# Shopify app embed: what it is and how to turn it on

> What a Shopify app embed is, how it differs from an app block, why it comes switched off after you install the app, and how to check that it works.

URL: https://clione.ai/glossary/shopify-app-embed/
Lang: en

You install a reviews app, a chat app or a [structured data](/glossary/structured-data/) app, the app says it is ready and nothing shows up in the store. Often the reason has a name: **the app is installed, but its app embed is switched off**. An app embed is not the app and it is not your theme's code. It is the piece the app leaves ready to put its code on every page, and it only works once you turn it on. Its relative, the _app block_, is a different thing: a block you place inside a section, in a specific spot on the page.

## How it works

App embeds are part of an app's theme app extensions, the mechanism Shopify gives merchants to add dynamic elements to their theme **without touching the [Liquid](/glossary/shopify-liquid/) templates or the code**.[^shopify-tae] There are two kinds of block:[^shopify-tae-config]

- **App blocks.** They are placed inside a section, so they need JSON templates and sections that accept blocks of type `@app`.
- **App embeds.** They are used by apps that have no visible part or that add floating or overlay elements. Shopify renders them and inserts them **before the closing `</head>` and `</body>` tags**, depending on the target the block declares: `head`, `body` or `compliance_head`.

Because they do not depend on sections or JSON templates, app embeds work **on both vintage themes and Online Store 2.0**.[^shopify-tae-config] Shopify's help describes them, for the merchant, as elements that float or overlay on the theme, or that add code to the store without the customer seeing it, such as a chat bubble or an analytics tool.[^shopify-help-apps]

The detail that generates the most support requests: **after the app is installed, its app embeds are switched off**. The merchant has to turn them on in the theme editor, in the theme settings, under "App embeds."[^shopify-tae-config] The app can help with a deep link to the editor that opens the block already activated, using the `activateAppId` parameter.[^shopify-tae-config] And Shopify recommends that developers explain how to turn each app embed on and off, with screenshots, video or text, and that they offer that deep link.[^shopify-tae-ux]

Inside, each block is a Liquid file in the extension's `blocks/` folder, alongside `assets/` for the CSS and JavaScript, `snippets/` and `locales/`. A block can be shown only if a condition is met (`available_if`), which reads a boolean [metafield](/glossary/shopify-metafields/) from the app. And there are limits: **30 blocks per extension, 10 MB in total and 100 KB of Liquid**, adding up all the files.[^shopify-tae-config]

They exist to solve an old problem. Before, an app edited the theme's code or injected scripts into it, and when you uninstalled it those edits stayed behind: what Shopify calls **ghost code**, which can cause quality and performance problems.[^shopify-tae-migrate] With theme extensions, when an app is uninstalled its blocks are removed from the theme automatically and completely.[^shopify-tae-ux]

## In a store

A **fictional example**: an app that publishes structured data in the header of every [product page](/glossary/product-page/). Its block, in the extension's `blocks/` folder, declares that it goes in the `head`:

```liquid
{% comment %} blocks/structured-data.liquid (fictional example) {% endcomment %}
<script type="application/ld+json">
  {% comment %} the app writes the product page's JSON-LD here {% endcomment %}
</script>

{% schema %}
{
  "name": "Structured data",
  "target": "head",
  "settings": []
}
{% endschema %}
```

Until the merchant turns it on, that `<script>` does not appear on any page. When they turn it on and save, Shopify places it before `</head>`, so the [JSON-LD](/glossary/json-ld/) ends up in the header of the [product page](/glossary/product-page/) without anyone having edited `theme.liquid`.

It is the same split Clione uses on Shopify: it writes each product's signals to metafields and paints them with two app embeds, "Clione SEO," with the structured data graph in the `head`, and "Clione FAQ," with the question accordion in the `body`, which are turned on from the Clione panel with one click.


**Installed is not active, and active on one theme is not active on another.** After you install the app, the app embed comes switched off.[^shopify-tae-config] And if you change the published theme, the apps you activated on the previous one will not be active on the new one: you have to turn them on again. Also, changes apply to the store's default configuration unless you first pick a specific market.[^shopify-help-apps]


## How to check it

1. **Open the theme editor for the published theme** and click the "App embeds" icon in the sidebar. Find the app and see whether the toggle is on. If you change it, save.[^shopify-help-apps]
2. **If you sell in several markets**, check which market was selected: with none chosen, the change goes to the store's default configuration.[^shopify-help-apps]
3. **Open a product page and its source code** (Ctrl+U in Chrome) and look for the app's code before `</head>` or `</body>`, depending on where the app says it works.[^shopify-tae-config]
4. **If the block publishes structured data**, run the URL through the [Rich Results Test](/glossary/rich-results-test/) or a [schema validator](/glossary/schema-markup-validator/) to see that it reads without errors.
5. **Every time you change themes, repeat steps 1 and 3.** The new theme does not inherit the apps activated on the previous one.[^shopify-help-apps]

## Related concept: BigCommerce widget

On BigCommerce, the closest thing is the [BigCommerce widget](/glossary/bigcommerce-widget/). A widget is a unit of content in HTML, CSS and JavaScript, on a Handlebars template, that is placed with the Widgets API in a specific region of a [Stencil](/glossary/bigcommerce-stencil/) theme and **is rendered as part of the store's HTML**.[^bc-widgets] The practical difference is the location. An app embed goes at the end of the page's `head` or `body`, and the merchant turns it on with a toggle. A widget goes to the region and the page its _placement_ says, which is created through the API.[^bc-widgets]

The guide [from metafield to published page](/guides/metafield-to-published-page/) follows a piece of Shopify data all the way to the product page's HTML, and the [publishing by platform reading path](/learn/publishing-by-platform/) puts the rest of the terms in order.
