Introduction
AI Shopper Chat settings let you customize how your Customer Agent looks and behaves during storefront conversations. You can change the greeting, colors, font, layout, product-card behavior, and mobile experience to match your brand.
You can configure and preview these settings before upgrading. Using the chat experience on a live storefront generally requires a paid AI Shopper/AI Sales Agent or AI Commerce plan and available Shopper credits. See Tolstoy’s current pricing.
How to Set Up
Log in to your Tolstoy account.
Select Customer Agent from the left navigation.
Open Settings.
Select the Chat tab.
Customize the available chat settings:
Enable Embedded Chat: Displays the complete chat experience directly on product pages. When disabled, the preview shows the pop-up chat.
Assistant Greeting: Enter the first message shoppers see when they open the chat.
Background Color: Select the background color of the chat window.
User Message Color: Select the background color used for shopper messages and the Send button.
User Message Text Color: Select the text color used inside shopper messages.
Font Style: Choose the chat font. Select Shopify Default to use your store’s default font.
Display Mode: Choose where the pop-up chat appears. Corner displays it near the edge of the screen, while Centered opens it in the middle of the page.
Enable 7/8 Screen: Opens chat across most of the mobile screen while leaving part of the storefront visible.
Enable Profile: Gives shoppers access to their profile within the chat experience.
Show Minimize Button: Allows shoppers to minimize chat without closing it.
Keep Chat Open on Navigation: Keeps the conversation open when shoppers move between store pages.
Chat Input Placeholder: Customize the text shown in the empty message field.
Product Click Behavior: Choose whether clicking a recommendation opens a product modal or takes the shopper to the product page.
Product Image Aspect Ratio: Display product images as Square 1:1 or another available portrait format.
Select Desktop or Mobile above the preview to check both experiences.
Wait for the changes to save before leaving the page.
To restore the original appearance and behavior, click Reset to default.
How to Publish
Chat settings do not have a separate Publish button. They are applied to the Customer Agent entry points you publish on your storefront.
Publish the Pop-Up Chat
Finish customizing the Chat settings.
Go to Customer Agent → Features or Widgets.
Open or create a chat entry point, such as Chat Bubble.
Configure its placement and visibility.
Test the complete chat experience.
Click Publish.
If prompted, enable the Tolstoy app embed in Shopify.
Visit your storefront and confirm the chat opens and works correctly.
Publish Embedded Chat on Shopify
In the Tolstoy platform, toggle on Enable Embedded Chat.
In the Shopify theme editor, open the product page template where chat should appear.
Add section or block ➜ Apps ➜ Chat Embed.
Or use liquid code
Move the block to the desired position.
Click Save in Shopify.
Open a live product page and test the embedded experience.
If your store uses multiple product templates, add the section or block to each template where Chat Embed should appear.
Update a Live Chat Experience
After changing the Chat settings:
Wait for the settings to save.
Refresh your live storefront.
Start a new conversation to verify the changes.
You normally do not need to reinstall the widget unless its Shopify block or embed code was removed.
Best Practices
Keep the assistant greeting short and focused on how the agent can help.
Use colors with enough contrast to keep messages readable.
Match the chat font to your storefront branding.
Use Corner mode for a less intrusive experience.
Use Centered mode when chat should receive the shopper’s full attention.
Keep the minimize button enabled so shoppers can continue browsing.
Enable chat persistence when shoppers frequently compare products across pages.
Use product-page navigation when shoppers need detailed information before purchasing.
Check product images in every available aspect ratio.
Test both Desktop and Mobile previews before publishing.
Test Embedded Chat on every Shopify product template where it is installed.
Troubleshooting / FAQs
Why aren’t my changes appearing?
Wait for the settings to finish saving, refresh the storefront, and start a new conversation. Confirm that you edited the correct store or workspace.
Why does the preview still show a pop-up chat?
Embedded Chat is currently disabled. Turn on Enable Embedded Chat to preview the chat inline on a product page.
Why is Embedded Chat not visible on my store?
Confirm that Embedded Chat is enabled, the Shopify block was added to the correct product template, and the theme was saved.
Why does Embedded Chat appear on only some products?
Your store may use multiple product templates. Add the Embedded Chat block to every template where it should appear.
Why does chat close when a shopper opens another page?
Turn on Keep Chat Open on Navigation. Test it by moving between pages within the same storefront session.
Why do product recommendations open in the wrong place?
Review Product Click Behavior and select either Open product modal or Navigate to product page.
Why are the colors difficult to read?
Choose contrasting values for User Message Color and User Message Text Color, then verify them in both previews.
How do I restore the original settings?
Click Reset to default at the bottom of the Chat settings.
Do I need a paid plan?
You can customize and preview the chat before upgrading. Using it through most live Customer Agent entry points requires a paid AI Shopper/AI Sales Agent or AI Commerce plan.
What happens if my Shopper credits run out?
Your Customer Agent may be paused or become unavailable until more credits are available.