Add Comments to GoHighLevel Sites

Първо ще редактираме настройките за нашия курс.

За да направите това, отворете курса, и кликнете върху Edit Details.

Редактиране на подробности за курса

След това трябва да отворим настройките Advanced:

Отворете разширените настройки

Ще добавим нашия код в секцията Tracking Code. Отидете в тази секция и кликнете върху Footer Code.

Now we're going to generate your custom FastComments code. Use the wizard below to configure how you want FastComments to work on your GoHighLevel site:

Различни типове полета за коментари

You can configure the TYPE = 'commenting' line to switch the product used (for example you can change it to live for streaming chat or collab for collab chat).

Поставяне на полето за коментари там, където искате

Let's say you want to put comment boxes on specific parts of the page and not the default locations. Change this line:

const TARGET_ELEMENT_ID = ''; // задайте, за да използвате режим на целеви div

To:

const TARGET_ELEMENT_ID = 'fc_box'; // задайте, за да използвате режим на целеви div

Then in the GHL editor, click the "code" button and add where you want the comments to go:

FastComments Div за GoHighLevel

Copy

1

2<div

3 id="fc_box"

4 type="commenting"

5 urlid="custom-chat-id"

6></div>

7

Различен тип поле за коментари на страница

Let's say you want users to highlight and discuss pieces of text, or use the streaming chat UI instead.

First follow the steps above in "Putting The Comment Box Where You Want".

Note in that small snippet there's type="commenting".

If you want to enable collab chat for example change type to type="collab".

Показвайте само на конкретни страници

If you don't set don't set TARGET_ELEMENT_ID, you can instead configure the VALID_PATTERNS variable, to set which URL routes the comments should show. By default, it will show on pages that contain /post in the URL.

Конфигуриране на Collab Chat

You can tell collab chat to only add collaborative functionality around HTML inside a specific area, for example, let's say you add the footer code above and then add this div in the post/page content to enable collab chat:

Collab Chat със зададено съдържание

Copy

1

2<div

3 id="fc_box"

4 type="collab"

5 urlid="custom-chat-id"

6><p>This content will have collab chat!</p></div>

7

Then the paragraph element inside the <div> will have collab chat enabled, and nothing else on the page. If you don't put any content in the <div> then it will enable collab chat on the entire post body.

Сега, след като копирахме фрагмента си, поставете го в секцията Footer Code, както е показано:

Поставете кода

Това е всичко! Сега трябва да имате добавени коментари в реално време към вашия курс GoHighLevel.

Успех

Ако сте получили грешка 'permission denied', или искате да персонализирате FastComments, продължете да четете.

FastComments е проектиран да бъде персонализиран, за да съответства на вашия сайт.

Ако искате да добавите персонализирани стилове или да промените конфигурацията, Вижте нашата документация за персонализиране за да научите как.

Първо ще отворим редактора за страницата на нашия сайт, към която искаме да добавим коментари.

Отворете редактора

Сега намерете мястото на страницата, където искате да добавите коментари. Преместете мишката си към края на тази област. Ще се появи икона +:

Добавете секция

Ако щракнем върху нея, ще ни попита на колко колони да бъде новата секция. Ще изберем 1 COLUMN:

Добавете колона

Сега, ако преместите мишката си върху новия ред с 1 колона, ще имате опция да добавите елемент. Щракнете върху нея:

Добавете елемент

Превъртете надолу и изберете CUSTOM JS/HTML:

Изберете CUSTOM JS/HTML

Сега изберете нашия нов елемент и щракнете върху Open Code Editor отляво:

Отворете редактора на код

Време е да копирате нашия код. Копирайте следния код:

Код за коментари за GoHighLevel сайт

Copy

1

2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5 (function () {

6 const tenantId = 'demo';

7 const SCRIPT_ID = 'fastcomments-embed';

8 const WIDGET_ID = 'fastcomments-widget';

9

10 let lastInstance;

11 let currentUrlId;

12 let rendered = false;

13

14 // Модификации на History API за поддръжка на SPA

15 const oldPushState = history.pushState;

16 history.pushState = function pushState() {

17 const ret = oldPushState.apply(this, arguments);

18 window.dispatchEvent(new Event('pushstate'));

19 window.dispatchEvent(new Event('locationchange'));

20 return ret;

21 };

22

23 const oldReplaceState = history.replaceState;

24 history.replaceState = function replaceState() {

25 const ret = oldReplaceState.apply(this, arguments);

26 window.dispatchEvent(new Event('replacestate'));

27 window.dispatchEvent(new Event('locationchange'));

28 return ret;

29 };

30

31 window.addEventListener('popstate', () => {

32 window.dispatchEvent(new Event('locationchange'));

33 });

34

35 function getContainer() {

36 return document.getElementById(WIDGET_ID);

37 }

38

39 // Функция за гарантиране, че скриптът е зареден

40 function ensureScriptLoaded() {

41 return new Promise((resolve) => {

42 // Проверка дали елементът script вече съществува

43 let scriptTag = document.getElementById(SCRIPT_ID);

44

45 if (!scriptTag) {

46 console.log('FastComments: Script tag not found, adding dynamically...');

47 scriptTag = document.createElement('script');

48 scriptTag.id = SCRIPT_ID;

49 scriptTag.src = 'https://cdn.fastcomments.com/js/embed-v2.min.js';

50 scriptTag.async = true;

51

52 scriptTag.onload = () => {

53 console.log('FastComments: Script loaded successfully');

54 resolve();

55 };

56

57 scriptTag.onerror = () => {

58 console.error('FastComments: Failed to load script');

59 resolve(); // Resolve anyway to prevent hanging

60 };

61

62 document.head.appendChild(scriptTag);

63 } else if (window.FastCommentsUI) {

64 // Елементът script съществува и вече е зареден

65 console.log('FastComments: Script already loaded');

66 resolve();

67 } else {

68 // Елементът script съществува, но все още не е готов

69 console.log('FastComments: Waiting for script to initialize...');

70 scriptTag.addEventListener('load', () => {

71 resolve();

72 });

73

74 // Резервен механизъм в случай че скриптът вече се зарежда

75 const checkInterval = setInterval(() => {

76 if (window.FastCommentsUI) {

77 clearInterval(checkInterval);

78 resolve();

79 }

80 }, 100);

81

82 // Таймаут след 10 секунди

83 setTimeout(() => {

84 clearInterval(checkInterval);

85 console.warn('FastComments: Script load timeout');

86 resolve();

87 }, 10000);

88 }

89 });

90 }

91

92 // Основна функция за рендиране

93 async function render() {

94 rendered = false;

95

96 // Ensure script is loaded before proceeding

97 await ensureScriptLoaded();

98

99 function tryNext() {

100 if (rendered) {

101 return;

102 }

103

104 const container = getContainer();

105

106 if (container) {

107 // Допълнителна проверка дали FastCommentsUI е наличен

108 if (!window.FastCommentsUI) {

109 console.log('FastComments: not ready, waiting...');

110 setTimeout(tryNext, 300);

111 return;

112 }

113

114 console.log('FastComments: Target element found, initializing...');

115

116 // Вземане на текущия URL като urlId

117 const newUrlId = window.location.pathname;

118

119 // Проверка дали трябва да рендерираме отново (urlId се е променил или първо рендериране)

120 if (currentUrlId !== newUrlId || !lastInstance) {

121 currentUrlId = newUrlId;

122

123 // Унищожаване на предишния инстанс, ако съществува

124 if (lastInstance) {

125 lastInstance.destroy();

126 // Изчистване на съдържанието на контейнера

127 container.innerHTML = '';

128 }

129

130 // Подготовка на конфигурацията

131 const config = {

132 tenantId: tenantId,

133 urlId: newUrlId

134 };

135

136 console.log('FastComments: Using urlId:', newUrlId);

137

138 // Инициализация на FastComments

139 lastInstance = window.FastCommentsUI(container, config);

140 rendered = true;

141 } else {

142 console.log('FastComments: Already rendered with same urlId');

143 rendered = true;

144 }

145

146 // Наблюдение дали контейнерът е премахнат или URL се е променил

147 const interval = setInterval(function () {

148 const currentContainer = getContainer();

149 if (!currentContainer) {

150 console.log('FastComments: Container removed, will retry...');

151 rendered = false;

152 currentUrlId = null;

153 tryNext();

154 clearInterval(interval);

155 } else {

156 const newUrlId = window.location.pathname;

157 if (newUrlId !== currentUrlId) {

158 console.log('FastComments: URL changed, re-rendering...');

159 rendered = false;

160 tryNext();

161 clearInterval(interval);

162 }

163 }

164 }, 1000);

165 } else {

166 console.log('FastComments: Target element not found, waiting...');

167 setTimeout(tryNext, 300);

168 }

169 }

170

171 tryNext();

172 }

173

174 // Първоначално рендиране когато DOM е готов

175 if (document.readyState === 'loading') {

176 document.addEventListener('DOMContentLoaded', render);

177 } else {

178 render();

179 }

180

181 // Пререндиране при промяна на локацията (за SPA)

182 window.addEventListener('locationchange', function () {

183 console.log('FastComments: Location changed, updating...');

184 render();

185 });

186 })();

187</script>

188

Поставете това в прозореца на редактора, който отворихме:

Поставете кода

Сега можем да кликнем на Yes, Save в долния десен ъгъл на този прозорец.

В горната част на страницата сега кликнете на Save и след това на Preview.

Това е всичко! Трябва вече да имате добавена функция за коментиране в реално време на вашия сайт в GoHighLevel.

Успех

Ако сте получили грешка 'permission denied', или искате да персонализирате FastComments, продължете да четете.

FastComments е проектиран да бъде персонализиран, за да съответства на вашия сайт.

Ако искате да добавите персонализирано оформление или да настроите конфигурацията, Вижте нашата документация за персонализиране, за да научите как.