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

MODX CMS वेबसाइटों के लिए चरण-दर-चरण मार्गदर्शिका

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

चरण 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: MODX टेम्पलेट में जोड़ें (अनुशंसित)

चैटबॉट जोड़ने का अनुशंसित तरीका MODX मैनेजर में अपनी MODX टेम्पलेट को सीधे संपादित करना है:

अपने MODX मैनेजर (एडमिन पैनल) में लॉग इन करें
बाएँ साइडबार में, एलिमेंट > टेम्पलेट पर जाएँ
अपनी साइट की टेम्पलेट खोलें (आमतौर पर "BaseTemplate" या आपकी सक्रिय टेम्पलेट कहलाती है)
टेम्पलेट कोड में क्लोज़िंग </body> टैग खोजें
क्लोज़िंग </body> टैग से ठीक पहले अपना Asyntai एम्बेड कोड पेस्ट करें
टेम्पलेट सहेजने के लिए "सहेजें" पर क्लिक करें

<!-- Your existing template content -->

<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>
</body>
</html>

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

वैकल्पिक विधि 1: MODX चंक का उपयोग करना

एम्बेड कोड को अलग और पुन: प्रयोज्य रखने के लिए आप MODX Chunk का उपयोग कर सकते हैं:

MODX मैनेजर में, एलिमेंट > चंक पर जाएँ
नया चंक बनाने के लिए "नया चंक" पर क्लिक करें
चंक का नाम "asyntaiWidget" रखें
चंक सामग्री क्षेत्र में अपना Asyntai एम्बेड कोड पेस्ट करें
"सहेजें" पर क्लिक करें
अपनी टेम्पलेट खोलें (एलिमेंट > टेम्पलेट के अंतर्गत)
क्लोज़िंग </body> टैग से ठीक पहले चंक कॉल [[$asyntaiWidget]] जोड़ें
टेम्पलेट सहेजें

<!-- In your Template, before </body> -->
[[$asyntaiWidget]]
</body>
</html>

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

वैकल्पिक विधि 2: MODX सिस्टम सेटिंग्स (HTML हेड/फुटर) का उपयोग करना

कुछ MODX सेटअप में सिस्टम सेटिंग्स के माध्यम से फुटर स्क्रिप्ट के लिए प्लेसहोल्डर शामिल होते हैं:

MODX मैनेजर में, सिस्टम > सिस्टम सेटिंग्स पर जाएँ
"htmlhead" द्वारा फ़िल्टर करें या फुटर स्क्रिप्ट के लिए कस्टम सिस्टम सेटिंग खोजें
यदि आपके सेटअप में फुटर स्क्रिप्ट के लिए प्लेसहोल्डर है (जैसे [[++footer_scripts]]), तो आप इसका उपयोग कर सकते हैं
सिस्टम सेटिंग मान को अपने Asyntai एम्बेड कोड पर सेट करें
सुनिश्चित करें कि संबंधित प्लेसहोल्डर [[++footer_scripts]] क्लोज़िंग </body> टैग से पहले आपकी टेम्पलेट में मौजूद है
सिस्टम सेटिंग सहेजें

<!-- In your Template, before </body> -->
[[++footer_scripts]]
</body>
</html>

नोट: यह विधि आपके MODX सेटअप में फुटर स्क्रिप्ट के लिए कस्टम सिस्टम सेटिंग होने पर निर्भर करती है। यदि कोई मौजूद नहीं है, तो आप एक कस्टम सिस्टम सेटिंग बना सकते हैं और [[++setting_key]] सिंटैक्स का उपयोग करके अपनी टेम्पलेट में इसका संदर्भ दे सकते हैं।

वैकल्पिक विधि 3: MODX प्लगइन का उपयोग करना (OnWebPagePrerender)

एक उन्नत दृष्टिकोण के लिए, आप एक MODX प्लगइन बना सकते हैं जो स्वचालित रूप से हर पृष्ठ में चैटबॉट कोड इंजेक्ट करता है:

MODX मैनेजर में, एलिमेंट > प्लगइन पर जाएँ
नया प्लगइन बनाने के लिए "नया प्लगइन" पर क्लिक करें
प्लगइन का नाम "AsyntaiChatbot" रखें
प्लगइन कोड क्षेत्र में निम्नलिखित PHP कोड पेस्ट करें:

$output = &$modx->resource->_output;
$script = '<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>';
$output = str_replace('</body>', $script . '</body>', $output);

"सिस्टम इवेंट" टैब पर क्लिक करें
उस इवेंट पर यह प्लगइन फ़ायर करने के लिए "OnWebPagePrerender" के बगल में बॉक्स चेक करें
"सहेजें" पर क्लिक करें

महत्वपूर्ण: YOUR_WIDGET_ID को अपने Asyntai डैशबोर्ड से अपनी वास्तविक विजेट ID से बदलें। यह प्लगइन रेंडर होने से पहले आपकी MODX साइट के हर पृष्ठ में स्वचालित रूप से चैटबॉट स्क्रिप्ट इंजेक्ट करेगा।

चरण 3: कैश साफ़ करें और सत्यापित करें

ऊपर दी गई किसी भी विधि का उपयोग करके एम्बेड कोड जोड़ने के बाद, आपको MODX कैश साफ़ करना होगा और इंस्टॉलेशन सत्यापित करना होगा:

MODX मैनेजर में, प्रबंधित करें > कैश साफ़ करें पर जाएँ (या शीर्ष मेनू में कैश साफ़ करें आइकन पर क्लिक करें)
अपनी वेबसाइट को नए ब्राउज़र टैब या इनकॉग्निटो विंडो में खोलें
आपको अपने पृष्ठ के नीचे दाएँ कोने में चैट विजेट बटन दिखाई देना चाहिए
यह सुनिश्चित करने के लिए इस पर क्लिक करें कि यह सही ढंग से खुलता और काम करता है

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