Skip to content

Custom website

Add the chat to your own site, including Next.js.

Open in dashboard

Your store is your own website, not Shopify? Connect it as a Custom website. This works with any site, including ones built with Next.js.

Connect your website#

  1. Go to Stores and select Connect store

  2. Select Custom website

  3. Enter your store name and website address, like https://example.com.

  4. Select Connect website

    Installation opens next.

The address must start with https:// and be a public website.

Products#

We read your products ourselves, once a day. Check them on Chat widget > Installation under Products. Select Refresh now after big changes.

There are two ways we find them:

  • Your product pages. We follow your sitemap (/sitemap.xml, or the one in robots.txt) to your product pages and read their schema.org Product data: name, description, price, currency, stock, image and options. Most Next.js stores have this already, since Google uses it too.
  • A product feed. Paste a Google Shopping feed address, XML or CSV, into Product feed. When it's set, we read the feed instead of your pages.

Each product links to its own page. Products must be on your own site and have a name, a price and a link.

Your shipping, returns and FAQ pages come in through the Knowledge base, the same as on Shopify.

Install the chat#

Copy the code from Chat widget > Installation. It holds your store's widget key.

Any website#

Paste one line before the closing head tag, on every page:

Script tag
<script src="https://api.anystoreai.com/static/widget.js" data-widget-key="YOUR_WIDGET_KEY" async></script>

Next.js#

Add it to app/layout.tsx with next/script, so it loads on every page:

app/layout.tsx
import Script from "next/script";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        {children}
        <Script
          src="https://api.anystoreai.com/static/widget.js"
          data-widget-key="YOUR_WIDGET_KEY"
          strategy="afterInteractive"
        />
      </body>
    </html>
  );
}

Add data-position="bottom-left" to move the chat to the left. Deploy your site, then check Setup on the dashboard.

What's not available#

These need Shopify, so they're off for custom websites:

  • Cart and checkout. The assistant links to the product page instead, and product cards show View product.
  • Order lookup and returns. For an order question, the assistant passes the chat to your team.
  • Abandoned checkout, review, cross-sell and win-back emails, and the discount popup after Add to cart.
  • Questions on product pages and back in stock alerts.
  • Shopify discounts and Sales from chats.

Everything else works the same: answers from your products and Knowledge base, the inbox, live chat, the welcome email series and reports.

Still stuck? Contact support and we'll reply by email.