Il Widget per il Conteggio dei Commenti e progettato per visualizzare il conteggio dei commenti di una singola pagina. E leggero e fornisce aggiornamenti in tempo reale se configurato.

Installazione Base

Comment Count Widget Installation

Copy Run

1

2<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>

3<div id="comment-count"></div>

4<script>

5 window.FastCommentsCommentCount(document.getElementById('comment-count'), {

6 tenantId: 'demo'

7 });

8</script>

9

Opzioni di Configurazione

La funzione FastCommentsCommentCount accetta le seguenti opzioni di configurazione:

• tenantId (obbligatorio): Il tuo ID tenant FastComments
• urlId (opzionale): L'identificatore della pagina. Default e window.location.href se non specificato
• numberOnly (opzionale): Se true, visualizza solo il numero senza testo. Default e false
• isLive (opzionale): Se true, il conteggio si aggiornera automaticamente. Default e false

Esempi Avanzati

URL ID Personalizzato

Comment Count with Custom URL ID

Copy Run

1

2<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>

3<div id="comment-count-custom"></div>

4<script>

5 window.FastCommentsCommentCount(document.getElementById('comment-count-custom'), {

6 tenantId: 'demo',

7 urlId: 'my-custom-page-id'

8 });

9</script>

10

Visualizzazione Solo Numero

Comment Count Number Only

Copy Run

1

2<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>

3<div id="comment-count-number"></div>

4<script>

5 window.FastCommentsCommentCount(document.getElementById('comment-count-number'), {

6 tenantId: 'demo',

7 numberOnly: true

8 });

9</script>

10

Aggiornamenti in Tempo Reale

Live Comment Count Updates

Copy Run

1

2<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>

3<div id="comment-count-live"></div>

4<script>

5 window.FastCommentsCommentCount(document.getElementById('comment-count-live'), {

6 tenantId: 'demo',

7 isLive: true

8 });

9</script>

10

Metodi del Widget

Il widget restituisce un oggetto con i seguenti metodi:

• destroy(): Rimuove il widget e pulisce tutti i timer
• update(config): Aggiorna il widget con una nuova configurazione

Esempio di Utilizzo

Widget Methods Example

Copy Run

1

2<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>

3<div id="comment-count-methods"></div>

4<script>

5 const widget = window.FastCommentsCommentCount(document.getElementById('comment-count-methods'), {

6 tenantId: 'demo'

7 });

8

9 // Update the widget to show a different page's count

10 setTimeout(() => {

11 widget.update({

12 tenantId: 'demo',

13 urlId: 'different-page-id'

14 });

15 }, 5000);

16

17 // Destroy the widget after 10 seconds

18 setTimeout(() => {

19 widget.destroy();

20 }, 10000);

21</script>

22

Stile

Il widget renderizza HTML semplice con il conteggio dei commenti e viene fornito con uno stile minimo. Puoi personalizzare l'aspetto con CSS:

Custom Styling

Copy Run

1

2<style>

3 .comment-count-styled {

4 background: #f0f0f0;

5 padding: 5px 10px;

6 border-radius: 15px;

7 font-size: 14px;

8 color: #666;

9 display: inline-block;

10 }

11</style>

12<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>

13<div id="comment-count-styled" class="comment-count-styled"></div>

14<script>

15 window.FastCommentsCommentCount(document.getElementById('comment-count-styled'), {

16 tenantId: 'demo'

17 });

18</script>

19

Il Widget per il Conteggio di Commenti in Blocco e progettato per visualizzare in modo efficiente i conteggi dei commenti per piu pagine sulla stessa pagina. Invece di effettuare chiamate API individuali per ogni conteggio di commenti, questo widget raggruppa le richieste per prestazioni ottimali.

Installazione Base

Bulk Comment Count Widget Installation

Copy Run

1

2<script src="https://cdn.fastcomments.com/js/embed-widget-comment-count-bulk.min.js"></script>

3

4<!-- Multiple elements with comment counts -->

5<div class="fast-comments-count" data-fast-comments-url-id="page-1"></div>

6<div class="fast-comments-count" data-fast-comments-url-id="page-2"></div>

7<div class="fast-comments-count" data-fast-comments-url-id="page-3"></div>

8

9<script>

10 window.FastCommentsBulkCountConfig = {

11 tenantId: 'demo'

12 };

13</script>

14

Come Funziona

Il widget in blocco funziona:

1. Scansionando la pagina per elementi con la classe fast-comments-count
2. Leggendo l'attributo data-fast-comments-url-id da ogni elemento
3. Raggruppando le richieste API per recuperare piu conteggi di commenti in modo efficiente
4. Aggiornando ogni elemento con il conteggio dei commenti appropriato

Opzioni di Configurazione

La funzione FastCommentsCommentCountBulk accetta le seguenti opzioni di configurazione:

• tenantId (obbligatorio): Il tuo ID tenant FastComments
• apiHost (opzionale): Host API personalizzato se stai usando un'istanza self-hosted

Esempio dal Mondo Reale

Ecco un esempio pratico che mostra come potresti usare il widget in blocco in un elenco di post del blog:

Blog Post Listing with Comment Counts

Copy Run

1

2<script src="https://cdn.fastcomments.com/js/embed-widget-comment-count-bulk.min.js"></script>

3

4<style>

5 .blog-post {

6 border: 1px solid #ddd;

7 margin: 10px 0;

8 padding: 15px;

9 border-radius: 5px;

10 }

11 .post-meta {

12 color: #666;

13 font-size: 14px;

14 margin-top: 10px;

15 }

16 .comment-count {

17 background: #e7f3ff;

18 padding: 2px 8px;

19 border-radius: 12px;

20 font-size: 12px;

21 display: inline-block;

22 }

23</style>

24

25<div class="blog-post">

26 <h3>How to Install FastComments</h3>

27 <p>Learn how to add FastComments to your website in just a few minutes...</p>

28 <div class="post-meta">

29 Published: March 15, 2024 |

30 <span class="fast-comments-count comment-count" data-fast-comments-url-id="how-to-install-fastcomments"></span>

31 </div>

32</div>

33

34<div class="blog-post">

35 <h3>Advanced FastComments Configuration</h3>

36 <p>Dive deep into the advanced configuration options for FastComments...</p>

37 <div class="post-meta">

38 Published: March 10, 2024 |

39 <span class="fast-comments-count comment-count" data-fast-comments-url-id="advanced-fastcomments-config"></span>

40 </div>

41</div>

42

43<div class="blog-post">

44 <h3>FastComments vs Other Solutions</h3>

45 <p>See how FastComments compares to other commenting solutions...</p>

46 <div class="post-meta">

47 Published: March 5, 2024 |

48 <span class="fast-comments-count comment-count" data-fast-comments-url-id="fastcomments-comparison"></span>

49 </div>

50</div>

51

52<script>

53 window.FastCommentsBulkCountConfig = {

54 tenantId: 'demo'

55 };

56</script>

57

Considerazioni sulle Prestazioni

Il widget in blocco ottimizza automaticamente le prestazioni tramite:

• Raggruppamento delle richieste: Piu conteggi di commenti vengono recuperati in una singola chiamata API
• Limiti di dimensione delle richieste: Le richieste vengono automaticamente suddivise se l'elenco degli URL diventa troppo grande (oltre 1.000 caratteri)
• Deduplicazione: Piu elementi con lo stesso data-fast-comments-url-id condividono lo stesso conteggio

Piu Elementi con lo Stesso URL ID

Puoi avere piu elementi sulla pagina con lo stesso data-fast-comments-url-id. Saranno tutti aggiornati con lo stesso conteggio:

Multiple Elements Same URL ID

Copy Run

1

2<script src="https://cdn.fastcomments.com/js/embed-widget-comment-count-bulk.min.js"></script>

3

4<style>

5 .count-example {

6 margin: 10px 0;

7 padding: 10px;

8 background: #f9f9f9;

9 border-radius: 5px;

10 }

11</style>

12

13<div class="count-example">

14 Header Count: <span class="fast-comments-count" data-fast-comments-url-id="shared-article"></span>

15</div>

16

17<div class="count-example">

18 Sidebar Count: <span class="fast-comments-count" data-fast-comments-url-id="shared-article"></span>

19</div>

20

21<div class="count-example">

22 Footer Count: <span class="fast-comments-count" data-fast-comments-url-id="shared-article"></span>

23</div>

24

25<script>

26 window.FastCommentsBulkCountConfig = {

27 tenantId: 'demo'

28 };

29</script>

30

Localizzazione

Il widget in blocco formatta automaticamente i conteggi dei commenti in base alle impostazioni della lingua di FastComments. Fornisce testo appropriato per:

• Zero commenti
• Un commento
• Piu commenti

Quando Usare il Widget in Blocco vs Singolo

Usa il Widget in Blocco quando:

• Hai piu conteggi di commenti sulla stessa pagina
• Stai visualizzando un elenco di post/articoli con conteggi di commenti
• Le prestazioni sono importanti (riduce le chiamate API)

Usa il Widget Singolo quando:

• Hai bisogno di un solo conteggio di commenti sulla pagina
• Hai bisogno di aggiornamenti in tempo reale (il widget singolo supporta aggiornamenti in tempo reale)
• Vuoi piu controllo sul comportamento del singolo widget