Kako integrirati programsko opremo za načrtovanje sestankov, kot so Calendly, TidyCal ali Youcanbookme

Ta stran vas bo naučila, kako integrirati programsko opremo za načrtovanje sestankov v systeme.io.

Kar boste potrebovali:

• Račun systeme.io
• Stran prodajnega lijaka
• Račun Calendly, TidyCal ali YouCanBook.me

Naslednja metoda se lahko uporabi s Calendly, TidyCal & YouCanBook.me

Kot primer bomo uporabili Calendly.

1. Na svojem računu Calendly:

Generirajte in kopirajte HTML kodo svojega načrtovanja sestankov

2. Na svojem računu systeme.io:

Dodajte element "HTML koda" na svojo stran

Postavite kodo, ki jo je zagotovila vaša programska oprema koledarja, na HTML kodo, ki ste jo dodali, nato shranite kodo in svojo stran.

Nazadnje, ko si ogledate svojo stran, boste videli koledar Calendly.

Kako integrirati Calendly v pojavno okno

Sledite vsem prejšnjim korakom in po tem

1. V svoji kodi po meri pojavnega okna

Dodajte atribut id  elementu div , ki ga zagotavlja Calendly. Lahko uporabite katero koli vrednost, vendar se prepričajte, da je edinstvena za stran.

2. Na glavni strani urejevalnika

Pojdite na stran Nastavitve , kliknite Uredi kodo noge  in prilepite kodo tako

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

Če ste izbrali ime id , ki ni calendly-container , se prepričajte, da ga zamenjate po prilepitvi kode.

Kako integrirati TidyCal v pojavno okno

Za jasnost bomo to ponazorili s primerom:

1. Koda, kot je spodnja, je bila zagotovljena s strani TidyCal za integracijo:

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

2. Prva stvar, ki jo morate storiti, je dodati HTML element v pojavno okno, kjer želite dodati svoj koledar, nato kopirajte to vrstico <div class="tidycal-embed" data-path="VAŠA_DATA_PATH"></div>  in jo prilepite v svoj HTML element.

3. Nato pojdite na nastavitve strani in kliknite "Uredi kodo noge". Prilepiti morate preostanek kode, ki jo zagotavlja TidyCal <script src="https://asset-tidycal.b-cdn.net/js/embed.js"></script> , kot tudi dodajanje spodnjega odlomka

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