Push Your WordPress Theme from Your Server to Your GitHub Account

Using version control like Git with WordPress can greatly improve your workflow, especially when dealing with large scale projects. While developing locally and then pushing files to GitHub is pretty straightforward with GitHub’s native apps for Windows and Mac, developers will often find themselves working on a client’s production server. In situations like these, knowing how to push files from a server to GitHub can be a valuable tool.

For this tutorial, we will be focusing on pushing a WordPress theme, Twenty Fourteen, from your web server to a GitHub repository.  This tutorial is for those who are new to Git/GitHub but assumes that you know how to use SSH to access your server. If you’re not sure if SSH is enabled on your server, contact your host and they should be able to enable it for you.

Setting Up Git In The Theme Folder

  1. Open up your SSH client (I use PuTTY) and connect to your server.
  2. Double check that your host has Git enabled on the server by typing
    git --version
  3. Now we want to take the terminal to the correct directory of our server. In this case, we want to go to our theme folder. In order to do this we use the Change Directory command (cd). For example, if you want to go to the twentyfourteen theme folder on your server you would enter the path to the folder, such as:
    cd public_html/wp-content/themes/twentyfourteen
  4. Assuming you are doing this for the first time, you will have to initialize a git repo in the theme folder. To check if a git repository already exists in your theme folder, simply enter
    git status

    in the command line. If no git repo exists, you will get a fatal error.

  5. To create a new git repo in your theme folder, enter
    git init

    You will see a message that says “Initialized empty Git repository in [path to theme folder]”

  6. Now, let’s put the README file in the theme directory for GitHub to read. Do this by entering
    touch README

    There should now be README file in your theme folder on your server.

  7.  Now, if you enter
    git status

    you will see a list of all the files that are only in the root of the theme folder. We want to add all files from the theme folder and its subfolders to the repo. To do this, type

    git add *

    Now if you enter

    git status

    you will see all the files in the sub-folders of your theme as well.

Setting Up Your Repository On GitHub

  1. First, login to your github account and create a new repository.
  2. For our example, let’s call our new repository “twentyfourteen”. Choose whether or not the repo will be public or private (private repos are only for paid accounts). Do not check the box that says “Initialize this repository with a README” since we have already created one. Click “Create repository” when ready.
    The page that follows will give you some very helpful information for creating your first commit.
  3. Under the “Create a new repository on the command line” heading, copy the final 3 commands into the command line. The  final 3 commands are:
    1. git commit -m "first commit"

      This command creates the note that will go along with the commit

    2. git remote add origin [email protected]:YOURUSERNAMEHERE/twentyfourteen.git

      This command tells Git where we are going to be pushing this commit to. In this case, we are pushing to our specific repo in github.

    3. git push -u origin master

      This command actually pushes your files to your Github account.

  4. Now if you go to your GitHub account, you will see that your twentyfourteen repo has all of your theme files and folders.

Now let’s see what happens when we update a file in the theme folder on our server.

  1. The README file in the twentyfourteen folder should be empty, so open it up via your FTP client, add the following line, and save the file:
    “Thanks for reading this README file!”
  2. Back in the console, type
    git status

    you should see a line that says the README file has been modified

  3. Add the README file to the commit by typing
    git add *
  4. Add a note to the commit using the commit command we used earlier:
    git commit -m "just updated the README"
  5. And now push the commit using the same command as before:
    git push origin master

Using this method you can quickly and easily use the power of Git and the convenience of GitHub in your next WordPress theme development project.

Leave a Reply

Your email address will not be published. Required fields are marked *