Skip to content
Sites

Add GHL Customer Care's Chat Widget to Your Weebly Website

Are you looking for an easy way to connect with your website visitors and convert them into customers? GHL Customer Care Webchat for Weebly is the perfect solution for you!

1 min read291 words5 explained imagesUpdated Fri, 11 Oct, 2024 at 10:15 AM
View as markdownOpen in ClaudeOpen in ChatGPT
Each image has a one line explanation. Switch to full detail for the step it belongs to, the fields and buttons involved, examples and the whole procedure.
On this page
  1. Here are detailed steps on how to add a custom chat widget to a Weebly website using different methods:
  2. Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature
  3. Method 2: Adding a Custom Chat Widget with Weebly's Custom HTML/ Embed Code Element

Are you looking for an easy way to connect with your website visitors and convert them into customers? GHL Customer Care Webchat for Weebly is the perfect solution for you!
In this article, we'll walk you through the steps to start with GHL Customer Care Webchat for Weebly.

Covered in the article

How to obtain the embed code for web chat for the website:

Here are detailed steps on how to add a custom chat widget to a Weebly website using different methods:

Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature

Method 2: Adding a Custom Chat Widget with Weebly's Custom HTML/ Embed Code Element

How to obtain the embed code for web chat for the website:

Copy the embed code from Sites > Chat Widget > Get Code
How to obtain the embed code for web chat for the website: (image 1 of 5) What this shows Copy the embed code from Sites > Chat Widget > Get Code What this shows Illustrates the "How to obtain the embed code for web chat for the website:" section of "Add GHL Customer Care's Chat Widget to Your Weebly Website". 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 Weebly Website". The text alongside this image reads: Copy the embed code from Sites > Chat Widget > Get Code. The navigation path used here is Sites > Chat Widget > Get Code. Immediately after, the guide continues: Log in to your Weebly account and navigate to the website editor. Click on "Settings". Path: Sites > Chat Widget > Get CodeImage 1 of 5 What to copyCopy the embed code from Sites > Chat Widget > Get Code
Buttons and menus referenced SitesChat WidgetGet Code
Next stepLog in to your Weebly account and navigate to the website editor. Click on "Settings"

Here are detailed steps on how to add a custom chat widget to a Weebly website using different methods:

Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature

  • Log in to your Weebly account and navigate to the website editor.
  • Click on "Settings" 
Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature (image 2 of 5) What this shows Log in to your Weebly account and navigate to the website editor. What this shows Illustrates the "Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature" section of "Add GHL Customer Care's Chat Widget to Your Weebly Website". This screenshot appears in the "Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature" section of "Add GHL Customer Care's Chat Widget to Your Weebly Website". The text alongside this image reads: Log in to your Weebly account and navigate to the website editor. Click on "Settings". Immediately after, the guide continues: In the left-hand menu and select "SEO" from the options. Image 2 of 5 What to clickLog in to your Weebly account and navigate to the website editor. Click on "Settings" Next stepIn the left-hand menu and select "SEO" from the options.
All 2 steps in this procedure
  1. Log in to your Weebly account and navigate to the website editor.
  2. Click on "Settings"
  • In the left-hand menu and select "SEO" from the options.
Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature (image 3 of 5) What this shows In the left-hand menu and select "SEO" from the options. What this shows Illustrates the "Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature" section of "Add GHL Customer Care's Chat Widget to Your Weebly Website". This screenshot appears in the "Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature" section of "Add GHL Customer Care's Chat Widget to Your Weebly Website". The text alongside this image reads: In the left-hand menu and select "SEO" from the options. Immediately after, the guide continues: Scroll down to the "Header Code Injection" section and click "Edit". Paste the code into the "Header Code Injection" box in Weebly. Image 3 of 5 What to chooseIn the left-hand menu and select "SEO" from the options. Next stepScroll down to the "Header Code Injection" section and click "Edit". Paste the code into the "Header Code Injection" box in Weebly.
All 2 steps in this procedure
  1. Log in to your Weebly account and navigate to the website editor.
  2. Click on "Settings"
  • Scroll down to the "Header Code Injection" section and click "Edit".
  • Paste the code into the "Header Code Injection" box in Weebly.
Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature (image 4 of 5) What this shows Scroll down to the "Header Code Injection" section and click "Edit". What this shows Illustrates the "Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature" section of "Add GHL Customer Care's Chat Widget to Your Weebly Website". This screenshot appears in the "Method 1: Adding a Custom Chat Widget with Weebly's Header Code Injection Feature" section of "Add GHL Customer Care's Chat Widget to Your Weebly Website". The text alongside this image reads: Scroll down to the "Header Code Injection" section and click "Edit". Paste the code into the "Header Code Injection" box in Weebly. Immediately after, the guide continues: Click "Save" to save your changes. Image 4 of 5 What to copyScroll down to the "Header Code Injection" section and click "Edit". Paste the code into the "Header Code Injection" box in Weebly. Next stepClick "Save" to save your changes.
All 2 steps in this procedure
  1. Log in to your Weebly account and navigate to the website editor.
  2. Click on "Settings"
  • Click "Save" to save your changes.

Method 2: Adding a Custom Chat Widget with Weebly's Custom HTML/ Embed Code Element

  • Log in to your Weebly account and navigate to the website editor.
  • Click on "Elements" in the left-hand menu and select "Custom HTML/Embed Code" from the options.
  • Drag and drop the Custom HTML element onto your page where you want the chat widget to appear.
Method 2: Adding a Custom Chat Widget with Weebly's Custom HTML/ Embed Code Element (image 5 of 5) What this shows Log in to your Weebly account and navigate to the website editor. What this shows Illustrates the "Method 2: Adding a Custom Chat Widget with Weebly's Custom HTML/ Embed Code Element" section of "Add GHL Customer Care's Chat Widget to Your Weebly Website". This screenshot appears in the "Method 2: Adding a Custom Chat Widget with Weebly's Custom HTML/ Embed Code Element" section of "Add GHL Customer Care's Chat Widget to Your Weebly Website". The text alongside this image reads: Log in to your Weebly account and navigate to the website editor. Click on "Elements" in the left-hand menu and select "Custom HTML/Embed Code" from the options. Drag and drop the Custom HTML element onto your page where you want the chat widget to appear. Immediately after, the guide continues: Paste the Chat code into the Custom HTML element in Weebly. Click "Publish" to save your changes. Image 5 of 5 What to chooseLog in to your Weebly account and navigate to the website editor. Click on "Elements" in the left-hand menu and select "Custom HTML/Embed Code" from the options. Drag and drop the Custom HTML element onto your page where you want the chat widget to appear. Next stepPaste the Chat code into the Custom HTML element in Weebly. Click "Publish" to save your changes.
All 3 steps in this procedure
  1. Log in to your Weebly account and navigate to the website editor.
  2. Click on "Elements" in the left-hand menu and select "Custom HTML/Embed Code" from the options.
  3. Drag and drop the Custom HTML element onto your page where you want the chat widget to appear.
  • Paste the Chat code into the Custom HTML element in Weebly.
  • Click "Publish" to save your changes.

Was this guide helpful?

Related guides

Getting Started with Chat Widget5 min read · 16 imagesOverview of Chat Widget Customizations6 min read · 10 imagesChat Widget - Business Office Hours in Live Chat1 min read · 7 imagesChat Widget - Send your leads to Whatsapp Chat1 min read · 4 images