अपॉइंटमेंट शेड्यूलिंग सॉफ्टवेयर जैसे Calendly, TidyCal या YouCanBookMe को कैसे इंटीग्रेट करें

यह पेज आपको systeme.io पर अपॉइंटमेंट शेड्यूलिंग सॉफ्टवेयर को इंटीग्रेट करने का तरीका सिखाएगा।

आपको ज़रूरत होगी:

एक systeme.io अकाउंट
एक सेल्स फनल पेज
एक Calendly, TidyCal या YouCanBook.me अकाउंट

निम्नलिखित विधि Calendly, TidyCal और YouCanBook.me के साथ लागू की जा सकती है

**हम उदाहरण के लिए Calendly का उपयोग करेंगे।**

1. अपने Calendly अकाउंट पर:

अपने अपॉइंटमेंट शेड्यूलिंग का HTML कोड जनरेट करें और उसे कॉपी करें



2. अपने systeme.io अकाउंट पर:

अपने पेज में "HTML कोड" एलिमेंट जोड़ें।



अपने कैलेंडर सॉफ्टवेयर द्वारा प्रदान किया गया कोड "HTML Code" में डालें जिसे आपने जोड़ा था, फिर कोड को सेव करें और अपने पेज को भी सेव करें।



अंत में, जब आप अपने पेज को प्रीव्यू करेंगे, तो आप Calendly कैलेंडर देखेंगे।



नोट: यह सुविधा बहुत उपयोगी है क्योंकि यह आपको अपने अपॉइंटमेंट शेड्यूलिंग में Facebook पिक्सल जोड़ने की अनुमति देती है, जो कुछ अपॉइंटमेंट शेड्यूलिंग सॉफ्टवेयर के साथ सीधे करना हमेशा संभव नहीं होता है।

Calendly को पॉपअप में इंटीग्रेट कैसे करें

सभी पहले के स्टेप्स का पालन करें और उसके बाद

अपने पॉपअप कस्टम कोड में

Calendly द्वारा प्रदान किए गए div एलिमेंट में id एट्रिब्यूट जोड़ें। आप कोई भी वैल्यू उपयोग कर सकते हैं, हालाँकि, सुनिश्चित करें कि यह पेज के लिए यूनिक हो।



मुख्य एडिटर पेज पर

सेटिंग्स पेज पर जाएं, फूटर कोड एडिट करें पर क्लिक करें, और कोड को इस तरह पेस्ट करें

<script>
  document.addEventListener('open_popup', function() {
    Calendly.initInlineWidget({
      url: 'https://calendly.com/YOUR_CALENDLY_LINK',
      parentElement: document.getElementById('calendly-container')
    })
  })
</script>

यदि आपने calendly-container के अलावा कोई अन्य id नाम चुना है, तो सुनिश्चित करें कि आप कोड पेस्ट करने के बाद इसे रिप्लेस कर दें।

TidyCal को पॉपअप में इंटीग्रेट कैसे करें

स्पष्टता के लिए, हम इसे एक उदाहरण के साथ समझाएंगे:

TidyCal ने इंटीग्रेशन के लिए नीचे दिए गए कोड जैसा एक कोड प्रदान किया:

<div class="tidycal-embed" data-path="YOUR_DATA_PATH"></div>
<script src="https://asset-tidycal.b-cdn.net/js/embed.js"></script>

सबसे पहले, आपको उस पॉपअप में एक HTML एलिमेंट जोड़ना होगा जहाँ आप अपना कैलेंडर जोड़ना चाहते हैं, फिर इस पंक्ति को कॉपी करें <div class="tidycal-embed" data-path="YOUR_DATA_PATH"></div> और इसे अपने HTML एलिमेंट में पेस्ट करें।



फिर, पेज सेटिंग्स पर जाएं और "फूटर कोड एडिट करें" पर क्लिक करें। आपको TidyCal द्वारा प्रदान किए गए शेष कोड <script src="https://asset-tidycal.b-cdn.net/js/embed.js"></script> को पेस्ट करना होगा और नीचे दिए गए स्निपेट को भी जोड़ना होगा:

<script>
  document.addEventListener('open_popup', function(){
    const embedTarget = document.querySelector('div.tidycal-embed')
    window.TidyCal?.init(embedTarget) 
  })
</script>

Updated on: 22/05/2025