Integrating GitHub with Your Shopify Store

In the shortfalls of complexity faced in Shopify theme management and version control, if you also find it annoying to use the basic version control given in Shopify to keep track of changes or

duplicate the theme for development purposes or make more than one copy of the theme because both you and your fellow developer need to work simultaneously.

Integration of Shopify with GitHub provides unparalleled benefits, for version control and collaboration. Connecting Shopify stores with the GitHub repository allows us to leverage a Git-based version control system which allows developers to track changes and collaboration. Multiple developers can work on different features or fixes simultaneously, and Git helps merge their changes together without conflicts, one can also ensure code quality before deploying changes to the live store. By following these easy steps, you integrate your Shopify Store with GitHub –

Create a new repository on GitHub 

Create a GitHub Repository for your Shopify Project

Download the thetheme file from your store

Shopify allows you to download your store's theme files as a ZIP.

In your Online Store, click on the action icons and Select download the file, this will send a zip file to your mail.

Download the zip file from your mail address, then extract it to a folder. Push the files to your repository. Make sure to follow the proper file structure of the theme i.e 

In your Online store, navigate to the Add theme button and select the option ‘connect from GitHub’ – On clicking the Add theme button, you'll get options whether to visit the Theme Store, Upload a Zip file, or connect from GitHub. This last option is key for Shopify GitHub integration.

Click on login to GitHub Next, and choose your account to continue with Shopify-GitHub Integration

After choosing the account, the next step would be to choose whether to give Shopify access to all the repositories or selected repositories only, it’s totally up to your store requirements whether you want to give access to a few selected repositories or all. 

After Selecting repositories, click on the install button. After completion, you will be able to see on the side window your GitHub Account being displayed along with the option of selecting the repository.

Select the repository that has your theme files and the branch that has your latest code and click on the connect button. After clicking, it will show you a tick mark and in the Theme Library section, you can see your theme file being uploaded to your store.

And now you finally have your Shopify Store Integrated with your GitHub account

On clicking on view logs, one can see recent theme logs

Also on GitHub, in your repo you’ll see a Shopify Bot section on the heading, clicking upon which you can see all the recent changes on your theme –

Now, let's look at a scenario where different developers are working on different features and they push their codes to their respective branches,

Here we can make pull request to merge the branches to the master branch(i.e. the one which is integrated with Shopify)

Based on the changes, GitHub will either automatically merge or in some cases, notify us that there are conflicts that need to be resolved manually. which one can resolve by reviewing the conflicting lines of code and deciding how to reconcile them with the changes in the pull request.

After successful merging, one can see the code that has been implemented now in the master branch itself and automatically reflected in our Shopify theme. This seamless integration between Shopify and GitHub makes theme development and management much more efficient.

The Shopify Bot on GitHub is a useful feature that appears in your repo after integration. Clicking on it allows you to see all the recent changes on your theme:

This bot facilitates the smooth operation of Shopify Git workflows, making it easier to manage your Shopify theme GitHub repository.

Conclusion

Connecting your Shopify store with GitHub allows you to leverage the version control system, It makes it easy for multiple developers to work on different features or fixes simultaneously say in separate branches, and then Github helps in merging or rebasing their changes to the master branch (i.e the branch that is integrated with Shopify) making the development and edits on a theme a hassle-free task. By following the above given steps you can easily integrate your Shopify store with GitHub.