{
  "$type": "site.standard.document",
  "bskyPostRef": {
    "cid": "bafyreicplz3vdvd6hylbjjyr74pz3xlmcg2cs7svz3eroslxbiz65kmt34",
    "uri": "at://did:plc:fn2acxfxtgb64qxmzdocnbav/app.bsky.feed.post/3mi7fakv7rpr2"
  },
  "coverImage": {
    "$type": "blob",
    "ref": {
      "$link": "bafkreihxvquvjdepv3gvtox6hputnlqrnfylj6uoigithor24vyvjfguim"
    },
    "mimeType": "image/png",
    "size": 25009
  },
  "path": "/blog/website-changes-new-section-music-widget-and-upvotes/",
  "publishedAt": "2026-03-28T14:29:42.000Z",
  "site": "https://joelchrono.xyz",
  "tags": [
    "a post",
    "Josh Beckman",
    "how to have upvotes on a blog",
    "the setup instructions",
    "100DaysToOffload",
    "Reply on Fediverse"
  ],
  "textContent": "## “On This Week” section\n\nI wanted to add an “On This Day” kind of thing to my website for a while, but even though I have made almost 600 posts as of the time of writing, I still have plenty of empty days where I’ve not made a post.\n\nA In any case, the solution was simple, do it by week and call it done. I found a post by Josh Beckman detailing how to do this by day. Using a similar logic, I made use of `%V` to get the week number and `%G` to get the year for that week—when a calendar week happens across different years.\n\nYou can find it live on my home page, and here’s a simplified version of it with just the basics:\n\n\n    {% assign current_week = site.time | date: \"%V\" %} {% assign current_week_year = site.time | date: \"%G\" %} <ul> {% for post in site.posts %} {% assign post_week = post.date | date: \"%V\" %} {% assign post_week_year = post.date | date: \"%G\" %} {% if post_week == current_week and post_week_year != current_week_year %} <li>{{ post.date | date: \"%Y-%m-%d\" }} <a href=\"{{ post.url }}\">{{ post.title }}</a> </li> {% endif %} {% endfor %} </ul>\n\nThis is a live example of how the output looks like:\n\n  * 2025-03-26 Week Notes W12\n  * 2024-03-30 The Undefeated\n  * 2024-03-28 Tender is The Flesh\n  * 2023-04-01 March 2023 Summary\n  * 2023-03-27 The Monster Hunter online experience\n  * 2022-04-01 March 2022 Summary\n\n\n\n## Improved music widget\n\nYesterday I was playing around with the ListenBrainz API—which I use to display my last song I listened to—and realized that there was a way to get the song _currently playing_ instead. I implemented my original script a while back, but I got to work and modified it to get my currently listening song, and fallback to the latest one when nothing’s playing on my ears.\n\n\n    // fetch json file based on given url async function fetchListen(url) { try { const response = await fetch(url); const data = await response.json(); return data.payload.listens[0] || null; } catch (err){ console.error(\"Unable to fetch\", err); return null; } } function printHtml(container, content){ container.innerHTML = content; } async function getListen(username) { // get html id to override later const container = document.getElementById('latest-listen'); const currentUrl = `https://api.listenbrainz.org/1/user/${username}/playing-now`; const latestUrl = `https://api.listenbrainz.org/1/user/${username}/listens?count=1`; const current = await fetchListen(currentUrl); if (current) { const track = current.track_metadata.track_name; const artist = current.track_metadata.artist_name; return printHtml(container, `<b>Currently listening:</b></br>🎵 <i>${track}</i> by <i>${artist}</i>.`); } const latest = await fetchListen(latestUrl); if (latest) { const track = latest.track_metadata.track_name; const artist = latest.track_metadata.artist_name; const listenedAt = new Date(latest.listened_at * 1000); // Convert timestamp const dateFormatted = listenedAt.toLocaleString(); return printHtml(container, `<b>Last listened track:</b></br>🎶 <i>${track}</i> by <i>${artist}</i>. <br>${dateFormatted}`); } printHtml(container, `<b>No music found</b>`); } getListen('joel76');\n\n## An upvote button\n\nNaty shared how to have upvotes on a blog and I basically copy-pasted the entire thing. You only need to follow the setup instructions and it will literally just work.\n\nYou can find the upvote button in the comments sections of every blogpost! Feel free to click or tap on it.\n\nThe one downside is that it’s a third party service, but it’s so simple I can’t really come up with a reason why not to try it out. If it ever breaks or stops being supported, it won’t really be that big of a deal.\n\n* * *\n\nAnyway, those were a lot of changes done to my site for one week, I feel kinda cool about that. Feel free to borrow any of these ideas and make it your own.\n\nThis website has evolved and changed so much over time, I can feel the itch to start over creeping up, making it minimal while keeping as much of the features I got on it. Maybe a simple CSS overhaul will do the trick though…\n\nThis is day 42 of #100DaysToOffload.\n\nReply to this post via email | Reply on Fediverse",
  "title": "Website changes: new section, music widget, and upvotes",
  "updatedAt": "2026-03-28T14:29:42.000Z"
}