Insérer une carte Google
Voici la marche à suivre pour insérer une carte Google interactive sur un site Friweb :
Création de la carte
- Sur le site de Google Maps, rechercher l’adresse qui devra apparaître sur la carte.
- Modifier l’affichage de la carte telle qu’elle devra apparaître sur le site (zoom, cadrage, vue aérienne, etc…)
- Cliquer sur le bouton « Partager », situé dans la barre de gauche
- Cliquer sur l’onglet « Intégrer une carte »
- Cliquer sur « Copier le contenu HTML » pour copier le code dans le presse-papier
Insertion de la carte
- Sur le site Friweb, insérer un bloc de type « HTML personnalisé »
- Coller le contenu du presse-papier dans le champ « Écrire du HTML… »
Personnalisation de la taille de la carte
Afin de personnaliser les dimensions de la carte sur la page, il faut modifier les valeurs situées après les options « width » (largeur) et « height » (hauteur) dans le code qui vient d’être collé dans le champ.
Par défaut, les valeurs sont en pixels, mais il est tout à fait possible d’indiquer un pourcentage en faisant suivre la valeur par le signe %. Ceci peut être pratique pour afficher la carte sur la totalité de la largeur du site (voir exemple ci-dessous).
Exemple
En insérant le code suivant (avec les modifications en gras) :
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d4584.077617427084!2d7.147411212993407!3d46.79952844323854!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x478e69373caa6eb1%3A0x4134e54b99a5cc5a!2sCentre%20Fritic!5e1!3m2!1sfr!2sch!4v1688549259763!5m2!1sfr!2sch" width="100%" height="400" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
On obtient le résultat suivant :