Add Comments to GoHighLevel Sites

Prvo ćemo urediti postavke našeg tečaja.

Da biste to učinili, otvorite tečaj i kliknite Edit Details.

Uredi detalje tečaja

Zatim trebamo otvoriti Advanced postavke:

Otvorite napredne postavke

Kod ćemo dodati u odjeljak Tracking Code. Idite u taj odjeljak i kliknite Footer Code.

Sada ćemo generirati vaš prilagođeni FastComments kod. Upotrijebite čarobnjak dolje za konfiguriranje kako želite da FastComments radi na vašoj GoHighLevel stranici:

Različite vrste okvira za komentare

Možete konfigurirati liniju TYPE = 'commenting' da promijenite proizvod koji se koristi (na primjer možete ga promijeniti u live za streaming chat ili collab za kolaboracijski chat).

Postavljanje okvira za komentare gdje želite

Recimo da želite staviti okvire za komentare na određene dijelove stranice, a ne na zadane lokacije. Promijenite ovu liniju:

const TARGET_ELEMENT_ID = ''; // postavi da koristi target div način

U:

const TARGET_ELEMENT_ID = 'fc_box'; // postavi da koristi target div način

Zatim u GHL uređivaču kliknite gumb "code" i dodajte mjesto gdje želite da komentari budu:

GoHighLevel FastComments Div

Copy

1

2<div

3 id="fc_box"

4 type="commenting"

5 urlid="custom-chat-id"

6></div>

7

Različita vrsta okvira za komentare po stranici

Recimo da želite da korisnici označavaju i raspravljaju dijelove teksta, ili koriste sučelje za streaming chat umjesto toga.

Prvo slijedite korake gore u "Postavljanje okvira za komentare gdje želite".

Obratite pažnju u tom malom isječku postoji type="commenting".

Ako želite omogućiti collab chat na primjer promijenite type u type="collab".

Prikaz samo na određenim stranicama

Ako ne postavite ne postavite TARGET_ELEMENT_ID, umjesto toga možete konfigurirati varijablu VALID_PATTERNS, za postavljanje na kojim URL rutama bi se komentari trebali prikazivati. Po zadanom, prikazivat će se na stranicama koje u URL-u sadrže /post.

Konfiguriranje Collab Chata

Možete reći collab chatu da doda kolaboracijsku funkcionalnost samo oko HTML-a unutar određenog područja, na primjer, recimo da dodate gore navedeni footer kod a zatim dodate ovaj div u sadržaj posta/stranice da omogućite collab chat:

Collab chat s određenim sadržajem

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

Tada će element paragraf unutar <div> imati omogućen collab chat, i ništa drugo na stranici. Ako ne stavite nikakav sadržaj u <div> tada će se omogućiti collab chat na cijelom tijelu posta.

Sada kad smo kopirali naš isječak, zalijepite ga u odjeljak Footer Code kako je prikazano:

Zalijepite kôd

To je to! Sada biste trebali imati omogućeno komentiranje uživo u svom GoHighLevel tečaju.

Uspjeh

Ako ste naišli na pogrešku 'permission denied', ili želite prilagoditi FastComments, nastavite čitati.

FastComments je dizajniran da se prilagodi vašoj stranici.

Ako želite dodati prilagođeni stil ili prilagoditi konfiguraciju, Pogledajte našu dokumentaciju o prilagodbama kako biste saznali kako.

Najprije ćemo otvoriti uređivač za stranicu našeg sajta na koju želimo dodati komentare.

Otvorite uređivač

Sada pronađite mjesto na stranici gdje želite dodati komentare. Pomaknite miša prema kraju tog područja. Pojavit će se ikona +:

Dodajte odjeljak

Ako kliknemo na nju, pita nas koliko stupaca treba imati novi odjeljak. Odabrat ćemo 1 COLUMN:

Dodajte stupac

Sada, ako pomaknete miša preko novog retka s 1 stupcem, imat ćete opciju dodavanja elementa. Kliknite na nju:

Dodajte element

Pomaknite se dolje i odaberite CUSTOM JS/HTML:

Odaberite CUSTOM JS/HTML

Sada odaberite naš novi element i kliknite Open Code Editor s lijeve strane:

Otvorite uređivač koda

Vrijeme je da kopirate naš kod. Kopirajte sljedeći kod:

Kod komentara za GoHighLevel stranicu

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 // Izmjene History API-ja za podršku SPA-a

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 // Funkcija koja osigurava da je skripta učitana

40 function ensureScriptLoaded() {

41 return new Promise((resolve) => {

42 // Provjeri postoji li već tag skripte

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 // Tag skripte postoji i već je učitan

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

66 resolve();

67 } else {

68 // Tag skripte postoji, ali još nije spreman

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

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

71 resolve();

72 });

73

74 // Alternativa u slučaju da se skripta već učitava

75 const checkInterval = setInterval(() => {

76 if (window.FastCommentsUI) {

77 clearInterval(checkInterval);

78 resolve();

79 }

80 }, 100);

81

82 // Odustajanje nakon 10 sekundi

83 setTimeout(() => {

84 clearInterval(checkInterval);

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

86 resolve();

87 }, 10000);

88 }

89 });

90 }

91

92 // Glavna funkcija za renderiranje

93 async function render() {

94 rendered = false;

95

96 // Osiguraj da je skripta učitana prije nastavka

97 await ensureScriptLoaded();

98

99 function tryNext() {

100 if (rendered) {

101 return;

102 }

103

104 const container = getContainer();

105

106 if (container) {

107 // Dodatna provjera dostupnosti 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 // Dohvati trenutni URL kao urlId

117 const newUrlId = window.location.pathname;

118

119 // Provjeri trebamo li ponovno renderirati (urlId se promijenio ili je prvo renderiranje)

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

121 currentUrlId = newUrlId;

122

123 // Uništi prethodnu instancu ako postoji

124 if (lastInstance) {

125 lastInstance.destroy();

126 // Očisti sadržaj kontejnera

127 container.innerHTML = '';

128 }

129

130 // Pripremi konfiguraciju

131 const config = {

132 tenantId: tenantId,

133 urlId: newUrlId

134 };

135

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

137

138 // Inicijaliziraj 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 // Prati je li kontejner uklonjen ili se URL promijeni

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 // Početno renderiranje kada je DOM spreman

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

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

177 } else {

178 render();

179 }

180

181 // Ponovno renderiranje pri promjeni lokacije (za SPA)

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

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

184 render();

185 });

186 })();

187</script>

188

Zalijepite to u prozor uređivača koji smo otvorili:

Zalijepite kod

Sada možemo kliknuti Yes, Save u donjem desnom kutu tog prozora.

Na vrhu stranice sada kliknite Save i zatim Preview.

To je to! Sada biste trebali imati omogućeno komentiranje uživo na vašoj GoHighLevel stranici.

Uspjeh

Ako ste naišli na pogrešku 'permission denied', ili želite prilagoditi FastComments, nastavite čitati.

FastComments je dizajniran tako da se može prilagoditi vašoj stranici.

Ako želite dodati prilagođeni stil ili podesiti konfiguraciju, Pogledajte našu dokumentaciju o prilagodbama i konfiguraciji da saznate kako.