Content Marketingأنظمة إدارة علاقات العملاء والبياناتالتسويق عبر البريد الإلكتروني والأتمتةالحدث التسويقفيديوهات التسويق والمبيعاتأدوات التسويقتمكين المبيعات

ودية: كيفية تضمين جدول زمني منبثق أو تقويم مضمن في موقع الويب الخاص بك أو موقع WordPress

قبل بضعة أسابيع ، كنت في أحد المواقع ولاحظت عندما نقرت على رابط لتحديد موعد معهم أنه لم يتم نقلي إلى موقع الوجهة ، كان هناك عنصر واجهة مستخدم ينشر Calendly المجدول مباشرة في نافذة منبثقة. هذه أداة رائعة ... الاحتفاظ بشخص ما على موقعك تجربة أفضل بكثير من إعادة توجيهه إلى صفحة خارجية.

ما هو كالودي؟

Calendly يتكامل مباشرة مع الخاص بك مساحة عمل Google أو أي نظام تقويم آخر لإنشاء نماذج جدولة جميلة وسهلة الاستخدام. وأفضل ما في الأمر هو أنه يمكنك تحديد الوقت الذي تسمح فيه لشخص ما بالاتصال بك في التقويم الخاص بك. على سبيل المثال، غالبًا ما يكون لدي بضع ساعات فقط متاحة في أيام محددة للاجتماعات الخارجية.

يعد استخدام برنامج جدولة مثل هذا أيضًا تجربة أفضل بكثير من مجرد ملء نموذج. لاجلي شركة استشارات التحول الرقمي، لدينا أحداث مبيعات جماعية حيث يكون فريق القيادة في الاجتماع. نقوم أيضًا بدمج منصة اجتماعات الويب الخاصة بنا مع Cal Friendly بحيث تتضمن دعوات التقويم جميع روابط الاجتماعات عبر الإنترنت.

أطلقت Cal Friendly برنامجًا نصيًا لعناصر واجهة المستخدم وورقة أنماط تقوم بعمل رائع في تضمين نموذج الجدولة مباشرةً في الصفحة ، أو فتحه من زر ، أو حتى من زر عائم في تذييل موقعك. تمت كتابة البرنامج النصي لـ Cal Friendly بشكل جيد ، لكن الوثائق اللازمة لدمجه في موقعك ليست جيدة على الإطلاق. في الواقع ، أنا مندهش من أن Cal Friendly لم تنشر بعد الإضافات أو التطبيقات الخاصة بها للأنظمة الأساسية المختلفة.

هذا مفيد بشكل لا يصدق. سواء كنت تعمل في خدمات منزلية وترغب في توفير وسيلة لعملائك لتحديد موعدهم ، أو مشاة كلاب ، أو شركة SaaS تريد من الزائرين جدولة عرض توضيحي ، أو شركة كبيرة تضم أعضاء متعددين ، فأنت بحاجة إلى جدولتها بسهولة ... ودية وأدوات التضمين هي أداة خدمة ذاتية رائعة.

كيفية تضمين ودية في موقعك

الغريب ، ستجد فقط الاتجاهات على هذه التضمين في نوع الحدث مستوى وليس مستوى الحدث الفعلي داخل حسابك Cal Friendly. ستجد الرمز في القائمة المنسدلة لإعدادات نوع الحدث في أعلى اليمين.

تضمين ودي

بمجرد النقر فوق ذلك ، سترى خيارات أنواع التضمينات:

تضمين النص المنبثق

إذا حصلت على الشفرة وقمت بتضمينها أينما تريد على موقعك ، فهناك بعض المشكلات.

  • إذا كنت ترغب في استدعاء عدة عناصر واجهة مستخدم مختلفة في صفحة واحدة ... ربما يكون لديك زر يعمل على تشغيل برنامج الجدولة (نص منبثق) بالإضافة إلى زر التذييل (عنصر واجهة مستخدم منبثق) ... ستضيف ورقة الأنماط والبرنامج النصي للزوجين من المرات. هذا غير ضروري.
  • لا يعد استدعاء برنامج نصي خارجي وملف ورقة أنماط مضمن في موقعك أفضل الوسائل لإضافة الخدمة إلى موقعك.

توصيتي هي تحميل ورقة الأنماط وجافا سكريبت في رأسك... ثم استخدام الأدوات الأخرى حيث تكون منطقية في جميع أنحاء موقعك.

كيف تعمل أدوات Cal Friendly

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

<link href="https://calendly.com/assets/external/widget.css" rel="stylesheet">
<script src="https://calendly.com/assets/external/widget.js" type="text/javascript"></script>

ومع ذلك ، إذا كنت تستخدم WordPress ، فستكون أفضل ممارسة هي استخدام ملف functions.php ملف لإدراج البرامج النصية باستخدام أفضل ممارسات WordPress. لذلك ، في القالب الفرعي الخاص بي ، لدي سطور التعليمات البرمجية التالية لتحميل ورقة الأنماط والبرنامج النصي:

wp_enqueue_script('calendly-script', '//assets.calendly.com/assets/external/widget.js', array(), null, true);
wp_enqueue_style('calendly-style', '//assets.calendly.com/assets/external/widget.css' );

سيؤدي ذلك إلى تحميل هذه (وتخزينها مؤقتًا) في جميع أنحاء موقعي. الآن يمكنني استخدام الأدوات التي أريدها.

زر تذييل كاليندى

أريد استدعاء الحدث المحدد بدلاً من نوع الحدث على موقعي ، لذلك أقوم بتحميل النص التالي في تذييل:

<script type="text/javascript">window.onload = function() { Calendly.initBadgeWidget({ url: 'https://calendly.com/link', text: 'Schedule a Consultation', color: '#0069ff', textColor: '#ffffff', branding: false }); }</script>

سترى Calendly ينقسم البرنامج النصي على النحو التالي:

  • URL - الحدث الدقيق الذي أريد تحميله في عنصر واجهة المستخدم الخاص بي.
  • نص - النص الذي أريده على الزر.
  • لون - لون خلفية الزر.
  • لون الخط - لون النص.
  • العلامات التجارية - إزالة العلامة التجارية Cal Friendly.

نافذة منبثقة للنص في كالودي

أريد أيضًا أن يكون هذا متاحًا في جميع أنحاء موقعي باستخدام ارتباط أو زر. للقيام بذلك ، يمكنك استخدام حدث onClick في ملف

Calendly نص المرساة. لدي فئات إضافية لعرضها كزر (لم يظهر في المثال أدناه):

<a href="#" onclick="Calendly.initPopupWidget({url: 'https://calendly.com/link'});return false;">Schedule time with us</a>

يمكن استخدام هذه الرسالة للحصول على عروض متعددة في صفحة واحدة. ربما لديك 3 أنواع من الأحداث التي ترغب في تضمينها ... ما عليك سوى تعديل عنوان URL للوجهة المناسبة وسيعمل.

نافذة منبثقة مضمنة من Cal Friendly

يختلف التضمين المضمن قليلاً من حيث أنه يستخدم div الذي يتم استدعاؤه على وجه التحديد بواسطة الفئة والوجهة.

<div class="calendly-inline-widget" data-url="https://calendly.com/link" style="min-width:320px;height:630px;"></div>

مرة أخرى ، هذا مفيد لأنه يمكن أن يكون لديك عدة divs مع كل منهما Calendly مجدول في نفس الصفحة.

ملاحظة جانبية: أتمنى أن يقوم Cal Friendly بتعديل الطريقة التي تم بها تنفيذ ذلك ، لذا لم يكن من الضروري أن يكون تقنيًا جدًا. سيكون من الرائع أن يكون لديك فئة فقط ثم تستخدم href الوجهة لتحميل الأداة. سيتطلب ذلك ترميزًا مباشرًا أقل عبر أنظمة إدارة المحتوى. لكن ... إنها أداة رائعة (في الوقت الحالي!). على سبيل المثال - ستكون إضافة WordPress ذات الرموز القصيرة مثالية لبيئة WordPress. إذا كنت مهتمًا ، ودي ... يمكنني بسهولة بناء هذا لك!

ابدأ مع Cal Friendly

Douglas Karr

Douglas Karr هو CMO من أوبن إنسايتس ومؤسس Martech Zone. ساعد دوغلاس العشرات من الشركات الناشئة الناجحة في MarTech، وساعد في العناية الواجبة بأكثر من 5 مليارات دولار في عمليات الاستحواذ والاستثمارات في Martech، ويستمر في مساعدة الشركات في تنفيذ وأتمتة استراتيجيات المبيعات والتسويق الخاصة بها. دوغلاس هو أحد خبراء التحول الرقمي المعترف بهم عالميًا وخبير ومتحدث في MarTech. دوغلاس هو أيضًا مؤلف منشور لدليل Dummie وكتاب عن قيادة الأعمال.

مقالات ذات صلة

العودة إلى الزر العلوي
اغلاق

كشف Adblock

Martech Zone قادر على تزويدك بهذا المحتوى دون أي تكلفة لأننا نستثمر موقعنا من خلال عائدات الإعلانات ، والروابط التابعة ، والرعاية. سنكون ممتنين إذا قمت بإزالة مانع الإعلانات الخاص بك أثناء عرض موقعنا.