# Add GHL Customer Care's Chat Widget to Your Shopify Website > Are you looking for an easy way to connect with your website visitors and convert them into customers?GHL Customer Care Webchat for Shopify is the perfect solution for you! In this article, we'll walk you through the steps to start with HL Webchat for Shopify - Source: https://docs.ghlcustomercare.com/docs/sites/chat-widget/add-ghl-customer-care-s-chat-widget-to-your-shopify-website - Section: Sites / Chat Widget - Reading time: 1 min - Images: 7, each explained below - Modified on Fri, 2 May, 2025 at 11:15 AM --- Are you looking for an easy way to connect with your website visitors and convert them into customers? GHL Customer Care Webchat for Shopify is the perfect solution for you! In this article, we'll walk you through the steps to start with GHL Customer Care Webchat for Shopify. --- # **How to obtain the embed code for web chat for the website:** Copy the embed code from **Sites** > **Chat Widget** \> **Get Cod**e ![How to obtain the embed code for web chat for the website: (image 1 of 7)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297297829/original/oKtzhm7Qaeia1e1Pzl-q2_GbFteEF8ZoBw.gif) **How to obtain the embed code for web chat for the website: (image 1 of 7)** This animation appears in the "How to obtain the embed code for web chat for the website:" section of "Add GHL Customer Care's Chat Widget to Your Shopify Website". The text alongside this image reads: Copy the embed code from Sites > Chat Widget > Get Cod e. The navigation path used here is Sites > Chat Widget > Get Cod. Immediately after, the guide continues: Log in to your Shopify account: Go to your Shopify account and log in. Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. - Path: Sites > Chat Widget > Get Cod - What to copy: Copy the embed code from Sites > Chat Widget > Get Cod e - Controls: Sites, Chat Widget, Get Cod - Next: Log in to your Shopify account: Go to your Shopify account and log in. Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. --- ## **Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods:** - Log in to your Shopify account: Go to your Shopify account and log in. - Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. ![Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 2 of 7)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297324784/original/4ixY62gc7EwglJ9F0a4bwMoxpQXHH_Xtyw.jpeg) **Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 2 of 7)** This screenshot appears in the "Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods:" section of "Add GHL Customer Care's Chat Widget to Your Shopify Website". The text alongside this image reads: Log in to your Shopify account: Go to your Shopify account and log in. Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. Immediately after, the guide continues: Edit your website's theme: Select the theme that you want to edit and click on the " Actions " button. Choose " Edit code " from the drop-down menu. - What this covers: Log in to your Shopify account: Go to your Shopify account and log in. Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. - Controls: Actions, Edit code, Layout, theme.liquid, theme.liquid, - Next: Edit your website's theme: Select the theme that you want to edit and click on the " Actions " button. Choose " Edit code " from the drop-down menu. Full procedure: 1. Log in to your Shopify account: Go to your Shopify account and log in. 2. Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. - Edit your website's theme: Select the theme that you want to edit and click on the "**Actions**" button. Choose "**Edit code**" from the drop-down menu. ![Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 3 of 7)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297324783/original/7OOpzX5r1cGs_hKuMlyK7PFupzLej25itg.jpeg) **Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 3 of 7)** This screenshot appears in the "Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods:" section of "Add GHL Customer Care's Chat Widget to Your Shopify Website". The text alongside this image reads: Edit your website's theme: Select the theme that you want to edit and click on the " Actions " button. Choose " Edit code " from the drop-down menu. Immediately after, the guide continues: Open your theme's theme.liquid file: In the list of files that appears, select the " Layout " folder and then select the " theme.liquid " file. - What to choose: Edit your website's theme: Select the theme that you want to edit and click on the " Actions " button. Choose " Edit code " from the drop-down menu. - Controls: Actions, Edit code, Layout, theme.liquid, theme.liquid, - Next: Open your theme's theme.liquid file: In the list of files that appears, select the " Layout " folder and then select the " theme.liquid " file. Full procedure: 1. Log in to your Shopify account: Go to your Shopify account and log in. 2. Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. ![Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 4 of 7)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297324778/original/xDoNGM25Xom69HxzbfsPJM2bIG4oT58Mpw.png) **Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 4 of 7)** This screenshot appears in the "Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods:" section of "Add GHL Customer Care's Chat Widget to Your Shopify Website". The text alongside this image reads: Edit your website's theme: Select the theme that you want to edit and click on the " Actions " button. Choose " Edit code " from the drop-down menu. Immediately after, the guide continues: Open your theme's theme.liquid file: In the list of files that appears, select the " Layout " folder and then select the " theme.liquid " file. - What to choose: Edit your website's theme: Select the theme that you want to edit and click on the " Actions " button. Choose " Edit code " from the drop-down menu. - Controls: Actions, Edit code, Layout, theme.liquid, theme.liquid, - Next: Open your theme's theme.liquid file: In the list of files that appears, select the " Layout " folder and then select the " theme.liquid " file. Full procedure: 1. Log in to your Shopify account: Go to your Shopify account and log in. 2. Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. - Open your theme's theme.liquid file: In the list of files that appears, select the "**Layout**" folder and then select the "**theme.liquid**" file. ![Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 5 of 7)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297324780/original/WpuHKCkk_K3rGrEMk0fx8m0xINkUuO1K4Q.jpeg) **Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 5 of 7)** This screenshot appears in the "Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods:" section of "Add GHL Customer Care's Chat Widget to Your Shopify Website". The text alongside this image reads: Open your theme's theme.liquid file: In the list of files that appears, select the " Layout " folder and then select the " theme.liquid " file. Immediately after, the guide continues: Paste the embed code: Locate the tag within the theme.liquid, then add embed code above it. - Where to go: Open your theme's theme.liquid file: In the list of files that appears, select the " Layout " folder and then select the " theme.liquid " file. - Controls: Actions, Edit code, Layout, theme.liquid, theme.liquid, - Next: Paste the embed code: Locate the tag within the theme.liquid, then add embed code above it. Full procedure: 1. Log in to your Shopify account: Go to your Shopify account and log in. 2. Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. - Paste the embed code: Locate `` the tag within the **theme.liquid,** then add embed code above it. ![Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 6 of 7)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297324781/original/bYge5b1X9AAUYrVTDgNZfgmSkr3XM-tnqw.jpeg) **Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 6 of 7)** This screenshot appears in the "Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods:" section of "Add GHL Customer Care's Chat Widget to Your Shopify Website". The text alongside this image reads: Paste the embed code: Locate the tag within the theme.liquid, then add embed code above it. Immediately after, the guide continues: Save the changes: After adding the embed code, hit the save button. - What to copy: Paste the embed code: Locate the tag within the theme.liquid, then add embed code above it. - Controls: Actions, Edit code, Layout, theme.liquid, theme.liquid, - Next: Save the changes: After adding the embed code, hit the save button. Full procedure: 1. Log in to your Shopify account: Go to your Shopify account and log in. 2. Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. - Save the changes: After adding the embed code, hit the save button. ![Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 7 of 7)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297324782/original/TLDL_HdeWPkxcNvDgXCxByiyh7ZTzjIqLg.jpeg) **Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods: (image 7 of 7)** This screenshot appears in the "Here are detailed steps on how to add a custom chat widget to a Shopify website using different methods:" section of "Add GHL Customer Care's Chat Widget to Your Shopify Website". The text alongside this image reads: Save the changes: After adding the embed code, hit the save button. Immediately after, the guide continues: Preview the chat widget: Go to your website and refresh the page. The chat widget should now be visible on your website. Please test it out to make sure it's working correctly. - How to confirm: Save the changes: After adding the embed code, hit the save button. - Controls: Actions, Edit code, Layout, theme.liquid, theme.liquid, - Next: Preview the chat widget: Go to your website and refresh the page. The chat widget should now be visible on your website. Please test it out to make sure it's working correctly. Full procedure: 1. Log in to your Shopify account: Go to your Shopify account and log in. 2. Navigate to the "Online Store" section: From your Shopify dashboard, navigate to the "Online Store" section. - Preview the chat widget: Go to your website and refresh the page. The chat widget should now be visible on your website.  - Please test it out to make sure it's working correctly. --- Documentation for GHL Customer Care. Support: support@ghlcustomercare.com