FastComments.com

Add Comments to GoHighLevel Sites

With FastComments we can easily add live commenting to any site built with GoHighLevel.

Note that this tutorial requires a FastComments account. It's recommended that you sign up first and then come back here. You can create an account here.

Signing in first will ensure the generated code snippets are already tied to your account.

GoHighLevel Membership Sites and Other Sites

This tutorial is split between two categories: Membership Sites and regular GoHighLevel Sites.

We start with the instructions for Membership Sites.

Step 1: Edit Course Internal Link

First, we're going to edit the settings for our course.

To do this, open the course, and click Edit Details.

Edit Course Details
Edit Course Details

Step 2: Open Advanced Settings Internal Link

Next, we need to open the Advanced settings:

Open Advanced Settings
Open Advanced Settings

We'll be adding our code to the Tracking Code section. Go to that section and click Footer Code.

Step 3: Copy Code Internal Link

Now we're going to copy our FastComments code. Try using the "Copy" button on the right, as the code is quite large to work properly with GoHighLevel:

GoHighLevel FastComments Code Snippet
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<script>
4 (function () {
5 const oldPushState = history.pushState;
6 history.pushState = function pushState() {
7 const ret = oldPushState.apply(this, arguments);
8 window.dispatchEvent(new Event('pushstate'));
9 window.dispatchEvent(new Event('locationchange'));
10 return ret;
11 };
12
13 const oldReplaceState = history.replaceState;
14 history.replaceState = function replaceState() {
15 const ret = oldReplaceState.apply(this, arguments);
16 window.dispatchEvent(new Event('replacestate'));
17 window.dispatchEvent(new Event('locationchange'));
18 return ret;
19 };
20
21 window.addEventListener('popstate', () => {
22 window.dispatchEvent(new Event('locationchange'));
23 });
24
25 function render() {
26 let rendered = false;
27
28 function tryNext() {
29 if (rendered) {
30 return;
31 }
32 const container = document.querySelector('#post-body');
33 if (container) {
34 console.log('FastComments: container found, updating...');
35 if (document.querySelector('.fastcomments-wrapper')) {
36 document.querySelector('.fastcomments-wrapper').remove();
37 }
38 const target = document.createElement('div');
39 target.classList.add('fastcomments-wrapper');
40 container.append(target);
41 FastCommentsUI(target, {
42 tenantId: "demo",
43 showLiveRightAway: true
44 });
45 rendered = true;
46 const interval = setInterval(function() {
47 const doesContainerStillExist = document.querySelector('.fastcomments-wrapper');
48 if (!doesContainerStillExist) {
49 rendered = false;
50 tryNext();
51 clearInterval(interval);
52 }
53 }, 1000);
54 } else {
55 console.log('FastComments: container not found, waiting...');
56 setTimeout(tryNext, 300);
57 }
58 }
59
60 tryNext();
61 }
62
63 render();
64
65 window.addEventListener('locationchange', function () {
66 console.log('Updating FastComments.');
67 render();
68 });
69 })();
70</script>
71

Step 4: Paste Code Internal Link

Now that we've copied our snippet, paste it in the Footer Code section as shown:

Paste Code
Paste Code

Member Site Success Internal Link

That's it! You should now have live commenting added to your GoHighLevel course.

Success
Success

If you've run into a permission denied error, or would like to customize FastComments, read on.

Member Site Customization Internal Link

FastComments is designed to be customized to match your site.

If you'd like to add custom styling, or tweak configuration, Checkout our Customization Documentation to learn how.

Step 1: Add Custom Code Element Internal Link

First, we're going to open the editor for the page of our site we want to add comments to.

Open Editor
Open Editor

Now find the place on the page where you want to add comments. Move your mouse toward the end of that area. A + icon will appear:

Add Section
Add Section

If we click that it asks us how many columns should the new section be. We'll select 1 COLUMN:

Add a Column
Add a Column

Now if you move your mouse over the new 1-column-row you'll have the option to add an element. Click that:

Add Element
Add Element

Scroll down and pick CUSTOM JS/HTML:

Select CUSTOM JS/HTML
Select CUSTOM JS/HTML

Now select our new element and click Open Code Editor on the left:

Open Code Editor
Open Code Editor

Step 2: Copy and Paste Code Internal Link

It's time to copy our code. Copy the following code:

GoHighLevel Site Comments Code
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5 FastCommentsUI(document.getElementById('fastcomments-widget'), {
6 tenantId: "demo",
7 urlId: window.location.pathname
8 });
9</script>
10

Paste that in the editor window we opened:

Paste Code
Paste Code

We can now click Yes, Save on the bottom right of that window.

At the top of the page now click Save and then Preview.

Site Success Internal Link

That's it! You should now have live commenting added to your GoHighLevel site.

Success
Success

If you've run into a permission denied error, or would like to customize FastComments, read on.

Site Customization Internal Link

FastComments is designed to be customized to match your site.

If you'd like to add custom styling, or tweak configuration, Checkout our Customization Documentation to learn how.

In Conclusion

If for any reason the provided steps or code is not working, please let us know.