Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.remark.ai/llms.txt

Use this file to discover all available pages before exploring further.

The embedded chat generates starter questions based on the page it appears on. By default, it falls back to site-wide questions. Page context attributes tell Remark what the page is about so it can generate more relevant, specific questions for your visitors.

How it works

Each unique page context gets its own pool of starter questions. Remark generates these questions from the title, content, and products you provide via HTML attributes on the <remark-qa-activator> element. When the context changes — for example, when you update page-content — questions are regenerated automatically. Page context follows a precedence order: product context (most specific) takes priority over page context, which takes priority over site-wide questions (the fallback). If external-id is set, questions target that specific product regardless of other attributes.

Attributes

external-id
string
A product ID from your ecommerce platform. When present, questions target this specific product — overrides page context.On Shopify storefronts, Remark detects the product automatically, so you don’t need to set this attribute on product pages.Example: 7982345678901
page-key
string
Identifies the page. Same key = same question pool — defines which pool questions come from.Example: /collections/running-shoes
page-title
string
The page’s title. Used when generating questions — helps Remark understand what the page is about.Example: Women's Running Shoes
page-content
string
The page’s main text content. More content = more relevant questions.Example: Shop our selection of lightweight trail and road running shoes...
product-ids
string
Comma-separated product IDs from your ecommerce platform related to the page. Gives Remark additional product context without changing which pool is used.Example: 7982345678901,7982345678902
context-key
string
Distinguishes between multiple embedded chats on the same page. Each key gets its own question pool, even at the same URL.Example: featured-collection

Examples

Product page

A furniture store’s product detail page:
<remark-qa-activator
  external-id="8012345678901"
></remark-qa-activator>
Product context is the most specific scope. Remark generates questions about this exact product — dimensions, materials, care instructions. No need for page-key, page-title, or page-content since the product catalog provides all the context Remark needs.
On Shopify storefronts, Remark detects the product automatically — you don’t need to set external-id at all.

Collection page

An outdoor gear store’s “Hiking Boots” collection:
<remark-qa-activator
  page-key="/collections/hiking-boots"
  page-title="Men's Hiking Boots"
  page-content="Waterproof hiking boots built for trails, scrambles, and all-day comfort. From lightweight dayhikers to burly backpacking boots."
  product-ids="7982345678901,7982345678902,7982345678903"
></remark-qa-activator>
Questions are generated about the collection as a whole — visitors might see “What’s the difference between dayhiking and backpacking boots?” or “Which boots are waterproof?” The product IDs give Remark awareness of what’s in the collection without scoping questions to a single product.

Blog post

A skincare brand’s ingredient guide:
<remark-qa-activator
  page-key="/blogs/skincare-guide/understanding-retinol"
  page-title="Understanding Retinol: A Beginner's Guide"
  page-content="Retinol is one of the most studied skincare ingredients. It promotes cell turnover, helps reduce fine lines, and can improve skin texture over time. Start with a low concentration and apply at night..."
></remark-qa-activator>
No product IDs needed unless the article recommends specific products. Questions are generated from the article content — visitors might see “How often should I use retinol?” or “Can I use retinol with vitamin C?”

Landing page with multiple sections

A home goods store with separate “Kitchen” and “Bathroom” sections on the same page:
<!-- Kitchen section -->
<remark-qa-activator
  page-key="/collections/spring-sale"
  page-title="Spring Sale"
  page-content="Up to 40% off cookware sets, knife blocks, and countertop appliances."
  context-key="kitchen"
  product-ids="8012345678901,8012345678902"
></remark-qa-activator>

<!-- Bathroom section, further down the same page -->
<remark-qa-activator
  page-key="/collections/spring-sale"
  page-title="Spring Sale"
  page-content="Save on towel sets, shower organizers, and bath accessories."
  context-key="bathroom"
  product-ids="8012345678903,8012345678904"
></remark-qa-activator>
Both share the same page-key and page-title (same page) but context-key gives each section its own question pool. The kitchen section gets questions about cookware; the bathroom section gets questions about towels and organizers.

Tips

  • Use a stable path for page-key — something like /collections/hiking-boots, not a full URL with query parameters. Remark normalizes the value, but a clean path is easiest to reason about.
  • Locale prefixes are stripped automatically/en/collections/hiking-boots and /fr-ca/collections/hiking-boots both resolve to /collections/hiking-boots, so you don’t need to remove them yourself.
  • More page-content = better questions — the more text you provide, the more relevant the generated questions will be.
  • external-id takes priority — when present, questions are about that product regardless of other attributes.
  • Questions regenerate automatically — when context changes (for example, when you update page-content), Remark generates a new set of questions.

Best practices

  • Keep product-ids stable. Remark regenerates questions whenever the context changes, and product-ids are part of that context. If the product list changes on every page load — for example, because it reflects a randomized or personalized sort order — questions will regenerate constantly and never have a chance to settle and improve over time. Pass a consistent set of product IDs that represents the page’s core products.
  • Don’t change page-content on every render. The same principle applies — if page-content includes dynamic elements like timestamps, personalized greetings, or live inventory counts, it will trigger unnecessary regeneration. Strip volatile content before passing it.