Lippukaupan lisääminen omaan sivustoon (upotus)

Johdanto

Voit lisätä kassaprosessin omaan verkkosivustoon niin, että se avautuu verkkosisältösi päälle:

Perusasetus

1. Verkkosivustollasi lisää tavallinen linkki, joka osoittaa tapahtumasivulle Fientassa, esimerkiksi:

   <a href="https://fienta.com/tapahtuman-nimi">Osta lippuja</a>

2. Lisää seuraava koodirivi verkkosivustollesi. Tämä avaa Fientan tapahtumiin osoittavat linkit suoraan verkkosivustollasi:

   <script src="https://fienta.com/embed.js"></script>

Verkkosivustollasi voi olla monia linkkejä, jotka osoittavat samoihin tai eri tapahtumiin Fientassa.
Sisällytä embed.js vain kerran sivua kohden.

Mukauttaminen

Muuttaaksesi upotuksen taustavärin, reunuksen säteen ja muita parametreja, määritä JavaScript-objekti kuten seuraavassa esimerkissä. Tässä näytetyt arvot ovat oletusarvoja.

<script>
window.fientaSettings = {
    // lightbox taustaväri
    background: 'rgba(0,0,0,0.5)',
    // modaalin sisällön reunuksen säde
    border_radius: '5px',
    // linkkien valitsin, jotka osoittavat Fientan tapahtumasivuille
    link_selector: 'a[href*="fienta.com"]',
    // suosittelijan nimi
    utm_source: 'homepage',
};
</script>
<script src="https://fienta.com/embed.js"></script>

Toteuttaessasi jätä vain ne parametrit, joita haluat muokata.

Tapahtuman kuvauksen ja kuvan näyttäminen

Oletuksena upotus ei sisällä tapahtuman kuvausta. Voit lisätä sen määrittelemällä seuraavan rivin window.fientaSettings-objektissa:

descriptionEnabled: true,

Näyttääksesi kuvauksen alkuperäisnäkymänä, lisää:

step: 'description',

Näyttääksesi tapahtuman kuvan:

imageEnabled: true,

Välittääksesi ostajan sähköpostiosoitteen:

email: '[email protected]',

Tietyn lipun esivalinta

Jos sinulla on useita lipputyyppejä, valintamme avautuu ilman yhtäkään valittua. Voit pakottaa Fientan valitsemaan tietyn lipputyypin lisäämällä "ticket" -parametrin URL-osoitteeseen. Esimerkiksi:

<a href="https://fienta.com/tapahtuman-nimi?ticket=1234">Osta lippuja</a>

Löydät lipputyypin ID:n selaimen osoiteriviltä muokatessasi sitä, esimerkiksi https://fienta.com/my/ticket_types/1234/edit

"Loppuunmyyty" -tekstin ja saatavilla olevien lippujen määrän näyttäminen

Jokaisella sivun latauksella ja vierailijan lippuostolla laukeaa "onTicketsAvailableReady" -tapahtuma. Käytä tätä näyttääksesi jäljellä olevien lippujen määrän tai muokataksesi HTML:ääsi, esimerkiksi poistamalla linkin käytöstä, kun myynti on päättynyt.

<script>
window.fientaSettings = {
 onTicketsAvailableReady: function(elem, count) {
 // elem - HTML a-tagi, joka osoittaa tapahtumaan fienta.comissa
 // count - saatavilla olevien lippujen määrä, mahdolliset arvot:
 // true - kun yli 50 lippua on saatavilla
 // 1 .. 50 - saatavilla olevien lippujen määrä
 // 0 - tapahtuma on loppuunmyyty
 // false - myynti on päättynyt

 // kirjoita koodisi tähän
 }
}
</script>
<script src="https://fienta.com/embed.js"></script>

Esimerkki täydestä koodista

<script>
window.fientaSettings = {
 background: 'rgba(255,0,0,0.5)',
 border_radius: '0',
 onTicketsAvailableReady: function(elem, count) {
 if (count === true) {
 // yli 50 lippua on saatavilla
 }
 else if (count > 0) {
 elem.text('Vain ' + count + ' lippua jäljellä');
 }
 else if (count === 0) {
 elem.addClass('disabled').removeAttr('href').text('Loppuunmyyty');
 }
 else if (count === false) {
 elem.addClass('disabled').removeAttr('href').text('Myynti on päättynyt');
 }
 }
}
</script>
<script src="https://fienta.com/embed.js"></script>

Upotuksen avaaminen URL-osoitteesta

On mahdollista jakaa linkki verkkosivustollesi ja avata upotus automaattisesti:

https://verkkosivustosi.com/sivu?openEmbed=https://fienta.com/tapahtuman-nimi

Lisääminen tiettyihin verkkosisällön hallintajärjestelmiin

• Wix

• Squarespace