Add Chat Button to Shopify

There are two simple methods to add the GetButton widget to your Shopify store. You can either use the Shopify app for a quick and seamless installation or manually add the widget by inserting a short JavaScript code into your theme. Both approaches offer flexibility depending on your needs.

Quick installation from the Shopify app store

1. Visit the Shopify GetButton app page.

2. Click Install and then approve the app subscription.

   
   

   

3. You'll be redirected to the widget configuration page to get started. Check out the GetButton Widget and Greeting Message article for a complete overview of all the button and greeting message features. Once you have configured your button press Save Button.

   
   

   

4. In your Shopify admin, go to Online Store → Themes, and click Customize. In the sidebar, click the App embeds icon, find GetButton and toggle it on, and click Save.

   
   

   

You can go ahead and visit your store to preview the button.

You can adjust the widget settings or turn it off at any time. If changes don't appear right away, try clearing your browser cache or checking in Incognito mode.

Manual installation using JavaScript code

For this method, first configure the button on GetButton.io and obtain the short JavaScript code for your store. For more details, see the How to Create a Custom Chat Button for Your Website guide.

Once you have the button code, follow these steps:

1. Log in to your Shopify admin panel and go to Online Store → Themes.

2. Click the three-dot button and select Edit code.

   
   

   

3. Choose the theme.liquid file.
4. Scroll down to locate the </body> tag in the code.
5. Paste the button code just before the </body> tag, and click Save.

After installing the button using this manual method, you will be able to manage it from the admin.getbutton.io panel.

You now have two methods to add the GetButton widget to your Shopify store: using the Shopify app for quick installation or manually adding the JavaScript code to your theme. Both methods are designed to be straightforward, but if you encounter any issues or need assistance, please don't hesitate to contact us — we're here to help!