> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.keyplace.ai/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Theme app blocks and Online Store 2.0

keyplace ships a theme app extension with two app blocks for product templates. There is no app embed, so the chat shows only in themes whose product sections accept app blocks (Online Store 2.0).

## In short
- Two blocks: "Ask about product" (the chat) and "keyplace Q&A" (approved questions and answers).
- Both use `"target": "section"` and `"enabled_on": { "templates": ["product"] }`.
- No app embed, no ScriptTag, no edits to theme files.
- Block settings can override the app settings for one placement.

## The blocks
| | Ask about product | keyplace Q&A |
|---|---|---|
| File | `blocks/zapytaj.liquid` | `blocks/faq.liquid` |
| Handle | `zapytaj` | `faq` |
| Target | `section` | `section` |
| Templates | `product` | `product` |
| Schema `javascript` | `keyplace-widget.js` (loader) | none |
| Schema `stylesheet` | `keyplace-widget.css` | `keyplace-faq.css` |
| Renders | The chat field, up to 4 suggested questions and the chat window | Questions and answers from the `$app:product_faq` metaobject, in Liquid, with optional FAQ JSON-LD |

`section` is Shopify's older target value for app blocks. Shopify still supports it and treats it the same as `content`.

## Add the block
The quickest way is the button in keyplace:

1. In keyplace, open **Home**.
2. Click **Add in theme editor**.
3. Check where the block landed in the product section and move it if needed.
4. Click **Save**.

![Theme editor with the Ask about product block in the product section](https://storage.crisp.chat/users/helpdesk/website/-/f/a/1/7/fa17236ecfb11800/en-13-a-editor_1aj33hc.png "=1000xauto")

The button opens this deep link in the published theme:

```
https://{shop}.myshopify.com/admin/themes/current/editor?template=product&addAppBlockId={api_key}/zapytaj&target=mainSection
```

`target=mainSection` adds the block to the main section of the default product template. For another product template, switch to it in the theme editor and add the block by hand from the apps list of the product section. The Q&A block uses the same link with `faq` as the handle.

**Home** in keyplace shows whether the block is in the published theme. A block in a draft theme counts only after you publish that theme.

## How the block behaves in a theme
- **No form element.** Themes often render app blocks inside the product form. Every button is `type="button"` and the inputs have no form owner, so the block never submits or resets the product form.
- **Fits the theme.** Sizes are in `em`, so the widget takes the font of the product column. A small inline script matches the field to the theme's add-to-cart button: the height with size "Auto", and the corner radius and colors with the look "Like your store".
- **Chat window.** It is rendered hidden and moved to `<body>` the first time it opens.
- **Theme editor.** The block always renders there, so it can be placed and styled. It sends no views from the editor and doesn't load Guard.

## Settings: app first, block second
The block reads the app settings from the app-data metafield `keyplace.ustawienia`. A block setting left on "Same as in the app" takes the app value. Any other value overrides it for this placement only.

Two settings can only make things stricter than the app:
- "Prices in the widget": the block can hide prices, never show them when the app hides them. A hidden price also stays out of the page source and out of the answers.
- "Who sees the widget" and "Required customer tag": the block can hide the widget from guests or from customers without a tag. It only hides the widget. To make the chat itself refuse guests, set "Logged-in customers only" in the app.

## When the block renders nothing
- The page has no `product` object.
- The market currency differs from the store currency, for example EUR in a PLN store. keyplace answers with the store's prices and shipping rules, so it stays out of other currencies, also in the theme editor preview of that market.
- The widget is for logged-in customers only and nobody is logged in. Then there is no markup and no script at all.
- A required customer tag is set and the customer doesn't have it.

## Limits
- No app embed: no site-wide chat, no floating button and no fallback for vintage themes.
- Product templates only, not collection, home or cart pages.
- One loader and one stylesheet per page, even with more than one block: Shopify includes each file once.
- Custom CSS for the chat is not supported. Class names may change.

## Common questions
### Can I add the block to a custom section?
Yes, if the section accepts app blocks and sits in a product template. Add `{ "type": "@app" }` to `blocks` in the section schema, then render app blocks in the loop:

```html
{% for block in section.blocks %}
  {% if block.type == '@app' %}{% render block %}{% endif %}
{% endfor %}
```

### My theme is not Online Store 2.0. What now?
Vintage themes don't support app blocks, and keyplace has no app embed. The chat needs a theme whose product templates are JSON templates with sections that accept app blocks.

### Can I style the chat with my own CSS?
Not supported. Class names may change between releases. Use the block's look settings or the widget settings in keyplace.

## See also
- [How keyplace works in a store: technical overview](/en/article/how-keyplace-works-ege854/)
- [My theme doesn't support app blocks](/en/article/theme-without-app-blocks-1cu3pzf/)
- [How to add the chat to your product page](/en/article/add-the-chat-1xeez3e/)

Still stuck? Chat with us in keyplace: **Help > Chat with us**. We reply on working days. Never send us passwords, 2FA codes or shopper data.