FastComments.com

अनुकूलन और कॉन्फ़िगरेशन

अनुकूलन और कॉन्फ़िगरेशन

संदर्भ

यहाँ आपको कमेंट विजेट द्वारा समर्थित प्रत्येक फीचर और सेटिंग पर विस्तृत दस्तावेज़ीकरण मिलेगा।

यह दस्तावेज़ीकरण मुख्य अवधारणाओं को कवर करेगा, और कार्यक्षमता के प्रत्येक क्षेत्र में गहराई तक जाएगा, साथ ही हाउ-टू और सामान्य सावधानियाँ (gotchas) भी प्रदान करेगा।

कोड उदाहरण प्रासंगिक पंक्तियों के हाइलाइट के साथ दिए जाएँगे। जहाँ लागू हो, वहाँ कॉन्फ़िगरेशन पृष्ठों के स्क्रीनशॉट भी दिए जाएँगे।

कोड उदाहरण हमारी वैनिला JavaScript लाइब्रेरी का उपयोग करेंगे, हालाँकि कॉन्फ़िगरेशन विकल्प कमेंट विजेट के सभी संस्करणों (React, Vue, आदि) के लिए बिल्कुल उसी नाम का उपयोग करते हैं।

इस गाइड में वर्णित अधिकांश कॉन्फ़िगरेशन और फीचर्स के लिए कोई कोड लिखने की आवश्यकता नहीं है।

अलग-अलग पृष्ठों पर वही टिप्पणियाँ दिखाना Internal Link

चूंकि urlId पैरामीटर हमें यह परिभाषित करने की अनुमति देता है कि टिप्पणियाँ किस पेज या id से जुड़ी हैं, हम उन पेजों पर urlId को वही मान सेट कर सकते हैं।

एकाधिक पेजों पर वही टिप्पणियाँ
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "urlId": "https://example.com/source-page"
8}];
9</script>
10

कस्टम फ़ॉन्ट Internal Link

FastComments को अनुकूलित (customize) करने के लिए डिज़ाइन किया गया है, और हमारे विजेट्स द्वारा उपयोग किया जाने वाला फ़ॉन्ट भी इसका अपवाद नहीं है।

डिफ़ॉल्ट रूप से, FastComments विभिन्न प्रकार के डिवाइसेस पर सर्वोत्तम दिखने के लिए system font stack का उपयोग करता है।

अपने स्वयं के फ़ॉन्ट परिभाषित करने के लिए, Custom CSS दस्तावेज़ीकरण देखें।

वहाँ आपको कस्टम CSS परिभाषित करने का तरीका मिलेगा, जो आपको अपने इच्छित फ़ॉन्ट परिभाषित करने की अनुमति देगा।

फ़ॉन्ट कैसे परिभाषित करें

फ़ॉन्ट को ओवरराइड करने के लिए, हम अनुशंसा करते हैं कि आप अपनी CSS को .fast-comments, textarea सेलेक्टर्स का उपयोग करके परिभाषित करें। उदाहरण के लिए:

कस्टम एक्सटर्नल फ़ॉन्ट उदाहरण
Copy CopyRun External Link
1
2@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
3.fast-comments, textarea {
4 font-family: 'Roboto', sans-serif;
5}
6

गहरे बैकग्राउंड का समर्थन (डार्क मोड) Internal Link

डिफ़ॉल्ट रूप से, FastComments कमेंट विजेट अधिकांश साइटों पर डार्क मोड को स्वचालित रूप से पहचान लेगा।

जब डार्क मोड पहचाना जाता है, तो FastComments सफेद पृष्ठभूमि पर काले टेक्स्ट से काली पृष्ठभूमि पर सफेद टेक्स्ट में बदल जाएगा। छवियाँ भी बदल जाएँगी।

पेज लोड होने पर, विजेट यह निर्धारित करने की कोशिश करेगा कि कमेंट विजेट के पीछे पेज की पृष्ठभूमि कितनी गहरी है। इसका मतलब है कि पेज की पृष्ठभूमि सफेद हो सकती है, लेकिन यदि आप कमेंट विजेट को काली पृष्ठभूमि वाले कंटेनर के अंदर रखते हैं, तो डार्क मोड कमेंट्स को पढ़ने योग्य बनाने के लिए फिर भी स्वचालित रूप से सक्रिय हो जाना चाहिए।

हालाँकि, पहचान तंत्र, जो "luminance" निर्धारित करने पर निर्भर करता है, हो सकता है जब आप चाहें तब डार्क-मोड को सक्रिय न करे। इसे ज़बरदस्ती सक्रिय करने के लिए, hasDarkBackground फ्लैग को true इस प्रकार सेट करें:

डार्क बैकग्राउंड मोड को ज़बरदस्ती सक्रिय करें
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "hasDarkBackground": true
8}];
9</script>
10

टिप्पणियों से पृष्ठों का लिंक करना Internal Link

नोटिफिकेशन ईमेल भेजते समय, या मॉडरेशन पेज जैसे यूज़र इंटरफेस में कमेंट्स रेंडर करते समय, कमेंट से उसके पेज तक लिंक बनाने में सक्षम होना उपयोगी होता है।

यदि URL ID हमेशा एक ID नहीं है, तो हमें URL को किसी अन्य स्थान पर स्टोर करना होगा। इसी काम के लिए "url" प्रॉपर्टी है, जिसे निम्न प्रकार परिभाषित किया गया है।

कस्टम URL परिभाषित करना
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "url": "https://example.com/article-5"
8}];
9</script>
10

एक सामान्य उपयोग का मामला कमेंट थ्रेड को किसी पहचानकर्ता, जैसे एक आर्टिकल, से जोड़ना और फिर किसी विशेष पेज पर वापस लिंक करना है, उदाहरण के लिए:

कस्टम URL और URL IDs को एक साथ परिभाषित करना
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "url": "https://example.com/article-5",
8 "urlId": "article-5"
9}];
10</script>
11

URL से सामान्य मार्केटिंग पैरामीटर नहीं हटाए जाते। डिफ़ॉल्ट रूप से, जो भी वर्तमान पेज URL है, वही URL कमेंट के साथ स्टोर किया जाता है।

कौन सा पृष्ठ रेंडर करना है यह निर्धारित करना Internal Link

कमेंट्स को फ़ेच और रेंडर करते समय, कमेंट विजेट को यह जानना ज़रूरी होता है कि किस पेज से शुरू करना है। डिफ़ॉल्ट रूप से, यह पहले पेज से शुरू होता है और केवल उसी पेज को रेंडर करता है।

यदि चाहें, तो रेंडर किए जाने वाले सटीक पेज को startingPage सेटिंग के रूप में कमेंट विजेट को पास किया जा सकता है।

रेंडर किए जाने वाले पेज को निर्दिष्ट करना
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "startingPage": 1
8}];
9</script>
10

ध्यान दें कि पेज नंबर शून्य से शुरू होते हैं, इसलिए ऊपर दिया गया उदाहरण दूसरा पेज रेंडर करता है।

पृष्ठ पुनः लोड किए बिना टिप्पणी थ्रेड बदलना Internal Link

हमने देखा कि urlId वह पेज या आर्टिकल आईडी है जिससे कमेंट्स जुड़े होते हैं।

साथ ही, याद दिलाने के लिए, यदि परिभाषित नहीं किया गया है तो urlId डिफ़ॉल्ट रूप से वर्तमान पेज URL पर सेट हो जाता है।

लेकिन SPAs, यानी Single-Page-Applications का क्या, जहाँ कमेंट्स जिस पेज या कंटेंट से जुड़े हैं वह बिना पेज रीलोड के डायनामिक रूप से बदल जाता है?

Angular, React, Vue, आदि

हमारी लाइब्रेरीज़ जैसे Angular और React के साथ, विजेट को पास की गई urlId प्रॉपर्टी को अपडेट करने से ही कमेंट विजेट रिफ्रेश हो जाता है। आप इसे React ऐप में एक्शन में देख सकते हैं, उदाहरण के लिए, यहाँ।

VanillaJS

यदि आप VanillaJS लाइब्रेरी का उपयोग कर रहे हैं तो यह थोड़ा अधिक जटिल है, क्योंकि Angular या React जैसा कोई फ्रेमवर्क नहीं होता जो डेटा बाइंडिंग या स्टेट प्रोपेगेशन को संभालता हो।

जब आप VanillaJS विजेट को इंस्टेंटिएट करते हैं, तो यह कुछ फ़ंक्शंस रिटर्न करता है जिन्हें इसे अपडेट करने के लिए कॉल किया जा सकता है।

यहाँ एक फंक्शनल उदाहरण है जहाँ हम पेज हैश बदलते हैं और कमेंट विजेट को अपडेट करते हैं:

पेज हैश बदलने का उदाहरण
Copy CopyRun External Link
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<button id="change-page"></button>
4<div id="fastcomments-widget"></div>
5<script>
6 (function fastCommentsMain() {
7 let config = {
8 tenantId: 'demo'
9 };
10 let instance = window.FastCommentsUI(document.getElementById('fastcomments-widget'), config);
11
12 let page = '#page-1';
13 function getNextPage() {
14 if (page === '#page-1') {
15 return '#page-2';
16 } else {
17 return '#page-1';
18 }
19 }
20
21 let button = document.getElementById('change-page');
22 function nextPage() {
23 page = getNextPage();
24 button.innerText = 'Go to ' + getNextPage();
25 window.location.hash = page;
26 let locationString = window.location.toString();
27
28 config.url = locationString; // हम url भी अपडेट करते हैं, ताकि नोटिफिकेशन सही पेज से लिंक हो सकें
29 config.urlId = locationString;
30
31 instance.update(config);
32 }
33 nextPage();
34 button.addEventListener('click', nextPage);
35 })();
36</script>
37

छवि रीडायरेक्ट अक्षम करें Internal Link

डिफ़ॉल्ट रूप से, FastComments उपयोगकर्ताओं को इमेज अपलोड करने की अनुमति देता है। जब कोई उपयोगकर्ता उस इमेज पर क्लिक करता है, तो FastComments डिफ़ॉल्ट रूप से उस इमेज को पूरी तरह दिखाने के लिए एक नया टैब खोलता है। इस फ्लैग को true पर सेट करने से यह व्यवहार अक्षम हो जाता है:

इमेज रीडायरेक्ट अक्षम करें
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "disableImageRedirect": true
8}];
9</script>
10

यदि आप इमेज क्लिक को स्वयं कैप्चर करने की योजना नहीं बना रहे हैं (देखें onImageClicked), तो हम अनुशंसा करते हैं कि इसे कुछ स्टाइलिंग के साथ जोड़ा जाए ताकि यह दिखावा हट जाए कि इमेज पर क्लिक किया जा सकता है।

नई टिप्पणियों को हाइलाइट करना Internal Link

FastComments नई टिप्पणियों को हाइलाइट करने के कई तरीके प्रदान करता है।

सबसे पहले, डिफ़ॉल्ट रूप से, जिन टिप्पणियों ने इन-ऐप नोटिफिकेशन ट्रिगर किया (उत्तर, उसी थ्रेड में उत्तर, या उस पेज पर टिप्पणियाँ जिनकी आप सदस्यता लेते हैं), वे स्वचालित रूप से उपयोगकर्ता के अवतार के हल्के चमकने के साथ हाइलाइट की जाएँगी। रंग को is-unread क्लास का उपयोग करके CSS के माध्यम से अनुकूलित किया जा सकता है।

पिछले 24 घंटों में पोस्ट की गई टिप्पणियों पर 24hr क्लास लागू होती है जिसका उपयोग स्टाइलिंग के लिए किया जा सकता है।

अंत में, उपयोगकर्ता के सेशन में दिखने वाली कोई भी नई लाइव टिप्पणियाँ कुछ सेकंड के लिए एनिमेशन के माध्यम से हाइलाइट की जाएँगी। यह is-live CSS क्लास के माध्यम से किया जाता है और इसे भी अनुकूलित किया जा सकता है।

ईमेल टेम्पलेट Internal Link

FastComments से आपके ग्राहकों को भेजे जाने वाले ईमेल को कस्टमाइज़ किया जा सकता है। टेम्पलेट, लॉजिक और अनुवाद सभी को बदला जा सकता है। टेक्स्ट को प्रति-लोकेल कस्टमाइज़ किया जा सकता है, और स्टाइलिंग को प्रति-डोमेन भी बदला जा सकता है। कस्टम ईमेल टेम्पलेट के बारे में यहाँ और जानें।

नई लाइव टिप्पणियाँ नीचे दिखाएँ Internal Link

डिफ़ॉल्ट रूप से, नए लाइव कमेंट्स वास्तविक समय में पोस्ट होते ही कमेंट लिस्ट के शीर्ष पर दिखाई देते हैं।

जब यह विकल्प सक्षम किया जाता है, तो नए लाइव कमेंट्स लिस्ट के निचले हिस्से में जोड़े जाएंगे। यह तब कमेंट्स के दिखने के तरीके को प्रभावित करता है जब उपयोगकर्ता कमेंट थ्रेड देख रहे हों और कमेंट्स लाइव पोस्ट हो रहे हों।

नए लाइव कमेंट्स नीचे की ओर
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "newCommentsToBottom": true
8}];
9</script>
10

इस सेटिंग के सक्षम होने पर:

  • अन्य उपयोगकर्ताओं द्वारा पोस्ट किए गए नए लाइव कमेंट्स कमेंट लिस्ट के निचले हिस्से में दिखाई देंगे
  • उपयोगकर्ता वास्तविक समय में मौजूदा कमेंट्स के नीचे नए कमेंट्स देखेंगे
  • यह केवल लाइव कमेंट अपडेट को प्रभावित करता है - पेज के प्रारंभिक लोड को नहीं
  • यह उपयोगकर्ताओं को चर्चा का पालन करते समय पढ़ने के प्रवाह को बनाए रखने में मदद कर सकता है

ध्यान दें कि यह सेटिंग केवल वास्तविक समय में आने वाले नए लाइव कमेंट्स के स्थान को प्रभावित करती है। यह पेज लोड होने पर प्रारंभिक सॉर्ट क्रम को प्रभावित नहीं करती है।

अनंत स्क्रॉलिंग सक्षम करना Internal Link

डिफ़ॉल्ट रूप से, FastComments विजेट खुद को लंबवत रूप से रीसाइज़ कर लेता है ताकि सभी दिखाई देने वाली कमेंट्स फिट हो जाएं। पेजिनेशन मौजूदा पेज के अंत में एक "View Next" बटन के माध्यम से होती है, क्योंकि हमने पाया है कि यह इंटरैक्शन अधिकांश उपयोगकर्ताओं को सबसे अच्छा लगता है।

हालाँकि, कुछ मामलों में इनफिनिट स्क्रॉलिंग बेहतर होती है। उदाहरण के लिए, हम इस फीचर का उपयोग अपने Stream Chat प्रोडक्ट में करते हैं।

हम enableInfiniteScrolling फ्लैग को true सेट करके "View Next" बटन छिपा सकते हैं और इनफिनिट स्क्रॉलिंग पर स्विच कर सकते हैं:

इनफिनिट स्क्रॉलिंग सक्षम करना
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "enableInfiniteScrolling": true
8}];
9</script>
10

इसके लिए कस्टम CSS जोड़ना भी आवश्यक है। स्क्रॉलिंग सक्षम करने के लिए .comments सिलेक्टर के लिए कस्टम CSS जोड़ें, उदाहरण के लिए:

इनफिनिट स्क्रॉलिंग सक्षम करें
Copy CopyRun External Link
1
2.comments {
3 max-height: 500px;
4 overflow-y: auto;
5}
6

एक पूर्ण कार्यशील उदाहरण इस प्रकार होगा:

इनफिनिट स्क्रॉलिंग सक्षम करना
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "enableInfiniteScrolling": true,
8 "customCSS": ".comments { max-height: 500px; overflow-y: auto; }"
9}];
10</script>
11

उपरोक्त उदाहरण में हम customCSS प्रॉपर्टी का उपयोग करते हैं, हालाँकि परफॉर्मेंस कारणों से सुझाव दिया जाता है कि इसके बजाय Widget Configuration UI का उपयोग किया जाए। कस्टम CSS दस्तावेज़ीकरण देखें।

सभी टिप्पणियाँ एक साथ दिखाना - पृष्ठांकन अक्षम करें Internal Link

पेजिनेशन को अक्षम करने के लिए, और सभी कमेंट्स को एक साथ रेंडर करने के लिए, startingPage को -1 पर सेट करें।

सभी कमेंट्स रेंडर करें
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "startingPage": -1
8}];
9</script>
10

नई शीर्ष-स्तरीय टिप्पणियाँ रोकें Internal Link

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

नए रूट कमेंट्स को रोकें
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "noNewRootComments": true
8}];
9</script>
10

अधिकतम उत्तर गहराई Internal Link

डिफ़ॉल्ट रूप से, FastComments उत्तरों की असीमित नेस्टिंग की अनुमति देता है, जिससे एक थ्रेड संरचना बनती है जहाँ उपयोगकर्ता असीमित रूप से उत्तरों का उत्तर दे सकते हैं।

maxReplyDepth विकल्प आपको यह सीमित करने की अनुमति देता है कि उत्तर थ्रेड कितनी गहराई तक जा सकते हैं। जब अधिकतम गहराई तक पहुँच जाता है, तो उपयोगकर्ता उस स्तर पर टिप्पणियों पर उत्तर (reply) बटन नहीं देखेंगे।

उत्तर की गहराई 2 स्तरों तक सीमित करना
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "maxReplyDepth": 2
8}];
9</script>
10

maxReplyDepth को 2 पर सेट करने पर:

  • उपयोगकर्ता शीर्ष स्तर पर टिप्पणी कर सकते हैं (गहराई 0)
  • उपयोगकर्ता शीर्ष-स्तरीय टिप्पणियों का उत्तर दे सकते हैं (गहराई 1)
  • उपयोगकर्ता उन उत्तरों का उत्तर दे सकते हैं (गहराई 2)
  • गहराई 2 से आगे कोई उत्तर की अनुमति नहीं है

इसे 1 पर सेट करने से केवल शीर्ष-स्तरीय टिप्पणियों के उत्तर की अनुमति मिलेगी, जिससे अधिक सपाट चर्चा संरचना बनेगी।

maxReplyDepth को 0 पर सेट करने से सभी उत्तर अक्षम हो जाएंगे, जिससे केवल शीर्ष-स्तरीय टिप्पणियों की अनुमति मिलेगी। यदि निर्दिष्ट नहीं किया गया है, तो उत्तर बिना सीमा के नेस्ट किए जा सकते हैं।

अनभेजी टिप्पणी के साथ छोड़ने से पहले चेतावनी दें Internal Link

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

warnOnUnsavedComment को true पर सेट करने से ब्राउज़र उपयोगकर्ता से पेज छोड़ने से पहले पुष्टि करने के लिए कहता है, जब तक कोई कमेंट बॉक्स, या चल रहा कोई संपादन, अभी भी टेक्स्ट रखता है। कमेंट सबमिट होने के बाद टेक्स्ट साफ़ हो जाता है, इसलिए कोई प्रॉम्प्ट नहीं दिखाया जाता।

असेव्ड कमेंट पर चेतावनी
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "warnOnUnsavedComment": true
8}];
9</script>
10

प्रॉम्प्ट ब्राउज़र के अपने डायलॉग का उपयोग करता है। आधुनिक ब्राउज़र अपनी खुद की भाषा दिखाते हैं और कस्टम टेक्स्ट को अनदेखा करते हैं, इसलिए संदेश को कस्टमाइज़ नहीं किया जा सकता।

यह विकल्प मांग पर एक छोटा एक्सटेंशन लोड करता है, इसलिए जिन साइटों पर इसे सक्षम नहीं किया जाता, उनके लिए यह विजेट में कुछ भी नहीं जोड़ता।

सिंगल साइन ऑन (SSO) अवलोकन Internal Link

SSO, या सिंगल-साइन-ऑन, कन्वेंशन्स का एक सेट है जिसका उपयोग आपको या आपके उपयोगकर्ताओं को बिना दूसरा खाता बनाए FastComments का उपयोग करने की अनुमति देने के लिए किया जाता है।

मान लें कि आप गुमनाम (anonymous) टिप्पणी की अनुमति नहीं देते हैं, तो FastComments के साथ टिप्पणी करने के लिए एक खाता आवश्यक है। हम इस साइन अप प्रक्रिया को बहुत आसान बनाते हैं - उपयोगकर्ता केवल टिप्पणी करते समय अपना ईमेल छोड़ देता है। हालाँकि, हम समझते हैं कि कुछ साइटें यहाँ तक कि इस अतिरिक्त बाधा से भी बचना चाहती हैं।

हम आपकी पूरी साइट के लिए केवल एक लॉगिन फ्लो रखकर इस बाधा को कम कर सकते हैं।

मैं इसे कैसे प्राप्त करूँ?

वर्तमान में सभी खाता प्रकारों को SSO तक पहुँच प्राप्त है। हालाँकि, SSO उपयोगकर्ताओं की अधिकतम संख्या आपके पैकेज के आधार पर भिन्न होगी। अन्य सुविधाओं की तरह, Pro प्लान और उससे ऊपर के प्लान सीधा डेवलपमेंट समर्थन प्रदान करते हैं।

आइए विकल्पों की तुलना करें, और फिर प्रत्येक के विवरण में जाएँ।

उपयोगकर्ता और टिप्पणी माइग्रेशन

जब आप Disqus जैसे SSO वाले प्लेटफ़ॉर्म से माइग्रेट कर रहे होते हैं, तो आपके पास पहले से ही उपयोगकर्ता और उनकी टिप्पणियाँ होती हैं।

टिप्पणियाँ आपके माइग्रेशन के हिस्से के रूप में आयात की जाती हैं, चाहे API द्वारा, हमारे Import UI द्वारा, या ग्राहक सहायता द्वारा। Import UI को प्राथमिकता दी जाती है यदि यह उस प्लेटफ़ॉर्म का समर्थन करता है जिससे आप माइग्रेट कर रहे हैं, क्योंकि इसमें त्रुटि हैंडलिंग, अवतार और मीडिया निष्कर्षण तथा अपलोड, और बैच जॉब मॉनिटरिंग सिस्टम शामिल है।

उपयोगकर्ता स्वयं पहली बार टिप्पणी थ्रेड देखते समय स्वचालित रूप से जोड़े जाते हैं। वैकल्पिक रूप से, उन्हें API के माध्यम से पहले से जोड़ा जा सकता है, लेकिन इस काम के अधिक लाभ नहीं हैं।

यदि टिप्पणियाँ आयात की जाती हैं, और SSO उपयोगकर्ता API के माध्यम से मैन्युअल रूप से नहीं जोड़े जाते हैं, तो टिप्पणियाँ स्वचालित रूप से उपयोगकर्ता के खाते में माइग्रेट हो जाएँगी जब वे पहली बार कोई टिप्पणी थ्रेड देखते हैं और उनका खाता बनाया जाता है। इसके बाद वे उन टिप्पणियों को प्रबंधित, संपादित और हटा सकेंगे जो उन्होंने मूल रूप से लिखी थीं।

स्वचालित माइग्रेशन ईमेल या उपयोगकर्ता नाम के माध्यम से किया जाता है। कुछ प्लेटफ़ॉर्म, जैसे Disqus, एक्सपोर्ट पर ईमेल प्रदान नहीं करते हैं, इसलिए इस स्थिति में हम उपयोगकर्ता नाम का उपयोग करते हैं।

  • जब तक आप SSO पेलोड में एक मिलान करने वाला उपयोगकर्ता नाम और एक ईमेल पास करते हैं, हम व्यक्तिगत टिप्पणी ऑब्जेक्ट्स में ईमेल जोड़ देंगे ताकि सूचनाएँ और मेंशन काम करें।

यदि आप अपनी टिप्पणियों और उपयोगकर्ताओं को एक साथ आयात करना चाहते हैं, तो API के माध्यम से उपयोगकर्ताओं को आयात करने के बाद समर्थन टीम के साथ मिलकर टिप्पणियों को उपयोगकर्ताओं के संबंधित खातों में माइग्रेट करें।

इसलिए, माइग्रेशन के लिए सबसे आसान रास्ता इस प्रकार है:

  1. टिप्पणियाँ आयात करें।
    1. यदि आप Manage Data -> Imports में Import UI का उपयोग कर रहे हैं तो अवतार और अन्य मीडिया स्वचालित रूप से माइग्रेट हो जाते हैं।
  2. Secure या Simple SSO सेटअप करें।
  3. जब उपयोगकर्ता पहली बार लॉग इन करें तो माइग्रेशन प्रति-उपयोगकर्ता स्वचालित रूप से होने दें।
    1. यदि उपयोगकर्ता के पास 50k से कम टिप्पणियाँ हैं तो यह आमतौर पर पेज लोड समय में एक सेकंड से कम जोड़ता है।

WordPress उपयोगकर्ता

यदि आप हमारे WordPress प्लगइन का उपयोग कर रहे हैं तो कोई कोड लिखने की आवश्यकता नहीं है! बस प्लगइन के एडमिन पेज पर जाएँ, SSO Settings पर क्लिक करें, और फिर Enable करें।

इससे आप एक सिंगल-बटन क्लिक विज़ार्ड पर पहुँचेंगे जो आपकी API कुंजी बनाएगा, इसे आपके WordPress इंस्टॉल पर भेजेगा और SSO चालू कर देगा। हमने इसे आपके लिए एक सिंगल बटन क्लिक में समेकित किया है।

ध्यान दें कि यदि आप प्लगइन को पहली बार इंस्टॉल कर रहे हैं तो आपको SSO Settings बटन वाला एडमिन पेज देखने से पहले सेटअप प्रक्रिया को पूरा करना होगा।

WordPress SSO - मॉडरेटर

ध्यान दें कि वर्तमान में FastComments WordPress प्लगइन के साथ टिप्पणी करते समय आपके मॉडरेटर के आगे "Moderator" बैज दिखाने के लिए, उन्हें FastComments डैशबोर्ड में भी मॉडरेटर के रूप में जोड़ा जाना चाहिए, और उनका ईमेल सत्यापित होना चाहिए।

कस्टम इंटीग्रेशन

कस्टम इंटीग्रेशन के लिए, दो विकल्प हैं।

विकल्प एक - Secure SSO

Secure SSO के साथ, FastComments जानता है कि टिप्पणी करने, वोट करने और टिप्पणियाँ पढ़ने वाला उपयोगकर्ता आपकी साइट का वास्तविक उपयोगकर्ता है।

जब तक आप एक वैध पेलोड बनाते हैं, उपयोगकर्ता को हमेशा एक निर्बाध टिप्पणी अनुभव मिलेगा।

Secure SSO के साथ, SSO पेलोड सर्वर-साइड पर HMAC प्रमाणीकरण का उपयोग करके बनाया जाता है और फिर क्लाइंट पर विजेट को पास किया जाता है।

Secure SSO के साथ, उपयोगकर्ता का खाता FastComments के बाकी उपयोगकर्ता-आधार से पूरी तरह अलग होता है। इसका मतलब है कि यदि हमारे पास दो पार्टनर Company A और Company B हैं, तो प्रत्येक के पास "Bob" उपयोगकर्ता नाम वाला एक SSO उपयोगकर्ता हो सकता है।

आवश्यकताएँ

  • बैकएंड डेवलपमेंट के बारे में कुछ बुनियादी ज्ञान।
  • गुप्त API कुंजियों के साथ काम करने के बारे में कुछ बुनियादी ज्ञान।
  • API डेवलपमेंट या सर्वर-साइड रेंडरिंग के बारे में कुछ बुनियादी ज्ञान।

फायदे

  • सुरक्षित।
  • निर्बाध टिप्पणी अनुभव।

नुकसान

  • बैकएंड डेवलपमेंट की आवश्यकता है।

उपयोगकर्ता डेटा अपडेट करना

Secure SSO के साथ, हर बार जब आप sso उपयोगकर्ता पेलोड पास करते हैं, हम उनके उपयोगकर्ता को नवीनतम जानकारी के साथ अपडेट कर देंगे। उदाहरण के लिए, यदि उपयोगकर्ता का उपयोगकर्ता नाम X है, और आप SSO पेलोड में Y पास करते हैं, तो उनका उपयोगकर्ता नाम Y हो जाएगा।

यदि आप इस दृष्टिकोण का उपयोग करके मान हटाना चाहते हैं तो उन्हें null पर सेट करें (undefined नहीं)।

Secure SSO API

हम SSO उपयोगकर्ताओं के साथ इंटरैक्ट करने के लिए एक API भी प्रदान करते हैं। दस्तावेज़ देखें।

ध्यान दें कि Secure SSO का उपयोग करते समय, उपयोगकर्ता पेज लोड पर पर्दे के पीछे स्वचालित रूप से बनाए जाते हैं। आपको अपने उपयोगकर्ताओं को बल्क इंपोर्ट करने की आवश्यकता नहीं है।

विकल्प दो - Simple SSO

Secure SSO का विकल्प यह है कि उपयोगकर्ता की जानकारी को सीधे टिप्पणी विजेट को पास कर दिया जाए।

Simple SSO के साथ ईमेल प्रदान करना आवश्यक नहीं है, हालाँकि इसके बिना उनकी टिप्पणियाँ "Unverified" के रूप में दिखाई देंगी।

ध्यान दें! 2022 की शुरुआत से Simple SSO के उपयोगकर्ता नामों का पूरे FastComments.com पर अद्वितीय होना आवश्यक नहीं है।

आदर्श रूप से, Simple SSO को केवल तब चुना जाना चाहिए जब ऐसे प्लेटफ़ॉर्म पर डेवलपमेंट कर रहे हों जो बैकएंड एक्सेस प्रदान नहीं करते।

आवश्यकताएँ

  • क्लाइंट-साइड डेवलपमेंट के बारे में कुछ बुनियादी ज्ञान।
  • कम से कम उपयोगकर्ता का ईमेल जानना आवश्यक है।

फायदे

  • सरल।
  • सभी गतिविधि अभी भी सत्यापित होती है।
  • उपयोगकर्ता कभी अपना उपयोगकर्ता नाम या ईमेल दर्ज नहीं करता।

नुकसान

  • Secure SSO की तुलना में कम सुरक्षित, क्योंकि क्लाइंट-साइड पेलोड को किसी भी उपयोगकर्ता बनने के लिए तैयार किया जा सकता है।

Simple SSO API

Simple SSO फ्लो के माध्यम से स्वचालित रूप से बनाए गए उपयोगकर्ता SSOUser ऑब्जेक्ट्स के रूप में संग्रहीत होते हैं। इन्हें SSOUser API के माध्यम से एक्सेस और प्रबंधित किया जा सकता है। दस्तावेज़ देखें।

कस्टम एकीकरण - Disqus SSO से माइग्रेशन Internal Link

Disqus और FastComments Secure SSO के बीच सबसे बड़ा अंतर यह है कि Disqus एन्क्रिप्शन के लिए SHA1 का उपयोग करता है जबकि हम SHA256 का उपयोग करते हैं। इसका मतलब है कि Disqus से माइग्रेट करना आसान है - उपयोग किए गए हैशिंग एल्गोरिथम को SHA1 से SHA256 में बदलें और UI को पास की गई प्रॉपर्टी नामों को अपडेट करें।

कस्टम एकीकरण - Commento SSO से माइग्रेशन Internal Link

Commento एक पूरी तरह से अलग SSO दृष्टिकोण अपनाता है - वे आपसे एक endpoint रखने की मांग करते हैं जिसे वे user को प्रमाणित करने के लिए invoke करते हैं। FastComments इसके विपरीत है - बस अपनी secret key का उपयोग करके user की जानकारी को encode और hash करें और उसे साथ में पास करें।

कॉलबैक Internal Link

कमेंट विजेट के लिए सभी लाइब्रेरी (वर्तमान में Angular, React, Vue) कॉलबैक का समर्थन करती हैं।

कॉलबैक कॉन्फ़िगरेशन ऑब्जेक्ट में निर्दिष्ट किए जाते हैं, और प्रत्येक लाइब्रेरी के लिए उनका सिग्नेचर समान होता है।

समर्थित कॉलबैक ये हैं:

  • onInit
  • onAuthenticationChange
  • onRender
  • commentCountUpdated
  • onReplySuccess
  • onVoteSuccess
  • onImageClicked
  • onOpenProfile
  • onCommentSubmitStart
  • onCommentsRendered

सटीक सिग्नेचर TypeScript परिभाषाओं में पाए जा सकते हैं।

सभी कॉलबैक के उपयोग का एक उदाहरण यहाँ दिया गया है:

कॉलबैक उदाहरण
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5 window.fcConfigs = [{
6 target: '#fastcomments-widget',
7 tenantId: 'demo',
8 onInit: function () {
9 console.log('Library started to fetch comments!');
10 },
11 onAuthenticationChange: function (eventName, userObj) {
12 console.log('User authenticated!', eventName, userObj);
13 },
14 onRender: function () {
15 console.log('Render event happened!');
16 },
17 commentCountUpdated: function (newCount) {
18 console.log('New comment count:', newCount);
19 },
20 onReplySuccess: function (comment) {
21 console.log('New comment saved!', comment);
22 },
23 onVoteSuccess: function (comment, voteId, direction, status) {
24 console.log('New vote saved!', comment, voteId, direction, status);
25 },
26 onImageClicked: function (src) {
27 console.log('Image clicked!', src);
28 },
29 onOpenProfile: function (userId) {
30 console.log('User tried to open profile', userId);
31 // return true; // डिफ़ॉल्ट व्यवहार (fastcomments.com यूज़र प्रोफ़ाइल खोलना) को रोकने के लिए true लौटाएँ।
32 },
33 onCommentSubmitStart: function(comment, continueSubmitFn, cancelFn) {
34 console.log('Trying to submit comment', comment);
35 setTimeout(function() { // असिंक्रोनस व्यवहार (API कॉल आदि) का अनुकरण।
36 if(confirm('Should submit?')) {
37 continueSubmitFn();
38 } else {
39 cancelFn('Some optional error message');
40 }
41 }, 1000);
42 },
43 onCommentsRendered: function(comments) {
44 // comments पेज के डिफ़ॉल्ट सॉर्ट के अनुसार क्रमबद्ध हैं, जो Most Relevant (जैसे: सबसे अधिक अपवोट, आदि) या Newest First हो सकता है
45 const topCommentInList = comments[0];
46 console.log('First Comment Rendered:', topCommentInList.avatarSrc, topCommentInList.commenterName, topCommentInList.commentHTML);
47 }
48 }];
49</script>
50

पृष्ठ शीर्षक Internal Link

वर्तमान पेज टाइटल निर्दिष्ट urlId के साथ संबद्ध किया जाता है और मॉडरेशन टूल्स में उपयोग के लिए सहेजा जाता है।

डिफ़ॉल्ट रूप से, यह document.title से प्राप्त किया जाता है।

यदि चाहें, तो अपना स्वयं का पेज टाइटल निम्न प्रकार से निर्दिष्ट किया जा सकता है:

पेज टाइटल निर्दिष्ट करना
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "pageTitle": "Article 42"
8}];
9</script>
10

टिप्पणी संख्या और सभी नेस्टेड उत्तरों की गिनती Internal Link

कमेंट विजेट के शीर्ष पर दिखाया गया कमेंट काउंट या तो सभी "टॉप-लेवल" कमेंट्स दिखा सकता है, यानी वे रिप्लाई जो सीधे पेज या आर्टिकल के जवाब में हैं, या यह सभी नेस्टेड कमेंट्स की गिनती हो सकती है।

डिफ़ॉल्ट रूप से, यह true है - यानी बाद वाली गिनती - सभी कमेंट्स। कमेंट विजेट के पुराने संस्करणों में डिफ़ॉल्ट मान false है।

हम countAll फ्लैग को true सेट करके व्यवहार बदल सकते हैं, ताकि यह सभी नेस्टेड कमेंट्स की गिनती हो।

सभी कमेंट्स की गिनती
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "countAll": true
8}];
9</script>
10

यदि हम चाहते हैं कि गिनती केवल टॉप-लेवल कमेंट्स को दर्शाए, तो हम फ्लैग को false सेट करते हैं।

टॉप-लेवल कमेंट्स की गिनती
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "countAll": false
8}];
9</script>
10

इसे वर्तमान में कोड बदलाव के बिना कस्टमाइज़ नहीं किया जा सकता।

मेंशन समूह आईडी Internal Link

@mentions ऑटोकम्प्लीट के लिए उपयोग करने हेतु ids की एक सूची। उपयोगी जब आप यह रोकना चाहते हैं कि ऐसे उपयोगकर्ताओं को टैग किया जाए जिनके समूह आपस में मेल नहीं खाते।

जब निर्दिष्ट किया जाता है, तो @ कैरेक्टर टाइप करने के बाद ऑटोकम्प्लीट में केवल अन्य समूहों के उपयोगकर्ता ही दिखाए जाएंगे।

Mentions के लिए समूह सीमित करें
Copy CopyRun External Link
1
2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.fcConfigs = [{
6 "tenantId": "demo",
7 "mentionGroupIds": [
8 "yxZAhjzda",
9 "QT19nXbqB"
10 ]
11}];
12</script>
13