Kako integrisati softver za zakazivanje termina kao što su Calendly, TidyCal ili Youcanbookme

Ova stranica vam pokazuje kako da integrišete softver za zakazivanje termina sa systeme.io.

Šta vam je potrebno:

• systeme.io nalog
• Stranica prodajnog levka
• Calendly, TidyCal ili YouCanBook.me nalog

Sledeća metoda funkcioniše sa Calendly, TidyCal i YouCanBook.me.

Koristićemo Calendly kao primer.

1. Na vašem Calendly nalogu: Generišite i kopirajte kod za ugrađivanje vašeg kalendara/događaja.

2. Na vašem systeme.io nalogu:

Dodajte Raw HTML element na vašu stranicu.

Nalepite kod koji vam je obezbedio vaš softver za kalendar u 'Raw HTML' element koji ste upravo dodali, zatim sačuvajte stranicu.

Konačno, kada pregledate vašu stranicu, videćete Calendly kalendar.

Kako integrisati Calendly u popup

Pratite prethodne korake, ali dodajte Raw HTML element u popup gde želite da se pojavi vaš kalendar.

1. U vašem popup custom code

Dodajteid  atribut div  elementu koji vam je obezbedio Calendly. Možete koristiti bilo koju vrednost; međutim, uverite se da je jedinstvena za stranicu.

2. Na glavnoj stranici editora

Idite na Settings, kliknite Edit footer code.

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

Ako ste izabrali ime id različito od calendly-container  uverite se da ga zamenite nakon što nalepite kod.

Kako integrisati TidyCal u popup

Evo primera:

1. TidyCal je obezbedio kod za ugrađivanje sličan onome ispod:

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

2. Prvo, dodajte Raw HTML element u vaš popup. Zatim, kopirajte samo sledeću liniju iz vašeg TidyCal koda i nalepite je u element: <div class="tidycal-embed" data-path="YOUR_DATA_PATH"></div>   i nalepite je u vaš HTML element.

3. Zatim, idite na podešavanja stranice i kliknite 'Edit footer code'. Potrebno je da nalepite ostatak koda koji vam je obezbedio TidyCal <script src="https://asset-tidycal.b-cdn.net/js/embed.js"></script>   i uključite deo koda ispod:

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