Ajouter la billetterie sur votre propre site

Introduction

Vous pouvez intégrer le processus de paiement sur votre propre site web : il s’affiche alors en superposition sur le contenu de la page.

Configuration de base

1. Sur votre site, ajoutez un lien classique vers la page de votre événement sur Fienta, par exemple :

   <a href="https://fienta.com/event-name">Acheter des billets</a>

2. Ajoutez la ligne de code suivante à votre site. Les liens vers les événements Fienta s’ouvriront alors directement sur votre site :

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

Vous pouvez avoir plusieurs liens sur votre site pointant vers le même événement ou vers différents événements sur Fienta.
N’incluez le script embed.js qu’une seule fois par page.

Suivi des paramètres UTM

Si un visiteur arrive sur votre site avec des paramètres UTM (par exemple ?utm_source=facebook) et que la page inclut embed.js de Fienta, l’intégration détecte automatiquement ces paramètres et les transmet à Fienta. Vous pouvez ainsi voir la source de vos ventes de billets dans les rapports et le tableau de bord.

Pour un suivi plus fiable, nous recommandons d’ajouter le script embed.js sur toutes les pages de votre site, pas seulement sur celles qui contiennent des liens vers les billets ou qui ouvrent l’intégration.

Les utilisateurs naviguent souvent sur plusieurs pages avant d’acheter, et les paramètres UTM peuvent disparaître de l’URL en cours de route. Le script d’intégration enregistre les valeurs UTM dans le navigateur lorsqu’elles sont présentes et les associe à l’achat plus tard, ce qui assure une attribution correcte même si les paramètres ne sont plus visibles dans l’URL.

Consentement et suivi en mode intégration

Fienta Embed respecte les choix de consentement du visiteur sur votre site. Lorsqu’il est disponible, l’intégration utilise le signal de consentement IAB TCF. Si le TCF est absent, elle peut aussi lire le consentement depuis des CMP courants comme Cookiebot, CookieYes et OneTrust.

Si aucun signal de consentement pris en charge n’est disponible, le suivi reste en mode refusé ou par défaut : les événements marketing et analytiques ne sont pas activés tant qu’aucun consentement n’a été donné.

Aucun code d’intégration personnalisé supplémentaire n’est nécessaire dans les configurations habituelles. Assurez-vous simplement que votre CMP est correctement configuré et chargé sur la page avant embed.js.

Personnalisation

Pour modifier la couleur d’arrière-plan de l’intégration, le rayon des bords et d’autres paramètres, définissez un objet JavaScript comme dans l’exemple suivant. Les valeurs indiquées ici sont les valeurs par défaut.

<script>
window.fientaSettings = {
    // couleur d’arrière-plan de la lightbox
    background: 'rgba(0,0,0,0.5)',
    // rayon des bords du contenu modal
    border_radius: '5px',
    // sélecteur des liens vers les pages d’événements Fienta
    link_selector: 'a[href*="fienta.com"]',
    // nom de la source / référent
    utm_source: 'homepage',
};
</script>
<script src="https://fienta.com/embed.js"></script>

Lors de l’intégration, ne conservez que les paramètres que vous souhaitez modifier.

Afficher la description et l’image de l’événement

Par défaut, l’intégration n’inclut pas la description de l’événement. Vous pouvez l’activer en ajoutant la ligne suivante dans window.fientaSettings :

descriptionEnabled: true,

Pour afficher la description comme vue initiale, ajoutez :

step: 'description',

Pour afficher l’image de l’événement :

imageEnabled: true,

Pour transmettre l’adresse e-mail de l’acheteur :

email: '[email protected]',

Présélectionner un type de billet

Si vous avez plusieurs types de billets, la sélection s’ouvre sans aucun billet présélectionné. Vous pouvez faire présélectionner un type de billet précis en ajoutant le paramètre ticket à l’URL. Par exemple :

<a href="https://fienta.com/event-name?ticket=1234">Acheter des billets</a>

Vous trouverez l’identifiant du type de billet dans la barre d’adresse du navigateur lors de son édition, par exemple https://fienta.com/my/ticket_types/1234/edit

Afficher « Complet » et le nombre de billets disponibles

À chaque chargement de page et après chaque achat de billet, un événement onTicketsAvailableReady est déclenché. Utilisez-le pour afficher le nombre de billets restants ou modifier votre HTML, par exemple en désactivant le lien lorsque les ventes sont terminées.

<script>
window.fientaSettings = {
 onTicketsAvailableReady: function(elem, count) {
 // elem — élément <a> pointant vers l’événement sur fienta.com
 // count - nombre de billets disponibles, valeurs possibles :
 // true - plus de 50 billets disponibles
 // 1 .. 50 - nombre de billets disponibles
 // 0 - événement complet
 // false - vente terminée

// votre code ici
 }
}
</script>
<script src="https://fienta.com/embed.js"></script>

Exemple de code complet

<script>
window.fientaSettings = {
 background: 'rgba(255,0,0,0.5)',
 border_radius: '0',
 onTicketsAvailableReady: function(elem, count) {
 if (count === true) {
 // plus de 50 billets disponibles
 }
 else if (count > 0) {
 elem.text('Il ne reste que ' + count + ' billets');
 }
 else if (count === 0) {
 elem.addClass('disabled').removeAttr('href').text('Complet');
 }
 else if (count === false) {
 elem.addClass('disabled').removeAttr('href').text('Vente terminée');
 }
 }
}
</script>
<script src="https://fienta.com/embed.js"></script>

Ouvrir l’intégration depuis une URL

Vous pouvez partager un lien vers votre site qui ouvre automatiquement l’intégration :

https://your-website.com/page?openEmbed=https://fienta.com/event-name

Intégration dans des systèmes de gestion de contenu

• Wix

• Squarespace