Go Beyond

Written by Teran McKinney
/ About Me / Half-time Remote DevOps/Systems Engineer for $40,000 /

Hugo, Github Pages, and Cloudflare

You can either host Github pages off a project with a gh-pages branch, or use username.github.io as a repository. gh-pages doesn't really work for Cloudflare because Cloudflare doesn't seem to act as a proxy with folder mapping and what not. Your site would have to be domain.tld/project, which isn't what I wanted.

Basing around an example online, I came up with this:



# Without this, git push would loop endlessly
if [ "$(git rev-parse --abbrev-ref HEAD)" = 'master' ]; then
        TEMP=$(mktemp -d)
        git checkout master
        git remote add pages $PAGES
        hugo > /dev/null 2>&1
        mv public "$TEMP"
        git checkout --orphan gh-pages
        rm -r ./* ./.gitmodules ./.gitignore
        mv $TEMP/public/* .
        echo $DOMAIN > CNAME
        git describe --long --tags master > VERSION.txt
        echo 404 > 404.html
        git add .
        git commit -m "$(date +%Y-%m-%dT%H:%M:%S)"
        git push -f -u pages gh-pages:master
        # Reset everything back to normal.
        git checkout master
        git submodule init
        git submodule update
        git branch -D gh-pages
        rm -r $TEMP

I have something much like this saved as .git/hooks/pre-push. You may have an issue with it changing your master to push to remote. I'm sure there's a way around it, although I only experienced it once. I tried to make the script as idempotent and use the least disk space possible (my user files are stored in memory, then backed up on-demand). When you git push, it will push to both repositories (only source to one, only rendered content to the other). It may use somewhat more bandwidth as the rendered content is not versioned and pushed fresh every time. Although it's possible git has compression even on that, so I don't know.

Whatever you do, backup your repository before using anything like this, just in case. You can see my source and pages repositories as a reference for how I'm doing this. The theme is a submodule.

CloudFlare will need some settings through the web interface to enable IPv6 and mostly disable their security features (unless you want them... for a static site?). It does inject cookies, which I find very annoying but it shouldn't matter. I turned the security options off partly because tor users will likely be blocked if you don't. I'll have to do some testing to see if I'm ever blocked accessing the site.

Share on Voat.