كيفية إدماج برنامج لجدولة المواعيد مثل Calendly أو TidyCal أو Youcanbookme

ستعلمك هذه الصفحة كيفية إدماج برنامج جدولة المواعيد على systeme.io.

ما ستحتاجه :

-حساب systeme.io

-صفحة مسار المبيعات

-حساب على Calendly أو TidyCal أو YouCanBook.me

يمكن تطبيق الطريقة التالية مع Calendly و TidyCal و YouCanBook.me

سنستخدم Calendly كمثال.

1. على حسابك في Calendly:

قم بإنشاء ونسخ رمز HTML لجدولة المواعيد الخاصة بك

2. على حساب systeme.io الخاص بك :

أضف عنصر " كود HTML" إلى صفحتك

ضع الرمز الذي يوفره برنامج التقويم الخاص بك على كود HTML الذي أضفته، ثم احفظ الكود وصفحتك.

أخيرًا، عند معاينة صفحتك، سترى تقويم Calendly.

ملاحظة: هذه الميزة مفيدة للغاية لأنها تسمح لك بإضافة فيسبوك pixel إلى جدول مواعيدك، وهو أمر غير ممكن دائمًا بشكل مباشر مع بعض برامج جدول المواعيد.

كيفية إدماج Calendly في نافذة

اتبع جميع الخطوات السابقة وبعد ذلك

1. في الرمز المخصّص للنافذة

أضف سمة  id إلى عنصر div الذي يوفره Calendly. يمكنك استخدام أي قيمة، فقط تأكد من أنها مميزة للصفحة.

2. في صفحة المحرر الرئيسية

انتقل إلى إعدادات الصفحة ، واضغط على تعديل رمز أسفل الصفحة ، والصق رمزًا مثل هذا

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

إذا قررت استخدام قيمتك الخاصة بالنسبة للid ، استخدمها في هذا الرمز بدلًا من calendly-container .

كيفية إدماج TidyCal في نافذة

للتوضيح، سوف نعرض مثالاً على ذلك:

1. تم توفير رمز مثل الرمز أدناه من قبل TidyCal للإدماج :

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

2. أول شيء تحتاج إلى القيام به هو إضافة عنصر HTML إلى النافذة حيث تريد إضافة التقويم الخاص بك، ثم انسخ هذا السطر <div class="tidycal-embed" data-path="YOUR_DATA_PATH"></div> والصقه في عنصر HTML الخاص بك.

3. بعد ذلك، انتقل إلى إعدادات الصفحة واضغط على ”تعديل رمز أسفل الصفحة“. تحتاج إلى لصق بقية الكود <script src="https://asset-tidycal.b-cdn.net/js/embed.js"></script> المقدم من TidyCal بالإضافة إلى إضافة المقطع أدناه

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