Shopify Installation Guide

Follow these simple steps to add the LiveChat widget to your Shopify store. The chat button will appear on all pages of your store.

📝 Other Guides: General | WordPress | WooCommerce | All Guides
📋 Before You Begin:
  • Log in to your Shopify admin panel
  • Get Your Installation Code: Log in to your LiveChat Dashboard and go to "Installation Code" to get your personalized code with your Account ID
  • If you switch themes later, you'll need to add the code again
  • Note: The code shown in this guide is sample code. Use the code from your Dashboard for actual installation
  • Official Domain: Use https://www.poplivechat.com for production deployment

Step 1: Access Shopify Theme Editor

In your Shopify admin panel, go to:

Online Store → Themes → Click "Actions" → "Edit code"

Step 2: Open theme.liquid File

In the theme editor, find and open the "theme.liquid" file (usually located in the "Layout" folder).

This file controls the layout for all pages in your store.

Step 3: Find the Closing </body> Tag

Scroll down in the theme.liquid file and find the closing </body> tag near the end of the file.

The code should be placed just before this tag.

Step 4: Copy and Paste the Code

📌 Sample Code Notice:

The code below is sample code for demonstration purposes. The YOUR_COMPANY_ID shown is a placeholder. To get your actual installation code with your Account ID, please log in to your LiveChat Dashboard and navigate to the "Installation Code" section.

Copy the code below and paste it just before the </body> tag:

<!-- PopLiveChat Widget -->
<script>
window.LiveChatWidgetConfig = { companyId: 'YOUR_COMPANY_ID' };
</script>
<link rel="stylesheet" href="https://www.poplivechat.com/css/chat-widget.css">
<script src="https://www.poplivechat.com/js/chat-widget.js"></script>
<!-- End PopLiveChat Widget -->

⚠️ Important: This is sample code. Replace YOUR_COMPANY_ID with your actual Account ID. Get your personalized installation code from your Dashboard → Installation Code page.

Step 5: Save and Test

Click the "Save" button at the bottom of the editor.

Visit your Shopify store and look for the chat button in the bottom-right corner. Click it to test!

✅ What You'll See:
  • A floating chat button appears on all pages of your Shopify store
  • Visitors can click the button to start a conversation
  • The widget loads automatically after page content
💡 Important Tips:
  • If you switch Shopify themes, you'll need to add the code to the new theme's theme.liquid file
  • The chat widget will appear on all pages: homepage, product pages, cart, checkout, etc.
  • Make sure you paste the code before the </body> tag, not after it

Troubleshooting

Chat widget not appearing?

  • Check that the code is placed before the </body> tag in theme.liquid
  • Verify your Account ID is correct in the code
  • Try clearing your browser cache
  • Check browser console (F12) for JavaScript errors

Need Help?

If you encounter any issues during installation, please contact our support team:

📧 Email: contact@items7.com
🏠 Access Dashboard | All Installation Guides