I wanted to move my blog from Wordpress to a static site. I had some problems with my hosting provider, that made me rethink if I really needed a hosting. I found that Github could host static sites using Jekyll and my site and blog are mostly static files.
Also I aimed to something faster, lighter and with better github markdown integration. My options were Jekyll and Hugo. Both are really good so you can’t go wrong with any of them. I choose Jekyll because it’s seems a little more mature and it have some interesting tools to choose, also because the Blog theme that I liked was a Jekyll one.
I searched themes here:
I found this nice theme https://jekyllthemes.io/theme/12337267/lagom and the installation was really easy (make sure you have ruby on rails installed)
It was just:
Fork the repository
git clone https://github.com/YOUR-USER/lagom
cd lagom
bundle update && bundle install
jekyll serve
Note: I had an error An error occurred while installing json (1.8.1), and Bundler cannot continue
when doing just bundle install
.I added bundle update
to solve the problem.
Then I just added my personal info in the _data/theme.yml
file, changed the logo, favicon, little css tweaks and it was ready.
There are multiple ways to import your data, I will talk about two. Using the Wordpress.com migrating tool (import a xml file) that I highly recommend and the second using the Wordpress migrating tool (import a database dump), that I don’t recommend because it’s slower and more error prone.
I used the wordpress.com importer version http://import.jekyllrb.com/docs/wordpressdotcom/ (even when my Wordpress blog is hosted) because is faster and really good for what I needed.
I went to my Wordpress admin page -> tools ->export post. This will download an xml file with all the posts, I called it wordpress.xml .
First install some required gems:
gem install jekyll-import hpricot open_uri_redirections
And then run the command to import the wordpress.xml file
ruby -rubygems -e 'require "jekyll-import";
JekyllImport::Importers::WordpressDotCom.run({
"source" => "wordpress.xml",
"no_fetch_images" => false,
"assets_folder" => "assets"
})'
This will import all the posts to the _post
and _draft
folders. Have in mind that this method will not import tags and other metadata, I didn’t have problems with that so I used this method.
The generated URL for the post was rather messy like /coding/2012/04/21/hello-world.html
instead of just the old coding/hello-world/
so I wanted to keep the same url.
It was a simple change adding this line permalink: /:categories/:title/
to _config.yml
. The only problem was that if the post had multiple categories the url looked like cat1/cat2/cat3/post . I wanted just the first category, so I modified each post to have only one category but multiple tags (In case I add some feature to filter by tag).
The post metadata ended looking like this:
categories:
- Coding
tags: [Coding, Javascript, RiotJs, Testing]
I had problem with the relative paths, because locally I access http://localhost:4000 but in production the address is vitomd.com/blog , so I had problems with the blog part. The solution was to add the variable
baseurl: /blog
to config.yml
and then use it in the urls
<a class="more_about" href="https://vitomd.com/blog/about">More about me</a>
and locally call the Jekyll server like this: jekyll serve --baseurl=""
.
The process is to run the migrating tools that will connect to a database and import the data, but my hosting provider didn’t have an easy way to connect to the database from outside so I decided to export the database and load it locally. I will talk about the problems that I found , at least when doing it in Ubuntu 16.
I have problems with missing gems (mysql2 and sequel) and also I had to install sudo apt-get install libmysqlclient-dev
because mysql2 installation was failing
First install the required gems:
gem install unidecode sequel mysql2 htmlentities
I went to my hosting provider and exported my blog database (mySql), to a file called wordpress.sql.
Then I imported the database locally, and did this steps:
Install mysql server with a password
sudo apt-get install mysql-server
Access mysql server, it will ask for the password
mysql -u root -p
Create the database
CREATE DATABASE wordpress;
Select the database to use
USE wordpress;
Execute the sql script (mine was wordpress.sql) to import the database
source wordpress.sql
Now we run the script with the dbname, user and password. I removed the option "socket" => "",
because it gave me errors
$ ruby -rubygems -e 'require "jekyll-import";
JekyllImport::Importers::WordPress.run({
"dbname" => "",
"user" => "",
"password" => "",
"host" => "localhost",
"table_prefix" => "wp_",
"site_prefix" => "",
"clean_entities" => true,
"comments" => true,
"categories" => true,
"tags" => true,
"more_excerpt" => true,
"more_anchor" => true,
"extension" => "html",
"status" => ["publish"]
})'
After importing I saw that there was some problem with the encoding, probably because I didn’t create the database correctly but it was a good way to test the problems that you could find if you choose this approach, so I don´t recommend it.
In the next post I will talk about, importing comments, adding SEO, using a custom domain and writing my first Jekyll post.
Comments