Adding The Concours Pro Web Chat Widget To Your Website

Contents

• Prerequisites
• Adding the Widget to a Concours Pro Website or Funnel
• Adding the Widget to a WordPress Website
• Adding the Widget to Another Type of Website

Prerequisites

Before you add the Concours Pro Web Chat Widget to your website, be sure you have created and customised your widget as per your requirements.

Here’s how to do that: Creating and Customising the Web Chat Widget in Concours Pro.

Adding the Widget to a Concours Pro Website or Funnel

1. Go to Sites > Websites, or Sites > Funnels, depending on whether you are adding to a Website or Funnel.
2. Click into your selected Website or Funnel.
3. Click Settings.
4. Select your desired Web Chat Widget from the Chat widget drop down menu.
5. Click Save (Bottom Right).

Adding the Widget to a WordPress Website

1. In your WordPress site, hover over the Plugins menu item, the click Add New Plugin.

2. Search for “LeadConnector” and find the LeadConnector Plugin by LeadConnector – Should be first in the list.
3. Click Install Now.

4. Once installed, the Install Now button changes to a blue Activate button. Click Activate.
5. In Concours Pro, Go to Settings > Business Profile.
6. Under General Information, click the clipboard icon to copy your API Key.

7. In your WordPress site, click the LeadConnector menu item.
8. Paste in your API key and click Save.
9. Ensure Enable Chat Widget is ticked and click Pull and Save.
10. Click Save again.

11. Clear any active caches and test your widget is working on the front end of your website.
12. You may need to perform a hard refresh and/or clear your browser cache, depending on your WordPress setup.

Adding the Widget to Another Type of Website

The Web Chat Widget can be added to any other type of website by directly adding code into the website or if your website uses Google Tag Manager (GTM) it can be added that way.

Direct Code Implementation

1. Go to Sites > Chat Widget.
2. Click into your desired chat widget.
3. In the top right, click Get Code.

4. In the pop up, select Via Code.
5. Click Copy to copy the code.

4. Paste the code into your website, either directly into the website HTML, or into a site editor HTML / Code element. Don’t forget to save it!

Google Tag Manager Implementation

1. Go to Sites > Chat Widget.
2. Click into your desired chat widget.
3. In the top right, click Get Code.
4. In the pop up, select Via GTM.
5. Click Copy to copy the code.

6. Add the copied code into your GTM account inside a Custom HTML tag that is triggered to fire on every page.
7. Don’t forget to submit your changes to make them live.

Note: We do not provide support for Direct Code or Google Tag Manager implementations. Only proceed with these implementation methods if you are confident in your ability to complete them – otherwise, please refer this article to your web developer.