« Aucun cookie ni traceur ne doit être déposé avant le recueil du consentement de l’utilisateur », rappelle la CNIL dans ses lignes directrices sur les cookies et autres traceurs. Une iframe Google Maps intégrée directement dans un template page-contact.php viole ce principe dès le chargement de la page : Google dépose des cookies et charge des ressources tierces avant même que le visiteur ait donné le moindre accord, simplement parce que la carte figure dans le gabarit du thème.
Le problème posé par l’intégration classique
L’intégration la plus répandue ressemble à ceci, codée en dur dans le template du thème :
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!..."
width="600"
height="450"
style="border:0;"
loading="lazy">
</iframe>
Même avec un bandeau de consentement affiché par ailleurs sur le site, cette iframe se charge indépendamment de tout choix de l’utilisateur dès que la page contact s’affiche, ce qui rend le bandeau cookie incohérent avec le comportement réel du site.
La recette : un espace réservé cliquable
La solution consiste à remplacer l’iframe par un espace réservé statique, sans aucune requête vers les serveurs de Google, tant que le visiteur n’a pas explicitement choisi d’afficher la carte :
<div class="carte-consentement" data-carte-src="https://www.google.com/maps/embed?pb=!1m18!...">
<p>Cette carte est fournie par Google Maps.</p>
<button type="button" class="carte-activer">Afficher la carte</button>
</div>
Le script associé, chargé via wp_enqueue_script depuis functions.php, ne crée l’iframe qu’au clic, et retient le choix pour la session en cours afin de ne pas redemander le consentement à chaque navigation sur le site :
document.addEventListener( 'click', function( event ) {
if ( ! event.target.classList.contains( 'carte-activer' ) ) {
return;
}
const conteneur = event.target.closest( '.carte-consentement' );
const iframe = document.createElement( 'iframe' );
iframe.src = conteneur.dataset.carteSrc;
iframe.width = '600';
iframe.height = '450';
iframe.style.border = '0';
iframe.loading = 'lazy';
conteneur.replaceWith( iframe );
sessionStorage.setItem( 'consentement_maps', 'oui' );
} );
document.addEventListener( 'DOMContentLoaded', function() {
if ( sessionStorage.getItem( 'consentement_maps' ) === 'oui' ) {
document.querySelectorAll( '.carte-activer' ).forEach( function( bouton ) {
bouton.click();
} );
}
} );
Éviter le saut de mise en page
Un espace réservé de largeur et de hauteur fixes, identiques à celles de l’iframe finale, évite un décalage visuel désagréable au moment du remplacement. Le CSS du thème fixe ces dimensions sur la classe .carte-consentement, pas seulement sur l’iframe qui la remplacera :
.carte-consentement {
width: 600px;
max-width: 100%;
height: 450px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: #f2f2f2;
text-align: center;
}
Ce que cette recette ne couvre pas
Cette approche traite uniquement le cas de la carte Google Maps intégrée au template contact. Elle ne remplace ni le bandeau de recueil de consentement global du site (Google Analytics, réseaux sociaux, autres services tiers), ni la politique de confidentialité qui doit lister l’ensemble des traceurs déposés. Un site peut très bien avoir corrigé sa carte Google Maps et rester non conforme sur d’autres intégrations tierces laissées de côté.
Un texte clair plutôt qu’une simple case
Le texte affiché avant le clic mentionne explicitement le service tiers concerné et invite à consulter sa politique de confidentialité, plutôt que de se contenter d’un bouton « Charger la carte » sans contexte :
Sur nos projets, préciser le nom du service tiers dans l’espace réservé, plutôt qu’un texte générique, réduit sensiblement les questions des clients au moment de la recette RGPD.
En résumé
Une carte intégrée au thème n’échappe pas aux règles de consentement qui s’appliquent au reste du site. Remplacer l’iframe codée en dur par un espace réservé cliquable, avec mémorisation du choix pour la session, aligne le comportement réel du template contact avec ce que le bandeau cookie du site promet par ailleurs.
