Add Comments to GoHighLevel Sites

Najprej bomo uredili nastavitve za naš tečaj.

Za to odprite tečaj in kliknite Edit Details.

Uredi podrobnosti tečaja

Nato moramo odpreti nastavitve Advanced:

Odprite napredne nastavitve

Našo kodo bomo dodali v razdelek Tracking Code. Pojdite v ta razdelek in kliknite Footer Code.

Zdaj bomo ustvarili vašo prilagojeno kodo FastComments. Uporabite spodnji čarovnik, da konfigurirate, kako želite, da FastComments deluje na vašem GoHighLevel spletnem mestu:

Različne vrste polj za komentarje

Lahko konfigurirate vrstico TYPE = 'commenting', da preklopite uporabljeni izdelek (na primer lahko spremenite v live za pretočni klepet ali v collab za collab klepet).

Postavitev polja za komentarje tam, kjer želite

Recimo, da želite polja za komentarje postaviti v določene dele strani in ne na privzeta mesta. Spremenite to vrstico:

const TARGET_ELEMENT_ID = ''; // nastavite za uporabo načina ciljnega div elementa

V:

const TARGET_ELEMENT_ID = 'fc_box'; // nastavite za uporabo načina ciljnega div elementa

Nato v urejevalniku GHL kliknite gumb "code" in dodajte mesto, kamor želite postaviti komentarje:

GoHighLevel FastComments div

Copy

1

2<div

3 id="fc_box"

4 type="commenting"

5 urlid="custom-chat-id"

6></div>

7

Različna vrsta polja za komentarje na posamezni strani

Recimo, da želite, da uporabniki označujejo in razpravljajo o delih besedila ali namesto tega uporabljajo vmesnik pretočnega klepeta.

Najprej sledite korakom zgoraj v razdelku "Postavitev polja za komentarje tam, kjer želite".

Upoštevajte, da je v tem kratkem odlomku type="commenting".

Če želite na primer omogočiti collab klepet, spremenite type v type="collab".

Prikaži samo na določenih straneh

Če ne nastavite TARGET_ELEMENT_ID, lahko namesto tega nastavite spremenljivko VALID_PATTERNS, da določite, na katerih URL poteh se bodo komentarji prikazovali. Privzeto se prikažejo na straneh, ki v URL vsebujejo /post.

Konfiguriranje collab klepeta

Lahko poveste collab klepetu, naj doda sodelovalno funkcionalnost le okoli HTML v določenem območju, na primer, recimo, da dodate zgornjo kodo v nogo in nato v vsebino objave/strani vstavite ta div, da omogočite collab klepet:

Collab klepet z določenimi vsebinami

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

Nato bo element

znotraj <div> imel omogočen collab klepet, in nič drugega na strani. Če v <div> ne vstavite nobene vsebine, bo collab klepet omogočen za celotno telo objave.

Zdaj, ko smo kopirali naš izsek, ga prilepite v razdelek Footer Code, kot je prikazano:

Prilepite kodo

To je to! Zdaj bi morali imeti v vašem GoHighLevel tečaju omogočeno komentiranje v živo.

Uspešno

Če ste naleteli na napako 'permission denied' ali želite prilagoditi FastComments, nadaljujte z branjem.

FastComments je zasnovan tako, da ga lahko prilagodite vaši spletni strani.

Če želite dodati lastno oblikovanje ali prilagoditi konfiguracijo, Oglejte si našo dokumentacijo o prilagajanju in konfiguraciji, da izveste, kako.

Najprej bomo odprli urejevalnik strani na našem spletnem mestu, kamor želimo dodati komentarje.

Odpri urejevalnik

Zdaj poiščite mesto na strani, kamor želite dodati komentarje. Pomaknite miško proti koncu tega območja. Pojavila se bo ikona +:

Dodaj razdelek

Če to kliknemo, nas vpraša, koliko stolpcev naj ima nov razdelek. Izbrali bomo 1 COLUMN:

Dodaj stolpec

Če premaknete miško nad novo vrstico z 1 stolpcem, se prikaže možnost za dodajanje elementa. Kliknite nanjo:

Dodaj element

Pomaknite se navzdol in izberite CUSTOM JS/HTML:

Izberite CUSTOM JS/HTML

Zdaj izberite naš novi element in na levi kliknite Open Code Editor:

Odpri urejevalnik kode

Čas je, da kopiramo našo kodo. Kopirajte naslednjo kodo:

Koda komentarjev za GoHighLevel spletno mesto

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 // Spremembe History API za podporo 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 // Funkcija za zagotovitev nalaganja skripte

40 function ensureScriptLoaded() {

41 return new Promise((resolve) => {

42 // Preveri, ali oznaka skripte že obstaja

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 // Oznaka skripte obstaja in je že naložena

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

66 resolve();

67 } else {

68 // Oznaka skripte obstaja, vendar še ni pripravljena

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

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

71 resolve();

72 });

73

74 // Rezervni mehanizem, če se skripta že nalaga

75 const checkInterval = setInterval(() => {

76 if (window.FastCommentsUI) {

77 clearInterval(checkInterval);

78 resolve();

79 }

80 }, 100);

81

82 // Potek časa po 10 sekundah

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 // Zagotovi, da je skripta naložena pred nadaljevanjem

97 await ensureScriptLoaded();

98

99 function tryNext() {

100 if (rendered) {

101 return;

102 }

103

104 const container = getContainer();

105

106 if (container) {

107 // Dodatna preverba, ali je FastCommentsUI na voljo

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 // Pridobi trenutni URL kot urlId

117 const newUrlId = window.location.pathname;

118

119 // Preveri, ali je treba ponovno renderirati (urlId se je spremenil ali je prvi prikaz)

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

121 currentUrlId = newUrlId;

122

123 // Uniči prejšnjo instanco, če obstaja

124 if (lastInstance) {

125 lastInstance.destroy();

126 // Počisti vsebino kontejnerja

127 container.innerHTML = '';

128 }

129

130 // Pripravi konfiguracijo

131 const config = {

132 tenantId: tenantId,

133 urlId: newUrlId

134 };

135

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

137

138 // Inicializiraj 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 // Spremljaj, ali je kontejner odstranjen ali se URL spremeni

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 // Začetno upodobitev, ko je DOM pripravljen

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

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

177 } else {

178 render();

179 }

180

181 // Ponovno renderiranje ob spremembi lokacije (za SPA)

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

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

184 render();

185 });

186 })();

187</script>

188

Prilepite to v urejevalno okno, ki smo ga odprli:

Prilepite kodo

Zdaj lahko kliknemo Yes, Save v spodnjem desnem kotu tega okna.

Na vrhu strani zdaj kliknite Save, nato Preview.

To je vse! Zdaj bi morali imeti na svojem spletnem mestu GoHighLevel omogočeno komentiranje v živo.

Uspešno

Če ste naleteli na napako 'permission denied', ali želite prilagoditi FastComments, nadaljujte z branjem.

FastComments je zasnovan tako, da ga lahko prilagodite svojemu spletnemu mestu.

Če želite dodati lastno oblikovanje ali prilagoditi konfiguracijo, Oglejte si našo dokumentacijo o prilagoditvah, da se naučite, kako.