How to Create a gh-pages Branch: A Step-by-Step Guide
Creating a gh-pages branch is a crucial step in GitHub’s workflow for hosting static websites. This branch allows you to keep your main codebase separate from your deployed website, ensuring that your development work remains clean and uncluttered. In this article, we will walk you through the process of creating a gh-pages branch, step by step, so you can easily set up and manage your static website on GitHub.
Step 1: Clone Your Repository
Before you can create a gh-pages branch, you need to have your GitHub repository cloned to your local machine. Open your terminal or command prompt, navigate to the directory where you want to clone your repository, and use the following command:
“`bash
git clone
“`
Replace `
Step 2: Navigate to Your Repository
Change to the directory of your cloned repository using the following command:
“`bash
cd
“`
Replace `
Step 3: Create a New Branch
To create a new gh-pages branch, run the following command in your terminal or command prompt:
“`bash
git checkout –orphan gh-pages
“`
This command creates a new branch called `gh-pages` and switches to it. The `–orphan` flag ensures that the new branch is a fresh copy of your repository, without any commits from your main branch.
Step 4: Set Up Your Static Website
Now that you have a new, empty gh-pages branch, you can set up your static website. This may involve creating HTML, CSS, and JavaScript files, or copying your existing website into the repository. Ensure that your website is structured correctly and that all necessary files are present.
Step 5: Add and Commit Your Files
After setting up your static website, add your files to the repository using the following commands:
“`bash
git add .
“`
This command adds all files in your current directory to the staging area. Once your files are added, commit them to the gh-pages branch:
“`bash
git commit -m “Initial commit of static website”
“`
Replace the message `”Initial commit of static website”` with a more descriptive message that reflects the contents of your commit.
Step 6: Push the gh-pages Branch to GitHub
To make your static website available on GitHub, push the gh-pages branch to your GitHub repository:
“`bash
git push origin gh-pages
“`
This command pushes the gh-pages branch to the remote GitHub repository, making your static website accessible at `
Step 7: Configure Your Repository to Use the gh-pages Branch
Finally, to ensure that your static website is deployed automatically when you push new commits to the gh-pages branch, you need to configure your GitHub repository settings. Go to your GitHub repository’s settings page, find the “Branches” section, and click on “gh-pages.” Enable the “Automatically deploy GitHub Pages” option, and choose the branch that contains your static website (usually `gh-pages`).
Now you have successfully created a gh-pages branch and set up your static website on GitHub. By following these steps, you can easily manage and deploy your static websites while keeping your main codebase clean and organized.