“All the News That’s Omg Lol”

Online Edition
As if we’d actually use ink for this?

Vol. 20 of 36
March 17, 2023 4:17 AM UTC
Free

Weblog Updates: Files, Tag Listings, and Multiple Post Landing Pages

There have been some exciting updates to weblog.lol over the past week. Before I dig into the bigger items, I’ll mention that thanks to our new Discourse forum’s categorization and tagging features, you can always use this link to view a complete list of recently implemented weblog features. Some of the more minor things may not surface into news posts here, but at least you now know where to find everything!

File Hosting

Up to this point it hasn’t been possible to store anything other than posts, pages, and templates in your weblog. Thanks to some.pics there’s now a way to store and share pictures in your posts, but everything else—in particular CSS files or JS files—had to be added to weblog templates inline or hosted externally. Well, not any more!

Thanks to @bix, it’s now possible to host text-based files right in your weblog. By “text-based files” I mean non-binary files like CSS, JS, JSON, HTML, XML, etc.

If you want to give this a try, here’s a quick example of how to add a CSS file. First, create a new entry and add this content:

Type: file
Content-Type: text/css
Title: Stylesheet
Location: /style.css

* {
  color: #000;
}

When you save it, you’ll notice that it shows up in a new “Files” section of the weblog UI (if you use the Git-based content management process, you probably won’t notice this, but that’s OK). Once it’s saved, pull up your weblog in your browser and add /style.css to the end of the URL — and you’ll see your new stylesheet! It’ll appear just like any other stylesheet, and without being mangled by your weblog template (which is what would have happened if you tried to do this before).

Your Location metadata can be literally anything—you don’t even have to specify a file extension, because the Content-Type defines the nature of the file. Content-Type: text/css is what you’d use for a CSS file, while Content-Type: text/javascript would be for a JS file. You could even host a plain text file with Content-Type: text/plain. The values in the Content-Type metadata are called MIME types, and you can use your favorite search engine to find the correct MIME type of any sort of text-based file that you might want to host in your weblog.

Tag Listings

Thanks to @esamecar, you can now create tag listing pages (and also use {tag-listing} to drop a list of all of your tags anywhere you’d like). The new configuration items that support this are:

  • Tag listing path, the path where your tag listing page will be shown. The default value is /tags.
  • Tag listing template, an optional template you can use for your tag listing page. If you don’t configure this, your main template will be used as usual.
  • Tag listing order, which can be set to alphabetical, ascending, or descending. The first option sorts your tags alphabetically (A to Z), while the second two sort the tags by the quantity of entries that use each tag.
  • Tag listing format, a template that manages the output of the tag listing (either on the tag listing page or where {tag-listing} is used). This can use the $count variable to either show the number of entries associated with each tag, or in more creative ways (e.g. in conjunction with CSS or JS to create a visual tag cloud or some other interesting display).

Previously, there was no way to show all of your tags in one place—so this is a really nice upgrade and will hopefully inspire some creative uses for tag listings.

Multiple Post Landing Pages

weblog.lol launched in kind of a hurry, and kind of skipped over the whole idea of the traditional blog landing page where multiple posts are shown. Well, thanks to requests from @bentsai and a few other folks over the past couple of months, we’re finally catching up to offer what most people probably identify as the typical look and feel for a blog landing page.

Setting this up is fairly straightforward, but, like everything else in the current weblog.lol beta, it’s a bit fiddly. Eventually we’ll move away from an awkward configuration-file-based approach to some kind of utopian UI, but until then, I appreciate your patience with the fiddliness.

Here are the new configuration items related to setting up a landing page with multiple posts:

  • Landing page post count, which should be set to the number of posts that you want to show on your landing page. The default is 1, which disables the multi-post landing page setup.
  • Post template, the title of the template that will be used for posts on your landing page. Defaults to Post Template. Note that this isn’t like the other templates that you’ve seen up to this point (which have all been complete web pages from top to bottom); this is just a fragment of HTML to capture the main parts of you post for display on the landing page (repeated for however many posts will be shown there). You can get a sense of how this works by viewing the default post template.
  • Pagination path, which is the path you want to use to signify the page that you’re on (right after this comes the page number itself). Defaults to /page/.
  • Previous page template and Next page template are both template snippets that define the link you want to use for previous and next page navigation respectively. When on the first page, Previous page template is hidden; when on the last page, Next page template is hidden.

All of this works in conjunction with a new Landing Page Template, which you can see here. It’s much like the main template, except it’s designed specifically for the multi-post setup. This is where you’ll want to put your {previous-page} and {next-page} tags and more or less define the multi-post landing page experience.

Because all of this is a bit confusing, and because so far everyone has set up their weblogs without any of this stuff in place, I’ve made a video that will show you how to go from a typical weblog setup to a multi-page weblog setup:

Hopefully this helps. If you have any questions, feel free to ask in the Discourse forum!

— Adam

Permalink