Calendly: Kiel Enigi Planan Ŝprucfenestron aŭ Enigitan Kalendaron En Via Retejo aŭ WordPress-Retejo

Calendly Scheduling Widget

Antaŭ kelkaj semajnoj, mi estis en retejo kaj rimarkis, kiam mi klakis ligilon por plani rendevuon kun ili, ke mi ne estas alportita al celejo, estis fenestraĵo kiu publikigis la Kalge planilo rekte en ŝprucfenestro. Ĉi tio estas bonega ilo... konservi iun en via retejo estas multe pli bona sperto ol plusendi ilin al ekstera paĝo.

Kio estas Calendly?

Kalge integriĝas rekte kun via Gugla Laborspaco aŭ alia kalendara sistemo por konstrui planajn formojn, kiuj estas kaj belaj kaj facile uzeblaj. Plej bone, vi eĉ povas limigi la tempon, kiam vi lasas iun konekti kun vi en via kalendaro. Ekzemple, mi ofte havas nur kelkajn horojn disponeblaj en specifaj tagoj por eksteraj renkontiĝoj.

Uzi planilon kiel ĉi tio ankaŭ estas multe pli bona sperto ol nur plenigi formularon. Por mia cifereca transforma konsilanta firmao, ni havas grupajn vendajn eventojn, kie la gvida teamo estas en la kunveno. Ni ankaŭ integras nian interretan kunvenplatformon al Calendly por ke kalendaraj invitoj inkluzivas ĉiujn retajn kunvenligojn.

Calendly lanĉis fenestraĵo-skripton kaj stilfolion, kiu faras bonegan laboron ĉe enkonstruado de la planformo rekte en paĝon, malfermitan de butono aŭ eĉ de ŝveba butono en la piedlinio de via retejo. La skripto por Calendly estas bone skribita, sed la dokumentado por integri ĝin en vian retejon tute ne estas bona. Fakte, mi miras, ke Calendly ankoraŭ ne eldonis siajn proprajn kromaĵojn aŭ apojn por malsamaj platformoj.

Ĉi tio estas nekredeble utila. Ĉu vi estas en hejmaj servoj kaj volas provizi rimedon por viaj klientoj por plani sian rendevuon, hundpromeniston, SaaS-kompanion, kiu volas, ke vizitantoj planu demonstraĵon, aŭ grandan korporacion kun pluraj membroj, kiujn vi devas facile plani... Calendly kaj la enkonstruaj fenestraĵoj estas bonega memserva ilo.

Kiel Enigi Calendly En Via Retejo

Strange, vi nur trovos direktojn pri ĉi tiuj enkonstruoj ĉe la Eventospeco nivelo kaj ne la reala eventonivelo ene de via Calendly-konto. Vi trovos la kodon en la menuo por la agordoj de la evento-tipo supre dekstre.

calendly enigi

Post kiam vi alklakas tion, vi vidos la eblojn por la specoj de enkonstruoj:

enigi ŝprucfenestran tekston

Se vi kaptas la kodon kaj enigas ĝin kie ajn vi volas en via retejo, estas kelkaj problemoj.

  • Se vi volas nomi kelkajn malsamajn fenestraĵojn sur unu paĝo... eble havas butonon kiu lanĉas la planilon (Popup Text) same kiel la piedpiedan butonon (Popup Widget)... vi aldonos la stilfolion kaj skripton kelkajn. de tempoj. Tio estas nenecesa.
  • Voki eksteran skripton kaj stilfolion enlinia en via retejo ne estas la plej optimuma rimedo por aldoni la servon al via retejo.

Mia rekomendo estus ŝargi la stilfolion kaj Javascript en via kaplinio... poste uzu la aliajn fenestraĵojn kie ili havas sencon tra via retejo.

Kiel Funkcias la Widgets de Calendly

Kalge havas du dosierojn, kiujn oni bezonas por enmeti en vian retejon, stilfolion kaj javaskripton. Se vi intencas enmeti ĉi tiujn en vian retejon, mi aldonus la jenon en la ĉefsekcion de via 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>

Tamen, se vi estas en WordPress, la plej bona praktiko estus uzi vian functions.php dosiero por enmeti la skriptojn utiligante la plej bonajn praktikojn de WordPress. Do, en mia infana temo, mi havas la jenajn liniojn de kodo por ŝargi la stilfolion kaj skripton:

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

Tio ŝarĝos ĉi tiujn (kaj konservos ilin) ​​tra mia retejo. Nun mi povas uzi la fenestraĵojn kie mi ŝatus ilin.

La Pieda Butono de Calendly

Mi volas nomi la specifan eventon prefere ol la eventospecon en mia retejo, do mi ŝargas la sekvan skripton en mia piedlinio:

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

Vi vidos la Kalge manuskripto malkonstruas jene:

  • URL - la ĝusta evento, kiun mi volas ŝargi en mia fenestraĵo.
  • teksto – la tekston, kiun mi volas, ke la butono havu.
  • Koloro - la fonkoloro de la butono.
  • tekstoKoloro - la koloro de la teksto.
  • marko – forigante la Calendly-markon.

Teksta Ŝprucfenestro de Calendly

Mi ankaŭ volas ĉi tion disponebla tra mia retejo per ligilo aŭ butono. Por fari tion, vi uzas onClick-eventon en via Kalge ankroteksto. La mia havas pliajn klasojn por montri ĝin kiel butonon (ne vidita en la ekzemplo sube):

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

Ĉi tiu mesaĝo povas esti uzata por havi plurajn proponojn sur ununura paĝo. Eble vi havas 3 tipojn de eventoj, kiujn vi ŝatus enigi... simple modifi la URL por la taŭga celo kaj ĝi funkcios.

La Inline Enigita Ŝprucfenestron de Calendly

La enlinia embed estas iomete malsama pro tio, ke ĝi uzas div kiu estas specife nomita laŭ klaso kaj celo.

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

Denove, ĉi tio estas utila ĉar vi povas havi plurajn div-ojn kun ĉiu Kalge planilo en la sama paĝo.

Flanka noto: Mi ja deziras, ke Calendly modifis la manieron en kiu tio estis efektivigita, por ke ĝi ne devus esti tiel teknika. Estus bonege, se vi povus simple havi klason kaj poste uzi la celon href por ŝargi la fenestraĵon. Tio postulus malpli rektan kodigon trans enhavadministradsistemoj. Sed... ĝi estas bonega ilo (nuntempe!). Ekzemple - WordPress-aldonaĵo kun mallongaj kodoj estus ideala por WordPress-medio. Se vi interesiĝas, Calendly... Mi povus facile konstrui ĉi tion por vi!

Komencu Kun Calendly

Malgarantio: Mi estas uzanto de Calendly kaj ankaŭ filio por ilia sistemo. Ĉi tiu artikolo havas filiajn ligilojn ĉie en la artikolo.