How to Deploy a GitHub Pages Site to an Azure Web App

Here’s a quick and easy way to get your GitHub Page repo deployed to an Azure Web App. Let me know if you run into any issues.

Create GitHub Pages Repo

Skip to next step if you already have a GitHub pages repo.

1. Create new GitHub repo

2. Under the repo settings > GitHub Pages, set Source to the branch and Launch automatic page generator.

3. Clone the repo locally

Copy Azure Deployment Files

We need to get .deployment, deploy.cmd and getruby.cmd in the root of the GitHub repo. We are going to pull those files from here: https://github.com/ritterim/jekyll-azure-deploy. If you have Bash installed on Windows you can use the following command:

If you don’t have bash, then figure out a way to get those files locally, i.e. clone that repo or download as a zip.

After you have the files in the root of your repo locally, push them to your remote GitHub repo.

Important: If you are deploying a Jekyll based site that precompiles files into a _site folder then you can leave these files as is. But, if you are deploying a static site without Jekyll, for example, the default HTML site that is generated by GitHub, then you are going to want to do the following:

I repeat: Only do this next step if you have a static site that isn’t generated into a subfolder.

Open deploy.cmd and find this line of code:

and change %DEPLOYMENT_SOURCE%/_site to %DEPLOYMENT_SOURCE% (remove /_site)

Once you have made that change, make sure you push to your remote GitHub repo

Create Azure WebSite

Go to https://portal.azure.com/#create/Microsoft.WebSite and create your site.

Increase Deployment Timeout

Ruby takes a while to install the first time, so increase the deployment timeout with this setting.

Open Azure Web App, Go to Application settings and add a custom setting called SCM_COMMAND_IDLE_TIMEOUT and set it to 3600

Make sure you click Save.

Setup GitHub to Azure Deployment Hook

Open Azure Web App, Go to “Deployment options” and select GitHub, Authorize and select your repo and branch and click OK.

You will see this notification

Click on “Deployment options” again and you should see that the site is being deployed:

It will take a few minutes to complete.

Open a browser and navigate to your site. Your GitHub pages site should load.

Jon

Share