How To Use The Shopify GitHub Integration For Your Shopify Store

by · July 7, 2021

Hura Product Showcase Builder

The Shopify GitHub integration lets you associate a GitHub account with your Shopify login, and then connect Git repositories to themes in your Shopify admin. This connection helps you to make and track changes to the theme code. It also helps you to collaborate with other developers and share progress in real-time.

The Shopify GitHub integration includes the following features:

  • Automatically pull and push theme code from any organization or repository associated with your GitHub account
  • Connect one or more branches from a repository to easily develop and test new theme features or campaigns
  • Keep a theme up to date with commits to a branch, and track edits made in the Shopify admin, including the code editor and theme editor
  • Connect branches to unpublished or published themes

This article will guide you on how to use the Shopify GitHub integration for your Shopify store.

Following the below steps:

Step 1: Connect to a GitHub organization or account

To get started with the Shopify GitHub integration, you need to connect a GitHub organization or account to Shopify. Make sure that you log in using the store URL (for example, my-example-store.myshopify.com/admin) instead of logging in through the Partner Dashboard.

  • From your Shopify admin, go to Online Store > Themes.
  • In the Theme library section, click Add theme > Connect from GitHub.
  • In the Connect theme pane, click Log in to GitHub.
  • Enter your GitHub credentials.
  • You’re prompted to authorize and install the Shopify Online Store GitHub app. Select whether you want to install the app on your personal account or for your organization.
  • If you’re installing the app for an organization, then choose whether to install the app for all repositories, or select repositories. Shopify recommends only granting access to specific repositories that you want to use with this integration.

Step 2: Connect a branch as a theme

To connect a branch to a theme in the Shopify admin, you need to choose a branch. The contents of the branch are added as a new theme in your theme library.

  • From your Shopify admin, go to Online Store > Themes.
  • In the Theme library section, click Connect from GitHub.
  • If prompted, log into GitHub.
  • If you’re connecting a repository that belongs to an organization, then select the organization that the repository belongs to.
  • Select the repository that you want to connect, and then select the branch that you want to connect.

The theme appears in your theme library. Themes that are connected to GitHub list the repository, branch name, and last commit time on the theme card.

After the initial connection is made, all commits to the branch that you selected are pulled into the theme, and all changes that you make through the Shopify admin are pushed to the branch.

Step 3: Test the connection

To ensure that the connection between your branch and repository is working, you can make a small change to the theme and then verify that a commit was made in the branch.

  • From your Shopify admin, go to Online Store > Themes.
  • On the theme that’s connected to GitHub, click Customize.
  • Change any setting in your theme. For example, in Dawn, you might change the text on the announcement bar.
  • Click Save, and then exit the theme editor.
  • In the theme library, on the card for the theme, click the name of the branch to navigate to GitHub.
  • Note the most recent commit. It should list the shopify-online-store app and your username as the authors of the commit.

If desired, you can also push a change to the branch from your local machine. After you push a commit to your branch, the Last saved date on the theme updates and the change is visible in the theme.

Step 4: Publish the theme

To track changes to your published theme, you need to publish a theme from your theme library that’s connected to a GitHub branch. You might add your master or main branch as a theme so you can keep your published theme up to date using Git branching and merging strategies.

You can publish the theme manually through the Shopify admin.

Source: Shopify

Hura Theme Blocks

Tags:

You may also like...