A template in Shopify Flow is an example workflow that can be copied into a merchant's shop. Templates help merchants automate a specific use case with minimal or no additional configuration. Flow's template library offers hundreds of templates with features to filter, browse, and search. You can  create a template  for Shopify Flow that showcases your custom triggers and actions and help merchants do more.


To create a workflow template that merchants can add to their workflow list, you need to add a Flow template extension to your app.

## Requirements

- A [development store](/docs/api/development-stores) that has [Shopify Flow](https://apps.shopify.com/flow) and your app installed.
- Your existing custom triggers and actions are connected to your instance of Shopify Flow.
- [Shopify CLI](/docs/apps/build/cli-for-apps) installed with a version of `3.49` or higher.

## Step 1: Create a workflow

A workflow is the foundation of a Flow template.

1. In your development store navigate to **Apps** > **Flow**.
2. Click **Create workflow**.
3. In the workflow editor, build a workflow that solves a merchant use case and showcases your custom trigger and or actions.
4. Optional: Tailor your template to a wider audience by [localizing your custom step descriptions](/docs/apps/build/flow/templates/reference#step-descriptions).
5. After you're satisfied with your workflow, [export the workflow](https://help.shopify.com/en/manual/shopify-flow/manage#export-a-workflow) and save the `.flow` file locally.

> Note:
> - Remove any shop specific test data or replace with placeholder values if the merchant needs to provide a value. For example using the placeholder `YOUR_TAG_NAME` in a location where the merchant needs to provide a shop specific tag.<br />
> - Don't edit `.flow` files directly. Only make changes within the Flow app and export the updated workflow.<br />
> - Test your workflow thoroughly, ensuring the trigger, condition(s), and action(s) used provide the intended result.

## Step 2: Create a Flow template extension

Use the Shopify CLI to generate a new extension:

1. Navigate to your app directory.
2. Run the following command:

<p>
<div class="react-code-block" data-preset="terminal">
<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>
</div>


<script type="text/plain" data-language="bash">
#!/bin/bash
shopify app generate extension
</script>

</div>
</p>


3. Select the `Flow Template` as the type of extension.
4. Provide a meaningful name for your extension.
<br>


The name that you provide displays in the Partners Dashboard. Follow these guidelines when choosing a name:

- Don't use punctuation.
- Separate words using spaces.

After you've followed the prompts, Shopify CLI generates the extension’s file representation in your app's `/extensions` directory and returns a success message. You can then go into your app's `/extensions` directory and start editing your new extension.

> Note:
> Each Flow template extension can contain only a single template. To deploy multiple templates, you will need to create an extension for each template.

The file structure of your extension should look like the following:

<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>
</div>

<script data-option="nocopy" data-value="true"></script>

<script type="text/plain" data-language="ssh">
/your-extension-name
  /locales
    en.default.json
    fr.json
  shopify.extension.toml
  template.flow
</script>

</div>
</p>


To learn more about the extensions file structure, refer to our [app structure](/docs/apps/build/cli-for-apps/app-structure) documentation and the [documentation](/docs/apps/build/flow/templates/reference) for the Flow template extension type.

## Step 3: Configure extension
Configure your template extension to include information describing it's function for merchants, and settings that control visibility.

1. Update the [shopify.extension.toml configuration file](/docs/apps/build/flow/templates/reference#toml).
2. Update and add any additional locales. [Localization reference](/docs/apps/build/flow/templates/reference#localization).
3. Replace `template.flow` with the workflow [that you exported](/docs/apps/build/flow/templates/create-a-template#step-1-create-a-workflow).
4. Be sure to update the filename to match your chosen file path in the `shopify.extension.toml` file. `template.flow` is the default.

## Step 4: Preview extension

Preview your template extension to see how it will be displayed to merchants before deploying and requesting review.

1. Run the following command in Shopify CLI:

<p>
<div class="react-code-block" data-preset="terminal">
<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>
</div>


<script type="text/plain" data-language="bash">
#!/bin/bash
shopify app dev
</script>

</div>
</p>


2. In your development store's Shopify admin, navigate to [`/flow/editor/templates/dev`](https://admin.shopify.com/apps/flow/editor/templates/dev). From here you can preview your workflow, template card, and custom step descriptions.
3. Refer to our [approval criteria](/docs/apps/build/flow/templates/reference#approval-process) to ensure that your extension meets our requirements.

## Step 5: Deploy extension

Use Shopify CLI to deploy your extension.

1. Navigate to your app directory.
2. Run the following command to start deploying your extension(s):

<p>
<div class="react-code-block" data-preset="terminal">
<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>
</div>


<script type="text/plain" data-language="bash">
#!/bin/bash
shopify app deploy
</script>

</div>
</p>


3. Follow the command prompts

When you receive confirmation that the deploy was successful, a new app version in your Partner Dashboard displays, where you can submit a request for review. After the request for review has been submitted and the [approval process](/docs/apps/build/flow/templates/reference#approval-process) is complete, you can release the new version from your Partner Dashboard and your templates will display in Flow's template library.