Shopify Integration
Learn how to integrate Chatplugify with your Shopify store in just a few minutes with our step-by-step video guide.
Shopify Integration Tutorial
Coming Soon - Complete Shopify setup guide
Installation Steps
1
Access Your Shopify Admin
Log into your Shopify admin dashboard and navigate to the theme customization section.
Path to follow:
Online Store → Themes → Actions → Edit Code
2
Locate theme.liquid File
Find and open the theme.liquid file in the Layout folder of your theme files.
File location:
Layout → theme.liquid
3
Add Chatplugify Script
Copy and paste the Chatplugify embed code just before the closing </body> tag.
<script>
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXX');
</script>Configuration Options
Widget Settings
- Position and sizing
- Colors and branding
- Welcome message
- Operating hours
E-commerce Features
- Product recommendations
- Order tracking support
- Abandoned cart recovery
- Customer support
Testing Your Integration
Testing Checklist
- ✓ Widget appears on your storefront
- ✓ Chat functionality works correctly
- ✓ Messages are received in your dashboard
- ✓ Widget matches your brand colors
- ✓ Mobile responsiveness is working
Best Practices
- • Test on different devices and browsers
- • Set up automated greetings for better engagement
- • Configure business hours for better customer expectations
- • Train your team on the new chat system
Complete Code Example
theme.liquid
<!-- Chatplugify Integration -->
<script>
window.chatplugifySettings = {
apiKey: "YOUR_API_KEY_HERE",
position: "bottom-right",
primaryColor: "#005B63",
accentColor: "#F45500",
welcomeMessage: "Hi! How can we help you today?",
showOnMobile: true,
autoOpen: false
};
</script>
<script src="https://cdn.chatplugify.com/widget.js" async></script>
</body>
</html>