Some context in advance. Many years ago I created this blog to show the world, and my family, how my adventures in Spain were going. At the time I ventured into a masters program in Barcelona. This was nearly 14 years ago (2009). This website once started in Drupal 6. Drupal 7 came out in 2011 and in that year I migrated this site to Drupal 7.

In 2013, I started to focus a lot more on my professional life and blogging or writing articles became lesser of a habit. Fast forward to today, only 4 articles appeared on my site since 2012.

The maintenance of a dynamic site didn’t feel it returned the effort required to keep it updated, let alone migrate it to Drupal 10. Even though Drupal 7 is in extended support, it didn’t feel responsible of me to keep it there without the needed updates. Drupal is amazing, but this blog doesn’t require such novelty. I just needed a place to put my thoughts.

Also driven by my latest work-change, which is taking place at GitLab, I decided to migrate my website to Jekyll and deploy this on GitLab pages. Let’s walk you through the steps required to migrate a Drupal 7 site to Jekyll & GitLab pages!

Prerequisites

Grab a database dump & filedump from your Drupal site

ssh me@myserver.example.com
cd /path/to/my/drupal/site
drush sql-dump > ~/Desktop/my-drupal-7-database.sql

Transfer the SQL file to the location where you will build your jekyll site. Most likely that’s your local computer. Once you’ve done that, import it.

mysql -uroot -prootpassword  -e"CREATE DATABASE drupal"
mysql -uroot -prootpassword drupal  -e"source data.sql"

Setting up development environment

This is very opinionated. I honestly don’t care if you do this in Docker or some Cloud IDE. So therefor I’m not making assumptions other than the version of Ruby. For this, I used Ruby 3.1.3p185.

gem install jekyll
gem install bundler
gem install mysql2
gem install sequel
gem install safe_yaml
gem install pg
gem install jekyll-import
jekyll import drupal7 --dbname drupal --user root --engine mysql --password rootpassword --types story
jekyll new --force .
bundle exec jekyll serve

And we have our website running!

Image of our Drupal content in Jekyll

Now, it doesn’t quite work as expected. The layout doesn’t look like it.

Image of blog that has does not detect the story layout

And that’s because we asked our default jekyll site to only render layouts of type post. To fix this, we can replace the layout: story with layout: post in all the articles in the _posts folder. After that, our jekyll site looks a lot better as it rendered the articles correctly.

HTML to markdown

I had some posts in Drupal that were using the html filter, others were already in markdown. It took some time to convert them, but this plugin helped: https://marketplace.visualstudio.com/items?itemName=YangtangWu.html-to-markdown

Image of blog that has html converted to markdown

Making it pretty

I’m lazy, so I bought a design online. I went to https://jekyllthemes.io/jekyll-blog-themes and purchased https://jekyllthemes.io/theme/horace-blog-jekyll-theme as it fits the bill. I don’t need anything more fancy. The only thing that was needed was to go through the blogs and clean them up so that the images were referenced & rendered similarly as how they were in Drupal. I decided to do this manually as writing automation would take me probably just as long, if not longer, and I didn’t see a need to redo it again afterwards. It was also a nice journey in my past to explore all that content again.

Deploying it to GitLab Pages

I added the following to my .gitlab-ci.yml. Once that was working, I added my domain name to GitLab pages and we were done!

image: ruby:3.1

variables:
  JEKYLL_ENV: production
  LC_ALL: C.UTF-8

before_script:
  - gem install bundler -v 2.2.33
  - bundle install

test:
  stage: test
  script:
  - bundle exec jekyll build -d test
  artifacts:
    paths:
    - test
  rules:
    - if: $CI_COMMIT_REF_NAME != $CI_DEFAULT_BRANCH

pages:
  stage: deploy
  script:
  - bundle exec jekyll build -d public
  artifacts:
    paths:
    - public
  rules:
    - if: $CI_COMMIT_REF_NAME == $CI_DEFAULT_BRANCH

Now every time I want to update my site, I only need to go to the GitLab Cloud IDE, add a markdown file, and commit it. Everything else is taken care of. If I want to test it locally, same principe - but I can test it with a local rendered version of Jekyll.