There are various reasons I spent a solid 24 hours forcing myself to port over my blog.
The main one being, I'm lazy af. Have you ever tried to upgrade a wordpress installation thats on wordpress v3.8! (its on v5.6 at the time of writing) The PHP version is woefully outdated and I'm pretty sure there was a spider crawling about in my SQL database.
I've been quite fortunate in that when I setup my linode I locked it down so much. I used cloudflare and some intense caching but all that made it really hard to keep up to date with security updates. I followed (and still follow) this excellent guide how to setup your linode every time I setup a new machine but I just dont have the time any more to spend maintaining servers.
I've ported my site over to 11ty I uhmned and ahhed between this and gatsby but for the sake of simplicity I chose eleventy. I'm glad I did. The code is all public.
What I've lost in the move is the download counter for my freebies it wasn't a requirement but it was nice to see if people were using them!
I also haven't setup comments yet. I'm considering a little node app on heroku that will comb github issues and rebuild the blog with them included. I didn't want to use something hosted elsewhere though.
I've just finished switching over my wordpress blog to a static site. I've had to make a few compromises and theres a few reasons for the switchover but thats for another day!
One of the requirements I had was that I wanted it show the full post on the homepage but I had an issue then where the images were coming back with relative urls and not displaying.
{% set absolutePostUrl %}{{ post.url | url | absoluteUrl(metadata.url) }}{% endset %}
{{ post.templateContent | htmlToAbsoluteUrls(absolutePostUrl) | safe }}
Another long winded solution that may be of help to someone googling is this method. It lets you modify the image url with a custom renderer.
My blog is based on the eleventy-base-blog so it uses markdownIt to parse the markdown. I added a renderer that looks to see if an image url starts with http or https and if it doesn't it adds the rest of the url to it.
This is how I displayed the collection content within my template.
{% for post in postslist | reverse %}
{{ post.templateContent | safe }}
{% endfor %}
This is what I ended up with for adding in the metadata siteUrl for anything that does not already start with http/https. Messy but it works.
/* Markdown Overrides */
let markdownLibrary = markdownIt({
html: true,
breaks: true,
linkify: true
}).use(markdownItAnchor, {
permalink: true,
permalinkClass: "direct-link",
permalinkSymbol: "#"
});
var defaultRender = markdownLibrary.renderer.rules.image;
markdownLibrary.renderer.rules.image = function (tokens, idx, options, env, self) {
const token = tokens[idx];
const aIndex = token.attrIndex('src');
const link = token.attrs[aIndex][1];
if(/(http(s?)):\/\//i.test(link)) {
} else {
var abspath = '';
abspath += env.metadata.url;
if(env.page.url.charAt(0) === '/') {
abspath += env.page.url.substring(1);
}
abspath += "/" + link;
tokens[idx].attrs[aIndex][1] = abspath;
}
// pass token to default renderer.
return defaultRender(tokens, idx, options, env, self);
}
eleventyConfig.setLibrary("md", markdownLibrary);
I’ve been using these actions for a while but I never released them as part of the femgeek 12 days of christmas! (too many freebies!) Two black and white actions for your photos. One gives a high contrast black and white image, the other works best on low key photographs and produces a black and white image with a soft violet hue.
Click the 'download' button on the top right hand corner above where it says 'View raw'
Note: You may get an error on the Violet one, dont worry it still works, just click ok.
Also these have been created in Photoshop CS5.
Day 12 of the 12 days of Femgeek Christmas! When you use any of the freebies I’d really appreciate a link back to femgeek.co.uk. If you would like to, you can also follow me on twitter. You can also add femgeek on facebook and google+ pages. It would be great if you could tweet/facebook/google plus about the 12 days too!
Just downloaded a festive greens curve from femgeek.co.uk download it here: http://bit.ly/W0FBG1 #12daysoffemgeekchristmas from @apricot_13
Adds Christmassy dark green hue to your photos – not just for christmas photos though!
Click the 'download' button on the top right hand corner above where it says 'View raw'
Day 11 of the 12 days of Femgeek Christmas!
When you use any of the freebies I’d really appreciate a link back to femgeek.co.uk. If you would like to, you can also follow me on twitter. You can also add femgeek on facebook and google+ pages.
It would be great if you could tweet/facebook/google plus about the 12 days too!
Just downloaded a free Lightroom Preset from femgeek.co.uk download it here: http://bit.ly/121azE5 #12daysoffemgeekchristmas from @apricot_13
An Adobe Lightroom preset to brighten up your photography.
Click the 'download' button on the top right hand corner above where it says 'View raw'
Don’t know how to install or use this download? Don’t worry, I created a little guide to help you. But if you run into any trouble tweet or email me and I’ll try to help.
