Setting up the website
Since you're reading this, it is probably obvious that I set up a website.
A quick look showed that FlatulentCupid.com was available, and I do love using the word "Flatulent" instead of "Farting" -- it seems much classier!
To make the site quickly and to make sure it's a fast, secure, unhackable site, I made it using Publii. WYSIWYG editing and static HTML output.
I host all my website with Pair - I've been using them since the early 90s. I highly recommend them.
I had to wait a little while for the DNS to propagate.
Then I used pair's free Let's Encrypt integration to make the site use https - a little more waiting.
I added a line to the .htaccess file to enable gzip compression to make everything that little bit faster.
AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript
I had some issues figuring out some details with getting all the site layout the way I wanted. Publii really wants to be blogging software with the home page a list of blog posts and the free themes are not as plentiful as one finds with WordPress.
A big thing (this took a LOT of fiddling since I don't know Handlebars, etc) I figured out was how to add the PREVIOUS and NEXT post links at the bottom of each post since I want this development blog to be easily readable all the way through.
It turns out that in the config.json file one needs the setting:
"renderPrevNextPosts": true,
And then at the bottom of where the post is done in the post.hbs file I added this ugly code (hey, I'm working fast because this website isn't the game!):
<table>
<tr><td align=left>
{{#checkIfAny ../previousPost ../nextPost}}
<nav class="post__nav">
{{#../previousPost}}
<div class="post__nav__prev"> PREVIOUS POST<br>
<a href="{{url}}" class="post__nav__link" rel="prev">
<div class="post__nav__text">
{{! translate 'post.previousPost' }}
<h3 class="h5">≪ {{title}}</h3>
</div>
{{#featuredImage}}
{{#if url}}
<img
{{#if @config.site.responsiveImages}}
src="{{urlXs}}"
{{else}}
src="{{url}}"
{{/if}}
height="100" width="100"
{{ lazyload "lazy" }}
height="{{height}}"
width="{{width}}"
alt="{{alt}}">
{{/if}}
{{/featuredImage}}
</a>
</div>
{{/../previousPost}}
</td>
<td align=right>
{{#../nextPost}}
<div class="post__nav__next"> NEXT POST<br>
<a href="{{url}}" class="post__nav__link" rel="next">
<div class="post__nav__text">
{{! translate 'post.nextPost' }}
<h3 class="h5">≫ {{title}}</h3>
</div>
{{#featuredImage}}
{{#if url}}
<img
{{#if @config.site.responsiveImages}}
src="{{urlXs}}"
{{else}}
src="{{url}}"
{{/if}}
height="100" width="100"
{{ lazyload "lazy" }}
height="{{height}}"
width="{{width}}"
alt="{{alt}}">
{{/if}}
{{/featuredImage}}
</a>
</div>
{{/../nextPost}}
</nav>
{{/checkIfAny}}
</td></tr></table>
It works and I'm moving on to the next thing!
(which you can easily get to thanks to the NEXT post link down below!)
