šŸš§ What did you do to your website today?

Thanks, but I donā€™t want to use server-side scripting for my website. I want my site to be something that you can download as a zip file and read offline if you have to, and server-side scripting isnā€™t compatible with that goal.

It would also force me to store user data, and Iā€™d rather store nuclear waste in my basement.

Instead, Iā€™m using media queries. If your device is set to dark mode, youā€™ll get a dark theme. Otherwise, a light one. Thatā€™s well-supported and doesnā€™t require any scripting or data handling.

7 Likes

I changed my ā€œbooks Iā€™ve readā€ list from chronological order to reverse chronological order. So the most recent books will be seen first.

3 Likes

I gave your post a like because of this line:

4 Likes

today, i got my first fanlisting up and running! if youā€™re a fan of the band they might be giants, check out melody, fidelity, quantity and add yourself to the list. i made lots of buttons! :musical_note:

if youā€™re not a fan, maybe youā€™ll check it out anyway just to see the layout (iā€™m proud of it!), and maaaaaybe youā€™ll even watch the birdhouse in your soul music video and become a fan. it can happen to anyone.

4 Likes

Adjusted my siteā€™s light mode so that the body background is ivory instead of white.

7 Likes

I need to sit down and sort out my ā€œwhiteā€ colour, itā€™s too bright.

Iā€™ve been using this web-safe color picker that @Frills made.

2 Likes

the color picker is pretty nice.

I added all the links to every board along the top, which is probably the best idea I had since I made board api client to include board posts in blog posts.

2 Likes

I did some work on the shell scripts with which I build my siteā€™s pages. For each page, Iā€™m now checking for subheadings (h2-h6). If any are present, Iā€™ll build the page with a collapsible table of contents in the headng.

This is the main script, to-html.sh.

#!/usr/bin/env bash

INPUT=$1
OUTPUT=$2
VARIABLES="${INPUT/.htm/.sh}"

. "./common.sh"
. "${VARIABLES}"

PAGE_URL=$(echo "${INPUT}" | sed -e "s|site/||" -e "s|.htm|.html|")
SUBJECT=$(echo "${PAGE_TITLE}" | sed -e "s| |%20|g")
CREATED_TIMESTAMP=$("${DATE}" -u -Iseconds -d "${PAGE_CREATED}")
CREATED_DISPLAY=$("${DATE}" -I -d "${PAGE_CREATED}")
EMAIL_SUBJECT=$(echo "${PAGE_TITLE} by ${AUTHOR}" | sed -e "s| |%20|g")
HEADING_COUNT=$(grep "<h" "${INPUT}" | wc -w | xargs)

case $PAGE_LEVEL in
    0)
        RELATIVE_PATH="."
        ;;
    1)
        RELATIVE_PATH=".."
        ;;
    2)
        RELATIVE_PATH="../.."
        ;;
    3)
        RELATIVE_PATH="../../.."
        ;;
    4)
        RELATIVE_PATH="../../../.."
        ;;
esac

# Use tools from HTML-XML-utils implement server-side includes on localhost.
# Use HTML Tidy to pretty-print markup and make it readable for newbies using "view source".
"./templates/${PAGE_TEMPLATE}.sh" "${INPUT}" "${HEADING_COUNT}" \
    | hxincl -f -b ./partials/ -x \
    | hxtoc -x -t -l 2 \
    | tidy -config ./tidy-html.conf \
    | "${SED}"  -f ./common.sed \
                -e "s|SED_TITLE|${PAGE_TITLE}|g" \
                -e "s|SED_DESCRIPTION|${PAGE_DESCRIPTION}|g" \
                -e "s|SED_SUBJECT|${EMAIL_SUBJECT}|g" \
                -e "s|SED_RELATIVE|${RELATIVE_PATH}|g" \
                -e "s|SED_PAGE_URL|${PAGE_URL}|g" \
                -e "s|SED_YEAR|${YEAR}|g" \
                -e "s|SED_PAGE_LINK|${PAGE_LINK}|g" \
                -e "s|SED_CREATED_ON|${PAGE_CREATED}|g" \
                -e "s|SED_CREATED_DISPLAY|${CREATED_DISPLAY}|g" \
                -e "s|SED_CREATED_TIMESTAMP|${CREATED_TIMESTAMP}|g" \
                -e "s|SED_UPDATED_ON|${UPDATED_DATE}|g" \
                -e "s|SED_UPDATED_DISPLAY|${UPDATED_DISPLAY}|g" \
                -e "s|SED_UPDATED_TIMESTAMP|${UPDATED_TIMESTAMP}|g" > "./${OUTPUT}"

This is one of my templates, which is also a shell script:

#!/usr/bin/env bash

PAGE_CONTENT=$(cat "${1}")
HEADING_COUNT="${2}"

if [ "$HEADING_COUNT" -gt 0 ];
then
    cat <<EOF
<!DOCTYPE html>
<html lang="SED_LANG">
    <!-- include "head.html" -->
    <!-- include "home-top-nav.html" -->
    <!-- include "home-header-toc.html" -->
    <main id="content">
        ${PAGE_CONTENT}
    </main>
    <!-- include "footer.html" -->
</html>
EOF
else
    cat <<EOF
<!DOCTYPE html>
<html lang="SED_LANG">
    <!-- include "head.html" -->
    <!-- include "home-header.html" -->
    <main id="content">
        ${PAGE_CONTENT}
    </main>
    <!-- include "footer.html" -->
</html>
EOF
fi
5 Likes

I made a page to keep track of my fitness goals for the year and reflect on how I feel about it so far. I plan on updating it through the year to keep myself motivated by being able to look back at how far Iā€™ve come.

4 Likes

a little change to include the latest commit hash in my site footer. i aim to make my site open source, and this is a step in that direction.

of course, the repository is not public yet - iā€™m looking to move off of github before i do that. who knows when that will be.

revamped quite a few pages! also added some new ones

1 Like

Well, Iā€™ve got a custom 404 page with cats.

Iā€™ve also done some work on the random quotes in page footers. The markup is more semantic now.

And I have a new preview card image for parasocial media.

2 Likes

Iā€™ve been adding a bunch of new goodies to my Halloween site, Kreepy Keyā€™s Halloween Horrortorium, over the past few days. New soundbytes, pumpkin-carving patterns, crafts (more coming) and more. :D

2 Likes

nice. I like to have decent parasocial previews as a lifeline for people stuck in there.

Your blog has a lot of relatable stuff under ā€œrecommended posts.ā€ Once I have as many articles as you that will be a good feature to add.

Thanks. You could start now if you want. Just start with one post thatā€™s gotten a bit of attention.

i made a page for our longer prose pieces! it talks a little about our relationship with writing prose, as well.

i also made a page for one such prose piece, mr. and mrs. hope. that piece is about hope (obviously), suicide, and photography.

3 Likes

After what seems like forever Iā€™ve finally had some focus time for some website building.

I put together a JSON feed for my bookmarks. This allows me to use Echo to consume the feed and cross post to Mastodon on my behalf. I could have used the existing ATOM feed, but JSON allowed a few extra parameters to allow me to construct the post just how I wanted.

I took the time to clean up the layout of the individual bookmark posts too and added a timestamp for the sake of feed readers.

Yay, feels great to be constructing again.

2 Likes

I updated my website for the first time in a while. Itā€™s just a diary entry and a button being added, but it felt good to be at it! Iā€™m hoping to be less overbooked in the upcoming months so I can sort out some stuff at home, including some web-building! Alas, itā€™s the curse ofā€¦ accidentally becoming an extrovert? I guess.

Edit: Ooopsie I accidentally wrote a really long review of a book too, today. Yay for some kind of productivity! Haha

2 Likes