Great artists don’t keep their work just for themselves. They find ways to share what they’ve made with the world. WordPress developers face the same dilemma. If you’ve built something new for the platform, you want to share it with the community. You may even be looking to host your custom code for free.
If that sounds like you, WordPress on GitHub likely offers your solution. GitHub, along with Git itself, helps you control the versions for your control base. You can both host your creation and get other developers to check your work. Beyond that, GitHub Pages provides a convenient free hosting space as long as you follow a static WordPress approach.
In this article, we show you how to use GitHub to manage your WordPress themes and plugins. You’ll also learn how to use a Wordpress static site generator to deploy your work to GitHub Pages for free.
- How to Use GitHub for WordPress Development
- How to Create a Local WordPress Environment for Git
- How to Install Git Locally
- GitHub and WordPress Integration
- How to Simplify GitHub Theme and Plugin Deployments With WP Pusher
- How to Use GitHub Pages for WordPress Static Hosting
- WordPress for GitHub Tutorials
How to Use GitHub for WordPress Development
If you want to use GitHub for WordPress development, you'll typically want to focus on two areas:
- GitHub for WordPress themes.
- GitHub for WordPress plugins.
Using GitHub to manage the codebase for your entire site usually isn't optimal for a few reasons:
- You should never edit core WordPress files, so it doesn‘t make sense to include the core files in your repository. What’s more, the core WordPress files are already mirrored on GitHub.
- You probably don‘t need to include your site’s static media files, such as images and videos, in the repository.
- Trying to version control the WordPress database opens up a can of worms. Some projects, such as VersionPress, have attempted to use Git to version control the WordPress database. However, many solutions add unnecessary complexity to your setup. Using an activity log plugin is a better option for most sites.
Even with a few flaws, using GitHub to manage your WordPress site’s theme and plugins can be helpful. This is especially true if you're using custom themes and plugins. You can manage the codebase of your WordPress themes and plugins on GitHub. You can then deploy directly from GitHub to your live site.
How to Create a Local WordPress Environment for Git
To get started, you must set up a local WordPress development site. This is where you‘ll work on your projects and make changes. Then, you’ll version control and commit those changes using Git and GitHub.
To create your local development site, you have several options.
First, you can use one of the WordPress-specific development tools. Here are three popular options:
Second, you can use a general local development tool such as one of the following:
For this example, we'll use Local as it makes it very easy to spin up a new WordPress site.
Nice! You now have a local Wordpress environment. Next, you will learn how to commit your environment to your GitHub Repository,
How to Install Git Locally
Before starting development with WordPress on GitHub, you must install Git locally. Your commit changes will live here before they reach your GitHub repository. Let’s go through each step to ensure you are set up correctly.
1. Sign up for GitHub.
First, you’ll need to register for a GitHub account.
2. Install Git and GitHub.
To use the Remote GitHub repository, you must install Git locally. But first, you want to check if Git is already installed on your machine. This is because Mac and Linux machines usually have Git pre-installed.
If you are on a Mac, click on your spotlight icon and search the word terminal. Once in your terminal, type the command: git version.
If you are on Windows, search for the Windows command prompt in your search bar and type: git version.
If Git is installed already on your computer, the Git version you are currently running will be returned as output. If nothing returns, we can easily install it.
Install Git on Windows
Head over to Git for Windows installer and download the latest version.
Until the installation is complete, follow the prompts from the Git setup Wizard.
You want to ensure the installation was successful. Type Git version on the Windows command prompt to verify it is installed on your computer.
Install Git on Mac
Although most Macs come with Git installed, let’s go over how to install it in case you need it. You have two options when installing Git on a Mac:
Install Git from an Installer
Go to macOS Git Installer and download the latest version of Git. Click Allow to start the installation process. As the installation is downloading, follow all prompts until it's complete.
Once the download is complete, head to the terminal to double-check it was successful. On the command line, type git version to verify it was installed.
Install Git Using Homebrew
Homebrew is a favorable package manager for MacOS created to make developers' lives easier for instances like this. If you already have Homebrew installed, installing Git will be fairly simple.
Open up the terminal window and type: brew install git
Once installation is complete, verify that Git is successfully installed by entering: git version.
If you‘re comfortable working from the command line, the previous steps should help you get started. But if you don’t like using the command line, we recommend installing the GitHub Desktop client instead, as it will give you a visual interface to work with Git.
3. Create a repository.
To create a new repository, click Create a New Repository on your hard drive in the GitHub Desktop client.
Give it a name that matches the folder of the theme or plugin that you're working on. Then, under Local path, enter the path to the theme or plugin parent folder on your local WordPress site. Essentially, you'll create a repository for this specific theme or plugin to easily manage your work.
We’ll set up a repository for the default Twenty Twenty-One theme for this example. It might look like this:
You‘ll now see all of the theme’s files in your repository. From here, you can make changes using your favorite code editor.
You can also easily track changes using the GitHub Desktop client. You can see what that looks like in the example below.
4. Publish your repository to GitHub.
To publish your local repository to GitHub, you can click Publish repository at the top of the GitHub Desktop client. From there, you’ll see a prompt where you can configure a few details, like the ones shown below.
After a short wait, your code will be published on GitHub.
For future commits, you can use the Commit button in GitHub Desktop. Then, you can click Push Origin to push those changes to your GitHub-hosted repository.
GitHub and WordPress Integration
WordPress has an excellent dashboard that allows you to maintain all of your site's needs. However, if you are trying to customize your plugins or theme files, doing so on GitHub can make your life easier.
Hosting your custom WordPress on GitHub can allow you to efficiently develop your code and push those changes to your website. GitHub offers many features that are favorable to the developer community.
You won’t have to worry about your teammate making a disastrous change that can ruin your hard work. GitHub bolsters collaboration through its branch features. This allows edits to be made on individual branches before they’re merged into your main repository.
Let’s take a closer look at other benefits that the GitHub and WordPress integrations offer.
GitHub and WordPress Integration Benefits
Keeps Track of Changes
GitHub makes team collaboration a breeze. It captures every change of code that is made to your project. This lets you know exactly what changes were made and who made them.
Free Web Hosting
You can host your WordPress website on GitHub for free. This allows you to push your changes to your website directly from GitHub.
Testing and Staging Environments
Integrating WordPress with Github is like having a sandbox for your website. You can test new code features, tweak your design, and customize your plugin without ever changing with your real website. Once everything looks exactly how it should, you can make the changes live.
How to Simplify GitHub Theme and Plugin Deployments With WP Pusher
At this point, we've covered a lot of ground. However, what if you want to deploy your version-controlled themes and plugins from GitHub to your live site?
You can manually deploy your work when needed. This method is simple and works well if you don’t update your site very often.
However, if you’re looking to make things even easier, you can use the freemium WP Pusher plugin. WP Pusher lets you deploy themes and plugins from GitHub with ease. The process feels like installing and updating plugins from WordPress.org.
WP Pusher is 100% free to deploy themes and plugins from public GitHub repositories. However, if you want to deploy from private repositories, you'll need one of the paid plans. These plans start at $99 for use on up to five sites and come with a 30-day money-back guarantee.
If you want to see if it's right, you can test it for free. Try deploying from a public repository. From there, you can decide to pay for the private repository support.
Here's a quick guide on how to use WP Pusher for GitHub WordPress theme and plugin deployments.
1. Install and configure the WP Pusher plugin.
Download and install the WP Pusher plugin on your site. Make sure you’re adding the plugin to the project you want to use GitHub on.
2. Connect WP Pusher to GitHub.
Once you've activated the plugin, go to WP Pusher → Settings → GitHub and click the Obtain a GitHub token button.
In the popup, authorize WP Pusher to access your GitHub repositories. Then:
- Copy the token from the popup.
- Paste it into the field in your WordPress dashboard.
- Click the Save GitHub token button.
3. Install WordPress theme or plugins.
Next, go to WP Pusher → Install Plugin or WP Pusher → Install Theme, depending on the type of extension that you want to install. For this example, we're installing a theme.
Then, enter the following information:
- Theme repository. Enter the repository that contains the theme you want to install.
- Repository branch. If you followed the tutorial above, you'll likely want to put “main” here.
- Push-to-Deploy. Check this box if you want to update the theme on every code push automatically. If you leave it unchecked, you'll need to deploy it manually.
- Link installed theme. Use this if you want to let WP Pusher take over a theme already on your site.
Then, click the Install theme button.
And that's it. The theme or plugin will now show up in the normal theme or plugin areas. You can easily update an extension in the future, much like you update plugins and themes from WordPress.org. Just go to WP Pusher → Plugins or WP Pusher → Themes, respectively.
How to Use GitHub Pages for WordPress Static Hosting
The second option for integrating WordPress with GitHub is to convert your WordPress site to a static HTML site and deploy it to GitHub Pages. With this GitHub Pages WordPress connection, you can essentially host a static WordPress site for free.
Of course, because you‘re converting WordPress into a static site, you’ll miss out on a lot of the useful dynamic functionality that WordPress offers. But for simple blogs or portfolio sites, this can be a really nifty setup that doesn't cost a single penny.
Here's a quick guide on how it works.
1. Create a GitHub Pages repository.
To begin, create a GitHub Pages repository to host your static WordPress site. You can follow the GitHub Pages quickstart guide if you're not sure what to do.
Once you‘ve done that, you’ll want to create an offline clone of your repository. For the simplest way to do this, use GitHub Desktop. (You can check out this tutorial on setting up GitHub Desktop with GitHub Pages.)
2. Create a WordPress website.
Next, you‘ll need to create the WordPress site that you’ll convert into static HTML and deploy to GitHub Pages. This is not the website that users will visit, but it is where you'll manage your content and design.
The easiest option is to host this site locally using a tool such as Local, DevKinsta, or XAMPP. Or, you can also create the site on web hosting so that you can access it anywhere — just make sure to make it private so that visitors can't access this version of your site.
Once you've installed your site, you should set up the design and add all of your content.
3. Convert to static HTML.
Next, you'll need to convert your WordPress site to static HTML. The best option here is Patrick Posner's free Simply Static plugin.
The free version of the plugin will work if you‘re fine with manually deploying your site’s HTML to GitHub Pages, while the premium version supports automatic deployment to GitHub Pages starting at $100.
Once you activate the plugin, go to Simply Static → Settings and enter the following information:
- Destination URL, the link of the domain name used on GitHub Pages. You'll probably want to use a custom domain name (by pointing it to GitHub Pages), but you can also use the GitHub Pages URL.
- Delivery Method. Select Local Directory from the drop-down.
- Local Directory. This is the directory where Simply Static will save the static HTML files. Make this the path to the local version of your GitHub Pages repository.
Now, go to Simply Static → Generate and click the Generate Static Files button. The plugin will export your site as static HTML to your locally hosted repository. It will also rewrite URLs to make sure they're working.
Once the export finishes, it should automatically show up in your local GitHub Pages repository.
4. Deploy WordPress to GitHub Pages.
To finish, you can publish the local repository to your GitHub Pages repository to make your site live. If you're using GitHub Desktop, all you need to do is click Push Origin to make your changes live.
Whenever you make changes to your site, you'll need to repeat steps #3 and #4 again. Or, you can purchase the premium version of Simply Static to simplify deployments to GitHub Pages.
WordPress for Github Tutorials
There are several WordPress Plugins for Github. Let’s examine a few popular choices that can make hosting your WordPress projects on Github more efficient.
My-Github
My-Github is a user-friendly plugin that helps you track your Github profile.
You can easily use the plugin by installing the plugin and creating a page or post. Once you create your page, you insert a shortcode provided by the plugin to display your stats.
This plugin supports:
- Editor ShortCode support.
- GitHub Widget Profile View.
- User profiles.
- Repositories.
- Used Main Language.
- Repository Star Count.
- Repository Watcher Count.
- Repository Fork Count.
- Repository License.
- Repository's Last Pushed Time.
- Add a custom template option.
Best for: My-GitHub is best for WordPress pages that want to track and present data from their webpage traffic, such as followers, following, company, location, blog URL, Twitter account, public repositories, and public repositories' used language.
WP Pusher
The Wordpress Dashboard is where you can control your website’s day-to-day functions. WP Pusher is a tool that allows you to install a theme and plugin directly from your WordPress Dashboard. You can also deploy themes to your WordPress website by using only your repository’s URL.
The WP Pusher has a price tag ranging from $0 for its free package to $99 a year for its premium package.
Installing WP Pusher is fairly easy. All you have to do is enter its repository link and click the install button. If your repository is private, you will have to gain an access token to move forward.
Best for: WP Pusher is best for users who constantly update their WordPress plugins or themes. If you are interested in using plugins or themes that aren’t directly listed in the WordPress library, WP Pusher may be a great choice to consider.
Version Press
Versionpress is a great tool that brings the wonderful features of Git to Wordpress. It goes beyond the basic version control that Git offers to WordPress pages by expanding these capabilities to your database as well.
If you are interested in using Version Press, follow this tutorial to get started.
Best for: Version Press is best for those WordPress web pages that are also integrated with Databases. You can test, stage, and revert all changes to both your live site and your database.
Getting Started With WordPress and GitHub
Whether you want to simplify your WordPress development workflows or host a static WordPress site on GitHub Pages, learning how to set up a WordPress GitHub integration has its benefits.
More advanced users might prefer to use Git from the command line, but the GitHub Desktop client provides an easy way for even non-technical users to use GitHub to manage their WordPress sites.
Set up your WordPress site with GitHub today and you‘ll be enjoying the power of GitHub’s version control and collaboration features in no time.
Editor's note: This post was originally published in January 2022 and has been updated for comprehensiveness.
