Comment Count Widgets | FastComments Docs

FastComments מספקת ווידג'טים קלים ועצמאיים לספירת תגובות שיכולים להציג את מספר התגובות לדפים או לפוסטים ספציפיים. ווידג'טים אלה נפרדים מהווידג'ט הראשי של ההערות ומיועדים לשימוש בכל מקום שבו ברצונך להציג ספירת תגובות ללא ממשק ההערות המלא.

ישנם שני סוגים של ווידג'טים לספירת תגובות זמינים:

ווידג'ט ספירת תגובות - להצגת ספירת התגובות של דף יחיד
ווידג'ט ספירת תגובות מרובה - להצגה יעילה של ספירות תגובות עבור מספר דפים באותו דף

מאמר זה מכסה את הווידג'טים של VanillaJS. גם הספריות שלנו ל-React/Angular/וכדומה כוללות ווידג'טים משלהן.

וידג'ט ספירת התגובות מעוצב להצגת מספר התגובות של דף יחיד. הוא קל משקל ומספק עדכונים בזמן אמת אם מוגדר.

התקנה בסיסית

Comment Count Widget Installation

Copy

Run

<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>
<div id="comment-count"></div>
<script>
    window.FastCommentsCommentCount(document.getElementById('comment-count'), {
        tenantId: 'demo'
    });
</script>

אפשרויות תצורה

הפונקציה FastCommentsCommentCount מקבלת את אפשרויות התצורה הבאות:

tenantId (נדרש): מזהה הדייר שלך ב-FastComments
urlId (אופציונלי): מזהה הדף. ברירת מחדל היא window.location.href אם לא צוין
numberOnly (אופציונלי): אם true, מציג רק את המספר ללא טקסט. ברירת מחדל היא false
isLive (אופציונלי): אם true, הספירה תתעדכן אוטומטית. ברירת מחדל היא false

דוגמאות מתקדמות

URL ID מותאם אישית

Comment Count with Custom URL ID

Copy

Run

<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>
<div id="comment-count-custom"></div>
<script>
    window.FastCommentsCommentCount(document.getElementById('comment-count-custom'), {
        tenantId: 'demo',
        urlId: 'my-custom-page-id'
    });
</script>

הצגת מספר בלבד

Comment Count Number Only

Copy

Run

<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>
<div id="comment-count-number"></div>
<script>
    window.FastCommentsCommentCount(document.getElementById('comment-count-number'), {
        tenantId: 'demo',
        numberOnly: true
    });
</script>

עדכונים חיים

Live Comment Count Updates

Copy

Run

<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>
<div id="comment-count-live"></div>
<script>
    window.FastCommentsCommentCount(document.getElementById('comment-count-live'), {
        tenantId: 'demo',
        isLive: true
    });
</script>

שיטות הוידג'ט

הוידג'ט מחזיר אובייקט עם השיטות הבאות:

destroy(): מסיר את הוידג'ט ומנקה את כל הטיימרים
update(config): מעדכן את הוידג'ט עם תצורה חדשה

דוגמת שימוש

Widget Methods Example

Copy

Run

<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>
<div id="comment-count-methods"></div>
<script>
    const widget = window.FastCommentsCommentCount(document.getElementById('comment-count-methods'), {
        tenantId: 'demo'
    });
    // Update the widget to show a different page's count
    setTimeout(() => {
        widget.update({
            tenantId: 'demo',
            urlId: 'different-page-id'
        });
    }, 5000);
    // Destroy the widget after 10 seconds
    setTimeout(() => {
        widget.destroy();
    }, 10000);
</script>

עיצוב

הוידג'ט מרנדר HTML פשוט עם ספירת התגובות ומגיע עם עיצוב מינימלי. אתה יכול להתאים אישית את המראה עם CSS:

Custom Styling

Copy

Run

<style>
    .comment-count-styled {
        background: #f0f0f0;
        padding: 5px 10px;
        border-radius: 15px;
        font-size: 14px;
        color: #666;
        display: inline-block;
    }
</style>
<script src="https://cdn.fastcomments.com/js/widget-comment-count.min.js"></script>
<div id="comment-count-styled" class="comment-count-styled"></div>
<script>
    window.FastCommentsCommentCount(document.getElementById('comment-count-styled'), {
        tenantId: 'demo'
    });
</script>

וידג'ט ספירת התגובות המרובות מעוצב להצגה יעילה של ספירות תגובות עבור דפים מרובים באותו דף. במקום לבצע קריאות API בודדות לכל ספירת תגובות, וידג'ט זה מקבץ בקשות לביצועים אופטימליים.

התקנה בסיסית

Bulk Comment Count Widget Installation

Copy

Run

<script src="https://cdn.fastcomments.com/js/embed-widget-comment-count-bulk.min.js"></script>
<!-- Multiple elements with comment counts -->
<div class="fast-comments-count" data-fast-comments-url-id="page-1"></div>
<div class="fast-comments-count" data-fast-comments-url-id="page-2"></div>
<div class="fast-comments-count" data-fast-comments-url-id="page-3"></div>
<script>
    window.FastCommentsBulkCountConfig = {
        tenantId: 'demo'
    };
</script>

איך זה עובד

הוידג'ט המרובה עובד על ידי:

סריקת הדף לאיתור אלמנטים עם המחלקה fast-comments-count
קריאת התכונה data-fast-comments-url-id מכל אלמנט
קיבוץ בקשות API לשליפת ספירות תגובות מרובות ביעילות
עדכון כל אלמנט עם ספירת התגובות המתאימה

אפשרויות תצורה

הפונקציה FastCommentsCommentCountBulk מקבלת את אפשרויות התצורה הבאות:

tenantId (נדרש): מזהה הדייר שלך ב-FastComments
apiHost (אופציונלי): מארח API מותאם אישית אם אתה משתמש במופע מתארח עצמאית

דוגמה מהעולם האמיתי

הנה דוגמה מעשית המראה כיצד תוכל להשתמש בוידג'ט המרובה ברשימת פוסטים בבלוג:

Blog Post Listing with Comment Counts

Copy

Run

<script src="https://cdn.fastcomments.com/js/embed-widget-comment-count-bulk.min.js"></script>
<style>
    .blog-post {
        border: 1px solid #ddd;
        margin: 10px 0;
        padding: 15px;
        border-radius: 5px;
    }
    .post-meta {
        color: #666;
        font-size: 14px;
        margin-top: 10px;
    }
    .comment-count {
        background: #e7f3ff;
        padding: 2px 8px;
        border-radius: 12px;
        font-size: 12px;
        display: inline-block;
    }
</style>
<div class="blog-post">
    <h3>How to Install FastComments</h3>
    <p>Learn how to add FastComments to your website in just a few minutes...</p>
    <div class="post-meta">
        Published: March 15, 2024 |
        <span class="fast-comments-count comment-count" data-fast-comments-url-id="how-to-install-fastcomments"></span>
    </div>
</div>
<div class="blog-post">
    <h3>Advanced FastComments Configuration</h3>
    <p>Dive deep into the advanced configuration options for FastComments...</p>
    <div class="post-meta">
        Published: March 10, 2024 |
        <span class="fast-comments-count comment-count" data-fast-comments-url-id="advanced-fastcomments-config"></span>
    </div>
</div>
<div class="blog-post">
    <h3>FastComments vs Other Solutions</h3>
    <p>See how FastComments compares to other commenting solutions...</p>
    <div class="post-meta">
        Published: March 5, 2024 |
        <span class="fast-comments-count comment-count" data-fast-comments-url-id="fastcomments-comparison"></span>
    </div>
</div>
<script>
    window.FastCommentsBulkCountConfig = {
        tenantId: 'demo'
    };
</script>

שיקולי ביצועים

הוידג'ט המרובה מייעל אוטומטית את הביצועים על ידי:

קיבוץ בקשות: ספירות תגובות מרובות נשלפות בקריאת API יחידה
מגבלות גודל בקשה: בקשות מתפצלות אוטומטית אם רשימת ה-URL הופכת גדולה מדי (מעל 1,000 תווים)
ביטול כפילויות: אלמנטים מרובים עם אותו data-fast-comments-url-id חולקים את אותה ספירה

אלמנטים מרובים עם אותו URL ID

אתה יכול לקבל אלמנטים מרובים בדף עם אותו data-fast-comments-url-id. כולם יעודכנו עם אותה ספירה:

Multiple Elements Same URL ID

Copy

Run

<script src="https://cdn.fastcomments.com/js/embed-widget-comment-count-bulk.min.js"></script>
<style>
    .count-example {
        margin: 10px 0;
        padding: 10px;
        background: #f9f9f9;
        border-radius: 5px;
    }
</style>
<div class="count-example">
    Header Count: <span class="fast-comments-count" data-fast-comments-url-id="shared-article"></span>
</div>
<div class="count-example">
    Sidebar Count: <span class="fast-comments-count" data-fast-comments-url-id="shared-article"></span>
</div>
<div class="count-example">
    Footer Count: <span class="fast-comments-count" data-fast-comments-url-id="shared-article"></span>
</div>
<script>
    window.FastCommentsBulkCountConfig = {
        tenantId: 'demo'
    };
</script>

לוקליזציה

הוידג'ט המרובה מעצב אוטומטית ספירות תגובות בהתבסס על הגדרות השפה שלך ב-FastComments. הוא מספק טקסט מתאים עבור:

אפס תגובות
תגובה אחת
תגובות מרובות

מתי להשתמש בוידג'ט מרובה לעומת וידג'ט בודד

השתמש בוידג'ט המרובה כאשר:

יש לך ספירות תגובות מרובות באותו דף
אתה מציג רשימת פוסטים/מאמרים עם ספירות תגובות
הביצועים חשובים (מפחית קריאות API)

השתמש בוידג'ט הבודד כאשר:

אתה צריך רק ספירת תגובות אחת בדף
אתה צריך עדכונים חיים (הוידג'ט הבודד תומך בעדכונים בזמן אמת)
אתה רוצה יותר שליטה על התנהגות הוידג'ט הבודד

ממשקי API לספירת תגובות

ישנן מספר נקודות קצה לקבלת הספירות, בהתאם למה שאתה רוצה ואם אתה רוצה לקבל אותן מדפדפן, שרת או באמצעות ה-API SDK.

ספירות תגובות ציבוריות

אתה יכול לקבל את ספירות התגובות הציבוריות באמצעות הווידג'טים למעלה או באמצעות ה-APIs שהם משתמשים בהם. APIs אלה נשארו ללא שינוי מאז 2019 ולעולם לא ישתנו.

Single Count Endpoint

Copy

https://fastcomments.com/widgets/comment-count/:tenantId?urlId=page_id_or_url

זה יחזיר מבנה כמו:

Single Count Endpoint Response

Copy

{"count":0,"postfix":"comments"}

המאפיין postfix תמיד כלול.

Bulk Count Endpoint

Copy

https://fastcomments.com/widgets/comment-count-bulk/:tenantId?urlIds=x,y,z

זה יחזיר מבנה כמו:

Bulk Count Endpoint Response

Copy

{
    "status": "success",
    "translations": {
        "t174": "0 Comments",
        "t175": "1 Comment",
        "t176": "[count] Comments"
    },
    "counts": {
        "x": 10
    }
}

האובייקט counts מאוכלס רק עבור דפים שיש להם ספירות. המפה translations תמיד נוכחת מכיוון שהיא משמשת לווידג'ט.

התנהגות נקודות קצה ציבוריות / מטמון

לנקודות הקצה הציבוריות יש מנגנון מטמון של 60 שניות לטיפול בעומסי תנועה. באופן פנימי זהו מטמון LRU לכל תהליכון בזיכרון בשרת, כך שאתה עשוי לראות שהספירות משתנות מעט (עולות ואז יורדות זמנית) כאשר אנשים משאירים הרבה תגובות.

נקודות הקצה הציבוריות תמיד מחזירות את ספירת התגובות הכוללת, לא את ספירת תגובות השורש.

APIs בצד השרת / SDK

הדרך לקבל תגובות מהשרת שלך היא לקרוא ל-Pages API ולקבל את אובייקט הדף, שמכיל את ספירת התגובות הכוללת וספירת תגובות השורש. אנו מספקים SDKs שמאפשרים לך לקרוא ל-API זה מבלי לבנות את בקשת ה-API ידנית ומספקים ערכי החזרה מוקלדים.

ווידג'טים של FastComments לספירת תגובות מספקים דרך פשוטה ויעילה להצגת ספירות תגובות ברחבי האתר שלך.

אנו מקווים שמצאתם את התיעוד הזה מועיל.

התקנה

ממשקי API לספירת תגובות

התקנת ווידג'ט ספירת תגובות

התקנה בסיסית

אפשרויות תצורה

דוגמאות מתקדמות

URL ID מותאם אישית

הצגת מספר בלבד

עדכונים חיים

שיטות הוידג'ט

דוגמת שימוש

עיצוב

התקנת אצווה של ווידג'טים לספירת תגובות

התקנה בסיסית

איך זה עובד

אפשרויות תצורה

דוגמה מהעולם האמיתי

שיקולי ביצועים

אלמנטים מרובים עם אותו URL ID

לוקליזציה

מתי להשתמש בוידג'ט מרובה לעומת וידג'ט בודד

ממשקי API לספירת תגובות

ספירות תגובות ציבוריות

התנהגות נקודות קצה ציבוריות / מטמון

APIs בצד השרת / SDK

שפה 🇮🇱 עברית

התקנה

ממשקי API לספירת תגובות

התקנת ווידג'ט ספירת תגובות

התקנה בסיסית

אפשרויות תצורה

דוגמאות מתקדמות

URL ID מותאם אישית

הצגת מספר בלבד

עדכונים חיים

שיטות הוידג'ט

דוגמת שימוש

עיצוב

התקנת אצווה של ווידג'טים לספירת תגובות

התקנה בסיסית

איך זה עובד

אפשרויות תצורה

דוגמה מהעולם האמיתי

שיקולי ביצועים

אלמנטים מרובים עם אותו URL ID

לוקליזציה

מתי להשתמש בוידג'ט מרובה לעומת וידג'ט בודד

ממשקי API לספירת תגובות

ספירות תגובות ציבוריות

התנהגות נקודות קצה ציבוריות / מטמון

APIs בצד השרת / SDK