Shopify

A Detailed Guide on How to Integrate Wonderchat with Shopify.

This guide will help you seamlessly integrate Wonderchat, our AI-powered chatbot, with your Shopify store. By following these steps, you'll enhance customer engagement and streamline support, providing a more efficient shopping experience for your users.

Let’s get started on setting up Wonderchat in Shopify!

---

Installing Wonderchat App on your Shopify Store

Step 1: Login to your Shopify Store.

Login to ↗ Shopify Store Admin.

Step 2: On the left-panel, click on "Apps".

Click on "Apps" on the left-panel.

Step 3: In the pop-up, click on "Shopify App Store".

Click on "Shopify App Store" link on the bottom of the pop-up window.

Step 4: Search for "Wonderchat" in Shopify App Store.

Type in "Wonderchat" in the search bar.

Step 5: Click on 'Install'.

Install the 'Wonderchat' app.

Step 6: Select 'Install' again.

Click 'Install' to grant access permissions.

Step 7: Access Wonderchat from the Shopify Dashboard

1. In your Shopify dashboard, click on Apps from the left-hand sidebar to open the Apps menu.

2. In the search bar at the top, type Wonderchat.

3. Once Wonderchat appears under Installed apps, click on it to open the Wonderchat integration interface.

Click on "Wonderchat" to open ↗ Wonderchat App.

Step 8: Verify Shopify Store Connection

1. After connecting your Shopify store to Wonderchat, navigate to the Dashboard in Wonderchat.

2. You should see your Shopify chatbot listed under Bot Name with its status toggled on.

3. A notification will appear at the bottom of the screen, confirming that your Shopify store has been successfully connected. It will state:

"Your Shopify Store has already been connected to your Wonderchat account. Please go to Settings > Integrations > Shopify to connect your store to an existing chatbot."

Shopify Icon in Green under Integrations

If you see the Shopify Icon lighted up in green, your integration has been successful, and your chatbot is now ready to interact with your Shopify customers. From here, you can now embed your chat widget to your website.

---

How to Embed Chat Widget on Shopify

Step 1: Go to "Edit Code"

On your Shopify Admin Dashboard, find the left-panel and click on "Themes" > "(...) > "Edit Code".

Click on "Edit Code".

Step 2: Select "theme.liquid"

On the left-panel under the 'Layout' folder, click on "theme.liquid".

Click on "theme.liquid"

Step 3: Scroll down to find the </body> tag

Find where the </body> tag is

Step 3: Retrieve Embed Code from Wonderchat App

In a separate window, open the ↗ Wonderchat App.

From your dashboard, Click on the “⋮” and go to “Embed to website”

From the pop-up, copy the embed code.

Click on "Copy to clipboard".

Step 4: Paste copied code before </body> tag

Paste copied code just before </body> tag.

Step 5: Click on 'Save'

Click on 'Save' to save changes.

Step 6: Preview Widget on Store

Click on "Preview Store" (top-right corner)

Check if chat widget appears on the page.

Step 7: Test Chatbot on Live Store

Ensure the chatbot works properly by interacting with it on your live store. Test the chatbot's functionality across different devices (desktop, tablet, mobile) to make sure it's responsive.

Click on Chatbot Widget Icon to expand pop-up

Test and interact with chatbot to ensure everything is working well

---

Conclusion

By following this guide, you've successfully integrated Wonderchat with your Shopify store. Your AI-powered chatbot is now ready to enhance customer engagement, streamline communication, and provide round-the-clock support to your store visitors. This integration will not only improve the overall user experience but also help automate routine tasks, allowing you to focus on growing your business.

If you encounter any issues or need further assistance, don't hesitate to explore the Wonderchat help resources or reach out to their support team. Happy selling!

---

If you have any more questions, feel free to reach out to us at [email protected]