Webflow में Asyntai AI चैटबॉट कैसे जोड़ें

Webflow वेबसाइटों के लिए चरण-दर-चरण गाइड

प्लेटफ़ॉर्म:

चरण 1: अपना एम्बेड कोड प्राप्त करें

सबसे पहले, अपने Asyntai डैशबोर्ड पर जाएँ और नीचे "Embed Code" अनुभाग तक स्क्रॉल करें। अपना यूनिक एम्बेड कोड कॉपी करें, जो कुछ इस तरह दिखेगा:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

नोट: ऊपर दिया गया कोड केवल एक उदाहरण है। आपको अपने डैशबोर्ड से अपना अद्वितीय एम्बेड कोड कॉपी करना होगा क्योंकि इसमें आपकी व्यक्तिगत विजेट ID होती है।

चरण 2: साइट सेटिंग्स के माध्यम से कोड जोड़ें (सभी पेज)

अपनी Webflow साइट के सभी पेजों पर एक साथ चैटबॉट जोड़ने के लिए:

अपने Webflow खाते में लॉग इन करें और अपना प्रोजेक्ट चुनें
बाएं साइडबार में गियर आइकन (साइट सेटिंग्स) पर क्लिक करें
सेटिंग्स मेनू में "कस्टम कोड" पर क्लिक करें
\"Footer Code\" अनुभाग (</body> टैग से पहले) तक नीचे स्क्रॉल करें
अपना Asyntai एम्बेड कोड पेस्ट करें
"परिवर्तन सहेजें" पर क्लिक करें
परिवर्तन लागू करने के लिए अपनी साइट प्रकाशित करें

सुझाव: फुटर अनुभाग में कोड जोड़ने से यह क्लोजिंग </body> टैग के ठीक पहले आ जाता है, जो चैट विजेट के लिए अनुशंसित है क्योंकि यह आपके पेज लोडिंग को धीमा नहीं करेगा।

वैकल्पिक: पेज-विशिष्ट कस्टम कोड

यदि आप केवल विशिष्ट पृष्ठों पर चैटबॉट चाहते हैं:

Webflow डिज़ाइनर में अपना प्रोजेक्ट खोलें
बाएं साइडबार में पेज पैनल (फ़ोल्डर आइकन) पर क्लिक करें
जिस पेज को आप संपादित करना चाहते हैं उस पर होवर करें और गियर आइकन पर क्लिक करें
"कस्टम कोड" तक नीचे स्क्रॉल करें
अपना Asyntai एम्बेड कोड "Before </body> tag" सेक्शन में पेस्ट करें
"सहेजें" पर क्लिक करें
अपनी साइट प्रकाशित करें

वैकल्पिक: एम्बेड एलीमेंट का उपयोग

आप अपने पेज पर कहीं भी एम्बेड एलीमेंट का उपयोग करके चैटबॉट जोड़ सकते हैं:

Webflow डिज़ाइनर में अपना प्रोजेक्ट खोलें
जोड़ें पैनल खोलने के लिए "+" बटन पर क्लिक करें
"एम्बेड" खोजें या इसे कंपोनेंट्स के अंतर्गत खोजें
एम्बेड एलीमेंट को अपने पेज पर ड्रैग करें
कोड एडिटर में अपना Asyntai एम्बेड कोड पेस्ट करें
"सहेजें और बंद करें" पर क्लिक करें
अपनी साइट प्रकाशित करें

महत्वपूर्ण: एम्बेड एलीमेंट का उपयोग करते समय, आपको इसे प्रत्येक पेज पर जोड़ना होगा जहाँ आप चैटबॉट चाहते हैं। साइट-व्यापी इंस्टॉलेशन के लिए, ऊपर दी गई साइट सेटिंग्स विधि का उपयोग करें।

चरण 3: इंस्टॉलेशन सत्यापित करें

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

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

AI सर्च बार जोड़ना

AI सर्च बार अपना अलग कोड रखने वाला अलग विजेट है। इसे चैट के साथ जोड़ें, या अकेले। इसके लिए Standard या उससे ऊपर का प्लान चाहिए: कम प्लान पर बार दिखता है पर परिणाम नहीं देता।

स्क्रिप्ट टैग में data-replace एट्रिब्यूट जोड़ें, और यह बार आपकी थीम के मौजूदा बार की जगह ले लेगा। इसे Site Settings, Custom Code, Footer में जोड़ें, वही जगह जहां चैट कोड है, जिससे यह क्लोजिंग body टैग से ठीक पहले आ जाता है।

<script src="https://widget.asyntai.com/static/js/search-widget.js" data-asyntai-id="YOUR_WIDGET_ID" data-replace="auto" async></script>

AI सर्च बार की पूरी गाइड पढ़ें