Une page d’événement intégrée affiche le pourcentage accompli et le temps restant, et se rafraîchit à chaque chargement par un visiteur. Vous n’avez pas à retoucher l’article après sa publication.
Récupérer le code d’intégration
- Créez un événement.
- Sur la page de l’événement, cliquez sur Intégrer dans la section Partager.
- Choisissez Normal ou Compact et copiez le code.
Le code est une iframe standard qui pointe vers la version intégrable de votre événement :
<iframe src="https://eventcompletion.com/embed/your-event-slug?mode=normal"
width="100%" height="420" frameborder="0" scrolling="no"
title="Progression de l'événement"></iframe>Utilisez mode=compact et une hauteur d’environ 220 pour la carte plus courte.
Méthode 1 : bloc HTML personnalisé
Dans l’éditeur de blocs, ajoutez un bloc HTML personnalisé et collez l’iframe. Cela fonctionne sur tout site WordPress qui permet d’ajouter du HTML à un article.
Méthode 2 : shortcode
Si vous intégrez souvent des événements, ajoutez un petit shortcode au fichier functions.php de votre thème ou à une extension de snippets de code :
function eventcompletion_shortcode($atts) {
$slug = sanitize_title($atts['slug'] ?? '');
$mode = ($atts['mode'] ?? 'normal') === 'compact' ? 'compact' : 'normal';
$height = $mode === 'compact' ? 220 : 420;
return '<iframe src="https://eventcompletion.com/embed/' . esc_attr($slug) . '?mode=' . $mode . '"'
. ' width="100%" height="' . $height . '" frameborder="0" scrolling="no" title="Progression de l\'événement"></iframe>';
}
add_shortcode('eventcompletion', 'eventcompletion_shortcode');Utilisez ensuite [eventcompletion slug="your-event-slug"] ou [eventcompletion slug="your-event-slug" mode="compact"] dans n’importe quel article.
Constructeurs de pages
Le même code d’iframe fonctionne dans le widget HTML d’Elementor, le module Code de Divi et le bloc HTML personnalisé de Gutenberg.
Conseils
- Donnez à l’iframe toute la largeur de son conteneur pour qu’elle s’adapte au mobile.
- Si le contenu est coupé sur petits écrans, augmentez un peu la hauteur.
- Certaines extensions de sécurité bloquent les iframes d’autres domaines. Si l’intégration n’apparaît pas, autorisez
eventcompletion.com.
