If you have a theme that you want to work with programmatically, then you can integrate Shopify CLI into your CI/CD pipeline to perform actions like pushing, pulling, and publishing a theme.

## What you'll learn

In this tutorial, you'll learn how to set up your CI/CD pipeline to work with themes programmatically. To do so, you'll gather the credentials necessary to run the CLI commands, and then add a step to your CI/CD pipeline that installs Shopify CLI and runs CLI commands.

## Requirements

- [Shopify CLI 3.20 or higher](/docs/storefronts/themes/tools/cli/cli-2/commands)

> Tip:
> [Learn how to check your Shopify CLI version](/docs/storefronts/themes/tools/cli/cli-2/commands#version).

## Step 1: Get a Theme Access password for the store

For each store that you want to interact with programmatically using Shopify CLI, you need to get a Theme Access password. These are generated using the [Theme Access](https://apps.shopify.com/theme-access) app.

To learn about the requirements for installing and using the Theme Access app, and instructions on how to generate a new password, refer to [Manage theme access](/docs/storefronts/themes/tools/theme-access).

## Step 2: Integrate Shopify CLI into your pipeline

After you get a Theme Access password for the store, you can integrate Shopify CLI into your continuous deployment pipeline using your CI/CD provider.

The CD pipeline step should install Shopify CLI and all of its [dependencies](/docs/api/shopify-cli#requirements).

To run Shopify CLI theme commands programmatically using your CD pipeline step, include the following:

- Environment variables (or equivalent flags):

    | Name | Required? | Value |
    | --- | --- | --- |
    | `SHOPIFY_CLI_THEME_TOKEN` | Yes | The [Theme Access password](#step-1-get-a-theme-access-password-for-the-store) that you generated or were given by a merchant |
    | `SHOPIFY_FLAG_STORE` | Yes | The store that you want to interact with |
    | `SHOPIFY_FLAG_FORCE` | No | Pass this variable with a value of `1` to turn off interactive prompts. You may want to use this variable if your Shopify CLI pipeline step is timing out. |

    Where possible, you should protect the Theme Access password by masking it or storing it as a secret.
- A step that sets up Node.js.
- A step that installs Shopify CLI globally.
- A step that runs the CLI command that you want to execute.

### Example (GitHub Actions)

Below is an example of a step that you might add to your GitHub Actions workflow. It pushes a theme to a Shopify store when code is pushed to the `main` branch.

<p>
<div class="react-code-block" data-preset="file">
<div class="react-code-block-preload ThemeMode-dim">
<div class="react-code-block-preload-bar "></div>
<div class="react-code-block-preload-placeholder-container">
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>

</div>
</div>

<script data-option="filename" data-value=".github/workflows/deploy-theme.yml"></script>

<script type="text/plain" data-language="yml">

name: Theme deploy

on: [push]

jobs:
  deploy:
    name: Deploy
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: actions/setup-node@v3
        with:
          node-version: 18

      - name: Install Shopify CLI
        run: npm install -g @shopify/cli

      - name: Upload theme
        run: |
          shopify theme push \
            --json \
            --theme your-theme-name-or-id \
            --store ${{ secrets.SHOPIFY_STORE }} \
            --password ${{ secrets.SHOPIFY_CLI_THEME_TOKEN }}

</script>

</div>
</p>