Nardiéna's GitHub Site

This is a website for my GitHub+Jekyll-learning Project. Here you can find my daily logs with which I take you through my journey of learning how to use GitHub and Jekyll. Hope you find my site interesting!

View project on GitHub

How to Change the Jekyll Theme with a GitHub-Pages Supported Theme


By default, your GitHub Pages site would have a minima theme. This is a step-by-step tutorial on how to change the theme of your GitHub Pages site with a GitHub-Pages supported theme, which can be found in this link.

Step 1

Firstly, choose the theme of your liking from the link given here.

Step 2

You will then be redirected to the theme’s corresponding GitHub repository on github.com. To use the chosen theme (e.g. the Architect theme), add the following to your site’s ‘config.yml’ file:

img

Step 3

Then add the following to your site’s ‘Gemfile’:

img

Step 3

Open your command prompt and run the following commands:

1.

bundle install

img

img

2.

bundle update

img

img

Step 4

Afterwards, go to the ‘layouts’ folder in the directory of the chosen theme. Check the HTML templates used for the theme. In this example, there is only one template. However, for other themes, there may be more than one HTML template which corresponds to different purposes, e.g. a ‘post.html’ file specifically used for diary entries/logs.

img

Step 5

Go to the ‘index.md’ as well as all the other Markdown template files that are used for the website and make sure the ‘layout’ setting is set to the HTML file name(s) from the previous step.

img

Step 6

Finally, to run the website on your localhost, run this command in the command prompt:

img

Step 7

If you’d like to further customize your website, there would be additional instructions in the theme repository’s README.md file, just as shown below.

img