Calendr: Sut i Wreiddio Popup Amserlennu neu Galendr Mewnosodedig Yn Eich Gwefan neu'ch Safle WordPress

Widget Amserlennu Calendr

Ychydig wythnosau yn ôl, roeddwn i ar safle a sylwais pan wnes i glicio dolen i drefnu apwyntiad gyda nhw na chefais fy nwyn ​​i safle cyrchfan, roedd teclyn a gyhoeddodd y Calendly trefnwr yn uniongyrchol mewn ffenestr naid. Mae hwn yn offeryn gwych ... mae cadw rhywun ar eich gwefan yn brofiad llawer gwell na'u hanfon ymlaen i dudalen allanol.

Beth yw calendr?

Calendly yn integreiddio'n uniongyrchol â'ch Gweithfan Google neu system galendr arall i adeiladu ffurflenni amserlennu sy'n brydferth ac yn hawdd eu defnyddio. Gorau oll, gallwch hyd yn oed gyfyngu ar yr amser y byddwch yn gadael i rywun gysylltu â chi ar eich calendr. Fel enghraifft, yn aml dim ond cwpl o oriau sydd gennyf ar gael ar ddiwrnodau penodol ar gyfer cyfarfodydd allanol.

Mae defnyddio rhaglennydd fel hyn hefyd yn brofiad llawer gwell na llenwi ffurflen yn unig. Am fy cwmni ymgynghori trawsnewid digidol, mae gennym ddigwyddiadau gwerthu grŵp lle mae'r tîm arweinyddiaeth ar y cyfarfod. Rydym hefyd yn integreiddio ein platfform cyfarfod gwe i Calendly fel bod gwahoddiadau calendr yn cynnwys yr holl ddolenni cyfarfod ar-lein.

Mae Calendly wedi lansio sgript teclyn a thaflen arddull sy'n gwneud gwaith gwych wrth ymgorffori'r ffurflen amserlennu yn uniongyrchol mewn tudalen, wedi'i hagor o fotwm, neu hyd yn oed o fotwm arnofio yn nhroedyn eich gwefan. Mae'r sgript ar gyfer Calendly wedi'i ysgrifennu'n dda, ond nid yw'r ddogfennaeth i'w hintegreiddio i'ch gwefan yn dda o gwbl. Mewn gwirionedd, rwy'n synnu nad yw Calendly eto wedi cyhoeddi ei ategion neu ei apiau ei hun ar gyfer gwahanol lwyfannau.

Mae hyn yn hynod ddefnyddiol. P'un a ydych chi mewn gwasanaethau cartref ac eisiau darparu modd i'ch cwsmeriaid drefnu eu hapwyntiad, cerddwr cŵn, cwmni SaaS sydd am i ymwelwyr drefnu demo, neu gorfforaeth fawr gyda nifer o aelodau, mae angen i chi drefnu yn hawdd ... Yn fisol ac mae'r teclynnau gwreiddio yn offeryn hunanwasanaeth gwych.

Sut i Wreiddio'n Calendr Yn Eich Gwefan

Yn rhyfedd iawn, dim ond cyfarwyddiadau ar y gwreiddiau hyn yn y Math o Ddigwyddiad lefel ac nid gwir lefel y digwyddiad yn eich cyfrif Calendr. Fe welwch y cod yn y gwymplen ar gyfer gosodiadau math y digwyddiad ar y dde uchaf.

gwreiddio calendly

Ar ôl i chi glicio ar hynny, fe welwch yr opsiynau ar gyfer y mathau o wreiddiau:

ymgorffori testun naidlen

Os ydych chi'n cydio yn y cod a'i fewnosod olwynion yr hoffech chi ar eich gwefan, mae yna ychydig o faterion.

  • Os ydych chi am alw cwpl o wahanol widgets ar un dudalen ... efallai bod botwm gyda chi sy'n lansio'r rhaglennydd (Popup Text) yn ogystal â'r botwm troedyn (Popup Widget) ... rydych chi'n mynd i ychwanegu'r ddalen arddull a sgriptio cwpl o amseroedd. Mae hynny'n ddiangen.
  • Nid galw sgript allanol a ffeil taflen arddull yn fewnol yn eich gwefan yw'r ffordd fwyaf optimaidd o ychwanegu'r gwasanaeth i'ch gwefan.

Fy argymhelliad fyddai llwytho'r ddalen arddull a Javascript yn eich pennawd ... yna defnyddio'r teclynnau eraill lle maen nhw'n gwneud synnwyr ledled eich gwefan.

Sut mae Widgets Calendly yn Gweithio

Calendly mae dwy ffeil sydd eu hangen i wreiddio yn eich gwefan, taflen arddull a javascript. Os ydych chi'n mynd i fewnosod y rhain yn eich gwefan, byddwn i'n ychwanegu'r canlynol ym mhrif adran eich 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>

Fodd bynnag, os ydych chi yn WordPress, yr arfer gorau fyddai defnyddio'ch functions.php ffeil i fewnosod y sgriptiau gan ddefnyddio arferion gorau WordPress. Felly, yn thema fy mhlentyn, mae gen i'r llinellau cod canlynol i lwytho'r ddalen arddull a'r sgript:

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

Mae hynny'n mynd i lwytho'r rhain (a'u storfa) ledled fy safle. Nawr gallaf ddefnyddio'r teclynnau lle hoffwn eu cael.

Botwm Troedyn Calendly

Rwyf am alw'r digwyddiad penodol yn hytrach na'r math o ddigwyddiad ar fy safle, felly rwy'n llwytho'r sgript ganlynol yn fy nhroedyn:

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

Fe welwch chi'r Calendly mae'r sgript yn torri i lawr fel a ganlyn:

  • URL - yr union ddigwyddiad rydw i eisiau ei lwytho yn fy widget.
  • Testun - y testun yr wyf am i'r botwm ei gael.
  • lliw - lliw cefndir y botwm.
  • testunLliw - lliw y testun.
  • brandio - cael gwared ar y brand Calendly.

Popup Testun Calendly

Rwyf hefyd eisiau i hyn fod ar gael ledled fy safle gan ddefnyddio dolen neu botwm. I wneud hyn, rydych chi'n defnyddio digwyddiad onClick yn eich Calendly testun angor. Mae gan Mine ddosbarthiadau ychwanegol i'w arddangos fel botwm (nas gwelir yn yr enghraifft isod):

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

Gellir defnyddio'r neges hon i gael sawl offrwm ar un dudalen. Efallai bod gennych chi 3 math o ddigwyddiad yr hoffech chi eu hymgorffori ... dim ond addasu'r URL ar gyfer y gyrchfan briodol a bydd yn gweithio.

Popup Embed Inline Calendly

Mae'r gwreiddio mewnlin ychydig yn wahanol yn yr ystyr ei fod yn defnyddio div a elwir yn benodol yn ôl dosbarth a chyrchfan.

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

Unwaith eto, mae hyn yn ddefnyddiol oherwydd gallwch chi gael divs lluosog gyda phob un Calendly trefnwr yn yr un dudalen.

Nodyn ochr: Rwy'n dymuno i Calendly addasu'r ffordd y gweithredwyd hyn felly nid oedd yn rhaid iddo fod mor dechnegol. Byddai'n wych pe gallech chi gael dosbarth yn unig ac yna defnyddio'r href cyrchfan i lwytho'r teclyn. Byddai hynny'n gofyn am godio llai uniongyrchol ar draws systemau rheoli cynnwys. Ond… mae'n arf gwych (am y tro!). Er enghraifft - byddai ategyn WordPress gyda chodau byr yn ddelfrydol ar gyfer amgylchedd WordPress. Os oes gennych ddiddordeb, Calendly ... gallwn yn hawdd adeiladu hwn i chi!

Dechreuwch Gyda Calendly

Ymwadiad: Rwy'n ddefnyddiwr Calendly a hefyd yn aelod cyswllt o'u system. Mae gan yr erthygl hon gysylltiadau cyswllt trwy'r erthygl.