FastComments.com

ThriveCart Learn+ कोर्स में टिप्पणियाँ जोड़ें

FastComments के साथ हम किसी भी ThriveCart Learn+ कोर्स में आसानी से लाइव कमेंटिंग जोड़ सकते हैं।

यदि आपको सेटअप में कोई समस्या आती है, तो FastComments सपोर्ट भी सहायता प्रदान कर सकता है।

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

चरण 1: कोर्स तैयार करें Internal Link

ThriveCart Learn+ के डिज़ाइन के कारण, हमें FastComments कोड उन हर कोर्स पेज पर जोड़ना होगा जहाँ हम कमेंट्स दिखाना चाहते हैं।

हम हर पेज पर एक ही कोड स्निपेट का उपयोग कर सकते हैं, और अलग-अलग कमेंट थ्रेड्स अपने आप हर अलग पेज से जुड़ जाएँगे।

हम अपने कोर्स को एडिटर में खोलकर और एक HTML ब्लॉक जोड़कर शुरुआत करेंगे।

बाईं ओर आपको एक HTML ब्लॉक विकल्प दिखना चाहिए। उसे पेज पर उस जगह तक खींचें जहाँ आप कमेंट्स दिखाना चाहते हैं।

कोर्स खोलें और HTML ब्लॉक जोड़ें
कोर्स खोलें और HTML ब्लॉक जोड़ें

अब नए HTML एलिमेंट को चुनें। बाईं ओर एक ब्लॉक दिखाई देगा जहाँ हम अपना कोड पेस्ट कर सकते हैं।

अब आप स्टेप 2 के लिए तैयार हैं।

चरण 2: कस्टम कोड जोड़ें Internal Link

चरण 2 के लिए हमें अपना कोड स्निपेट कॉपी करना होगा। जांचें कि लाइन 50 पर "demo" नहीं लिखा है - आप यह सुनिश्चित करना चाहेंगे कि इसमें आपकी tenant id हो। यह आपके लिए पहले से भरा हुआ होना चाहिए।

अब आइए अपना ThriveCart-Learn-विशिष्ट FastComments कोड स्निपेट कॉपी करें।

यह काफी बड़ा है, क्योंकि ThriveCart के साथ इंटीग्रेशन में बहुत सारी सुविधाएं हैं, इसलिए बस कोड स्निपेट के ऊपरी दाएं कोने में Copy बटन पर क्लिक करें:

ThriveCart Learn+ Comments Code
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5 (function () {
6 let attemptsRemaining = 10;
7
8 function tryLoad() {
9 const simpleSSO = {optedInNotifications: true, optedInSubscriptionNotifications: true};
10 let isAuthenticated = false;
11 let profileLink = document.querySelector('.thrivecart-courses-header-profile-link');
12 if (!profileLink) {
13 profileLink = document.querySelector('.thrivecart-courses-header-profile'); // class is different for preview.
14 }
15 // broad email input field selector incase ThriveCart changes id.
16 const emailInputField = document.querySelector('input[type=email]');
17 if (emailInputField && emailInputField.value) {
18 isAuthenticated = true;
19 simpleSSO.email = emailInputField.value;
20 } else if (profileLink && !profileLink.innerText.includes('John Smith')) { // allow preview to work - no email available.
21 attemptsRemaining--;
22 if (!attemptsRemaining) {
23 return console.error('Could not load FastComments - could not determine user information (email). Please reach out to FastComments support.');
24 }
25 console.warn('FastComments: No user email found - waiting and trying again.');
26 return setTimeout(tryLoad, attemptsRemaining < 5 ? 3000 : 100); // increase wait time after 5 attempts incase slow internet.
27 }
28 if (profileLink) {
29 // use raw "img" query incase ThriveCart changes image class selector.
30 const avatarImg = profileLink.querySelector('img');
31 if (avatarImg && avatarImg.src) {
32 isAuthenticated = true;
33 simpleSSO.avatar = avatarImg.src;
34 }
35 // use innerText incase ThriveCart changes how profile name is displayed.
36 if (profileLink.innerText) {
37 isAuthenticated = true;
38 simpleSSO.username = profileLink.innerText;
39 } else {
40 const bold = profileLink.querySelector('b');
41 if (bold && bold.innerText) {
42 isAuthenticated = true;
43 simpleSSO.username = bold.innerText;
44 }
45 }
46 } else {
47 if (!attemptsRemaining) {
48 return console.error('Could not load FastComments - could not determine user information (user name/avatar). Please reach out to FastComments support.');
49 }
50 console.warn('FastComments: No user profile info found - waiting and trying again.');
51 attemptsRemaining--;
52 return setTimeout(tryLoad, attemptsRemaining < 5 ? 3000 : 100); // increase wait time after 5 attempts incase slow internet.
53 }
54
55 let url;
56 const selectedNavLink = document.querySelector('.tcc-browse-lesson.active a');
57
58 if (selectedNavLink) {
59 // sometimes TC uses multiple links the same page, so let's de-dupe them.
60 url = getPathnameFromUrl(selectedNavLink.href);
61 } else {
62 // trim marketing parameters and domain name
63 url = window.location.pathname;
64 }
65
66 if (url) {
67 url = url.replace('/starte-hier', '');
68 url = url.replace('/start-here', '');
69 }
70
71 FastCommentsUI(document.getElementById('fastcomments-widget'), {
72 tenantId: 'demo',
73 urlId: url,
74 simpleSSO: isAuthenticated ? simpleSSO : null
75 });
76 }
77
78 tryLoad();
79
80 function getPathnameFromUrl(url) {
81 try {
82 const parsedUrl = new URL(url);
83 // trim marketing parameters and domain name
84 return parsedUrl.pathname;
85 } catch (error) {
86 console.error("Invalid URL", url, error);
87 return window.location.pathname; // default to current, so at least it works sometimes
88 }
89 }
90
91 })();
92</script>
93

अब इसे ThriveCart एडिटर में बाएं कोड ब्लॉक में पेस्ट करें। यह इस तरह दिखना चाहिए:

कोड जोड़ा गया
कोड जोड़ा गया

बस! अब हमें सिर्फ प्रकाशित (publish) करना है:

प्रकाशित करें
प्रकाशित करें

बस! अब जब आप प्रीव्यू करेंगे तो अपने कोर्स पर कमेंट बॉक्स देख सकेंगे, और वास्तविक उपयोगकर्ता बिना साइन-इन किए या दूसरी बार अपना यूज़रनेम/ईमेल छोड़े कमेंट कर पाएंगे।

परीक्षण संबंधी नोट!

यदि आपने गुमनाम (anonymous) कमेंटिंग अक्षम की है, जो कि डिफ़ॉल्ट रूप से होती है, तो आप Preview मोड में John Smith उपयोगकर्ता के रूप में कमेंट नहीं कर पाएंगे। आपको एक प्रमाणीकरण त्रुटि मिलेगी क्योंकि डिफ़ॉल्ट John Smith उपयोगकर्ता के पास कोई ईमेल नहीं है। यदि आप परीक्षण करना चाहते हैं, तो हम सुझाव देते हैं कि आप एक कूपन कोड का उपयोग करें और अपनी साइट को एक वास्तविक उपयोगकर्ता की तरह देखें।

सफलता Internal Link

सफलता! अब आपको FastComments Comment Widget दिखाई देना चाहिए।

सफलता!
सफलता!

ThriveCart के साथ FastComments सेट अप करने के लिए बधाई! यदि आपको Domain Error का सामना हुआ है, या कमेंट एरिया को कस्टमाइज़ करना सीखना चाहते हैं, तो आगे पढ़ें!

अनुकूलन Internal Link

FastComments को आपकी साइट से मेल खाने के लिए अनुकूलित करने के लिए डिज़ाइन किया गया है।

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