FastComments.com

कमेंट काउंट विजेट

FastComments हल्के, स्वतंत्र कमेंट काउंट विजेट प्रदान करता है जो विशिष्ट पेजों या पोस्टों के लिए कमेंट की संख्या दिखा सकते हैं। ये विजेट मुख्य कमेंटिंग विजेट से अलग हैं और उन जगहों पर उपयोग के लिए बनाए गए हैं जहाँ आप पूरी कमेंटिंग इंटरफ़ेस के बिना कमेंट काउंट दिखाना चाहते हैं।

दो प्रकार के कमेंट काउंट विजेट उपलब्ध हैं:

  1. Comment Count Widget - किसी एक पेज का कमेंट काउंट दिखाने के लिए
  2. Bulk Comment Count Widget - एक ही पेज पर कई पेजों के कमेंट काउंट कुशलतापूर्वक दिखाने के लिए

यह लेख VanillaJS विजेट को कवर करता है। हमारी React/Angular/आदि लाइब्रेरीज़ में भी उनके अपने विजेट हैं।

कमेंट काउंट विजेट इंस्टॉलेशन Internal Link

कमेंट काउंट विजेट किसी एक पेज की कमेंट संख्या दिखाने के लिए बनाया गया है। यह हल्का है और कॉन्फ़िगर किए जाने पर रीयल-टाइम अपडेट प्रदान करता है।

बेसिक इंस्टॉलेशन

कमेंट काउंट विजेट इंस्टॉलेशन
Copy CopyRun External Link
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

कॉन्फ़िगरेशन विकल्प

FastCommentsCommentCount फ़ंक्शन निम्नलिखित कॉन्फ़िगरेशन विकल्प स्वीकार करता है:

  • tenantId (आवश्यक): आपकी FastComments टेनेंट ID
  • urlId (वैकल्पिक): पेज पहचानकर्ता। यदि निर्दिष्ट नहीं किया गया है तो डिफ़ॉल्ट रूप से window.location.href होता है
  • numberOnly (वैकल्पिक): यदि true है, तो केवल संख्या बिना किसी टेक्स्ट के रेंडर होती है। डिफ़ॉल्ट false है
  • isLive (वैकल्पिक): यदि true है, तो संख्या स्वचालित रूप से अपडेट होगी। डिफ़ॉल्ट false है

उन्नत उदाहरण

कस्टम URL ID

कस्टम URL ID के साथ कमेंट काउंट
Copy CopyRun External Link
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

केवल संख्या डिस्प्ले

कमेंट काउंट केवल संख्या
Copy CopyRun External Link
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

लाइव अपडेट

लाइव कमेंट काउंट अपडेट
Copy CopyRun External Link
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

विजेट मेथड्स

विजेट निम्नलिखित मेथड्स के साथ एक ऑब्जेक्ट लौटाता है:

  • destroy(): विजेट को हटाता है और सभी टाइमर साफ़ करता है
  • update(config): नई कॉन्फ़िगरेशन के साथ विजेट को अपडेट करता है

उपयोग का उदाहरण

विजेट मेथड्स उदाहरण
Copy CopyRun External Link
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 // किसी दूसरे पेज की संख्या दिखाने के लिए विजेट को अपडेट करें
10 setTimeout(() => {
11 widget.update({
12 tenantId: 'demo',
13 urlId: 'different-page-id'
14 });
15 }, 5000);
16
17 // 10 सेकंड बाद विजेट को नष्ट करें
18 setTimeout(() => {
19 widget.destroy();
20 }, 10000);
21</script>
22

स्टाइलिंग

विजेट कमेंट संख्या के साथ सादा HTML रेंडर करता है और इसमें न्यूनतम स्टाइलिंग शामिल है। आप CSS के साथ उपस्थिति को अनुकूलित कर सकते हैं:

कस्टम स्टाइलिंग
Copy CopyRun External Link
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

बल्क कमेंट काउंट विजेट इंस्टॉलेशन Internal Link

बल्क कमेंट काउंट विजेट एक ही पेज पर कई पेजों के लिए कमेंट काउंट कुशलतापूर्वक प्रदर्शित करने के लिए डिज़ाइन किया गया है। प्रत्येक कमेंट काउंट के लिए अलग-अलग API कॉल करने के बजाय, यह विजेट बेहतर प्रदर्शन के लिए अनुरोधों को बैच में भेजता है।

बेसिक इंस्टॉलेशन

बल्क कमेंट काउंट विजेट इंस्टॉलेशन
Copy CopyRun External Link
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

यह कैसे काम करता है

बल्क विजेट इस तरह काम करता है:

  1. पेज पर fast-comments-count क्लास वाले एलिमेंट्स को स्कैन करता है
  2. प्रत्येक एलिमेंट से data-fast-comments-url-id एट्रिब्यूट पढ़ता है
  3. कई कमेंट काउंट कुशलतापूर्वक प्राप्त करने के लिए API अनुरोधों को बैच में भेजता है
  4. प्रत्येक एलिमेंट को उपयुक्त कमेंट काउंट के साथ अपडेट करता है

कॉन्फ़िगरेशन विकल्प

FastCommentsCommentCountBulk फ़ंक्शन निम्नलिखित कॉन्फ़िगरेशन विकल्प स्वीकार करता है:

  • tenantId (आवश्यक): आपकी FastComments टेनेंट ID
  • apiHost (वैकल्पिक): कस्टम API होस्ट, यदि आप सेल्फ-होस्टेड इंस्टेंस का उपयोग कर रहे हैं

वास्तविक दुनिया का उदाहरण

यहाँ एक व्यावहारिक उदाहरण है जो दिखाता है कि आप ब्लॉग पोस्ट लिस्टिंग में बल्क विजेट का उपयोग कैसे कर सकते हैं:

कमेंट काउंट के साथ ब्लॉग पोस्ट लिस्टिंग
Copy CopyRun External Link
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

प्रदर्शन संबंधी विचार

बल्क विजेट स्वचालित रूप से प्रदर्शन को अनुकूलित करता है:

  • अनुरोधों का बैचिंग: कई कमेंट काउंट एक ही API कॉल में प्राप्त किए जाते हैं
  • अनुरोध आकार सीमाएँ: यदि URL सूची बहुत बड़ी हो जाती है (1,000 से अधिक वर्ण) तो अनुरोध स्वचालित रूप से विभाजित हो जाते हैं
  • डीप्लिकेशन: समान data-fast-comments-url-id वाले कई एलिमेंट्स एक ही काउंट साझा करते हैं

समान URL ID वाले कई एलिमेंट्स

आप पेज पर समान data-fast-comments-url-id वाले कई एलिमेंट्स रख सकते हैं। उन सभी को एक ही काउंट के साथ अपडेट किया जाएगा:

समान URL ID वाले कई एलिमेंट्स
Copy CopyRun External Link
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

स्थानीयकरण

बल्क विजेट आपकी FastComments भाषा सेटिंग्स के आधार पर कमेंट काउंट को स्वचालित रूप से फ़ॉर्मेट करता है। यह निम्नलिखित के लिए उपयुक्त टेक्स्ट प्रदान करता है:

  • शून्य कमेंट
  • एक कमेंट
  • कई कमेंट

बल्क बनाम सिंगल विजेट का उपयोग कब करें

बल्क विजेट का उपयोग करें जब:

  • आपके पास एक ही पेज पर कई कमेंट काउंट हों
  • आप कमेंट काउंट के साथ पोस्ट/आर्टिकल की सूची प्रदर्शित कर रहे हों
  • प्रदर्शन महत्वपूर्ण हो (API कॉल कम करता है)

सिंगल विजेट का उपयोग करें जब:

  • आपको पेज पर केवल एक कमेंट काउंट की आवश्यकता हो
  • आपको लाइव अपडेट की आवश्यकता हो (सिंगल विजेट रियल-टाइम अपडेट का समर्थन करता है)
  • आप अलग-अलग विजेट व्यवहार पर अधिक नियंत्रण चाहते हों

FastComments कमेंट काउंट विजेट आपकी साइट पर कमेंट की संख्या दिखाने का एक सरल और कुशल तरीका प्रदान करते हैं।

हमें उम्मीद है कि आपको यह दस्तावेज़ीकरण उपयोगी लगा होगा।