Migrated rdagumampan.wodpress.com into Hugo and GitLab

April 8, 2018 by rdagumampan

After a successful purchase of my personal domain, I have started migrating my blog into static pages. My former team-mate Kah Man made a great post about Hugo last year and it has been in on my radar since then.

I was actually editing this entry while configuring Hugo! I hope to describe here the individual steps I took to execute the migration. The general approach is thru CLIs running on Windows machine. I will not explain the individual commands but I hope you’ll take the time to read each tool’s CLI command reference or post your question at the comment section.

Why static pages

  • Fast. Fast authoring, fast serving pages.
  • Secured. These just static files, no database or transactions.
  • Cheap. Low compute units and extremely small packages.
  • Cheap. You can host anywhere without special server requirements. It can be via Github, S3 buckets or Azure Storage.

Install the pre-requisites tools

Pre-requsiites that must be mapped to your PATH.

  1. Install chocolatey / @"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"
  2. Install git for windows / choco install git
  3. Install hugo / choco install hugo -confirm
  4. Install golang / choco install golang

Setup your GitLab workspace

  1. Signup to GitLab (GL). GitLab offers private repository, 10GB storage, enormous bandwidth, custom domain, TLS and a full CI/CD pipeline with NPM.

  2. Fork out Hugo in your GL account and follow 3 basic instructions here:

Setup your local workspace

  1. Clone your user pages

    / md c:\ws
    / cd c:\ws
    / git clone https://gitlab.com/rdagumampan/rdagumampan.gitlab.io.git
    
    / cd rdagumampan.gitlab.io
    / hugo server
    

    At this point you should be able to see a runnig site on http://localhost:1313/hugo/. Press CTRL+C to shutdown the hugo server.

  2. Configure your site In your config.toml, from “https://pages.gitlab.io/hugo/" change to baseurl = “https://namespace.gitlab.io" or baseurl = “http(s)://example.com” if you use custom domain.

    / notepad++ config.toml
    / <change the baseurl>
    

Write a post

  1. Post a new blog entry

    / hugo new post/2018-04-08-hello-world-hugo.md
    / notepad++ content/post/2018-04-08-hello-world-hugo.md
    
    Follow this template header.
    title: <title text>
    subtitle: <sub title text>
    date: <yyyy-mm-dd>
    tags: ["ssg", "hugo"]
    
  2. Start hugo with drafts enabled

    / hugo server -D 
    
  3. Commit our new content

    / git add -A
    / git commit -a -m "first pos!t"
    / git push
    
  4. Watch your CI/CD status in GitLab

    gitlab-cicd-01 gitlab-cicd-01

    NOTE: It takes few minutes before the pages becomes available on your GitLab page. The site published as http://rdagumampan.gitlab.io/.

Apply a theme

Hugo breaks when using other themes, so you must delete this file first before applying a theme.

/ del content\post\2017-03-20-photoswipe-gallery-sample.md

/ cd c:\ws\rdagumampan.gitlab.io\themes
/ git clone https://github.com/eliasson/liquorice.git
/ git add liquorice
/ cd..
/ hugo -t liquorice
/ notepad++ config.toml
/ <change the theme>

/ git commit -a -m "applied new theme"
/ git push

When you received a 404

GitLab is broken and we have no *** idea why. It’ll be fix soon.

Migrating from Wordpress.com

  1. Install go / choco install golang
  2. Export your Wordpress blog as xml

    gitlab-cicd-01

  3. Clone wp2hugo migration tool

    / md c:\ws\wp2hugo
    / cd c:\ws\wp2hugo
    / git clone https://github.com/eklausme/c.git
    
  4. Build your hugo pages

    / go run c:\ws\wp2hugo\c\wp2hugo.go rodeledagumampan.wordpress.2018-04-08.xml
    / cd content
    
  5. Wrap-up

    / copy c:\ws\wp2hugo\content\post\*.* c:\ws\rdagumampan.gitlab.io\content\post
    / git add -A
    / git commit -a -m "migrated wordpress pages, posts and tags"
    / git push -u
    

What do we have so far

  • Built initial draft with Hugo
  • Setup CI/CD pipeline in GitLab
  • Migrated 222 posts, 3 pages, 3 drafts

Next steps

  • Secure with SSL
  • Integrate Disqus comments
  • Activate Google Analytics
  • Try running in Azure Containers

References

© 2017 | About | Contact | Follow me on Twitter | Powerered by Hucore & Hugo