Si të integroni softuer për caktimin e takimeve si Calendly, TidyCal ose Youcanbookme

Kjo faqe tregon si të integroni një softuer për planifikimin e takimeve me systeme.io.

Çfarë ju nevojitet:

• Një llogari systeme.io
• Një faqe të funnel-it të shitjes
• Një llogari Calendly, TidyCal ose YouCanBook.me

Metoda e mëposhtme funksionon me Calendly, TidyCal dhe YouCanBook.me.

Ne do të përdorim Calendly si shembull.

1. Në llogarinë tuaj Calendly: Gjeneroni dhe kopjoni kodin e integrimit (embed code) për kalendarin/ngjarjen tuaj.

2. Në llogarinë tuaj systeme.io:

Shtoni elementin Raw HTML në faqen tuaj.

Ngjisni kodin e ofruar nga softueri juaj i kalendarit në elementin Raw HTML që sapo shtuat, më pas ruani faqen.

Në fund, kur të shikoni paraprakisht faqen tuaj, do të shihni kalendarin Calendly.

How to integrate Calendly into a popup

Si të integroni Calendly në një popup

Ndiqni hapat e mëparshëm, por shtoni një element Raw HTML në popup-in ku dëshironi të shfaqet kalendari juaj.

1. Në kodin e personalizuar të popup-it

Shtoni një atribut  id  te elementi  div   i ofruar nga Calendly. Mund të përdorni çdo vlerë; megjithatë, sigurohuni që të jetë unike për faqen.

2. Në faqen kryesore të editorit

   Shkoni te Cilësimet, klikoni Ndrysho kodin e footer-it.

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

Nëse keni zgjedhur një emër  id  tjetër përveç  calendly-container , sigurohuni që ta zëvendësoni atë pas ngjitjes së kodit.

Si të integroni TidyCal në një popup

Ja një shembull:

1. TidyCal ofron një kod integrimi të ngjashëm me atë më poshtë:

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

2. Së pari, shtoni një element Raw HTML në popup-in tuaj.Më pas, kopjoni vetëm rreshtin e mëposhtëm nga kodi i TidyCal dhe ngjiseni në elementin tuaj HTML: <div class="tidycal-embed" data-path="YOUR_DATA_PATH"></div>   

3. Pastaj, shkoni te cilësimet e faqes dhe klikoni Ndrysho kodin e footer-it.

   Duhet të ngjisni pjesën tjetër të kodit të ofruar nga TidyCal <script src="https://asset-tidycal.b-cdn.net/js/embed.js"></script>   dhe të përfshini fragmentin më poshtë:

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