# Install Tidio on Shopify

Section: Install Tidio

Description: Install the Tidio app from the Shopify App Store with a new account or an existing project, activate the widget in your theme, or add the chat with the JavaScript code.

Verified against Tidio panel 12.304.0

Last updated: 2026-11-09

Source: https://help.tidio.com/articles/install-shopify/

Installing a live chat widget like Tidio can greatly enhance customer engagement on your Shopify store. This article provides step-by-step instructions on installing and activating Tidio to improve communication with your website visitors.

 

**In this article, you'll learn:**

 

- [How to install Tidio via Plugin (Shopify Market) ](<https://help.tidio.com/articles/install-shopify/#install-tidio-via-shopify-plugin->)
- [How to connect an existing Tidio project](<https://help.tidio.com/articles/install-shopify/#connect-an-existing-tidio-project>)
- [How to activate the Tidio widget on your website ](<https://help.tidio.com/articles/install-shopify/#activate-tidio-app-in-shopify>)
- [How to install Tidio with the JavaScript code (advanced)](<https://help.tidio.com/articles/install-shopify/#alternative-install-tidio-via-javascript-code>)

 



 

Please remember that the Tidio widget can be installed on your website via only one installation method - the plugin **or** the javascript code.

 



 

## Install Tidio via Shopify plugin

 



 

The best way to install Tidio on your Shopify store is by our official plugin available in the [Shopify App Market](<https://apps.shopify.com/tidio-chat>).

 

To install Tidio on Shopify, log into your Shopify account and select the store to which you would like to add Tidio. Next, click on the **Apps** tab and type in **Tidio** in the Apps search bar**. **

 



 

![The Shopify admin search bar has the Apps filter selected and "Tidio" entered, with an option to search the Shopify App Store.](<https://help.tidio.com/article-media/install-shopify/legacy-6510045928476.webp>)

 



 

Select **Tidio Live Chat & AI Chatbots** and click on the **Add app **button to download Tidio and add it to your Shopify store.

 



 

![The Shopify App Store listing for "Tidio Live Chat & AI Chatbots" has an "Add app" button below the app rating and developer details.](<https://help.tidio.com/article-media/install-shopify/legacy-9221734457756.webp>)

 



 

Select the **Install App** button on the page that follows. That will transfer you to your Tidio panel where you can customize your chat.

 



 

![The Shopify installation page lists Tidio access to customer and store information, with the "Install app" button at the top right.](<https://help.tidio.com/article-media/install-shopify/legacy-9221734458908.webp>)

 



 

**All set. Tidio Chat is installed\! **

 



 

The following steps will take you to your admin panel, where you can customize your chat widget.

 



 

### Log into & configure the Tidio Chat Panel

 



 

Tidio opens the **Welcome to Tidio** page. New to Tidio? Click on **Create a new account**. As a new user, you'll begin the product tour, where we'll ask you some basic questions about your business and possible Tidio usage. Thanks to some additional information, we’ll adapt the Tidio to your need to improve your experience and help achieve better results.

 



 ![The Welcome to Tidio page opened from the Shopify app, with the Create a new account and Log In buttons, and the info message "This email is already registered. Please log in to continue." above them](<https://help.tidio.com/article-media/install-shopify/137.1.png>) 

If you see **This email is already registered. Please log in to continue.**, you already have a Tidio account - simply click on **Log In** and connect one of your projects, as shown below.

 



 

### Connect an existing Tidio project

 



 

Already using Tidio? You can connect your project to your Shopify store through the app, too. Click on **Log In** and sign in with your Tidio email and password. On the **Choose a project** screen, pick your project in **Select project** and hit **Integrate selected project**. Prefer to start fresh? Click on **Create one** next to **Would you like to integrate a new project?**:

 



 ![The Choose a project screen opened from the Shopify app, with the Select project list open: one project under "Available projects" and one greyed-out project under "Not available projects - integrated with different platform", the Integrate selected project button, and "Would you like to integrate a new project? Create one" below it](<https://help.tidio.com/article-media/install-shopify/137.2.png>) 



 

Projects that are already connected with another platform, or with a Shopify store, are listed under **Not available projects - integrated with different platform**, and you can't pick them. If none of your projects can be used, Tidio asks you to **Create a new project** instead.

 

💡



**Please note:** only the owner of a project can connect it with a Shopify store - otherwise, you'll see **Only the owner of the project can integrate platform**. A project that already has an active Tidio subscription can't be connected either: you'll see **Per Shopify terms, Shopify stores must be subscribed to Tidio through Tidio’s Shopify App.** If that happens, please reach out to our support team at support@tidio.com - we'll help you with the change.

 



 

After the tour, our chat will be ready to use on your website. Your customers can now write to you on chat\!

 

![The Tidio chat widget shows a shopper asking about pink sneakers in size 8 and an agent offering to check a recent delivery.](<https://help.tidio.com/article-media/install-shopify/legacy-20094063174044.webp>)

 

### Activate Tidio App in Shopify

 



 

After installing the Tidio App, you need to make the widget visible to visitors to your website.

 



 

You will make the Tidio widget visible by opening your Shopify admin panel and going to **Online Store \> Themes **section. There, find the theme you want to edit, and click **Customize**.

 



 

![The Shopify Themes page has arrows pointing to "Themes" in the Online Store menu and "Customize" beside the current theme.](<https://help.tidio.com/article-media/install-shopify/legacy-9221734460316.webp>)

 



 

Open the **App embeds** tab.

 



 

![The Shopify theme editor has "App embeds" selected, with the "Tidio Chat Widget" toggle switched off.](<https://help.tidio.com/article-media/install-shopify/legacy-9221734461596.webp>)

 



 

To activate Tidio on your website, enable the toggle next to the **Tidio Chat Widget **and **save** the changes.

 



 

![The Shopify "App embeds" panel shows the "Tidio Chat Widget" toggle switched on.](<https://help.tidio.com/article-media/install-shopify/legacy-9221741469596.webp>)

 



 



 

💡

 

Please note that you'll need to activate the Tidio chat widget each time you change the theme.

 



 

### Activate the widget from your Tidio panel

 



 

Your Tidio panel reminds you about this step, too. Until the widget is activated, you'll see **Chat Widget is not visible to your customers. Go to Settings to finish the setup.** at the top of the panel, with the **Complete setup** button, and a **Show widget to your visitors** task on your [Getting started](<https://help.tidio.com/articles/getting-started-checklist/>) list. Both take you to **Settings \> Live Chat \> Installation**, which walks you through it in two steps:

 

1. Click on **Go to Shopify Theme Editor**, turn on the Tidio app embed and save your changes.
2. Click on **Go to your website** - visiting your store is required to activate the widget. Tidio shows **checking widget activation** until it detects the widget.

 ![Settings \> Live Chat \> Installation for a Shopify store with the widget not activated yet: the alert "The widget is currently not visible to your customers. Follow the steps below to enable Tidio live chat for your visitors.", step 1 with the Go to Shopify Theme Editor button, and step 2 with the Go to your website button and "checking widget activation"](<https://help.tidio.com/article-media/install-shopify/137.3.png>) 



 

Once it's done, the screen says **The widget is installed properly**, and you can click on **See on your website** to check it out.

 



 

## Alternative - Install Tidio via javascript code

 



 

If you prefer to add the chat to your store manually - this is the option for you\! Shopify-exclusive flows and automation will still work correctly, although your billing will go directly through Tidio.

 



 

You can add an existing project to your Shopify website by adding the chat manually. If you want to transfer your chat from another website to Shopify, please copy the code snippet from your chat panel. You can find your unique javascript code in the **Settings \>** **Live Chat** \> **Installation**** **section.

 



 

![The Tidio Installation settings show "Manual install", a code snippet and "Copy to clipboard", with the widget marked as activated.](<https://help.tidio.com/article-media/install-shopify/legacy-13499277464092.webp>)

 



 

Copy the JavaScript code to your clipboard.

 



 

Come back to your Shopify panel. Open the **Themes** section under the **Online Store** settings and click on the **Customize** button.

 



 

![The Shopify Themes page has arrows pointing to "Themes" in the Online Store menu and "Customize" beside the current theme.](<https://help.tidio.com/article-media/install-shopify/legacy-9221734460316.webp>)

 



 

Click on the three dots menu on the left side next to the name of the Theme. The code editor will open in a separate tab.

 



 

![The Shopify theme menu is open, with an arrow and outline marking "Edit code".](<https://help.tidio.com/article-media/install-shopify/legacy-9221741472028.webp>)

 



 

Choose the **theme.liquid** file under the **Layout** folder and paste the code from above, right before the closing **` </body> `** tag. The screenshot below will help you find this.

 



 

![The Shopify theme code editor marks the line immediately before the closing body tag as the place to paste the Tidio JavaScript code.](<https://help.tidio.com/article-media/install-shopify/legacy-6510303613724.webp>)

 



 

Please remember to **S****ave** the changes and refresh your website when you finish.

 



 

![The Shopify code editor has a "Save" button in the upper-right corner.](<https://help.tidio.com/article-media/install-shopify/legacy-6510341741212.webp>)

 

## Further reading

 

- [Install Tidio on your Website](<https://help.tidio.com/articles/install-website/>)
- [Getting started: your first steps in Tidio](<https://help.tidio.com/articles/getting-started-checklist/>)
- [Manage multiple projects](<https://help.tidio.com/articles/manage-multiple-projects/>)
