FastComments.com

Add Live Discussions to Super.So Sites

FastComments Collab Chat podiže Super.so stranice na višu razinu dodavanjem živih inline rasprava. Korisnici mogu označavati i komentirati dijelove teksta suradnički, zajedno - uživo!

Ovdje ćemo pokriti korake instalacije koji bi trebali trajati samo nekoliko minuta.

Korak 1: Otvorite postavke Internal Link

Prvo trebamo otvoriti uređivač koda. Ako želite dodati FastComments na sve stranice, jednostavno odaberite Kod u donjem lijevom kutu:

Otvorite postavke koda
Otvorite postavke koda

Ako želite dodati FastComments na određenu stranicu, tada odaberite Edit Custom Code u postavkama te stranice.

Sada odaberimo karticu Body. Ovo je važno!. Instaliranje isječka koda u Head ne radi.

Odaberite Body
Odaberite Body

Sada ste spremni za korak 2.

Korak 2: Dodajte unaprijed pripremljeni kod Internal Link

U sljedećem koraku trebate kopirati unaprijed pripremljeni kod widgeta u nastavku.

Sve dok ste prijavljeni na FastComments.com donji isječak koda već će imati informacije o vašem računu. Kopirajmo ga:

Super.so FastComments Collab Chat Kod
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-collab-chat.min.js"></script>
3<script>
4 (function () {
5 let currentPathname = window.location.pathname;
6 let currentWidget = null;
7 let currentTopBar = null;
8
9 function load() {
10 if (!window.FastCommentsCollabChat) {
11 console.log('...no script, trying again...');
12 return setTimeout(load, 100);
13 }
14
15 const target = document.querySelector('.super-content');
16 if (!target || !target.innerHTML || target.innerHTML.length < 100) {
17 console.log('...no content, trying again...');
18 return setTimeout(load, 100);
19 }
20
21 // Očisti postojeću instancu
22 if (target.fastCommentsInstance) {
23 target.fastCommentsInstance.destroy();
24 }
25
26 // Ukloni postojeću gornju traku ako postoji
27 if (currentTopBar && currentTopBar.parentNode) {
28 currentTopBar.parentNode.removeChild(currentTopBar);
29 }
30
31 // Kreiraj novu gornju traku
32 const topBarTarget = document.createElement('div');
33 target.parentNode.insertBefore(topBarTarget, target);
34 topBarTarget.style.maxWidth = 'var(--layout-max-width)';
35 topBarTarget.style.margin = '0 auto';
36 currentTopBar = topBarTarget;
37 currentWidget = target;
38
39 // Inicijaliziraj FastComments Collab Chat
40 target.fastCommentsInstance = FastCommentsCollabChat(target, {
41 tenantId: "demo",
42 topBarTarget: topBarTarget
43 });
44
45 // Ažuriraj trenutni pathname
46 currentPathname = window.location.pathname;
47 }
48
49 // Početno učitavanje
50 load();
51
52 // Provjera promjena svakih 500 ms
53 setInterval(() => {
54 // Ponovno učitaj ako se pathname promijenio
55 if (window.location.pathname !== currentPathname) {
56 console.log('Pathname changed, reloading...');
57 load();
58 return;
59 }
60
61 // Ponovno učitaj ako je widget uklonjen
62 if (currentWidget && !currentWidget.parentNode) {
63 console.log('Widget removed, reloading...');
64 load();
65 return;
66 }
67
68 // Ponovno učitaj ako je kontejner ispraznjen
69 const target = document.querySelector('.super-content');
70 if (target && target.innerHTML.length < 100) {
71 console.log('Container emptied, reloading...');
72 load();
73 }
74 }, 500);
75 })();
76</script>
77

Sada zalijepite u područje Body:

Zalijepljeni kod
Zalijepljeni kod

Ako nakon lijepljenja koda vidite "this is a demo message":

  • Provjerite jeste li prijavljeni na svoj račun na fastcomments.com.
  • Provjerite jesu li omogućeni kolačići trećih strana.
  • Zatim osvježite ovu stranicu i ponovno kopirajte isječak koda. Trebao bi imati tenantId popunjen identifikatorom vašeg tenanta.

Pogledajte također: standardni widget komentara Internal Link

Dodavanje vidžeta za komentare uživo u vaše Super.so Notion članke

Uz Collab Chat, možete dodati tradicionalni vidžet za komentare na dno vaših Notion članaka. To omogućuje čitateljima da ostave komentare i vode rasprave o cijelom članku.

Koraci instalacije

Kopirajte sljedeći kod i zalijepite ga u odjeljak Body postavki vaše Super.so stranice:

Super.so FastComments vidžet za komentare uživo
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<script>
4 (function () {
5 let currentPathname = window.location.pathname;
6 let currentWidget = null;
7
8 function load() {
9 if (!window.FastCommentsUI) {
10 console.log('...no script, trying again...');
11 return setTimeout(load, 100);
12 }
13
14 const contentArea = document.querySelector('.notion-root');
15 if (!contentArea || !contentArea.innerHTML || contentArea.innerHTML.length < 100) {
16 console.log('...no content, trying again...');
17 return setTimeout(load, 100);
18 }
19
20 // Očisti postojeću instancu
21 if (contentArea.fastCommentsInstance) {
22 contentArea.fastCommentsInstance.destroy();
23 }
24
25 // Kreiraj novi ciljni element
26 const target = document.createElement('div');
27 contentArea.append(target);
28 currentWidget = target;
29
30 // Inicijaliziraj FastComments
31 contentArea.fastCommentsInstance = FastCommentsUI(target, {
32 tenantId: "demo",
33 urlId: window.location.pathname
34 });
35
36 // Ažuriraj trenutnu putanju
37 currentPathname = window.location.pathname;
38 }
39
40 // Početno učitavanje
41 load();
42
43 // Provjeri svakih 500 ms za promjene
44 setInterval(() => {
45 // Ponovno učitaj ako se putanja promijenila
46 if (window.location.pathname !== currentPathname) {
47 console.log('Pathname changed, reloading...');
48 load();
49 return;
50 }
51
52 // Ponovno učitaj ako je vidžet uklonjen
53 if (currentWidget && !currentWidget.parentNode) {
54 console.log('Widget removed, reloading...');
55 load();
56 return;
57 }
58
59 // Ponovno učitaj ako je kontejner ispraznjen
60 const contentArea = document.querySelector('.notion-root');
61 if (contentArea && contentArea.innerHTML.length < 100) {
62 console.log('Container emptied, reloading...');
63 load();
64 }
65 }, 500);
66 })();
67</script>
68

Važne napomene

  • Vidžet za komentare pojavit će se na dnu vaših Notion članaka
  • Svaka stranica dobiva vlastitu jedinstvenu nit komentara zasnovanu na putanji URL-a
  • Pobrinite se zamijeniti "demo" svojim stvarnim tenant ID-jem iz FastComments računa
  • Vidžet automatski podržava dinamičko učitavanje stranica Super.so-a

Prilagodba Internal Link


FastComments je dizajniran da se prilagodi vašoj stranici.

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