Calendly: ວິທີການຝັງປ໊ອບອັບການກໍານົດເວລາຫຼືປະຕິທິນທີ່ຝັງຢູ່ໃນເວັບໄຊທ໌ຫຼືເວັບໄຊທ໌ WordPress ຂອງທ່ານ

Widget ການກຳນົດເວລາປະຕິທິນ

ສອງສາມອາທິດກ່ອນຫນ້ານີ້, ຂ້ອຍຢູ່ໃນເວັບໄຊທ໌ຫນຶ່ງແລະສັງເກດເຫັນເມື່ອຂ້ອຍຄລິກໃສ່ການເຊື່ອມຕໍ່ເພື່ອກໍານົດເວລານັດຫມາຍກັບພວກເຂົາວ່າຂ້ອຍບໍ່ໄດ້ຖືກນໍາໄປຫາເວັບໄຊທ໌ປາຍທາງ, ມີ widget ທີ່ເຜີຍແຜ່. ປະຕິທິນ ກໍານົດເວລາໂດຍກົງຢູ່ໃນປ່ອງຢ້ຽມປ໊ອບອັບ. ນີ້​ແມ່ນ​ເຄື່ອງ​ມື​ທີ່​ຍິ່ງ​ໃຫຍ່… ການ​ຮັກ​ສາ​ຜູ້​ໃດ​ຜູ້​ຫນຶ່ງ​ຢູ່​ໃນ​ເວັບ​ໄຊ​ຂອງ​ທ່ານ​ເປັນ​ປະ​ສົບ​ການ​ທີ່​ດີກ​ວ່າ​ການ​ສົ່ງ​ຕໍ່​ໃຫ້​ເຂົາ​ເຈົ້າ​ກັບ​ຫນ້າ​ພາຍ​ນອກ.

Calendly ແມ່ນຫຍັງ?

ປະຕິທິນ ປະສົມປະສານໂດຍກົງກັບຂອງທ່ານ Google ພື້ນທີ່ເຮັດວຽກ ຫຼືລະບົບປະຕິທິນອື່ນໆເພື່ອສ້າງຮູບແບບການກໍານົດເວລາທີ່ມີທັງທີ່ສວຍງາມແລະງ່າຍຕໍ່ການໃຊ້. ດີທີ່ສຸດ, ທ່ານຍັງສາມາດຈຳກັດເວລາທີ່ທ່ານໃຫ້ຜູ້ໃດຜູ້ໜຶ່ງເຊື່ອມຕໍ່ກັບທ່ານຢູ່ໃນປະຕິທິນຂອງທ່ານໄດ້. ຕົວຢ່າງ, ຂ້ອຍມັກຈະມີພຽງແຕ່ສອງສາມຊົ່ວໂມງໃນມື້ສະເພາະສໍາລັບການປະຊຸມພາຍນອກ.

ການນໍາໃຊ້ຕົວກໍານົດເວລາແບບນີ້ຍັງເປັນປະສົບການທີ່ດີກ່ວາພຽງແຕ່ຕື່ມແບບຟອມ. ສໍາລັບຂອງຂ້ອຍ ບໍລິສັດທີ່ປຶກສາການຫັນເປັນດິຈິຕອນ, ພວກເຮົາມີກິດຈະກໍາການຂາຍກຸ່ມທີ່ທີມງານຜູ້ນໍາຢູ່ໃນກອງປະຊຸມ. ພວກເຮົາຍັງເຊື່ອມໂຍງເວທີການປະຊຸມເວັບກັບ Calendly ເພື່ອໃຫ້ການເຊີນປະຕິທິນລວມເອົາການເຊື່ອມຕໍ່ການປະຊຸມອອນໄລນ໌ທັງຫມົດ.

Calendly ໄດ້ເປີດຕົວ widget script ແລະ stylesheet ທີ່ເຮັດວຽກໄດ້ດີໃນການຝັງແບບຟອມການກໍານົດເວລາໂດຍກົງໃນຫນ້າ, ເປີດຈາກປຸ່ມ, ຫຼືແມ້ກະທັ້ງຈາກປຸ່ມລອຍຢູ່ໃນສ່ວນທ້າຍຂອງເວັບໄຊທ໌ຂອງທ່ານ. script ສໍາລັບ Calendly ແມ່ນຂຽນໄດ້ດີ, ແຕ່ເອກະສານທີ່ຈະປະສົມປະສານມັນເຂົ້າໄປໃນເວັບໄຊທ໌ຂອງທ່ານແມ່ນບໍ່ດີເລີຍ. ໃນຄວາມເປັນຈິງ, ຂ້າພະເຈົ້າປະຫລາດໃຈທີ່ Calendly ຍັງບໍ່ທັນໄດ້ເຜີຍແຜ່ plugins ຫຼື app ຂອງຕົນເອງສໍາລັບເວທີທີ່ແຕກຕ່າງກັນ.

ນີ້ແມ່ນເປັນປະໂຫຍດ incredibly. ບໍ່ວ່າທ່ານຈະຢູ່ໃນບໍລິການເຮືອນແລະຕ້ອງການສະຫນອງວິທີການສໍາລັບລູກຄ້າຂອງທ່ານເພື່ອກໍານົດເວລານັດຫມາຍຂອງພວກເຂົາ, ຄົນຍ່າງຫມາ, ບໍລິສັດ SaaS ທີ່ຕ້ອງການໃຫ້ຜູ້ເຂົ້າຊົມຈັດຕາຕະລາງການສາທິດ, ຫຼືບໍລິສັດຂະຫນາດໃຫຍ່ທີ່ມີສະມາຊິກຫຼາຍຄົນທີ່ເຈົ້າຕ້ອງການຈັດຕາຕະລາງໄດ້ງ່າຍ… Calendly ແລະ embed widgets ເປັນເຄື່ອງມືການບໍລິການຕົນເອງທີ່ຍິ່ງໃຫຍ່.

ວິທີການຝັງ Calendly ໃນເວັບໄຊຂອງທ່ານ

ແປກ, ທ່ານພຽງແຕ່ຈະຊອກຫາເສັ້ນທາງເຫຼົ່ານີ້ຝັງຢູ່ໃນ ປະເພດເຫດການ ລະດັບ ແລະບໍ່ແມ່ນລະດັບເຫດການຕົວຈິງພາຍໃນບັນຊີ Calendly ຂອງທ່ານ. ທ່ານຈະເຫັນລະຫັດໃນເມນູເລື່ອນລົງສໍາລັບການຕັ້ງຄ່າຂອງປະເພດເຫດການຢູ່ເບື້ອງຂວາເທິງ.

ຝັງ calendly

ເມື່ອ​ທ່ານ​ຄລິກ​ໃສ່​ມັນ​, ທ່ານ​ຈະ​ເຫັນ​ທາງ​ເລືອກ​ສໍາ​ລັບ​ປະ​ເພດ​ຂອງ​ການ​ຝັງ​:

ຝັງຂໍ້ຄວາມປັອບອັບ

ຖ້າທ່ານຈັບລະຫັດແລະຝັງມັນບ່ອນໃດກໍ່ຕາມທີ່ທ່ານຕ້ອງການຢູ່ໃນເວັບໄຊຂອງເຈົ້າ, ມີບັນຫາເລັກນ້ອຍ.

  • ຖ້າທ່ານຕ້ອງການໂທຫາສອງ widget ທີ່ແຕກຕ່າງກັນຢູ່ໃນຫນ້າດຽວ ... ບາງທີອາດມີປຸ່ມທີ່ເປີດຕົວກໍານົດເວລາ (Popup Text) ເຊັ່ນດຽວກັນກັບປຸ່ມ footer (Popup Widget) ... ເຈົ້າຈະເພີ່ມ stylesheet ແລະ script ຄູ່. ຂອງເວລາ. ນັ້ນບໍ່ຈໍາເປັນ.
  • ການໂທຫາໄຟລ໌ script ພາຍນອກ ແລະ stylesheet ໃນແຖວຢູ່ໃນເວັບໄຊຂອງເຈົ້າບໍ່ແມ່ນວິທີທີ່ດີທີ່ສຸດຂອງການເພີ່ມການບໍລິການໃສ່ເວັບໄຊຂອງເຈົ້າ.

ຄໍາແນະນໍາຂອງຂ້ອຍຄືການໂຫລດ stylesheet ແລະ Javascript ໃນ header ຂອງທ່ານ ... ຫຼັງຈາກນັ້ນໃຊ້ widget ອື່ນໆທີ່ພວກເຂົາມີຄວາມຫມາຍໃນທົ່ວເວັບໄຊທ໌ຂອງເຈົ້າ.

ວິທີການເຮັດວຽກຂອງ Widgets Calendly

ປະຕິທິນ ມີສອງໄຟລ໌ທີ່ຈໍາເປັນເພື່ອຝັງເຂົ້າໄປໃນເວັບໄຊທ໌ຂອງເຈົ້າ, ແບບແຜ່ນແລະ javascript. ຖ້າ​ຫາກ​ວ່າ​ທ່ານ​ຈະ​ໃສ່​ເຫຼົ່າ​ນີ້​ເຂົ້າ​ໄປ​ໃນ​ເວັບ​ໄຊ​ຂອງ​ທ່ານ​, ຂ້າ​ພະ​ເຈົ້າ​ຈະ​ເພີ່ມ​ການ​ດັ່ງ​ຕໍ່​ໄປ​ນີ້​ໃນ​ພາກ​ສ່ວນ​ຫົວ​ຂອງ 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. ດັ່ງນັ້ນ, ໃນຫົວຂໍ້ລູກຂອງຂ້ອຍ, ຂ້ອຍມີລະຫັດຕໍ່ໄປນີ້ເພື່ອໂຫລດ stylesheet ແລະ script:

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' );

ວ່າໄປໂຫຼດເຫຼົ່ານີ້ (ແລະ cache ໃຫ້ເຂົາເຈົ້າ) ໃນທົ່ວເວັບໄຊຂອງຂ້າພະເຈົ້າ. ຕອນນີ້ຂ້ອຍສາມາດໃຊ້ widget ທີ່ຂ້ອຍຕ້ອງການ.

ປຸ່ມສ່ວນທ້າຍຂອງ Calendly

ຂ້ອຍຕ້ອງການໂທຫາເຫດການສະເພາະແທນທີ່ຈະເປັນປະເພດເຫດການຢູ່ໃນເວັບໄຊທ໌ຂອງຂ້ອຍ, ດັ່ງນັ້ນຂ້ອຍກໍາລັງໂຫລດສະຄິບຕໍ່ໄປນີ້ຢູ່ໃນສ່ວນທ້າຍຂອງຂ້ອຍ:

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

ທ່ານຈະເຫັນ ປະຕິທິນ script ແບ່ງ​ອອກ​ເປັນ​ດັ່ງ​ຕໍ່​ໄປ​ນີ້​:

  • URL – ເຫດການທີ່ແນ່ນອນທີ່ຂ້ອຍຕ້ອງການໂຫລດໃນ widget ຂອງຂ້ອຍ.
  • ຂໍ້ຄວາມ – ຂໍ້ຄວາມທີ່ຂ້ອຍຕ້ອງການໃຫ້ປຸ່ມມີ.
  • ສີ - ສີ​ພື້ນ​ຖານ​ຂອງ​ປຸ່ມ​.
  • ສີຂໍ້ຄວາມ - ສີຂອງບົດເລື່ອງ.
  • ຍີ່ຫໍ້ - ຖອນການສ້າງຍີ່ຫໍ້ Calendly.

ປັອບອັບຂໍ້ຄວາມຂອງ Calendly

ຂ້າພະເຈົ້າຍັງຕ້ອງການນີ້ມີຢູ່ທົ່ວເວັບໄຊທ໌ຂອງຂ້ອຍໂດຍໃຊ້ການເຊື່ອມຕໍ່ຫຼືປຸ່ມ. ເພື່ອເຮັດສິ່ງນີ້, ທ່ານໃຊ້ເຫດການ onClick ໃນຂອງທ່ານ ປະຕິທິນ ສະມໍຂໍ້ຄວາມ. mine ມີຫ້ອງຮຽນເພີ່ມເຕີມເພື່ອສະແດງມັນເປັນປຸ່ມ (ບໍ່ເຫັນໃນຕົວຢ່າງຂ້າງລຸ່ມນີ້):

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

ຂໍ້ຄວາມນີ້ສາມາດຖືກນໍາໃຊ້ເພື່ອມີການສະເຫນີຫຼາຍໃນຫນ້າດຽວ. ບາງທີທ່ານມີ 3 ປະເພດຂອງເຫດການທີ່ທ່ານຕ້ອງການທີ່ຈະຝັງ ... ພຽງແຕ່ແກ້ໄຂ URL ສໍາລັບປາຍທາງທີ່ເຫມາະສົມແລະມັນຈະເຮັດວຽກ.

Calendly's Inline Embed Popup

ການຝັງຢູ່ໃນເສັ້ນແມ່ນແຕກຕ່າງກັນເລັກນ້ອຍທີ່ມັນໃຊ້ div ທີ່ຖືກເອີ້ນໂດຍສະເພາະໂດຍຫ້ອງຮຽນແລະປາຍທາງ.

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

ອີກເທື່ອຫນຶ່ງ, ນີ້ແມ່ນເປັນປະໂຫຍດເພາະວ່າທ່ານສາມາດມີຫຼາຍ divs ກັບແຕ່ລະຄົນ ປະຕິທິນ ຕາຕະລາງໃນຫນ້າດຽວກັນ.

ຫມາຍເຫດຂ້າງຄຽງ: ຂ້າພະເຈົ້າປາດຖະຫນາ Calendly ແກ້ໄຂວິທີການນີ້ໄດ້ຖືກປະຕິບັດເພື່ອວ່າມັນບໍ່ໄດ້ມີຄວາມຈໍາເປັນທາງດ້ານເຕັກນິກ. ມັນຈະດີຖ້າທ່ານສາມາດມີຫ້ອງຮຽນແລະຫຼັງຈາກນັ້ນໃຊ້ href ປາຍທາງເພື່ອໂຫລດ widget. ນັ້ນຈະຮຽກຮ້ອງໃຫ້ມີລະຫັດໂດຍກົງຫນ້ອຍລົງໃນທົ່ວລະບົບການຄຸ້ມຄອງເນື້ອຫາ. ແຕ່… ມັນເປັນເຄື່ອງມືທີ່ດີ (ສຳລັບຕອນນີ້!). ຕົວຢ່າງ - plugin WordPress ທີ່ມີ shortcodes ຈະເຫມາະສົມສໍາລັບສະພາບແວດລ້ອມ WordPress. ຖ້າເຈົ້າສົນໃຈ, Calendly… ຂ້ອຍສາມາດສ້າງອັນນີ້ໃຫ້ກັບເຈົ້າໄດ້ຢ່າງງ່າຍດາຍ!

ເລີ່ມຕົ້ນດ້ວຍປະຕິທິນ

ການປະຕິເສດຄວາມຮັບຜິດຊອບ: ຂ້ອຍເປັນຜູ້ໃຊ້ຂອງ Calendly ແລະຍັງເປັນສາຂາສໍາລັບລະບົບຂອງພວກເຂົາ. ບົດຄວາມນີ້ມີການເຊື່ອມຕໍ່ເປັນພີ່ນ້ອງກັນຕະຫຼອດບົດຄວາມ.