Setup
How do I customize Chatref to match my Shopify brand?
You can customize Chatref to match your Shopify brand by adjusting the widget’s primary color, logo, and welcome message directly in your agent’s settings. Then train the AI on your product content and brand voice so every response feels native to your store design. It takes minutes and is included on every account with no branding removal fees.
Customizing the widget appearance for Shopify
Branding your support chat starts right inside the Chatref dashboard. Within your agent’s settings you’ll find options to set the widget’s primary color, upload your store logo, and write a custom welcome message. These changes take effect instantly across your embedded widget, letting you align the chat bubble, header, and accent colors with your Shopify store’s palette. All branding features are included on every account - there’s no extra charge to remove any default Chatref badge or to apply your own look.
Training your AI agent to match your brand voice
A consistent brand voice isn’t just about colors. In the same agent workspace, you can upload your Shopify store’s content - product descriptions, return policies, FAQs, shipping details, or even your full site URL. Chatref learns from your own material using retrieval-augmented generation (RAG). That means the AI agent will answer customer questions grounded only in the documents you provide, so responses carry your store’s exact wording and tone. If you need to fine-tune, review real conversations in the shared inbox and adjust the welcome message or training data anytime.
Embedding the widget on your Shopify site
Once your branding is in place and the agent knows your store’s voice, embedding the widget into Shopify is straightforward. From your agent’s settings, copy the provided JavaScript snippet, then paste it into your Shopify theme’s global footer or header section (typically in theme.liquid). The snippet auto-loads the branded widget on every page - no plugins or extra coding. Visitors can then start conversations that feel like a natural extension of your store.
Testing and refining the brand experience
Before and after going live, use the built‑in playground to test how the widget looks and how the AI answers. Run through common customer queries like “Do you ship to X?” or “What’s your return policy?” to confirm the responses match your brand tone. The conversation inbox also gives you every chat, so you can spot areas where the agent might need more training or a tweak to the welcome message.
FAQ
Matching Chatref to Shopify store aesthetics
To make the widget blend with your Shopify site, go to your agent’s Customization settings. Set the Primary color to your brand’s hex value, upload your store logo, and edit the Welcome message so it greets customers in your brand’s voice. Because all customization is per-agent and free on every plan, you can create a unique look for each store without any branding removal fees.
Customizing AI agent responses for Shopify
Train your agent with your own content - upload your product pages, policy PDFs, or point Chatref to your Shopify store’s sitemap. The AI will generate answers grounded only in those documents, reflecting your exact product language and tone. If you need to adjust, review the conversation inbox and update the training data or welcome message; the agent learns from the content you provide, not from internet searches.
Adding brand colors to Chatref widget
In your Chatref agent’s settings, find the Customization section and use the color picker or enter your brand’s hex code in the Primary color field. This updates the widget’s header, chat bubble, and button accents to match your Shopify store instantly. There’s no additional CSS or code required, and you can change it anytime without affecting your credit balance.
Put this into practice
Chatref answers your customers from your own content, day and night. Add it to your site and go live in minutes – free to start.