Uploading Jekyll to Github Page
In previous articles, we have discussed how to set up a Jekyll Blog locally on our computer, create a draft and manage multiple drafts using a plugin. Now we are ready to deploy the Blog to the online server so that the world can see how awesome our Blog is.
Deploying Jekyll on an online server is so simple because it is just a static website. All you need is a shared hosting with decent disk space and enough bandwidth to host it. The cost of shared hosting should be affordable. But again, why worry if you can host a Jekyll Blog completely free of charge-with GitHub Pages.
Github offers GitHub Pages for free so that anyone can host their static websites. It has Jekyll integrated, so it’s a good place to host our Jekyll-powered Blog. In this article, we will show you how to deploy our Blog on Github pages.
First Steps
First of all, you will need a Github account. Once you have one, create a new repository. The name of your repository is defined for the blog address in the following format {username} verwendet.github.io / {name of the archive}.
In this example, I’m just going to name my repository as a blog. Once the repository is created, copy the URL of the clone.
Add, validate and push
We will upload our local Jekyll files to our newly created GitHub repository. I’m going to use Github for Mac to do the work which can be downloaded for free – Github for Windows is also available for Windows users.
Let’s launch the Github application, then add our Jekyll Blog directory as a local repository.
Github Pages Branch
Creating a GitHub page for a repository is as easy as creating a new Git branch. In The Github application, go to The Branches tab. Create a new branch named gh-pages from the main branch and click the Publish button.
The new branch is now registered in the Github repository. The Github page of your repository should be ready in a few minutes. If this is the matter, you can do it in the browsers under {Username} öffnen.github.io / {name of the archive}.
Troubleshooting
If the Blog is not formatted correctly, it may be because the stylesheet is not linked correctly. To solve this problem, open the default setting.html in the _layouts folder. You will see that the stylesheet is initialized with a slash/.