A few days ago I migrated this blog to Hugo from Jekyll and employed a beautiful theme called Even, a concise and powerful hugo theme, which fascinated me so much until I came across another graceful and exquisite hugo theme called Tranquilpeak

, brought by Thibaud Lepretre from the original hexo theme.

So I decided to change the theme of this blog and I took the following steps to accomplished that, which was very easy and worth a share here.

Table of Contents

Add another theme as a submodule

As previously mentioned in the blog setup post, you can use command git clone or git submodule to add a blog theme from GitHub repository. It is highly recommended here that you always use git submodule to add a new theme, even though you want to customize the theme template by yourself, in which case you could first fork the theme repository and add submodule from your replica repo of the theme which should track all the modifications by you and can also keep updated with the original repo when necessary.

So just in case you want to make some changes someday, or just don’t want to get the latest version from the original repo of which some newest fancy features may not be what you want.

You can fork a copy of https://github.com/kakawait/hugo-tranquilpeak-theme.git theme to your repository https://github.com/<GITHUB_USERNAME>/hugo-tranquilpeak-theme.git and then add submodule from the latter. Or you can simply add the orginal theme repo to a submodule by:

git submodule add https://github.com/kakawait/hugo-tranquilpeak-theme.git themes/tranquilpeak

Change the blog settings

Backup config.toml in the root directory of your blog site to config.toml_bak and copy config.toml from themes/tranquilpeak/exampleSite to the root directory and do some configuration as the user docs tells you, in which theme should be set to tranquilpeak:

theme = "tranquilpeak"

After all settings are done, you can rebuild the blog now with the simple command hugo in the root directory or hugo server -D to preview your blog first. And then in the public directory you can commit all the changes and push up to the GitHub repo and a new blog is ready.

Delete the submodule

Since you do not need the old theme anymore, you can delete it from you repository.

How to remove the old submodule?

In the blog root directory, run the following commands to remove the theme even from your blog site:

git submodule deinit theme/even
git rm theme/even 

git submodule deinit theme/even deletes theme/even’s entry from .git/config. This excludes theme/even from git submodule update, git submodule sync and git submodule foreach calls and deletes its local content (source). Also, this will not be shown as change in your parent repository. git submodule init and git submodule update will restore the submodule, again without commitable changes in your parent repository.

git rm theme/even will remove theme/even from the work tree and the theme/even directory. The files of theme/even directory will be gone as well as the submodules’ entry in the .gitmodules file, that is, the following lines will disappear.

[submodule "themes/even"]
        path = themes/even
        url = https://github.com/olOwOlo/hugo-theme-even.git

Reference