Hosting your Jekyll site on GitHub Pages is a popular choice for developers and hobbyists alike. It offers free hosting and seamless integration with GitHub repositories. This guide will walk you through the process step-by-step, ensuring your site is live and accessible.

Prerequisites

  • GitHub account
  • Basic knowledge of Git and GitHub
  • Jekyll installed on your local machine
  • A Jekyll site ready to deploy

Step 1: Prepare Your Jekyll Site

Ensure your Jekyll site is complete and working locally. Test it by running bundle exec jekyll serve. When satisfied, push your latest code to a GitHub repository.

Step 2: Create a GitHub Repository

Log in to GitHub and create a new repository. Name it yourusername.github.io to enable GitHub Pages to automatically host it. Initialize the repository with a README if desired.

Step 3: Push Your Site to GitHub

In your local project directory, initialize Git, add the remote repository, and push your code:

git init

git add .

git commit -m "Initial commit"

git remote add origin https://github.com/yourusername/yourusername.github.io.git

git push -u origin main

Step 4: Configure Your Jekyll Site for GitHub Pages

Create or edit the _config.yml file in your project root. Add the following line to specify the base URL:

baseurl: ""

If you are hosting on a custom branch like gh-pages, set publish_dir accordingly. For a user site, the default settings suffice.

Step 5: Enable GitHub Pages

Navigate to your repository settings on GitHub. Under the Pages section, select the branch you pushed to (typically main) and the root directory. Save your settings.

Step 6: Access Your Live Site

Within a few minutes, your site will be live at https://yourusername.github.io. Visit the URL to see your Jekyll site in action.

Additional Tips

  • Use custom domains by configuring DNS settings on GitHub.
  • Optimize your site for faster load times.
  • Regularly update your repository with new content.

Hosting your Jekyll site on GitHub Pages is straightforward and cost-effective. With these steps, your site will be accessible to the world in no time!