https://annonabot.com/_nuxt/nDNtfDT1.js

1import{d as a,a as i,b as d,z as p,w as l,h as m,o as h,f as t,g as n,j as r,_ as y}from"./C62kekaA.js";import{_ as g}from"./B2LShbzA.js";import{a as f}from"./B313tymB.js";import"./E2QaWh32.js";const I=a({__name:"add-ai-chatbot-to-shopify",setup(b){const e=f("add-ai-chatbot-to-shopify");return i({title:`${e.title} - Annona Bot Blog`,link:[{rel:"canonical",href:"https://annonabot.com/blog/add-ai-chatbot-to-shopify"}]}),d({title:e.title,description:e.description,ogTitle:e.title,ogDescription:e.description,ogUrl:"https://annonabot.com/blog/add-ai-chatbot-to-shopify",ogType:"article",ogImage:"https://annonabot.com/web-app-manifest-512x512.png",twitterCard:"summary_large_image",twitterTitle:e.title,twitterDescription:e.description,articlePublishedTime:e.date,articleAuthor:[e.author],articleTag:e.tags}),i({script:[{type:"application/ld+json",innerHTML:JSON.stringify({"@context":"https://schema.org","@type":"BlogPosting",headline:e.title,description:e.description,datePublished:e.date,author:{"@type":"Person",name:e.author},publisher:{"@type":"Organization",name:"Annona Bot"}})}]}),(w,o)=>{const s=y,u=g;return h(),p(u,{post:m(e)},{default:l(()=>[o[21]||(o[21]=t("p",null,[n(`Your Shopify store gets the same questions every day. "Do you ship to Canada?" "What's your return policy?" "Is this true to size?" Every unanswered question is a potential lost sale — `),t("a",{href:"https://baymard.com/lists/cart-abandonment-rate"},"Baymard Institute"),n(" reports an average cart abandonment rate of 70%, and unanswered product questions are a key contributor.")],-1)),o[22]||(o[22]=t("p",null,"An AI chatbot answers these instantly, 24/7, in your customer's language. Here's how to add one to your Shopify store in about 5 minutes.",-1)),o[23]||(o[23]=t("h2",null,"What You'll Get",-1)),o[24]||(o[24]=t("p",null,"Before we start, here's what the end result looks like:",-1)),t("ul",null,[o[2]||(o[2]=t("li",null,"A chat bubble appears in the corner of your store (similar to the one you see at the bottom right of this page)",-1)),t("li",null,[o[1]||(o[1]=n("Customers click it and ask a question — in English, French, Japanese, Arabic, or any of ",-1)),r(s,{to:"/blog/multilingual-chatbot-no-translation-tools"},{default:l(()=>[...o[0]||(o[0]=[n("50+ languages",-1)])]),_:1})]),o[3]||(o[3]=t("li",null,"The AI finds the answer from your FAQs and responds instantly, in the customer's language",-1)),o[4]||(o[4]=t("li",null,"If it can't answer, it offers to connect the customer with your team",-1))]),o[25]||(o[25]=t("p",null,[n("No app installs. No theme modifications. One snippet of code. And if you're selling internationally, you just got multilingual support without hiring a single translator — "),t("a",{href:"https://csa-research.com/Blogs-Events/CSA-in-the-Media/Press-Releases/Consumers-Prefer-their-Own-Language"},"76% of consumers prefer buying in their native language"),n(", and now yours can.")],-1)),o[26]||(o[26]=t("h2",null,"Step 1: Set Up Your FAQs",-1)),o[27]||(o[27]=t("p",null,"Log into your Annona Bot dashboard and add your most common Q&As. Start with the questions your support team answers most often:",-1)),o[28]||(o[28]=t("ul",null,[t("li",null,"Shipping times and costs"),t("li",null,"Return and exchange policy"),t("li",null,"Sizing and fit information"),t("li",null,"Order tracking"),t("li",null,"Payment methods"),t("li",null,"Product care instructions")],-1)),o[29]||(o[29]=t("p",null,[t("strong",null,"Tip:"),n(" 30-50 well-written FAQs cover the majority of customer questions for most stores. "),t("a",{href:"https://www.freshworks.com/How-AI-is-unlocking-ROI-in-customer-service/"},"Freshworks reports"),n(" that well-structured chatbots automate up to 70% of routine queries. You can always add more later — the dashboard shows you which questions customers ask that aren't covered yet.")],-1)),o[30]||(o[30]=t("h2",null,"Step 2: Add the Chat Widget to Shopify",-1)),o[31]||(o[31]=t("p",null,[n("In your Shopify admin, go to "),t("strong",null,"Online Store → Themes"),n(". Click "),t("strong",null,"Edit theme"),n(" on your live theme, then press the "),t("strong",null,"Actions (···)"),n(" button at the top right and choose "),t("strong",null,"Edit code"),n(".")],-1)),o[32]||(o[32]=t("p",null,[n("Find your "),t("code",null,"theme.liquid"),n(" file and paste this line just before the closing "),t("code",null,"</body>"),n(" tag:")],-1)),o[33]||(o[33]=t("pre",null,[t("code",null,`<script
2  defer
3  src="https://annonabot.com/widget/chat.js"
4  data-company="your-company-slug"
5  data-api-key="your-api-key"
6><\/script>`)],-1)),o[34]||(o[34]=t("p",null,[n("Replace "),t("code",null,"your-company-slug"),n(" and "),t("

6code",null,"your-api-key"),n(" with the values from your Annona Bot dashboard. Click "),t("strong",null,"Save"),n(" and visit your storefront — the chat bubble appears in the bottom right.")],-1)),t("p",null,[o[6]||(o[6]=n("Want the visual walkthrough? See the step-by-step screenshots on our ",-1)),r(s,{to:"/docs"},{default:l(()=>[...o[5]||(o[5]=[n("docs page",-1)])]),_:1}),o[7]||(o[7]=n(".",-1))]),o[35]||(o[35]=t("h3",null,"Alternative: Custom Liquid Section",-1)),o[36]||(o[36]=t("p",null,"If you'd rather not touch theme code, you can drop the script into a Custom Liquid section instead:",-1)),o[37]||(o[37]=t("ol",null,[t("li",null,[n("Go to "),t("strong",null,"Online Store → Themes"),n(" and click "),t("strong",null,"Customize"),n(" on your live theme")]),t("li",null,[n("Add a "),t("strong",null,"Custom Liquid"),n(" section (or open the existing footer section)")]),t("li",null,"Paste the same script tag"),t("li",null,"Save")],-1)),o[38]||(o[38]=t("p",null,"Both methods work identically. The widget loads asynchronously, so it won't slow down your store.",-1)),o[39]||(o[39]=t("h2",null,"Step 3: Customize the Widget",-1)),o[40]||(o[40]=t("p",null,"In your Annona Bot dashboard, you can match the chat widget to your store's branding:",-1)),o[41]||(o[41]=t("ul",null,[t("li",null,[t("strong",null,"Colors"),n(" — Match your brand's primary and accent colors")]),t("li",null,[t("strong",null,"Position"),n(" — Bottom-right (default) or bottom-left")]),t("li",null,[t("strong",null,"Greeting message"),n(' — "Hi! How can I help you today?" or whatever fits your brand voice')]),t("li",null,[t("strong",null,"Logo"),n(" — Add your store's logo to the chat header")])],-1)),o[42]||(o[42]=t("p",null,"The widget inherits your settings automatically — no code changes needed after the initial embed.",-1)),o[43]||(o[43]=t("h2",null,"What Happens When a Customer Asks a Question",-1)),o[44]||(o[44]=t("p",null,"Here's the flow:",-1)),o[45]||(o[45]=t("ol",null,[t("li",null,'Customer types "Do you ship to Australia?" — or "Livrez-vous en Australie ?" in French, or "オーストラリアに発送しますか？" in Japanese'),t("li",null,"The AI searches your English FAQs and finds your shipping policy"),t("li",null,"Customer gets an instant, accurate answer — in their own language"),t("li",null,"If the customer seems satisfied, great — ticket avoided"),t("li",null,'If not, they can click "Talk to a person" to reach your team')],-1)),o[46]||(o[46]=t("p",null,"The AI only answers from your FAQ content. It won't make up shipping rates or invent policies. If it doesn't know the answer, it says so and offers to connect the customer with support. And you never need to translate a single FAQ — write them once in English, and the AI handles the rest.",-1)),o[47]||(o[47]=t("h2",null,"Why This Works Better Than Shopify's Built-in Chat",-1)),o[48]||(o[48]=t("p",null,"Shopify Inbox is a live chat tool — it connects customers to your team. That's great for complex issues, but it means someone has to be available to respond. For the 70% of questions that are routine FAQ queries, an AI chatbot is faster, cheaper, and available 24/7.",-1)),t("table",null,[o[15]||(o[15]=t("thead",null,[t("tr",null,[t("th"),t("th",null,"Shopify Inbox"),t("th",null,"AI Chatbot")])],-1)),t("tbody",null,[o[11]||(o[11]=t("tr",null,[t("td",null,"Response time"),t("td",null,"Depends on staff availability"),t("td",null,"Under 2 seconds")],-1)),o[12]||(o[12]=t("tr",null,[t("td",null,"After-hours"),t("td",null,"Offline or delayed"),t("td",null,"Always on")],-1)),t("tr",null,[o[9]||(o[9]=t("td",null,"Languages",-1)),o[10]||(o[10]=t("td",null,"Staff-dependent",-1)),t("td",null,[r(s,{to:"/blog/multilingual-chatbot-no-translation-tools"},{default:l(()=>[...o[8]||(o[8]=[n("50+ languages",-1)])]),_:1})])]),o[13]||(o[13]=t("tr",null,[t("td",null,"Handles routine FAQs"),t("td",null,"Manually, every time"),t("td",null,"Automatically")],-1)),o[14]||(o[14]=t("tr",null,[t("td",null,"Cost per query"),t("td",null,"Staff time"),t("td",null,"Fractions of a cent")],-1))])]),o[49]||(o[49]=t("p",null,[n("A "),t("a",{href:"https://www.zendesk.com/blog/cx-trends-2024/"},"Zendesk survey"),n(" of 5,100+ consumers found that 67% prefer self-service for simple issues anyway. Give them the option — and save your team for the conversations that actually need a human.")],-1)),o[50]||(o[50]=t("p",null,"The best setup: use an AI chatbot for first-line support, and route complex issues to Shopify Inbox or your helpdesk. The chatbot handles the volume; your team handles the nuance.",-1)),o[51]||(o[51]=t("h2",null,"Common Questions From Store Owners",-1)),o[52]||(o[52]=t("p",null,[t("strong",null,"Will it slow down my store?"),t("br"),n("No. The widget script loads asynchronously and is served from a CDN. It doesn't block page rendering or affect your Core Web Vitals.")],-1)),o[53]||(o[53]=t("p",null,[t("strong",null,"Does it work with all Shopify themes?"),t("br"),n("Yes. The widget is a standalone overlay — it doesn't depend on your theme structure. Works with Dawn, Debut, custom themes, and headless setups.")],-1)),o[54]||(o[54]=t("p",null,[t("strong",null,"Can I control what it says?"),t("br"),n("Completely. The AI only responds based on FAQs you've written. You control the content, tone, and what happens when it can't answer.")],-1)),o[55]||(o[55]=t("p",null,[t("strong",null,"What about mobile?"),t("br"),n("The widget is fully responsive and works great on any screen size.")],-1)),o[56]||(o[56]=t("p",null,[t("strong",null,"How much does it cost?"),t("br"),n("Plans start at $49/month for up to 5,000 queries. Most small-to-mid Shopify stores fall well within that. There's also a "),t("a",{href:"https://annonabot.com"},"14-day free trial"),n(" to test it risk-free.")],-1)),o[57]||(o[57]=t("h2",null,"Measuring Impact",-1)),o[58]||(o[58]=t("p",null,"After a week or two, check your Annona Bot dashboard for:",-1)),o[59]||(o[59]=t("ul",null,[t("li",null,[t("strong",null,"Containment rate"),n(" — What percentage of conversations the AI resolved without human help (target: 70%+)")]),t("li",null,[t("strong",null,"Top questions"),n(" — What customers ask most (use this to improve your FAQ)")]),t("li",null,[t("strong",null,"Content gaps"),n(" — Questions the AI couldn't answer (a

6dd these as new FAQs)")]),t("li",null,[t("strong",null,"Support ticket volume"),n(" — Compare with your pre-chatbot baseline")])],-1)),t("p",null,[o[18]||(o[18]=n("Most Shopify stores see a ",-1)),r(s,{to:"/blog/reduce-support-costs-ai-chatbot"},{default:l(()=>[...o[16]||(o[16]=[n("significant reduction in routine support tickets",-1)])]),_:1}),o[19]||(o[19]=n(" within the first month. Also running a WordPress site? See our ",-1)),r(s,{to:"/blog/add-ai-chatbot-to-wordpress"},{default:l(()=>[...o[17]||(o[17]=[n("WordPress integration guide",-1)])]),_:1}),o[20]||(o[20]=n(".",-1))]),o[60]||(o[60]=t("h2",null,"Getting Started",-1)),o[61]||(o[61]=t("ol",null,[t("li",null,[t("a",{href:"https://annonabot.com"},"Start your free trial"),n(" — no credit card required")]),t("li",null,"Add your FAQs in the dashboard"),t("li",null,"Paste one line of code in your Shopify theme"),t("li",null,"Watch your support tickets drop")],-1)),o[62]||(o[62]=t("p",null,'Five minutes of setup. Immediate impact. And your team gets to stop answering "Do you ship to Canada?" for the hundredth time.',-1))]),_:1},8,["post"])}}});export{I as default};