WordPress and GitHub Integration

Developing themes and plugins for WordPress can be both fun and lucrative. While there are many ways to manage your workflow, version control, and storage, zeroing in on the best available tools can help take your projects to the next level. 

Fortunately, GitHub makes that task a lot easier. It’s a popular open-source code repository with many valuable tools for developers. Plus, it’s currently the largest host of open-source code in the world, boasting over 34 million users and more than 100 million repositories.  

This article will provide you with a complete guide to integrating your WordPress development site with GitHub. Additionally, we’ll look at some plugins you may want to consider adding to your workflow. Let’s get coding! 

How to Combine GitHub and WordPress (In 4 Steps)

In order to combine your WordPress development environment with GitHub, you’ll need to go through a few important steps. This starts with creating a local WordPress GitHub environment. Then you’ll move on to installing GitHub and creating your first repository. 

Step 1:  Create a Local WordPress Environment

If you plan on developing for WordPress, it’s best to establish a high-quality, local development environment. For this, we recommend using Local:

Developing locally means you can create an environment that will mimic your production server. You can develop and test your source code offline, without causing disruption to anything that’s already live. 

Once you set up your local environment, you’ll have all of the necessary developer features and tools at your disposal. To get started, you can select Free Download! on the home page, and choose your operating system:

After you’ve downloaded the software package and completed the installation process for your system, you can open Local and begin setting up your local development site. When you’re prompted, click on Create a New Site: 

Next, you’ll enter your development site’s name. The local site domain name and path will auto-populate. However, you can use the Browse option to select a different local path for your site if needed: 

You’ll also have the option to Create Site from Blueprint. This means that as you start to amass multiple sites or development projects, you can package together sets of WordPress themes and plugins you use frequently. Then by using Blueprints, you can quickly access and load them when you create a new development site. 

After finishing your domain name selection, click Continue. Next, you’ll be prompted to choose a username and password for your local WordPress installation:

Once your development environment is complete, you’ll see a screen with a summary of your new site’s information: 

This will be the main dashboard for all the local sites you create with Flywheel. From here, you can quickly check the status of your site, view it, and head to your WordPress admin dashboard by selecting Admin. Additionally, you can easily view your WordPress database, security, and other utility information. 

Step 2: Install GitHub 

To enable the use of GitHub with WordPress, you’ll need to create a free GitHub account and download and install Git on your local drive. Git is the open-source Version Control System (VCS) that handles all of the workflows on GitHub.

You have two choices for what you can use to install and configure Git. If you’re comfortable using a command-line tool, that’s one option. Alternatively, you can use the GitHub Desktop client: 

For this demonstration, we’ll download and install GitHub Desktop. After downloading and unzipping the files, you’ll need to sign in with your GitHub information: 

If you’re not familiar with how Git works, you can think of it as the middleman in your workflow. GitHub is where you can host your project, while Git is the function that pulls your GitHub repository to your local development environment so you can work on it.

When you’re done, you can use Git to push the changes to GitHub, so your files will always be up-to-date. 

Step 3: Create a Repository 

Now that you have your local environment ready to go, with WordPress and Git installed on your machine, you’re ready to create a repository for your project. From the GitHub Desktop, you can select Create a New Repository on Your Hard Drive:

You’ll then be prompted to configure your new local repository: 

After naming your repository and configuring a few other settings, such as selecting a license if needed, click on Create Repository. You’ll then see your new repository in the GitHub Desktop user interface:

This is command central for your project. From here, you can commit changes and publish your repository to GitHub. Additionally, you can create repositories from the GitHub website: 

If you create your repository this way, you can use the Clone repository feature in your Desktop interface to pull it into your local development environment: 

After you choose the repository you want to clone from GitHub and set the local path, click on Clone to complete the action. 

Step 4: Publish Your Repository

Once you’ve added files to your local repository folder, they will appear in the GitHub desktop. From there, you can initiate changes, open your code editor, and publish your repository to GitHub:

After clicking on Publish repository, you’ll be prompted to add a description and complete the publishing process: 

Then, you can check your GitHub account to make sure your repository was published:

As you make changes to your files and test them in your Local by Flywheel WordPress environment, you can easily commit your changes in GitHub Desktop. Then, you’ll be able to publish your updated repositories to GitHub with one click.  

Github Plugins for WordPress

There are not many plugins for WordPress that add meaningful functionality for GitHub. Some newer and unvetted plugins are available that are designed to enable updates to your blog via published repositories. However, there are two reliable options that offer useful features for developers.

1. Github Embed

Github Embed is a free WordPress plugin that enables you to embed GitHub information on your website. You can do this by using a simple link in your WordPress pages and posts. Once you embed your GitHub link on your website, it will be updated whenever you make a change to that repository. 

This is especially useful for developers who sell themes and plugins. With this tool, you can easily keep your customers up-to-date on any new changes, issues, and improvements.

2. GitHub Updater

It’s important to note that the plugins and themes you download from GitHub and add to your WordPress website will not be flagged for updates. This means that if the developer makes a change, you won’t get a notice in your WordPress dashboard. 

That’s where the GitHub Updater plugin can help you out. It was developed to make automatic updates available for GitHub themes and plugins. Some GitHub developers even require the use of this plugin when you install their projects on your WordPress website. 

Next Steps

At this point, you’re all set up to create a Git workflow between Flywheel, WordPress, and GitHub! You’ll be able to retrieve code from GitHub, and create your own themes and plugins or contribute to current projects in the WordPress community. 

In addition to enhancing your development workflow, you can also leverage GitHub’s many features and tools. For example, you can use GitHub Pages to push your repositories straight to a live website. GitHub is also highly effective for projects with large teams all working on the same project. 

Stay in Control With WP Engine

Orienting yourself to GitHub and a more streamlined development workflow can be a game-changer for your projects. Not only is this platform ideal for freelancers, but it also adds to the innovation that takes place in open-source communities. 

Here at WP Engine, we believe in the power of open-source development. That’s why we work to provide the best developer resources for WordPress users. Check out our plans for your next project!