Télécharger Google Earth

Intégration de cartes à votre site Web

 

Dans le didacticiel "Création de cartes à l'aide de l'onglet Mes cartes", nous vous avons comment montré quelques-unes des utilisations possibles des cartes pour votre organisme. À présent, nous allons vous montrer comment intégrer une carte à votre site Web ou à votre blog (en fonction du pays dans lequel vous vous trouvez). Vous pouvez intégrer à votre site Web une carte simple, un ensemble d'itinéraires routiers, une carte que vous avez créée en utilisant l'onglet "Mes cartes", une carte d'une recherche locale ou encore des cartes créées par d'autres utilisateurs.

 

Mise en route

Vous souhaiterez probablement intégrer la carte directement à votre site. Pour les besoins de ce didacticiel, nous utiliserons à la fois Google Page Creator et Blogger pour montrer comment intégrer votre carte à un site Web ou à un blog. Si vous souhaitez modifier votre propre site directement, toutes les instructions dont vous avez besoin se trouvent dans la première partie de ce didacticiel. Si vous ne possédez pas votre propre site ou si vous souhaitez savoir comment ajouter des cartes à votre blog, vous trouverez des instructions pour y parvenir en utilisant Google Page Creator et Blogger dans ce didacticiel.

1. Accédez à Google Maps. Ouvrez la carte que vous voulez intégrer à votre site Web. Vous pouvez intégrer une carte d'itinéraires routiers, une recherche locale ou une carte que vous avez créée avec l'onglet "Mes cartes". Si vous voulez consulter vos cartes enregistrées, connectez-vous avec votre compte Google. Si vous ne possédez pas de compte Google, ouvrez un compte ici.

Nous allons utiliser la page Santa Cruz Beach Cleanup que nous avons créée dans le didacticiel "Création de cartes à l'aide de l'onglet Mes cartes".

2. Cliquez sur Obtenir l'URL de cette page et copiez le code du champ Collez le code HTML pour l'intégrer sur un site Web. Pour redimensionner et prévisualiser la carte, cliquez sur Personnaliser et prévisualiser la carte intégrée. N'oubliez pas que vous ne pouvez pas intégrer de cartes des conditions de circulation, des images Street View ou des mapplets.

3. Accédez à votre application d'édition de pages Web et recherchez le meilleur endroit où placer la carte sur votre site Web. (Vous trouverez ci-dessous des exemples d'utilisation de Google Page Creator et de Blogger.)

4. Collez le code de la carte que vous avez copié dans le code HTML là où vous souhaitez faire apparaître votre carte sur votre site Web.

5. Enregistrez votre page Web et affichez la carte que vous venez d'intégrer !

mescartes

 

Utilisation de Google Page Creator

1. Accédez à Google Page Creator et connectez-vous avec votre compte Google si vous ne l'avez pas encore fait.

2. Cliquez sur "Create a new page..." (Créer une nouvelle page)

3. Saisissez le titre de votre page et cliquez sur "Create and Edit" (Créer et modifier).

mescartes

4. Cliquez sur la zone dans laquelle vous voulez faire apparaître la carte et cliquez sur "Edit HTML" (Modifier HTML) dans le coin inférieur droit.

mescartes

5. Prenez le texte que vous avez copié dans le champ Collez le code HTML pour l'intégrer sur un site Web et collez-le dans la fenêtre.

6. Cliquez sur Update (Mettre à jour). Notez que vous ne pourrez voir la carte que si vous affichez la page en mode "Preview" (Aperçu) ou "Published" (Publié).
Une fois terminée, votre page devrait ressembler à ceci, bien que votre modèle puisse avoir une apparence différente :

mescartes

C'est tout ! Vous disposez à présent des outils qui vous permettent de partager votre carte avec le monde entier, dans votre domaine.

 

Utilisation de Blogger

1. Accédez à Blogger et ouvrez le tableau de bord de votre blog. Si vous n'avez pas de blog, il est très facile d'en créer un ! Connectez-vous à votre compte Google et effectuez la procédure de création de votre blog.

2. Lorsque vous vous trouvez dans le tableau de bord, ouvrez l'onglet "Publication d'un message" et sélectionnez "Créer".

3. Saisissez le titre du message blog et le texte qui doit accompagner votre carte. Cliquez sur l'onglet "Modifier le code HTML".

4. En revenant à Google Maps, copiez le texte du champ Collez le code HTML pour l'intégrer sur un site Web. Puisque nous souhaitons fournir aux utilisateurs des itinéraires routiers pour se rendre sur la page Santa Cruz Beach Cleanup, nous allons utiliser le code HTML de ce résultat de recherche.

Vous devez vous trouver ici :

blogger

5. Prévisualisez la carte dans le message blog et assurez-vous que tout est conforme à vos souhaits, puis cliquez sur le bouton "Publier le message".

mescartes

Félicitations ! Vous avez intégré une carte à votre message blog.

 

Faites circuler l'information

Maintenant que vous savez comment intégrer des cartes directement à votre site Web ou à votre blog, les visiteurs de votre site peuvent visualiser votre travail.

Si vous avez créé une carte en utilisant l'onglet "Mes cartes", vous avez coché une case intitulée "Publique" ou "Privée". Si vous avez sélectionné "Publique", tous les utilisateurs de Google Maps peuvent voir votre carte. Vous pouvez également voir les cartes des autres utilisateurs. Voici de quelle manière :

1. Ouvrez Google Maps et cliquez sur l'onglet "Mes cartes". Zoomez sur une zone qui vous intéresse.
2. Sous "Contenu sélectionné", cliquez sur "Parcourir les cartes populaires".

En outre, si vous trouvez une carte que vous appréciez, vous pouvez l'enregistrer dans votre onglet Mes cartes.

En savoir plus sur Google Maps et l'intégration des API Google Maps à votre site Web en utilisant JavaScript.

 

Discussions et commentaires

Vous avez des questions à propos de ce didacticiel ? Vous aimeriez nous faire part de vos commentaires ? Consultez le groupe de discussion Google Earth Actions publiques pour discuter avec les autres internautes.

 

Et maintenant ?

Ce didacticiel vous a montré comment intégrer une carte à votre site Web. Vous allez maintenant apprendre comme améliorer vos cartes et vos repères Google Earth en y intégrant des vidéos YouTube.

Vous pouvez également découvrir comment créer des repères Google Earth personnalisés dans le didacticiel suivant :