Bubble.io साइटों में लाइव कमेंटिंग जोड़ें

सबसे पहले, उस पेज/लेआउट पर जाएँ जहाँ आप FastComments जोड़ना चाहते हैं। Bubble एडिटर में, Visual Elements साइडबार से एक HTML एलिमेंट को ड्रैग और ड्रॉप करके अपने पेज पर रखें।

HTML एलिमेंट जोड़ें

HTML एलिमेंट हमें FastComments विजेट को सीधे आपके Bubble ऐप में एम्बेड करने की सुविधा देगा।

आपने जो HTML एलिमेंट अभी जोड़ा है, उस पर क्लिक करें। दिखाई देने वाले प्रॉपर्टी एडिटर में, निम्नलिखित कोड को HTML फ़ील्ड में पेस्ट करें:

Bubble.io लाइव कमेंटिंग कोड स्निपेट

Copy

1

2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>

3<div id="fastcomments-widget" style="width: 100%;height: 100%;"></div>

4<script>

5 (function fcLoad() {

6 function tryLoad() {

7 // bubble tends to change the code snippet to be async

8 const container = document.getElementById('fastcomments-widget');

9 if (!container) {

10 return waitRetry();

11 }

12 if (!window.FastCommentsUI) {

13 return waitRetry();

14 }

15 if (container.fastCommentsSetup) {

16 return;

17 }

18 window.FastCommentsUI(container, {

19 tenantId: 'demo',

20 pageTitle: top.document.title,

21 url: top.location.href,

22 urlId: top.location.pathname

23 });

24 container.fastCommentsSetup = true;

25 }

26 function waitRetry() {

27 setTimeout(tryLoad, 500);

28 }

29 tryLoad();

30 })();

31</script>

32

FastComments कोड डालें

नोट: इस कोड में एक रिट्राई मैकेनिज्म शामिल है ताकि Bubble के डायनामिक वातावरण में FastComments ठीक से लोड हो सके। अन्य कोड स्निपेट काम नहीं करेंगे।

साइन अप करने के बाद 'demo' को अपनी वास्तविक FastComments टेनेंट ID से बदलना न भूलें। यदि आप FastComments.com में लॉग इन हैं, तो यह पहले से बदला हुआ होना चाहिए।

कमेंट विजेट के सही ढंग से प्रदर्शित होने के लिए, हमें HTML एलिमेंट की चौड़ाई (width) को एडजस्ट करने की आवश्यकता है। एलिमेंट के प्रॉपर्टी एडिटर में Layout टैब खोजें।

चौड़ाई (Width) सेटिंग खोजें

Layout टैब में महत्वपूर्ण साइज़िंग विकल्प होते हैं जो हमारे कमेंट विजेट को विभिन्न स्क्रीन साइज़ पर सही ढंग से प्रदर्शित करने में मदद करेंगे।

लेआउट टैब में, चौड़ाई को 100% पर सेट करें। इससे यह सुनिश्चित होता है कि कमेंट विजेट अपने कंटेनर की पूरी चौड़ाई ले ले और विभिन्न स्क्रीन साइज़ के अनुसार ठीक से प्रतिक्रिया दे।

चौड़ाई 100% पर सेट करें

इनपुट मान को 100 (या इच्छित प्रतिशत) में बदलने के बाद, आपको संख्या के बगल में ड्रॉपडाउन पर क्लिक करके इसे पिक्सेल से प्रतिशत में बदलना होगा।

साथ ही, एक न्यूनतम ऊँचाई (जैसे, 400px) सेट करें ताकि यह सुनिश्चित हो सके कि कमेंट विजेट को ठीक से प्रदर्शित होने के लिए पर्याप्त जगह मिले।

ये बदलाव करने के बाद, अपना FastComments विजेट एक्शन में देखने के लिए Preview बटन पर क्लिक करें!

बहुत बढ़िया! आपने अपनी Bubble.io साइट में लाइव कमेंटिंग जोड़ दी है।

यदि आपको permission denied एरर का सामना हुआ है, या आप FastComments को कस्टमाइज़ करना चाहते हैं, तो आगे पढ़ें।

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

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