① Votre code
Recherche de votre agenda…
② L’aperçu, avant de coller quoi que ce soit
Voici exactement ce qui s’affichera sur votre site — avec vos dates à vous. Réglez la hauteur qui vous convient : le code du haut se met à jour tout seul.
Nos prochaines dates
Retrouvez-nous près de chez vous.
…la suite de votre page continue ici.
Envie de voir un site complet ? Regardez cet exemple grandeur nature.
③ Où le coller, selon votre site
Le principe est toujours le même : votre site doit accepter un « code d’intégration » — aussi appelé HTML, iframe ou embed. Voici le chemin exact chez les hébergeurs les plus courants.
WordPress
- Ouvrez la page où mettre l’agenda, puis Modifier.
- Cliquez sur le + pour ajouter un bloc.
- Cherchez le bloc « HTML personnalisé ».
- Collez le code dedans, puis Mettre à jour.
Sur l’ancien éditeur, passez de l’onglet « Visuel » à l’onglet « Texte » avant de coller.
Wix
- Ajouter (le +) → Intégrer → Code d’intégration.
- Choisissez « Intégrer un code HTML ».
- Cliquez sur Saisir le code, collez, puis Appliquer.
- Étirez le cadre pour qu’il soit assez haut (environ 560 pixels).
Squarespace
- Sur la page, cliquez sur un point d’insertion puis choisissez le bloc Code.
- Vérifiez que le mode est bien HTML.
- Collez le code et enregistrez.
Jimdo
- Ajouter un élément → Widget / HTML.
- Collez le code dans la zone, puis Enregistrer.
Google Sites
- Menu de droite : Intégrer.
- Onglet « Intégrer le code » (et non « Par URL »).
- Collez, cliquez Suivant, puis Insérer.
Blogger / Overblog
- Créez ou modifiez la page.
- Passez en mode HTML (au lieu de « Rédaction »).
- Collez le code, puis publiez.
Un site fait main (HTML)
Collez le code à l’endroit voulu dans votre page, entre les balises
<body> et </body>. Aucun script à
charger, aucune bibliothèque à installer.
④ Ce qui se passe ensuite
- Vos nouvelles dates s’ajoutent toutes seules : rien à retoucher sur votre site.
- Seules les dates validées apparaissent — vos brouillons restent invisibles.
- Vos visiteurs voient la carte, l’adresse exacte, l’heure et le tarif.
- La carte s’adapte au téléphone comme à l’ordinateur.
Réglages utiles
Changer la hauteur
Dans le code, height="560" est la hauteur en pixels.
Mettez height="420" pour un cadre plus court,
height="700" pour en montrer davantage.
Afficher la page entière plutôt qu’un cadre
Retirez &embed=1 de l’adresse : la page complète s’affiche,
avec le bouton de partage.
Si rien ne s’affiche
- Le cadre est vide ? Vos dates ne sont probablement pas encore validées.
- Le code apparaît en toutes lettres sur la page ? Vous étiez en mode « texte » et non en mode HTML : recommencez avec le bon bloc.
- Votre formule d’hébergement gratuite interdit parfois les intégrations — dans ce cas, mettez simplement le lien.
Une question, un souci d’installation ?
contact@croisee-gps.fr