Install AskDolphin

Install AskDolphin on Shopify

Installing a live chat widget like AskDolphin can significantly enhance customer engagement on your Shopify store. AskDolphin allows you to integrate your product catalog seamlessly, enabling product-specific chats, training Dolphin AI with your product details, and delivering accurate and tailored responses to customer inquiries. This helps you provide a personalized shopping experience and improve communication efficiency.

Installing a live chat widget like AskDolphin can significantly enhance customer engagement on your Shopify store. AskDolphin allows you to integrate your product catalog seamlessly, enabling product-specific chats, training Dolphin AI with your product details, and delivering accurate and tailored responses to customer inquiries. This helps you provide a personalized shopping experience and improve communication efficiency.

Table of Content

Table of Content

Table of Content

This guide provides easy-to-follow steps to install and activate the AskDolphin widget, helping you communicate effectively with your website visitors.

In this article, you’ll learn:

  • How to install AskDolphin via Plugin (Shopify App Store).

  • How to activate the AskDolphin widget on your website.

  • How to install AskDolphin for existing accounts (Advanced JavaScript installation).

Let’s get started and make your setup process as simple as possible!

Note: The AskDolphin widget can be installed on your website using only one method, either the plugin or the JavaScript code.


Install AskDolphin via Shopify Plugin

The easiest way to add AskDolphin to your Shopify store is through our official plugin, available in the Shopify App Store.

To get started, log in to your Shopify account and select the store where you want to install AskDolphin. Then, navigate to the Apps tab and type AskDolphin in the search bar to find the plugin.

Select AskDolphin: Live Chat & AI and click on the Install (Add app) button to add AskDolphin to your Shopify store.

On the following page, select the Install App button. This action will redirect you to your AskDolphin panel, where you can customize your chat widget.

You will be asked for your email, password, and other relevant details about your business and brand (see how to create an AskDolphin account). If you encounter a warning indicating that your email is already in use, please reach out to our support team for assistance.

Once setup is complete, enable the AskDolphin Chat Widget in your theme’s App embeds (steps below) to make it visible on your store. Your customers can now engage with you directly through chat.



Activate AskDolphin App in Shopify

After installing the AskDolphin App, follow these steps to make the chat widget visible to visitors on your website.

Step 1: Open Your Shopify Admin Panel

Log in to your Shopify admin panel and navigate to Online Store > Themes. Select the theme you want to edit and click Customize (Edit theme).

Shopify admin dashboard showing the Online Store, Themes section with an arrow pointing to the Customize button.


Step 2: Access the App Embeds Tab

Within the customization panel, open the App embeds tab.

Shopify theme editor open to App embeds section, with an arrow pointing to the App embeds icon.


Step 3: Find the AskDolphin Widget

In the App embeds section, find AskDolphin Chat Widget in the list of apps.

Shopify App embeds section displaying the AskDolphin Chat Widget embed option, with an arrow pointing to expand the widget settings.


Step 4: Enable the AskDolphin Chat Widget

Toggle the AskDolphin Chat Widget to the on position. Once enabled, click Save to apply the changes.

AskDolphin Chat Widget activated in Shopify App embeds, with arrows pointing to the enabled toggle.


Note: You will need to repeat this activation process if you switch to a new theme in your Shopify store.


After saving your changes, open your Shopify store and refresh the page to make sure the AskDolphin chat widget is visible and working correctly.

AskDolphin chat widget icon being clicked to verify that the widget is active on the Shopify storefront.



Alternative - Install AskDolphin via JavaScript code

If you have an existing AskDolphin account or prefer not to use the Shopify plugin, this method is for you. With this approach, you can manually add the AskDolphin chat widget to your Shopify store.

Please note that Shopify-specific features and flows will still function correctly, but billing will remain managed through AskDolphin.


Steps to Add AskDolphin via JavaScript Code:

Step 1: Open Live Chat widget settings

Log in to your AskDolphin panel and go to Settings > Channels > Live Chat widget.

AskDolphin panel showing the Live Chat Installation menu highlighted with an arrow inside the Settings sidebar.


Step 2: Open the Manual installation option

Click Install chat widget, then select Manual installation.

AskDolphin manual installation page with an arrow pointing to the “Copy to clipboard” button for the JavaScript snippet.


Step 3: Copy the installation code

Copy the code shown in the Code block.

Screenshot of AskDolphin merchant dashboard to how to Copy the code shown in the Code block


Step 4: Access Your Shopify Panel

Open your Shopify admin panel. Under Online Store, go to the Themes section.

Shopify admin dashboard with an arrow pointing to the Themes menu under Sales channels.


Locate your active theme and click on the three dots next to the Customize button. From the dropdown menu, select Edit Code.

Shopify theme settings with an arrow pointing to the “Edit code” option inside the theme actions menu.


Step 5: Add the JavaScript Code to the Theme

In the code editor that opens, navigate to the Layout > theme.liquid file.

Shopify code editor showing the theme.liquid file selected, with an arrow highlighting where to insert code.


Tip: To make finding the correct spot easier, press CTRL+F (or CMD+F on Mac) and search for </body> in the code editor.

Scroll to the bottom of the file and paste the JavaScript code right before the closing  </body>  tag.

Shopify theme.liquid file with an arrow pointing to the location just above the closing </body> tag where the AskDolphin script should be pasted.


Step 6: Save and Refresh Your Website

After pasting the code, click Save.

Shopify code editor with an arrow pointing to the Save button to confirm changes after adding the AskDolphin script.


Once your updates are saved, visit your Shopify site and reload the page to check that the AskDolphin widget has been successfully installed and is responding as expected.

AskDolphin chat widget bubble being clicked to confirm successful installation.