Now, instead of having it show up under the title all the time, I also wanted it to show up to the right of the title, if the screen was wide enough.
So, if the page is being viewed on a wide screen, like on a desktop computer, the “Last Updated Date” will show up on the right side. If the page is being viewed on a small screen, like on a mobile phone, the “Last Updated Date” will show up under the title.
Here is how I made it responsive using Custom CSS:
Due to the rate-limiting feature that the Write.as team introduced into their API, a number of my Blazor WASM apps, like the WriteFreely Archive Page Generator I created, have stopped working. All of the Write.as related Blazor WASM apps I created, use the WriteAs.Net client/wrapper library that I wrote. And it is actually this client/wrapper library that is running into the rate-limiting problem.
I've already updated the WriteAs.Net client to make use of Application keys. But before I release the latest version, I also want to give it some caching abilities. That's what I'm working on and testing right now in my spare time. Once that's done, I'll publish the latest version of the WriteAs.Net client to Nuget.
After that, I plan to get the WriteFreely Archive Page Generator working once again. Then I'll work on getting the Search app for my journal working as well.
Option 1: CSS
I got this idea of customizing the footer via CSS after looking at Robert Xu's Write.as powered site. It puzzled me that I could not highlight the text in the footer. After viewing the page source, I finally figured out that it was CSS trickery.
So, anyway here we are. To customize the footer using CSS, all you need to do is modify the following CSS script, then add it to the Custom CSS settings for your website.
Finished work on the WriteFreely Archive Page Generator Blazor app. While it does say WriteFreely, you can still pass in Write.as as the instance name and your Write.as alias, and it will work just the same.
Update 04/26/2021: I have since taken down my Journal Entries, so the links on this post won't work anymore. However, the idea and logic described in this post, is still applicable for posts that you wanted to add a Previous or Next link to.
In Part 1, I covered how I generated links to the Previous and Next post for my “indexed” journal entries. In this post, I'll talk about how I generated the links for non-indexed journal entries.
Handling Old Journal Entries
Update 04/26/2021: I have since taken down my Journal Entries, so the links on this post won't work anymore. However, the idea and logic described in this post, is still applicable for posts that uses index numbers for post slugs. For a working example of this, check out the posts on my photo-blog.
To make navigation work between blog posts in a series, I made use of a standard format for post slugs/URLs. I call them “indexed” entries because I added an index to the end of the slug/URL. For example, “journal-entry-001”, “journal-entry-002”, “journal-entry-003” and so on. It's really just a way to help me figure out the sequence of posts.
var element = document.querySelector('meta[property="og:url"]');
var content = element && element.getAttribute("content");
// Get post slug
var postSlug = content.split('/').pop();
var postIndex = postSlug.split('-').pop();