### Example Theme Check Configuration

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/configuration

An example `.theme-check.yml` file demonstrating various configuration options.

```yaml
root: "dist"
extends: "theme-check:recommended"
require:
  - ./my-custom-checks.js
ignore:
  - assets/custom.js
checks:
  theme-layout-layout-file:
    enabled: false
  theme-liquid-html-check:
    severity: warning
    ignore:
      - templates/customers/*.liquid
  theme-content-for-layout-theme-object:
    max-name-length: 10
```

--------------------------------

### Theme Get Configuration File Example

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/command-reference

The `theme get` command outputs a `config.yml` file with the following structure, containing your store's connection details.

```yaml
development:
password: [your-theme-kit-password]
theme_id: "[your-theme-id]"
store: [your-store].myshopify.com
```

--------------------------------

### LiquidDoc Usage Examples

Source: https://shopify.dev/docs/storefronts/themes/tools/liquid-doc.md

This example shows how to provide multiple usage examples for a price display snippet, demonstrating different ways to call the snippet with various parameters.

```liquid
{% doc %}
  Price display snippet


  @param {number} price - Price value
  @param {boolean} [show_compare_at] - Whether to show compare-at price


  @example
  {% render 'price', price: product.price, show_compare_at: true %}


  @example
  {% render 'price',
    price: variant.price,
    show_compare_at: false
  %}
{% enddoc %}
```

--------------------------------

### Test Theme Kit installation

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/troubleshooting

Verify that Theme Kit is installed and functioning correctly by running the help command.

```bash
theme --help
```

--------------------------------

### Install Theme Kit on Windows

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/getting-started

Install Theme Kit on Windows using Chocolatey.

```bash
choco install themekit
```

--------------------------------

### Example ignore file content

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/configuration-reference

This example shows a valid ignore file format where each pattern is on a new line. Lines starting with '#' are treated as comments.

```text
# $PROJECT_DIR/themekit_ignores
# plain file names
config/settings_data.json
  
# globs
*.png
  
# regex
/\\.(txt|gif|bat)$/
```

--------------------------------

### Example Schema Configuration

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/asset-size-app-block-javascript

This example shows how to configure the `javascript` property within a theme app extension's schema to specify a JavaScript file.

```liquid
{% schema %}
{
... 
"javascript": "chat-widget.js"
}
{% endschema %}
```

--------------------------------

### Complete Example

Source: https://shopify.dev/docs/storefronts/themes/tools/cli/theme-preview-overrides

An example demonstrating the use of per-file operations (`source`, `merge`, and per-file `diffs`) within a single JSON overrides file.

```APIDOC
## Complete example

The following example uses per-file operations (`source`, `merge`, and per-file `diffs`):

```json
{
  "metadata": {
    "version": "0.1.0"
  },
  "theme_changes": {
    "templates/index.json": {
      "merge": {
        "current": {
          "product_image_size": "large"
        }
      }
    },
    "templates/product.liquid": {
      "source": "<div>{{ product.title }}</div>"
    },
    "templates/price.liquid": {
      "diffs": "3a4,6\n {% render 'sale-badge' %}\n"
    }
  }
}
```
```

--------------------------------

### Install Theme Kit on macOS

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/getting-started

Install Theme Kit on macOS using Homebrew. For Apple M1 architecture, start the terminal with the 'Open using Rosetta' option.

```bash
brew tap shopify/shopify
brew install themekit
```

--------------------------------

### URL Parameter Structure Examples

Source: https://shopify.dev/docs/storefronts/themes/navigation-search/filtering/storefront-filtering

These examples demonstrate the basic structure of URL parameters for storefront filtering, including product-level and variant-level filters.

```text
filter.filter_scope.attribute=value
```

```text
filter.filter_scope.attribute.attribute_scope=value
```

--------------------------------

### Passing Example: All static blocks have content_for (array notation)

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/schema-presets-static-blocks

This example passes because each static block has a corresponding `content_for` tag. This demonstrates a correct setup when blocks are defined as an array in the schema.

```liquid
{% content_for "block", type: "text", id: "block_1" %}{% content_for "block", type: "slide", id: "block_2" %}
  

{% schema %}
"presets": [
{
"name": "My preset",
"blocks": [ { 
"type": "text",
"static": true,
"id": "block_1"
}, 
"block_2": {
"type": "slide",
"static": true,
"id": "block_2"
}
]
}
]
{% endschema %}
```

--------------------------------

### Customer Form Example

Source: https://shopify.dev/docs/storefronts/themes/trust-security/captcha

This example shows the necessary attributes for a customer login form to be compatible with CAPTCHA functionality.

```html
<form action="/account/login" ...>
<input type="hidden" name="form_type" value="customer_login" />
...
```

--------------------------------

### Install Prettier and Shopify Liquid Plugin

Source: https://shopify.dev/docs/storefronts/themes/tools/liquid-prettier-plugin

Install the necessary packages for Prettier and the Shopify Liquid plugin using npm or Yarn.

```bash
npm install --save-dev prettier @shopify/prettier-plugin-liquid
```

```bash
yarn add --dev prettier @shopify/prettier-plugin-liquid
```

--------------------------------

### Example config.yml with ignore patterns

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/configuration-reference

This example demonstrates how to specify ignore patterns in the `ignore_files` value and a file path for additional ignores in the `ignores` value within a `config.yml` file.

```yaml
development:
... # Other content
ignore_files:
- config/settings_data.json
- "*.png" # Patterns that start with * need to be quoted to have vaild yaml
- /\\.(txt|gif|bat)$/
ignores:
- themekit_ignores # A file to load ignore patterns. Check out the example ignore file.
```

--------------------------------

### Install Theme Kit on Linux

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/getting-started

Use this script to automatically download and install the latest version of Theme Kit on Linux. Homebrew is not supported on Linux.

```bash
curl -s https://shopify.dev/themekit.py | sudo python3
```

--------------------------------

### Example llms.txt.liquid Content

Source: https://shopify.dev/docs/storefronts/themes/architecture/templates/llms-txt-liquid

This example shows how to use Liquid objects to dynamically populate agent-discovery information in the llms.txt file. It includes the store name, a link to the canonical agent-discovery document, and URLs for UCP discovery, MCP endpoint, and sitemap.

```liquid
# {{ agents.store_name }}
  

> Agent-discovery summary. The canonical, full description is at {{ agents.store_url }}/agents.md.
  
- UCP discovery: {{ agents.ucp_discovery_url }}
- MCP endpoint: {{ agents.mcp_endpoint_url }}
- Sitemap: {{ agents.sitemap_url }}
```

--------------------------------

### Example llms-full.txt.liquid Content

Source: https://shopify.dev/docs/storefronts/themes/architecture/templates/llms-full-txt-liquid

Provides an example of how to structure the content for the llms-full.txt.liquid template, using Liquid objects for dynamic data.

```liquid
# {{ agents.store_name }} — Full agent reference
  

The canonical description is at {{ agents.store_url }}/agents.md.
  
## Commerce Protocol (UCP)
- UCP discovery: {{ agents.ucp_discovery_url }}
- MCP endpoint: {{ agents.mcp_endpoint_url }}
  
### Supported UCP versions
{% for version in agents.ucp_versions %}
- {{ version }}
{% endfor %}
  
## Read-only browsing
- All products: `GET /collections/all`
- Sitemap: {{ agents.sitemap_url }}
```

--------------------------------

### Start Shopify Liquid Language Server

Source: https://shopify.dev/docs/storefronts/themes/tools/cli/language-server

Run this command in your terminal to start the Shopify Liquid Language Server. This command is part of the Shopify CLI.

```bash
shopify theme language-server
```

--------------------------------

### Example CSS File Size Check

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/asset-size-app-block-css

This example demonstrates how to check the size of an asset CSS file against a specified threshold within the theme schema.

```liquid
{% schema %}
{
... 
"stylesheet": "app.css"
}
{% endschema %}
```

--------------------------------

### Example Video ID and Type Output

Source: https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings

An example of how the video ID and type might be rendered in the theme editor or on the storefront.

```text
ID: _9VUPq3SxOc
Type: youtube
```

--------------------------------

### Specific Filter Examples

Source: https://shopify.dev/docs/storefronts/themes/navigation-search/filtering/storefront-filtering

Examples of URL parameters for filtering by product type and variant option (color).

```text
filter.p.product_type=shoes
```

```text
filter.v.option.color=red
```

--------------------------------

### Passing Example: Single Connection with Local Assets

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/remote-asset

This example passes the RemoteAsset check by loading JavaScript, CSS, and an image from the same connection. It demonstrates using the `asset_url` filter for local assets and `image_url` for images, ensuring efficient loading.

```html
<script src="{{ 'theme.js' | asset_url }}" defer></script>
{{ 'bootstrap.min.css' | asset_url | stylesheet_tag }}
<img src="/content/assets/images/{{ image | image_url: width: 500 }}" alt="" />
```

--------------------------------

### Legacy Resource-Based Setting Schema Example

Source: https://shopify.dev/docs/storefronts/themes/architecture/settings

An example of a schema definition for a 'product' type resource-based setting, used in older themes.

```json
{
"type": "product",
"id": "product",
"label": "Product"
}
```

--------------------------------

### Example Locale File Structure

Source: https://shopify.dev/docs/storefronts/themes/architecture/locales/storefront-locale-files

Organize your translation keys to mirror your theme's structure for clarity and ease of management. This example shows a common top-level grouping.

```text
general:
  404: "Page not found"
  breadcrumbs: "Breadcrumbs"
  search: "Search results"
  pagination: "Page {{ page_number }} of {{ total_pages }}"

products:
  product: "{{ product.title }}"
  related_products: "Related products"

cart:
  cart_contents: "Your cart"
  updates: "Update cart"
  notes: "Special instructions"
  link_to_checkout: "Checkout"
```

--------------------------------

### Get Help from Theme Kit CLI

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/command-reference

Run these commands to get help information directly from the command line interface. Use `theme help` for a list of all commands and flags, or `theme [command] --help` for specific command details.

```bash
theme help
```

```bash
theme [command] --help
```

--------------------------------

### Consistent Locale File Example

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/matching-schema-translations

This example displays a locale file that has consistent translations with the default locale, including pluralized strings.

```json
{
"greeting": "Hello, world",
"goodbye": "Bye, world",
"pluralized_greeting": {
"one": "Hello, you",
"other": "Hello, y'all"
}
}
```

--------------------------------

### Example Option Value Picker with Combined Listings Support

Source: https://shopify.dev/docs/storefronts/themes/product-merchandising/variants/support-high-variant-products

This example demonstrates a complete option value picker that supports combined listings. It uses `product_option_value` fields to simplify input rendering and includes the `data-product-url` attribute for dynamic updates.

```html
<section id="product" data-product-url="{{ product.url }}" data-section-id="{{ section.id }}">
<h2>{{ product.title }}</h2>
<div className="price">
{{ product.price | money }}
</div>
<!-- ...other product info... -->
  
<div className="optionValueSelectors">
<!-- Use options_with_values to render options -->
{%- for option in product.options_with_values -%}
<fieldset className="option">
<legend>{{ option.name }}</legend>
  
{%- for option_value in option.values -%}
{%- capture input_id -%}
{{ section.id }}-{{ option.position }}-{{ forloop.index0 -}}
{%- endcapture -%}
  
<!-- Use product_option_value` fields to simplify option value input rendering and support combined listings -->
<input
type="radio"
id="{{ input_id }}"
name="{{ option.name }}"
value="{{ option_value | escape }}"
{% if option_value.selected %}
checked
{% endif %}
{% unless option_value.available %}
className="disabled"
{% endunless %}
data-product-url="{{ option_value.product_url }}"
data-option-value-id="{{ option_value.id }}"
/>
  
<label for="{{ input_id }}">
{{ option_value -}}
{%- endfor -%}
</fieldset>
{%- endfor -%}
</div>
</section>
```

--------------------------------

### Example Section Group: Footer

Source: https://shopify.dev/docs/storefronts/themes/architecture/section-groups

An example of a section group configuration, named 'Footer group', which includes 'quick-links' and 'newsletter-signup' sections. The order of sections is specified.

```json
{
"type": "footer",
"name": "Footer group",
"sections": {
"quick-links": {
"type": "quick-links",
"settings": {}
},
"newsletter-signup": {
"type": "newsletter-signup",
"settings": {}
}
},
"order": [
"newsletter-signup",
"quick-links"
]
}
```

--------------------------------

### markets.json Structure Example

Source: https://shopify.dev/docs/storefronts/themes/architecture/config/markets-json

This example demonstrates the structure of a markets.json file, showing how different markets inherit settings from a parent market or the store default. The 'parent' field specifies the source of inheritance.

```json
{
"markets": {
"europe": {
"parent": "@default"
},
"north-america": {
"parent": "@default"
},
"canada": {
"parent": "north-america"
},
"united-states": {
"parent": "north-america"
}
}
}
```

--------------------------------

### Failing Example: Multiple Remote Connections

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/remote-asset

This example fails the RemoteAsset check because it loads JavaScript, CSS, and an image from different remote CDNs, leading to multiple competing connections.

```html
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" defer></script>
{{ "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" | stylesheet_tag }}
<img src="https://example.com/heart.png" alt="" />
```

--------------------------------

### Complete Section Schema Example

Source: https://shopify.dev/docs/storefronts/themes/architecture/sections/section-schema

This example demonstrates a comprehensive section schema including name, tag, class, limit, settings, max_blocks, blocks, and presets. It defines a 'Slideshow' section with a text input for the title and a 'Slide' block type with an image picker.

```liquid
{% schema %}
{
  "name": "Slideshow",
  "tag": "section",
  "class": "slideshow",
  "limit": 1,
  "settings": [
    {
      "type": "text",
      "id": "title",
      "label": "Slideshow"
    }
  ],
  "max_blocks": 5,
  "blocks": [
    {
      "name": "Slide",
      "type": "slide",
      "settings": [
        {
          "type": "image_picker",
          "id": "image",
          "label": "Image"
        }
      ]
    }
  ],
  "presets": [
    {
      "name": "Slideshow",
      "settings": {
        "title": "Slideshow"
      },
      "blocks": [
        {
          "type": "slide"
        }
      ]
    }
  ]
}
{% endschema %}
```

--------------------------------

### Download theme and set up config.yml

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/getting-started

Download a specific theme and automatically create the `config.yml` file to connect it with your local directory. Replace placeholders with your actual password, store name, and theme ID.

```bash
theme get --password=[your-password] --store="[your-store.myshopify.com]" --themeid=[your-theme-id]
```

--------------------------------

### Start Local Development Server for Shopify Theme

Source: https://shopify.dev/docs/storefronts/themes/getting-started/create

Run this command to serve your theme and interact with it in a browser. The `--store` flag is required the first time you preview your theme to specify the store for previewing. This command uploads the theme as a development theme and provides a URL for hot-reloading local changes.

```bash
shopify theme dev --store my-store
```

--------------------------------

### Example config.yml for Multiple Environments

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/configuration-reference

This YAML file demonstrates how to configure Theme Kit for development, production, and testing environments, specifying parameters like password, theme ID, store domain, proxy, ignore files, timeout, and read-only settings.

```yaml
development:
password: 16ef663594568325d64408ebcdeef528
theme_id: "123"
store: can-i-buy-a-feeling.myshopify.com
proxy: http://localhost:3000
ignore_files:
- "*.gif"
- "*.jpg"
- config/settings_data.json
production:
password: 16ef663594568325d64408ebcdeef528
theme_id: "456"
store: can-i-buy-a-feeling.myshopify.com
timeout: 60s
readonly: true
test:
password: 16ef663594568325d64408ebcdeef528
theme_id: "789"
store: can-i-buy-a-feeling.myshopify.com
ignores: ignore.txt
```

--------------------------------

### Verify Shopify CLI Installation

Source: https://shopify.dev/docs/storefronts/themes/tools/cli/migrate

Run this command after installation or uninstallation to check the installed version of Shopify CLI.

```bash
shopify version
```

--------------------------------

### Complete example with multiple operations

Source: https://shopify.dev/docs/storefronts/themes/tools/cli/theme-preview-overrides

Demonstrates a complete JSON overrides file using per-file operations for merge, source replacement, and diff patching.

```json
{
"metadata": {
"version": "0.1.0"
},
"theme_changes": {
"templates/index.json": {
"merge": {
"current": {
"product_image_size": "large"
}
}
},
"templates/product.liquid": {
"source": "<div>{{ product.title }}</div>"
},
"templates/price.liquid": {
"diffs": "3a4,6\n {% render 'sale-badge' %}\n"
}
}
}
```

--------------------------------

### Resource-Based Setting Schema Example

Source: https://shopify.dev/docs/storefronts/themes/architecture/settings

An example of a schema definition for a 'page' type resource-based setting.

```json
{
"type": "page",
"id": "page",
"label": "Page"
}
```

--------------------------------

### Publish a Theme

Source: https://shopify.dev/docs/storefronts/themes/getting-started/create

Make your theme live on your store by running the publish command. You'll be prompted to select the theme and confirm.

```bash
shopify theme publish
```

--------------------------------

### Example CSS for Template-Specific Selectors

Source: https://shopify.dev/docs/storefronts/themes/architecture/layouts

An example of a CSS rule targeting a specific template class, such as `.template-product`.

```css
.template-product {
margin-bottom: 2em;
}
```

--------------------------------

### Open Theme Preview

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/command-reference

Opens the preview page for your theme in your browser and prints the URL. Use `--env` to specify the environment.

```bash
theme open --env=production # opens http://your-store.myshopify.com?preview_theme_id=[your-theme-id]
```

--------------------------------

### Example of Missing Translations

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/matching-schema-translations

This example shows a locale file missing translations for keys present in the default locale.

```json
{
"greeting": "Hello, world",
"goodbye": "Bye, world"
}
```

--------------------------------

### Handling Legacy Resource-Based Settings

Source: https://shopify.dev/docs/storefronts/themes/architecture/settings

Demonstrates how to access a product object using its handle from a legacy resource-based setting. It includes checks for a valid product selection.

```liquid
{% unless settings.product == blank %}
{% assign product = all_products[settings.product] %}

{% if product %}
{{ product.title }} - {{ product.price }}
{% else %}
No product, or invalid product, selected.
{% endif %}
{% endunless %}
```

--------------------------------

### Consistent Translations Example

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/matching-translations

This example shows locale files that have consistent translations, with all keys present in both the default and the other locale files.

```json
{
  "greeting": "Hello, world",
  "goodbye": "Bye, world",
  "pluralized_greeting": {
    "one": "Hello, you",
    "other": "Hello, y'all"
  }
}
```

```json
{
  "greeting": "Bonjour, monde",
  "goodbye": "Au revoir, monde",
  "pluralized_greeting": {
    "zero": "Je suis seul :(",
    "few": "Salut, groupe!"
  }
}
```

--------------------------------

### Missing Translations Example

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/matching-translations

This example shows a locale file (`es.json`) that is missing translations for keys present in the default locale.

```json
{
  "greeting": "Hello, world",
  "goodbye": "Bye, world"
}
```

```json
{
}
```

--------------------------------

### Define a basic product.json template

Source: https://shopify.dev/docs/storefronts/themes/os20/migration.md

Initial structure for a product.json template file referencing a main section.

```json
{
  "sections": {
    "main": {
      "type": "product-template"
    }
  },
  "order": [
    "main"
  ]
}
```

--------------------------------

### Example of Extra Translation Key

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/matching-schema-translations

This example shows a locale file with an extra translation key that is not present in the default locale.

```json
{
"goodby": "Au revoir, monde"
}
```

--------------------------------

### Example settings_data.json Structure

Source: https://shopify.dev/docs/storefronts/themes/store/success/updates

This JSON structure defines theme presets and their configurations. Ensure preset names are concise and match theme naming conventions.

```json
[
{
"current": {...},
"presets": {
"Embiggen": {...},
"Canine Gourmand": {...},
"Zenful": {...},
"Embox": {...},
"7th Street": {...},
},
}
]
```

--------------------------------

### Example of Misspelled Parameters

Source: https://shopify.dev/docs/storefronts/themes/tools/liquid-doc.md

This example demonstrates how misspelled parameters in a Liquid render tag do not trigger errors without LiquidDoc.

```liquid
{% render 'loading-spinner', produt: product, show_vendorr: true %}
```

--------------------------------

### Initialize a New Shopify Theme

Source: https://shopify.dev/docs/storefronts/themes/getting-started/create

Use this command to clone the Skeleton theme or another Git repository to your local machine. You'll be prompted to enter a theme name, and the theme will be cloned into a folder with that name.

```bash
shopify theme init
```

--------------------------------

### Example of deprecated font in settings_schema.json

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/deprecated-fonts-on-settings-schema

This example shows a `font_picker` setting with a deprecated font (`helvetica_n4`) as its default value, which will trigger a warning.

```json
{% schema %}
[
...
{
"name": "t:names.typography",
"settings": [
{
"type": "header",
"content": "Fonts"
},
{
"type": "font_picker",
"id": "type_primary_font",
"default": "helvetica_n4",
"label": "t:settings.primary_font"
}
]
}
]
{% endschema %}
```

--------------------------------

### Configure a Metaobject List for Artists

Source: https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings

This example demonstrates configuring a metaobject_list setting to display a list of artists. It includes the metaobject type and a limit.

```json
{
  "type": "metaobject_list",
  "id": "my_artist_list",
  "label": "Artists",
  "metaobject_type": "artist",
  "limit": 12
}
```

--------------------------------

### Example of Block Without Wrapper

Source: https://shopify.dev/docs/storefronts/themes/architecture/blocks/theme-blocks/schema

This example shows the direct output of a block's content when 'tag' is set to null in the schema.

```html
<h3 className="heading">
... 
</h3>
```

--------------------------------

### Example of Missing and Extra Translations

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/matching-schema-translations

This example demonstrates a locale file missing a translation and containing an extra key not present in the default locale.

```json
{
}
```

--------------------------------

### Create theme directory

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/getting-started

Create a new directory for your theme project.

```bash
mkdir [your-theme-name]
```

--------------------------------

### Shopify Theme Development Command

Source: https://shopify.dev/docs/storefronts/themes/tools/cli

Run this command from the root of your theme directory to start a development server. It requires the directory to match the default Shopify theme structure.

```bash
shopify theme dev
```

--------------------------------

### Constructing product-specific filter URL parameters

Source: https://shopify.dev/docs/storefronts/themes/navigation-search/filtering/storefront-filtering

Example demonstrating the URL parameter structure for filtering products by tag, type, vendor, and custom metafields.

```text
// Product tag
filter.p.tag=new,trending
  

// Product type
filter.p.product_type=shoes
  

// Product vendor
filter.p.vendor=vendor1
  

// Product metafield
filter.p.m.custom.made_in=canada
```

--------------------------------

### agents.md.liquid Template Example

Source: https://shopify.dev/docs/storefronts/themes/architecture/templates/agents-md-liquid

This is a basic example of the agents.md.liquid template content. It utilizes the `agents` object to dynamically insert store-specific information into the agent-facing description.

```liquid
---
sitemap_exclude: true
---Liquid
{% comment %}
This template is used to generate the agents.md file, which is hosted at the /agents.md URL.
It tells AI agents and shopping assistants how to discover the store's commerce capabilities and how to transact with it.
{% endcomment %}

{% liquid
  assign policies = "policies.html" | shopify_pages
  assign shop_policy_urls = ''
  if policies.content
    assign shop_policy_urls = policies.content | split: 'href="' | last | split: '"' | first
  endif
%}

# {{ agents.store_name }}

## Universal Commerce Protocol (UCP)

### Discovery

{{ agents.ucp_discovery_url }}

### Supported Versions

{{ agents.ucp_versions | join: ", " }}

## Model Context Protocol (MCP)

{{ agents.mcp_endpoint_url }}

## Browsing

### Products

{{ agents.store_url }}/products

### Collections

{{ agents.store_url }}/collections

### Search

{{ agents.store_url }}/search?q={{ "query" | url_encode }}

## Policies

{{ shop_policy_urls }}

## Personal Shopping Agents

This store is configured for personal shopping agents. For example, the Shop skill can be used to browse products and collections.

```

--------------------------------

### Structure of settings_data.json

Source: https://shopify.dev/docs/storefronts/themes/architecture/config/settings-data-json

This JSON example outlines the main objects within the settings_data.json file: 'current' for active settings, 'presets' for predefined configurations, and 'platform_customizations' for platform-specific settings.

```json
{
"current": {
"color_page_bg": "#FFFFFF",
...
},
"presets": {
"preset name": {
"color_page_bg": "#000000",
...
}
}
}
```

--------------------------------

### 404 Page Content Example

Source: https://shopify.dev/docs/storefronts/themes/architecture/templates/404

Provides an example of HTML and Liquid code to display a 'Page not found' message and a 'Continue shopping' button on a 404 page.

```html
<p>
404
</p>
<h1 className="title">
Page not found
</h1>
<a href="{{ routes.all_products_collection_url }}" className="button">
Continue shopping
</a>
```

--------------------------------

### Extra and Missing Translations Example

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/matching-translations

This example demonstrates a locale file (`fr.json`) that is missing a translation for `greeting` and has an extra key `goodby` not present in the default locale.

```json
{
  "goodby": "Au revoir, monde"
}
```

--------------------------------

### Example Theme Zip Structure

Source: https://shopify.dev/docs/storefronts/themes/store/success/updates

Illustrates a recommended directory structure for a Shopify theme zip file. Preset-specific JSON files should be placed in kebab-case folders within the /listings directory.

```directory
/assets
/blocks
/config
/layout
/locales
/listings
/embiggen
/templates
404.json
index.json
product.json
/canine-gourmand
/templates
index.json
blog.json
collection.json
cart.json
/sections
header-group.json
/zenful
/templates
blog.json
/embox
/templates
index.json
404.json
product.json
cart.json
collection.json
blog.json
/sections
header-group.json
footer-group.json
/7th-street
/templates
index.json
```

--------------------------------

### List themes on a store

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-kit/getting-started

Use the `theme get --list` command to retrieve a list of themes and their IDs from your store. Replace `[your-password]` and `[your-store.myshopify.com]` with your actual credentials.

```bash
theme get --list --password=[your-password] --store="[your-store.myshopify.com]"
```

--------------------------------

### Section Group JSON Schema Example

Source: https://shopify.dev/docs/storefronts/themes/architecture/section-groups

Provides an example of a valid JSON structure for a section group, defining its type, name, sections, and rendering order.

```json
{
"type": "header",
"name": "Header Group",
"sections": {
"header": {
"type": "header",
"settings": {}
}
},
"order": ["header"]
}
```

--------------------------------

### Configure BlockIdUsage Check

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/block-id-usage

This example shows the default configuration for the `BlockIdUsage` check, including how to enable/disable it and set its severity.

```yaml
BlockIdUsage:
  enabled: true
  severity: warning
```

--------------------------------

### Example of settings_data.json before migration

Source: https://shopify.dev/docs/storefronts/themes/architecture/section-groups/migrate

This JSON shows the structure of `settings_data.json` before migrating static sections to section groups, detailing settings for a 'header' section.

```json
{
"current": {
"colors_solid_button_labels": "#ffffff",
"colors_accent_1": "#121212",
"sections": {
"header": {
"type": "header",
"settings": {
"color_scheme": "background-1",
"logo_width": 90,
"logo_position": "middle-left",
"menu": "main-menu",
"show_line_separator": true,
"enable_sticky_header": true,
"margin_bottom": 0
}
}
}
},
"presets": {}
}
```

--------------------------------

### Order Confirmation Email - Flat View Example

Source: https://shopify.dev/docs/storefronts/themes/product-merchandising/bundles-emails

An example of how a bundle of products might appear in an order confirmation email when displayed in a flat view, with all items listed linearly.

```json
{
  "data": {
    "order": {
      "lineItems": {
        "nodes": [
          {
            "title": "Short Sleeve T-Shirt - Green",
            "quantity": 1,
            "discountedTotalSet": {
              "shopMoney": {
                "amount": "22.0",
                "currencyCode": "USD"
              }
            },
            "lineItemGroup": {
              "id": "gid://shopify/LineItemGroup/1",
              "title": "Green Shirt and Shorts Bundle",
              "quantity": 1
            }
          },
          {
            "title": "Shorts - Green",
            "quantity": 1,
            "discountedTotalSet": {
              "shopMoney": {
                "amount": "0.0",
                "currencyCode": "USD"
              }
            },
            "lineItemGroup": {
              "id": "gid://shopify/LineItemGroup/1",
              "title": "Green Shirt and Shorts Bundle",
              "quantity": 1
            }
          }
        ]
      }
    }
  }
}
```

--------------------------------

### Configuring a Card Block with Dynamic Product Data

Source: https://shopify.dev/docs/storefronts/themes/architecture/blocks/theme-blocks/dynamic-sources

This example demonstrates configuring a 'Card' block that nests 'text', 'price', and 'product-medias' blocks. Each nested block accesses the closest product using `{{ closest.product }}`.

```json
{
"name": "Card",
"blocks": [{"type": "@theme"}],
"presets": [
{
"name": "Product Card",
"blocks": [
{
"type": "group",
"blocks": [
{
"type": "text",
"settings": {
"text": "<p>{{ closest.product.title }}</p>"
}
},
{
"type": "price",
"settings": {
"product": "{{ closest.product }}"
}
},
{
"type": "product-medias",
"settings": {
"product": "{{ closest.product }}"
}
}
]
}
]
}
]
}
```

--------------------------------

### Add additional sections to product.json

Source: https://shopify.dev/docs/storefronts/themes/os20/migration.md

Examples showing how to add and order multiple sections within a JSON template.

```json
{
  "sections": {
    "main": {
      "type": "product-template"
    },
    "recommendations": {
      "type": "product-recommendations"
    }
  },
  "order": [
    "main"
  ]
}
```

```json
{
  "sections": {
    "main": {
      "type": "product-template"
    },
    "recommendations": {
      "type": "product-recommendations"
    }
  },
  "order": [
    "main",
    "recommendations"
  ]
}
```

--------------------------------

### Passing Example: All static blocks have content_for (object notation)

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/schema-presets-static-blocks

This example passes the check because all static blocks defined in the schema have a corresponding `content_for` tag. This configuration ensures proper rendering.

```liquid
{% content_for "block", type: "text", id: "block_1" %}{% content_for "block", type: "slide", id: "block_2" %}
  

{% schema %}
"presets": [
{
"name": "My preset",
"blocks": {
"block_1": {
"type": "text",
"static": true
},
"block_2": {
"type": "slide",
"static": true
}
}
}
]
{% endschema %}
```

--------------------------------

### Valid Preset Setting

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/valid-settings-key

This example demonstrates a correctly configured preset where the setting key ('custom-setting') used in 'presets.[].settings' is defined in the schema's 'settings'.

```json
{
"settings": {
"type": "text",
"id": "custom-setting",
"label": "Custom Setting",
},
"presets": [{
"name": "Preset",
"settings": {
"custom-setting": "valid setting"
}
}]
}
```

--------------------------------

### Failing Example: Missing content_for for static block (object notation)

Source: https://shopify.dev/docs/storefronts/themes/tools/theme-check/checks/schema-presets-static-blocks

This example fails because the static block with id 'block_2' does not have a corresponding `content_for` tag. Use this to understand the structure that triggers the error.

```liquid
{% content_for "block", type: "text", id: "block_1" %}
  

{% schema %}
"presets": [
{
"name": "My preset",
"blocks": {
"block_1": {
"type": "text",
"static": true
},
"block_2": {
"type": "slide",
"static": true
}
}
}
]
{% endschema %}
```