ETOURVOL


Credits

Here is a list of resources I used when building this site. My coding style is akin to duct taping a lot of things together and might fall apart if you look at it the wrong way, but this is where I get the components from.


Coding

  • 11ty/Nunjucks Tutorial - How I created this site using a static site generator. This alternative tutorial is an offshoot of the linked one, and provides a more detailed step by step. If you're interested in building a site, highly recommend setting it up this way to save yourself some future pain, though it has a learning curve to figure out.
  • Kalechips Layout Resources - At the time of writing, this site's layout contains a frankensteined mashup of "Totally Tabular" and "Classless CSS". I admire this webmaster's dedication to accessibility and readability.
  • Styleswitcher - Allows switching between different themes via dropdown menu.
  • External Links - There's a few tutorials for this out there. This allows you to add an icon next to a link that leads offsite; here it is represented by an arrow.
  • 11ty Blog Setup - This is how my newsletters are organized. This is a modified version of Zonelets that works with static site generators, and allows me to organize and automate organization of my newsletters.
  • Ayano's Comment Widget - This is how my guestbook is set up, which normally does not work unless you are a Neocities supporter. Thankfully, Petra has provided a tutorial for a version that uses iFrames for free Neocities users. I've also implemented Frills Comment Moderation and Loveberry's Admin Tag as further customization.
  • Biancarosa's Recently Played Widget - This is on my about page, and displays the most recently played song on my last.fm.

Resources


Old Layouts

Here's a few screenshots of older iterations of the site. Click to open a fullview in a new tab.

Version 1.0 - Quagsire It took me a bit to decide to overhaul the site after this, I had spent a lot of time making the layout from scratch! I still like how it looks, but there was a lot of messiness with how the sidebar collapsed, color themes, accessiblity, etc... I'd love to reincorporate some of these layout ideas into future layouts.
Screenshot of a plain, light website with a dithered sidebar.
My first foray into responsive design, I still really like the sidebar.
Screenshot of a plain, dark theme website with a dithered sidebar and an array of journals.
This also had a Styleswitcher to toggle between light and dark modes! And a journal setup with categories.
Screenshot of a plain, dark theme website with a dithered sidebar and information on original projects.
This site had its own planned separate section for OCs, maybe one day I'll bring that back.