Intégration WordPress
Intégrer des campagnes OmniLab dans WordPress avec un bloc HTML personnalisé, un iframe, ou une balise JavaScript réutilisable.
WordPress peut héberger OmniLab comme n'importe quel autre site web. Dans la plupart des projets, vous utiliserez soit un plugin ou un shortcode déjà préparé pour votre déploiement, soit un iframe manuel ou une balise JavaScript collée dans un bloc HTML personnalisé.
Préférez l'option gérée lorsqu'elle existe
Si votre environnement WordPress inclut déjà un plugin ou un shortcode OmniLab, utilisez cette voie en priorité. Elle est généralement plus simple à maintenir que du code d'intégration copié manuellement dans plusieurs pages.
Choisir le bon parcours WordPress
| Option | Idéale lorsque | Propriétaire habituel |
|---|---|---|
| Plugin ou shortcode géré | Votre configuration WordPress inclut déjà une méthode OmniLab approuvée | Administrateur du site |
| HTML personnalisé + iframe manuel | Vous connaissez déjà l'URL OmniLab exacte à charger | Marketeur ou administrateur du site |
| HTML personnalisé + balise JavaScript | Une même page WordPress doit charger différentes campagnes selon l'URL | Administrateur du site ou développeur |
Iframe manuel dans WordPress
Copier l'URL OmniLab finale
Choisissez l'URL de page d'accueil ou l'URL directe de point de contact que vous voulez intégrer, puis ajoutez embedded=1.
Insérer un bloc HTML personnalisé
Dans l'éditeur WordPress, ajoutez un bloc HTML personnalisé ou une autre zone capable d'accepter du code iframe brut.
Coller le code iframe
<iframe
src="https://experience.example.com/<lien-public-de-la-campagne>?embedded=1"
title="Campagne OmniLab"
loading="lazy"
allow="camera; microphone; geolocation"
style="width:100%;min-height:900px;border:0;overflow:hidden"
></iframe>Prévisualiser la vraie page front-end
Prévisualisez la page WordPress dans l'expérience front-end, pas seulement dans l'éditeur, afin de vérifier la mise en page finale et les permissions.
Balise JavaScript réutilisable dans WordPress
Si une même page WordPress doit charger différentes campagnes selon l'URL courante, placez le conteneur OmniLab et la balise player dans un bloc HTML personnalisé, un template de thème, ou une autre zone d'injection de code approuvée.
<div id="omnilab-container"></div>
<script>
(function (b, o, n, u, s) {
var a, t;
a = b.createElement(u);
a.async = 1;
a.src = s;
t = b.getElementsByTagName(u)[0];
t.parentNode.insertBefore(a, t);
o[n] = o[n] || [];
})(document, window, "_om_async", "script", "https://<omnilab-script-host>/omplayer.js");
_om_async.push([
"init",
{
domain: "experience.example.com",
targetId: "omnilab-container",
queryParam: "id",
},
]);
</script>Ce modèle est utile lorsque vous voulez qu'une page WordPress comme /promo affiche différentes campagnes à partir d'URLs telles que :
https://www.example.com/promo?id=summer-campaignhttps://www.example.com/promo?id=summer-campaign%3Fc%3D<touchpoint-id>%26embedded%3D1
Checklist avant publication
- Testez les mises en page desktop et mobile depuis la page publiée.
- Vérifiez les permissions caméra, microphone ou géolocalisation si l'expérience en dépend.
- Contrôlez les cookies, les parcours de connexion et les redirections directement dans la vraie page WordPress.
- Si la page est mise en cache par WordPress ou par un CDN, videz le cache après la mise à jour du code d'intégration.