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
  1. Sur le site de Google Maps, rechercher l’adresse qui devra apparaître sur la carte.
  2. Modifier l’affichage de la carte telle qu’elle devra apparaître sur le site (zoom, cadrage, vue aérienne, etc…)
  3. Cliquer sur le bouton « Partager », situé dans la barre de gauche
  4. Cliquer sur l’onglet « Intégrer une carte »
  5. Cliquer sur « Copier le contenu HTML » pour copier le code dans le presse-papier
     
Insertion de la carte
  1. Sur le site Friweb, insérer un bloc de type « HTML personnalisé »
  2. 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 :