Hvordan integrere timeplanleggingsprogramvare som Calendly, TidyCal eller Youcanbookme

Denne siden viser deg hvordan du integrerer avtaleplanleggingsprogramvare med systeme.io.

Hva du trenger:

• En systeme.io konto
• En salgstrakt-side
• En Calendly-, TidyCal- eller YouCanBook.me-konto

Følgende metode fungerer med Calendly, TidyCal og YouCanBook.me.

Vi bruker Calendly som eksempel.

1. På Calendly-kontoen din: Generer og kopier innbyggingskoden for kalenderen/arrangementet ditt.

2. På din systeme.io konto:

Legg til Raw HTML-elementet på siden din.

Lim inn koden fra kalenderprogramvaren din i 'Raw HTML'-elementet du nettopp la til, og lagre siden.

Til slutt, når du forhåndsviser siden din, vil du se Calendly-kalenderen.

Hvordan integrere Calendly i en popup

Følg de forrige stegene, men legg til et Raw HTML-element i popup-vinduet der du vil at kalenderen din skal vises.

1. I din popup egendefinert kode

Legg til et id    til div    som Calendly gir. Du kan bruke hvilken som helst verdi; Men sørg for at det er unikt for siden.

2. På hovedredaktørens side

Gå til Innstillinger, klikk på Rediger bunntekstkode.

<script>
  document.addEventListener('open_popup', function() {
    Calendly.initInlineWidget({
      url: 'https://calendly.com/YOUR_CALENDLY_LINK',
      parentElement: document.getElementById('calendly-container')
    })
  })
</script>

Hvis du valgte et id    annet enn calendly-container   , sørg for å erstatte det etter at koden er limt inn.

Hvordan integrere TidyCal i en popup

Her er et eksempel:

1. TidyCal leverte en innebygd kode lik den nedenfor:

<div class="tidycal-embed" data-path="YOUR_DATA_PATH"></div>
<script src="https://asset-tidycal.b-cdn.net/js/embed.js"></script>

2. Først, legg til et rå HTML-element i popup-vinduet ditt. Kopier deretter kun følgende linje fra TidyCal-koden din og lim den inn i elementet: <div class="tidycal-embed" data-path="YOUR_DATA_PATH"></div>    og lim den inn i HTML-elementet ditt.

3. Gå deretter til sideinnstillingene og klikk på 'Rediger bunntekstkode'. Du må lime inn resten av koden levert av TidyCal <script src="https://asset-tidycal.b-cdn.net/js/embed.js"></script>    og inkludere utdraget nedenfor:

<script>
  document.addEventListener('open_popup', function(){
    const embedTarget = document.querySelector('div.tidycal-embed')
    window.TidyCal?.init(embedTarget) 
  })
</script>