Setting up Travis, Jekyll and GitHub pages

Please note that I'm not using Jekyll anymore, so this post might be outdated.

Update, November 2017

I don't use this setup anymore, it might be outdated, proceed with caution.

Original post

As I already mentioned, GitHub pages do not work with the Jekyll plugins. It is a security measure. So I researched it a bit, and colleague of mine proposed a simple solution - Travis CI.

There is a great repo with instructions how to set everything up - jekyll-travis. But few steps are kinda confusing, and it took me 10 failed builds to make it work. So I'll try to help you with those.

I copied the steps from the original repo and updated steps where I got stuck. Be sure to check the original readme as well.

Flow

  • When you push to your GitHub repo, it triggers Travis
  • Travis starts up a virtual machine and installs all required software (mostly Ruby gems). We use a custom rake task to tell Travis how to build our Jekyll site and push the updated content back to Github
  • Travis clones a source branch (usually master or source, in my case source)
  • Travis runs jekyll build on the source branch
  • Travis does a git push to the branch holding static site files (usually gh-pages or master, in my case master)
  • Github Pages starts serving the updated site

Steps to make it work

  • Move your Jekyll source files to the source branch (name it as you like). We'll use master or gh-pages branch to host generated HTML website.

  • Make sure you have enabled your source repo in the Travis CI admin dashboard so that the webhook is triggered

  • Create a GitHub Personal Access Token from you profile page.

  • If you haven't already, create a Gemfile, and add rake gem to it.

    source "http://production.cf.rubygems.org/"
    
    gem "rake", "~> 10.1.1"
    gem "jekyll-paginate"
    gem "jekyll-archives"
    

    We have seen intermittent timeouts fetching gems from Rubygems.org. install: bundle install lets Travis CI automatically retry, and we are using source "http://production.cf.rubygems.org/" in Gemfile to point to a different repository.

  • Install the travis gem (gem install travis) and create .travis.yml. It will tell Travis what to install and how build our Jekyll site. Add following data to it.

    language: ruby
    rvm:
    - 2.3.1
    install:
    - bundle install
    script: bundle exec rake site:deploy --quiet
    env:
      global:
        secure: YOUR_ENCRYPTED_INFO
    

    Replace the YOUR_ENCRYPTED_INFO with the output of the following command:

    travis encrypt 'GIT_NAME="Your Username" GIT_EMAIL="your@email.com" GH_TOKEN=GITHUB_PERSONAL_TOKEN_YOU_CREATED'
    
  • Make sure you add vendor to your .gitignore as Travis CI is vendoring the Ruby gems there. The vendor folder should also be excluded in the Jekyll _config.yml.

  • Add the following to your Jekyll _config.yml file: username, repo and branch.

    # GitHub
    username:             Stanko
    repo:                 Stanko.github.io
    branch:               source
    
    # Jekyll source / destination
    source:               .
    destination:          _site
    
  • Add the contents of Rakefile to your Jekyll Rakefile (or replace it). The provided Rakefile has some additional commands, but the important one here is rake site:deploy.

And you are done! That should be it, of course you need to create a Travis CI account. Travis is free for the open source projects. If you are using it for the commercial stuff, play fair and check their payed tiers.

Build for my blog takes about a minute. It depends of the software Travis installs on every build.

Now you can use custom plugins and asset pipeline with Jekyll. Cheers!

Comments (4)

Lars Olesen
27. Sep 2017, 21:14

I've been trying a lot of different setups to get https://github.com/vih/historie/tree/master to work using this setup, but nothing is working for me so far. Maybe you have the magic word and can see what my mistake is?

Stanko
27. Sep 2017, 22:11

Hello Lars,

I'll take a look, but I can't promise anything :)

Meanwhile I have a cheesy advice - you could clone my blog's repo, and replace the posts and theme.

Btw how are you doing it at the moment, are you building it locally and pushing everything to gh-pages by hand?

Cheers!

Lars Olesen
28. Sep 2017, 11:49

I know there is no promises :) Right now, I just let Github take care of the building in the gh-branch. Basically, the dfference might be that it is not a user or organization website?

Stanko
01. Oct 2017, 18:31

Hey Lars,

I downloaded your blog's repo and dug around but I couldn't get Travis working :(

I'm pretty sure that it doesn't matter if it is a user or organization.

Personally, I would start setup from scratch following this link: github.com/mfenner/jekyll-travis.

If you manage to get everything working, please share your solution.

Cheers!