Calendly: Si të futni një dritare kërcyese të planifikimit ose kalendar të integruar në faqen tuaj të internetit ose në faqen tuaj të WordPress

Miniaplikacioni i planifikimit në mënyrë të rregullt

Disa javë më parë, isha në një sajt dhe vura re kur klikova një lidhje për të caktuar një takim me ta se nuk më çuan në një vend destinacioni, kishte një miniaplikacion që publikonte Calendly planifikues direkt në një dritare kërcyese. Ky është një mjet i shkëlqyeshëm… mbajtja e dikujt në faqen tuaj është një përvojë shumë më e mirë sesa përcjellja e tyre në një faqe të jashtme.

Çfarë është Calendly?

Calendly integrohet drejtpërdrejt me tuajin Hapësira e punës e Google ose një sistem tjetër kalendarimi për të ndërtuar forma planifikimi që janë të bukura dhe të lehta për t'u përdorur. Më e mira nga të gjitha, madje mund të kufizoni kohën kur lejoni dikë të lidhet me ju në kalendarin tuaj. Si shembull, unë shpesh kam vetëm disa orë në dispozicion në ditë specifike për takime të jashtme.

Përdorimi i një planifikuesi si ky është gjithashtu një përvojë shumë më e mirë sesa thjesht plotësimi i një formulari. Për timin firmë konsulente për transformimin dixhital, ne kemi ngjarje të shitjeve në grup ku ekipi drejtues është në takim. Ne gjithashtu integrojmë platformën tonë të takimeve në ueb në Calendly në mënyrë që ftesat në kalendar të përfshijnë të gjitha lidhjet e takimeve në internet.

Calendly ka lançuar një skript miniaplikacioni dhe fletë stili që bën një punë të shkëlqyeshme në futjen e formularit të planifikimit direkt në një faqe, të hapur nga një buton ose edhe nga një buton lundrues në fundin e faqes suaj. Skripti për Calendly është shkruar mirë, por dokumentacioni për ta integruar në faqen tuaj nuk është aspak i mirë. Në fakt, jam i befasuar që Calendly nuk ka publikuar ende shtojcat ose aplikacionet e veta për platforma të ndryshme.

Kjo është tepër e dobishme. Pavarësisht nëse jeni në shërbimet e shtëpisë dhe dëshironi të ofroni një mjet për klientët tuaj që të caktojnë takimin e tyre, një shëtitës qensh, një kompani SaaS që dëshiron që vizitorët të planifikojnë një demonstrim, ose një korporatë e madhe me shumë anëtarë që ju duhet t'i planifikoni lehtësisht… Calendly dhe miniaplikacionet e integruara janë një mjet i shkëlqyer vetëshërbimi.

Si të futni Calendly në faqen tuaj

Çuditërisht, ju do të gjeni vetëm udhëzime në këto embed në Lloji i ngjarjes niveli dhe jo niveli aktual i ngjarjes brenda llogarisë suaj Calendly. Do ta gjeni kodin në listën rënëse për cilësimet e llojit të ngjarjes lart djathtas.

ngulitur calendly

Pasi të klikoni mbi të, do të shihni opsionet për llojet e ngulitjeve:

fut tekstin kërcyes

Nëse e kapni kodin dhe e futni kudo që dëshironi në faqen tuaj, ka disa probleme.

  • Nëse dëshironi të telefononi disa miniaplikacione të ndryshme në një faqe të vetme… ndoshta keni një buton që hap planifikuesin (Teksti kërcyes) si dhe butonin e fundit (Widget popup)... do të shtoni fletën e stilit dhe skriptin disa të kohërave. Kjo është e panevojshme.
  • Thirrja e një skedari skripti të jashtëm dhe fletë stili në linjë në faqen tuaj nuk është mënyra më optimale për të shtuar shërbimin në faqen tuaj.

Rekomandimi im do të ishte të ngarkoni fletën e stilit dhe Javascript në kokën tuaj… më pas përdorni miniaplikacionet e tjera ku kanë kuptim në të gjithë faqen tuaj.

Si funksionojnë miniaplikacionet e Calendly

Calendly ka dy skedarë që nevojiten për t'u futur në faqen tuaj, një fletë stili dhe javascript. Nëse do t'i futni këto në faqen tuaj, unë do të shtoja sa vijon në seksionin kryesor të HTML-së tuaj:

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

Sidoqoftë, nëse jeni në WordPress, praktika më e mirë do të ishte të përdornit tuajin functions.php skedar për të futur skriptet duke përdorur praktikat më të mira të WordPress. Pra, në temën e fëmijës sime, unë kam linjat e mëposhtme të kodit për të ngarkuar fletën e stilit dhe skriptin:

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

Kjo do t'i ngarkojë këto (dhe do t'i ruajë ato) në të gjithë faqen time. Tani mund t'i përdor miniaplikacionet ku do të doja.

Butoni i fundit të Calendly

Unë dua të thërras ngjarjen specifike në vend të llojit të ngjarjes në faqen time, kështu që po ngarkoj skriptin e mëposhtëm në fundin tim:

<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>

Ju do të shihni Calendly skripti zbërthehet si më poshtë:

  • URL – ngjarja e saktë që dua të ngarkoj në miniaplikacionin tim.
  • Tekst – teksti që dua të ketë butoni.
  • Ngjyra – ngjyra e sfondit të butonit.
  • tekstiNgjyra - ngjyra e tekstit.
  • branding – heqja e markës Calendly.

Kalendly's Text Popup

Unë gjithashtu dua që kjo të jetë e disponueshme në të gjithë faqen time duke përdorur një lidhje ose buton. Për ta bërë këtë, ju përdorni një ngjarje onClick në tuaj Calendly tekst ankorues. E imja ka klasa shtesë për ta shfaqur atë si një buton (nuk shihet në shembullin më poshtë):

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

Ky mesazh mund të përdoret për të pasur oferta të shumta në një faqe të vetme. Ndoshta ju keni 3 lloje ngjarjesh që dëshironi të futni… thjesht modifikoni URL-në për destinacionin e duhur dhe do të funksionojë.

Kalendly's Inline Embed Popup

Embed inline është pak më ndryshe në atë që përdor një div që thirret në mënyrë specifike sipas klasës dhe destinacionit.

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

Përsëri, kjo është e dobishme sepse mund të keni div të shumëfishta me secilën Calendly planifikues në të njëjtën faqe.

Shënim anësor: Unë do të doja që Calendly të modifikonte mënyrën se si u zbatua kjo në mënyrë që të mos ishte aq teknike. Do të ishte mirë nëse thjesht mund të kishit një klasë dhe më pas përdorni destinacionin href për të ngarkuar miniaplikacionin. Kjo do të kërkonte më pak kodim të drejtpërdrejtë nëpër sistemet e menaxhimit të përmbajtjes. Por… është një mjet i madh (për momentin!). Për shembull – një shtojcë WordPress me kode të shkurtra do të ishte ideale për një mjedis WordPress. Nëse jeni të interesuar, Calendly… Unë mund ta ndërtoj lehtësisht këtë për ju!

Filloni me Calendly

Mohim përgjegjësie: Unë jam një përdorues i Calendly dhe gjithashtu një bashkëpunëtor i sistemit të tyre. Ky artikull ka lidhje shoqëruese në të gjithë artikullin.