My quick guide to getting away from WordPress!
I got fed up with WordPress way before it’s owner went a bit loco. it was bloated, barely responsive and each update was more work to make right.
Most of this will be a rehash of https://www.11ty.dev/docs/, with notes and bits i’ve found to add in for clarity and ease of use.
Do I need to do this?
Do you have WordPress sites what you hardly change around, barely add content to, or just getting annoyed with? probably yes, this might be easier for you to do and save you lots of time and money.
If you write lots and lots of stuff and visually want to adjust your site or pages regularly, stick with WordPress. Though you can use both and have WordPress handle posting while your 11ty part handles design/layout, but its a little more complex.
Environment
I run on Windows for my daily development stuff, So you’ll want:
- Latest version of x64 NodeJS (link)
- An decent coding IDE (Visual Studio Code, its free)
- Github desktop (optional) or install github repo tools from VSC plugins inside VSC.
Install NodeJS like a normal program, and install VSC, while this is doing its thing you might want to look at Starter Projects for 11ty, this will give you a working site to play with in like 5 seconds (yes its that fast to set up a dev server!)
Here’s a list of Starters to look at
Run VSC and create a new folder, extract your chosen starter template to that folder
in VSC click View and click Terminal, this will open a terminal at the bottom. You should be in your folder with the template you just extracted, type in there ‘npm install’ and your starter will download the dependencies to your project folder.
Once that is done you can type ‘npx @11ty/eleventy --serve’ to run the project. Thats it! click the Localhost:8080 click to open it in the browser.
uh oh, here comes the technical stuff!
You will see that it works slightly different to WordPress (if you self hosted, you’ll know a bit about plugins and theme customization), you have NJK files (layouts/templates in Nunjuck favour), MD files (MarkDown, you’ll get used to it) and JS files what drive it all (JavaScript, lets not worry about those until you want specific stuff).
Your posts will be MD files, so lets concentrate on that. You will need to export your posts/content via WordPress’s export tool, this will give you a XML file with a terribly long and strange name.
Luckily there are some 11ty scripts available to process these for you:
Both ways should work if you want to keep your development local, but WordPress Export to Markdown script will get all your linked Images too, whereas the API method won’t grab images easily and might have to be done manually.
I’ll go with WordPress Export to Markdown for now, as its more user friendly with its Wizard confirming each step with the user.
Extract or do the git (it baffles me and usually goes wrong) stuff to its own folder (you can use your project folder and dump images/posts/pages to the right folders there, but you might find duplicates and odd things to fix… for example cringe posts.)
Install it and run via index.js, it will ask questions like location of the export file,What you want to grab from your Wordpress file, the output directories.
Give it a few minutes, and you should be done. if you set your outputs right your images should be in your assets/public passthrough folder
There we go, your content is in and you can reload 11ty and serve again to check and make sure its all coming up with correct paths, tags and titles. And start to work on layout and general feel of the site.
Something I can’t advise on as apparently I’m terrible at design!