{"id":23424,"date":"2019-02-05T03:07:47","date_gmt":"2019-02-05T02:07:47","guid":{"rendered":"https:\/\/kinsta.com\/?p=38977"},"modified":"2024-09-19T12:01:42","modified_gmt":"2024-09-19T11:01:42","slug":"google-maps-wordpress","status":"publish","type":"post","link":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/","title":{"rendered":"Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin"},"content":{"rendered":"<p>Vous cherchez un moyen d&rsquo;int\u00e9grer le contenu de Google Maps sur votre site WordPress ?<\/p>\n<p>Comme beaucoup de choses dans WordPress, il y a plusieurs fa\u00e7ons diff\u00e9rentes d&rsquo;int\u00e9grer Google Maps sur votre site selon le type de contenu cartographique que vous souhaitez inclure.<\/p>\n<p>Dans cet article, nous allons commencer par vous montrer comment ajouter Google Maps dans WordPress sans plugin. Ensuite, nous vous recommanderons quelques plugins qui <em>peuvent<\/em> vous aider \u00e0 int\u00e9grer Google Maps, ainsi que certains des avantages de cette approche. Nous nous pencherons \u00e9galement sur la fa\u00e7on d&rsquo;utiliser correctement l&rsquo;API Google Maps, qui est maintenant obligatoire.<\/p>\n<p>Enfin, nous terminerons par quelques consid\u00e9rations de performance pour l&rsquo;utilisation de Google Maps sur WordPress et partagerons quelques conseils sur la fa\u00e7on de garder le chargement de votre site WordPress rapide m\u00eame si vous avez besoin d&rsquo;int\u00e9grer Google Maps.<\/p>\n<p>Vous pouvez cliquer ci-dessous pour acc\u00e9der directement \u00e0 une section sp\u00e9cifique ou simplement lire l&rsquo;ensemble de l&rsquo;article.<\/p>\n<ul>\n<li><a href=\"#google-maps-api\">L&rsquo;API Google Maps est maintenant requise<\/a><\/li>\n<li><a href=\"#withoutplugin\">Comment ajouter Google Maps dans WordPress sans plugin<\/a><\/li>\n<li><a href=\"#plugins\">Plugins Google Maps WordPress qui vous donnent plus de flexibilit\u00e9<\/a><\/li>\n<li><a href=\"#performance\">Les effets de Google Maps sur les performances et conseils pour am\u00e9liorer les performances<\/a><\/li>\n<\/ul>\n<h2><a id=\"google-maps-api\"><\/a>L&rsquo;API Google Maps est maintenant requise<\/h2>\n<p>Depuis le 11 juin 2018, une <strong>cl\u00e9 API est requise pour Google Maps<\/strong>. Si vous avez d\u00e9j\u00e0 impl\u00e9ment\u00e9 Google Maps sur votre site et que cela ne fonctionne plus, cela pourrait en \u00eatre la raison. Ou plut\u00f4t, il manque la cl\u00e9 de l\u2019API. La bonne nouvelle, c&rsquo;est que pour 99% d&rsquo;entre vous, cela devrait toujours \u00eatre gratuit. Vous trouverez ci-dessous les <a href=\"https:\/\/cloud.google.com\/maps-platform\/pricing\/sheet\/\" target=\"_blank\" rel=\"noopener noreferrer\">tarifs de l&rsquo;API Google Maps<\/a>.<\/p>\n<figure style=\"width: 1533px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/prix-de-l-api-google-maps-1.jpg\" alt=\"Prix de l'API Google Maps\" width=\"1533\" height=\"1243\"><figcaption class=\"wp-caption-text\">Prix de l&rsquo;API Google Maps<\/figcaption><\/figure>\n<p>Google vous donne \u00e9galement un cr\u00e9dit r\u00e9current de 200 $ sur votre compte de facturation chaque mois pour compenser vos co\u00fbts d&rsquo;utilisation. Comme vous pouvez le constater, \u00e0 moins que vous ne g\u00e9n\u00e9riez des milliers de requ\u00eates, l&rsquo;utilisation de Google Maps sur votre site ne devrait rien vous co\u00fbter.<\/p>\n<p>Qu&rsquo;est-ce qui a chang\u00e9 d&rsquo;autre ? Rien, mais vous devrez maintenant faire ce qui suit si vous voulez utiliser Google Maps dans WordPress :<\/p>\n<ol>\n<li>Inscrivez-vous sur la console de la plateforme Google Cloud et configurez-le.<\/li>\n<li>Ajoutez vos informations de facturation, m\u00eame si vous ne serez peut-\u00eatre jamais factur\u00e9.<\/li>\n<li>Ajoutez la cl\u00e9 API \u00e0 vos param\u00e8tres de code ou de plugin Google Maps.<\/li>\n<\/ol>\n<h3>Comment obtenir une cl\u00e9 API Google Maps<\/h3>\n<p>Vous trouverez ci-dessous les \u00e9tapes \u00e0 suivre pour obtenir votre cl\u00e9 API Google Maps.<\/p>\n<h3>\u00c9tape 1<\/h3>\n<p>Acc\u00e9dez \u00e0 la <a href=\"https:\/\/cloud.google.com\/console\/google\/maps-apis\/overview\" target=\"_blank\" rel=\"noopener noreferrer\">console de la plateforme Google Cloud<\/a>. Si vous n&rsquo;avez pas encore de compte, cr\u00e9ez-en un, c&rsquo;est gratuit.<\/p>\n<h3>\u00c9tape 2<\/h3>\n<p>S\u00e9lectionnez ou cr\u00e9ez un projet.<\/p>\n<h3>\u00c9tape 3<\/h3>\n<p>Configurez votre compte de facturation. M\u00eame s&rsquo;ils exigent que vous mettiez une carte de cr\u00e9dit dans votre dossier, vous ne devriez jamais \u00eatre factur\u00e9, \u00e0 moins que vous ne d\u00e9passiez les limites d&rsquo;utilisation \u00e9lev\u00e9es.<\/p>\n<h3>\u00c9tape 4<\/h3>\n<p>Il vous sera demand\u00e9 de choisir un ou plusieurs produits. Cela d\u00e9pend du type de carte que vous utilisez. Par exemple, si vous int\u00e9grez une carte sur votre site WordPress <a href=\"#withoutplugin\" target=\"_blank\" rel=\"noopener noreferrer\">sans plugin<\/a> (comme indiqu\u00e9 dans les \u00e9tapes ci-dessous), vous devez choisir \u00ab\u00a0Maps Embed API\u00a0\u00bb.<\/p>\n<figure style=\"width: 1536px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/maps-embed-api.png\" alt=\"Maps Embed API\" width=\"1536\" height=\"878\"><figcaption class=\"wp-caption-text\">Maps Embed API<\/figcaption><\/figure>\n<p>Si vous utilisez un plugin comme <a href=\"#plugins\" target=\"_blank\" rel=\"noopener noreferrer\">Google Maps Widget<\/a> (comme indiqu\u00e9 dans les \u00e9tapes ci-dessous), vous devez choisir l&rsquo;API statique de Google Maps.<\/p>\n<p>Si vous utilisez un plugin ou un th\u00e8me tiers, ils doivent avoir de la documentation sur le type de d\u00e9ploiement de Google Maps qu&rsquo;ils utilisent. Ne vous inqui\u00e9tez pas, vous pouvez toujours ajouter plusieurs types et les changer plus tard.<\/p>\n<h3>\u00c9tape 5<\/h3>\n<p>Cliquez sur \u00ab\u00a0Activer\u00a0\u00bb.<\/p>\n<figure style=\"width: 1444px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/activer-l-api-google-maps.png\" alt=\"Activer l'API Google Maps\" width=\"1444\" height=\"411\"><figcaption class=\"wp-caption-text\">Activer l&rsquo;API Google Maps<\/figcaption><\/figure>\n<h3>\u00c9tape 6<\/h3>\n<p>Cliquez sur \u00ab\u00a0APIs\u00a0\u00bb puis sous \u00ab\u00a0Credentials\u00a0\u00bb, vous verrez votre cl\u00e9 API.<\/p>\n<figure style=\"width: 2229px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/cle-api-google-maps.png\" alt=\"Cl\u00e9 API Google Maps\" width=\"2229\" height=\"690\"><figcaption class=\"wp-caption-text\">Cl\u00e9 API Google Maps<\/figcaption><\/figure>\n<h3>\u00c9tape 7<\/h3>\n<p>Si vous int\u00e9grez simplement votre cl\u00e9 API Google Maps, elle appara\u00eetra en texte clair dans votre code source. Par cons\u00e9quent, vous devriez restreindre cela, sinon, les gens pourraient utiliser votre cl\u00e9 API sur leur site WordPress ou des projets et faire augmenter votre utilisation.<\/p>\n<p>Pour ce faire, cliquez simplement sur le nom de votre cl\u00e9 API et vous pourrez ajouter une restriction. Pour votre site WordPress, le simple ajout d&rsquo;un domaine HTTP devrait suffire. Comme <code>https:\/\/votredomaine.com\/*<\/code>. Cela lui permettra d&rsquo;effectuer uniquement des appels sur votre site Web.<\/p>\n<figure style=\"width: 1438px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/restriction--cle-api-google-maps.png\" alt=\"Restriction de la cl\u00e9 de l'API Google Maps\" width=\"1438\" height=\"1000\"><figcaption class=\"wp-caption-text\">Restriction de la cl\u00e9 de l&rsquo;API Google Maps<\/figcaption><\/figure>\n<h2><a id=\"withoutplugin\"><\/a>Comment faire pour ajouter Google Maps dans WordPress sans un plugin<\/h2>\n<p>Si vous souhaitez simplement int\u00e9grer une carte simple et n&rsquo;avez pas besoin de fonctionnalit\u00e9s plus d\u00e9taill\u00e9es comme des marqueurs de localisation personnalis\u00e9s ou d&rsquo;autres annotations, vous pouvez int\u00e9grer Google Maps sans plugin en utilisant le site Web normal de Google Maps que vous utilisez quotidiennement.<\/p>\n<p>Voici comment cela fonctionne\u2026<\/p>\n<h3>\u00c9tape 1 : Copier le code d&rsquo;int\u00e9gration de Google Maps<\/h3>\n<p>Pour commencer, utilisez le site Web de Google Maps pour cr\u00e9er la carte que vous souhaitez int\u00e9grer.<\/p>\n<p>Par exemple, si vous souhaitez int\u00e9grer un marqueur de lieu, ouvrez ce lieu dans Google Maps. Ou, si vous voulez incorporer des directions, ouvrez les directions dans Google Maps.<\/p>\n<p>Une fois que vous avez la carte que vous voulez int\u00e9grer, cliquez sur le menu hamburger dans le coin sup\u00e9rieur gauche :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/acceder-au-code-d-integration.png\" alt=\"Comment acc\u00e9der au code d'int\u00e9gration\" width=\"1050\" height=\"654\"><figcaption class=\"wp-caption-text\">Comment acc\u00e9der au code d&rsquo;int\u00e9gration<\/figcaption><\/figure>\n<p>Dans la liste des \u00e9l\u00e9ments de menu, s\u00e9lectionnez l&rsquo;option <strong>Partager ou Int\u00e9grer la carte<\/strong> :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/options-d-integration.png\" alt=\"Ouvrez les options d'int\u00e9gration\" width=\"1050\" height=\"768\"><figcaption class=\"wp-caption-text\">Ouvrez les options d&rsquo;int\u00e9gration<\/figcaption><\/figure>\n<p>Cela ouvrira une fen\u00eatre contextuelle <strong>Partager<\/strong>, Dans cette fen\u00eatre contextuelle, cliquez sur l&rsquo;onglet\u00a0<strong>Int\u00e9grer une carte<\/strong>.<\/p>\n<p>Ensuite, vous pouvez choisir la taille d\u00e9sir\u00e9e \u00e0 l&rsquo;aide du menu d\u00e9roulant. Pour la plupart des sites WordPress, la taille par d\u00e9faut fonctionne bien, mais vous pouvez agrandir ou r\u00e9duire la carte si n\u00e9cessaire.<\/p>\n<p>Une fois que vous avez fait cela, cliquez sur le bouton <strong>Copier HTML<\/strong> pour copier le code d&rsquo;int\u00e9gration :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/code-d-integration-de-google-maps.png\" alt=\"Le code d'int\u00e9gration de Google Maps\" width=\"1050\" height=\"762\"><figcaption class=\"wp-caption-text\">Le code d&rsquo;int\u00e9gration de Google Maps<\/figcaption><\/figure>\n<p>Vous devrez ensuite ajouter votre cl\u00e9 API dans le code. Votre code devrait donc ressembler \u00e0 ceci :<\/p>\n<pre>YOUR_API_KEY&parameters allowfullscreen&gt;<\/pre>\n<h3><a id=\"addcode\"><\/a>\u00c9tape 2 : Ajouter le code d\u2019int\u00e9gration de Google Maps au site WordPress<\/h3>\n<p>Maintenant, tout ce que vous avez \u00e0 faire est d&rsquo;ajouter ce code d&rsquo;int\u00e9gration \u00e0 votre site WordPress dans l\u2019article ou la page o\u00f9 vous voulez inclure votre carte.<\/p>\n<p>Si vous utilisez le <a href=\"https:\/\/kinsta.com\/fr\/blog\/editeur-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener noreferrer\">nouvel \u00e9diteur de blocs WordPress Gutenberg<\/a> qui a \u00e9t\u00e9 publi\u00e9 avec WordPress 5.0, vous pouvez le faire en ajoutant un bloc <strong>HTML personnalis\u00e9<\/strong> et en collant le code d&rsquo;int\u00e9gration dans le bloc. <strong>N&rsquo;oubliez pas d&rsquo;ajouter votre cl\u00e9 API<\/strong>.<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/code-d-integration-gutenberg.png\" alt=\"Comment ajouter le code d'int\u00e9gration dans l'\u00e9diteur de blocs WordPress\" width=\"1050\" height=\"562\"><figcaption class=\"wp-caption-text\">Comment ajouter le code d&rsquo;int\u00e9gration dans l&rsquo;\u00e9diteur de blocs WordPress<\/figcaption><\/figure>\n<p>Vous pouvez pr\u00e9visualiser l&rsquo;apparence de votre carte en cliquant sur le bouton <strong>Pr\u00e9visualisation<\/strong> au-dessus du bloc.<\/p>\n<p>Si vous <a href=\"https:\/\/kinsta.com\/fr\/blog\/desactiver-editeur-gutenberg-wordpress\/\" target=\"_blank\" rel=\"noopener noreferrer\">utilisez toujours l&rsquo;\u00e9diteur TinyMCE classique<\/a>, vous pouvez ajouter le code d&rsquo;int\u00e9gration de Google Maps en ouvrant l&rsquo;onglet <strong>Texte<\/strong> et en y collant le code :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/code-d-integration-editeur-classique.png\" alt=\"Comment ajouter le code d'int\u00e9gration dans l'\u00e9diteur WordPress Classique\" width=\"1050\" height=\"577\"><figcaption class=\"wp-caption-text\">Comment ajouter le code d&rsquo;int\u00e9gration dans l&rsquo;\u00e9diteur WordPress Classique<\/figcaption><\/figure>\n<p>Une fois le code ajout\u00e9, vous pouvez retourner \u00e0 l&rsquo;onglet <strong>Visuel<\/strong> pour voir un aper\u00e7u en direct de votre carte.<\/p>\n<p>Et c&rsquo;est tout ! Vous venez d&rsquo;apprendre comment ajouter Google Maps dans WordPress sans plugin.<\/p>\n<h2>Utiliser Google My Maps pour int\u00e9grer des cartes plus compliqu\u00e9es sans plugin<\/h2>\n<p>Si vous voulez \u00eatre plus cr\u00e9atif quand il s&rsquo;agit de choses comme les marqueurs de localisation multiples, les annotations personnalis\u00e9es, etc., vous pouvez toujours le faire sans avoir besoin d&rsquo;un plugin avec le service My Maps de Google.<\/p>\n<p>My Maps est un outil officiel de Google qui vous permet de cr\u00e9er et de partager vos propres cartes personnalis\u00e9es. Avec lui, vous pourriez cr\u00e9er quelque chose comme l&rsquo;exemple ci-dessous, avec beaucoup de marqueurs personnalis\u00e9s et d&rsquo;informations personnalis\u00e9es qui s&rsquo;affichent lorsqu&rsquo;un utilisateur clique sur un marqueur :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/exemple-google-maps-my-maps.png\" alt=\"Exemple Google My Maps\" width=\"1050\" height=\"686\"><figcaption class=\"wp-caption-text\">Exemple Google My Maps<\/figcaption><\/figure>\n<p>Voici comment l&rsquo;utiliser pour ajouter des Google Maps personnalis\u00e9s \u00e0 WordPress.<\/p>\n<h3>\u00c9tape 1 : Cr\u00e9er votre carte dans Google My Maps<\/h3>\n<p>Pour commencer, rendez-vous sur <a href=\"https:\/\/www.google.com\/maps\/about\/mymaps\/\" target=\"_blank\" rel=\"noopener noreferrer\">Google My Maps<\/a> et cr\u00e9ez une nouvelle carte. De l\u00e0, vous pouvez utiliser l&rsquo;interface du constructeur de carte pour construire votre carte :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/l-interface-google-my-maps.png\" alt=\"L'interface Google My Maps\" width=\"1050\" height=\"571\"><figcaption class=\"wp-caption-text\">L&rsquo;interface Google My Maps<\/figcaption><\/figure>\n<p>Bien que nous n&rsquo;en parlerons pas en d\u00e9tail, cette interface vous permet de cr\u00e9er des cartes assez cr\u00e9atives. Pour un examen plus approfondi, <a href=\"https:\/\/www.google.com\/earth\/outreach\/learn\/visualize-your-data-on-a-custom-map-using-google-my-maps\/\" target=\"_blank\" rel=\"noopener noreferrer\">cet article d&rsquo;aide de Google<\/a> couvre une grande partie des fonctionnalit\u00e9s importantes.<\/p>\n<h3>\u00c9tape 2 : G\u00e9n\u00e9rer le code d&rsquo;int\u00e9gration<\/h3>\n<p>Une fois que vous avez fini de construire votre carte, vous devez g\u00e9n\u00e9rer le code d&rsquo;int\u00e9gration.<\/p>\n<p>Avant de pouvoir obtenir ce code, vous devez d&rsquo;abord rendre votre carte publique. Pour ce faire, cliquez sur le bouton <strong>Partager<\/strong>. Ensuite, cliquez sur <strong>Modifier<\/strong>&#8230; dans la fen\u00eatre contextuelle :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/parametres-de-partage-de-google-my-maps.png\" alt=\"Param\u00e8tres de partage de Google My Maps\" width=\"1050\" height=\"352\"><figcaption class=\"wp-caption-text\">Param\u00e8tres de partage de Google My Maps<\/figcaption><\/figure>\n<p>Ensuite, s\u00e9lectionnez <strong>On &#8211; Public on the Web<\/strong> et cliquez sur <strong>Save<\/strong> :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/activer-le-partage-de-liens.png\" alt=\"Activer le partage de liens\" width=\"1050\" height=\"667\"><figcaption class=\"wp-caption-text\">Activer le partage de liens<\/figcaption><\/figure>\n<p>Une fois que vous avez fait cela, cliquez sur le menu d\u00e9roulant pr\u00e8s du titre de votre carte et s\u00e9lectionnez <strong>Int\u00e9grer sur mon site<\/strong> pour g\u00e9n\u00e9rer le code d&rsquo;int\u00e9gration :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/acceder-au-code-d-integration-de-my-maps.png\" alt=\"Acc\u00e9der au code d'int\u00e9gration de My Maps\" width=\"1050\" height=\"469\"><figcaption class=\"wp-caption-text\">Acc\u00e9der au code d&rsquo;int\u00e9gration de My Maps<\/figcaption><\/figure>\n<p>Une fois que vous avez fait cela, cliquez sur le menu d\u00e9roulant pr\u00e8s du titre de votre carte et s\u00e9lectionnez <strong>Int\u00e9grer sur mon site<\/strong> pour g\u00e9n\u00e9rer le code d&rsquo;int\u00e9gration :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/le-code-d-integration-de-my-maps.png\" alt=\"Le code d'int\u00e9gration de My Maps\" width=\"1050\" height=\"586\"><figcaption class=\"wp-caption-text\">Le code d&rsquo;int\u00e9gration de My Maps<\/figcaption><\/figure>\n<h3>\u00c9tape 3 : Ajouter le code d&rsquo;int\u00e9gration au site WordPress<\/h3>\n<p>Maintenant, vous pouvez ajouter ce code d&rsquo;int\u00e9gration \u00e0 votre site WordPress tout comme vous le feriez avec le code d&rsquo;int\u00e9gration que vous obtenez sur le site Google Maps normal.<\/p>\n<p>Si vous n&rsquo;\u00eates pas s\u00fbr de savoir comment faire, <a href=\"#addcode\" rel=\"noopener\">cliquez ici pour acc\u00e9der \u00e0 la section du tutoriel ci-dessus<\/a>.<\/p>\n<h2><a id=\"plugins\"><\/a>Utiliser plut\u00f4t un plugin WordPress Google Maps<\/h2>\n<p>Au-del\u00e0 des m\u00e9thodes manuelles ci-dessus, il existe \u00e9galement des tonnes de plugins WordPress Google Maps qui peuvent vous aider \u00e0 int\u00e9grer des cartes sur votre site.<\/p>\n<p>Il y a quelques raisons pour lesquelles vous devrez peut-\u00eatre consid\u00e9rer l&rsquo;un de ces plugins plut\u00f4t que les m\u00e9thodes manuelles :<\/p>\n<ul>\n<li>Ils vous permettent de cr\u00e9er des cartes plus complexes avec une interface simple.<\/li>\n<li>Vous pouvez tout faire sans avoir \u00e0 quitter votre tableau de bord WordPress.<\/li>\n<li>Certains d&rsquo;entre eux sont li\u00e9s \u00e0 WordPress. Par exemple, vous pourriez \u00eatre en mesure de lier des marqueurs de carte aux articles WordPress.<\/li>\n<li>Certains d&rsquo;entre eux peuvent vous aider \u00e0 optimiser les performances de Google Maps (<em>nous y reviendrons plus loin<\/em>).<\/li>\n<\/ul>\n<p>Pour tous ces plugins, vous devrez g\u00e9n\u00e9rer votre propre cl\u00e9 API Google Maps avant de pouvoir commencer \u00e0 int\u00e9grer des cartes. <a href=\"https:\/\/supsystic.com\/documentation\/create-google-maps-api-key\/\" target=\"_blank\" rel=\"noopener noreferrer\">Ce tutoriel<\/a> vous montre comment faire.<\/p>\n<h3>Google Maps Widget<\/h3>\n<p><a href=\"https:\/\/wordpress.org\/plugins\/google-maps-widget\/\" target=\"_blank\" rel=\"noopener noreferrer\">Google Maps Widget<\/a> est un simple plugin Google Maps qui vous permet d&rsquo;int\u00e9grer une carte \u00e0 l&rsquo;aide de l&rsquo;API Google Maps Static, qui offre une approche plus performante en int\u00e9grant une image statique plut\u00f4t qu&rsquo;une carte interactive (<em>nous en parlerons dans la section suivante<\/em>).<\/p>\n<p>C&rsquo;est une excellente option si vous voulez quelque chose de simple et l\u00e9ger. Une fois que vous l&rsquo;aurez activ\u00e9, vous devrez r\u00e9cup\u00e9rer votre <a href=\"#google-maps-api\">cl\u00e9 API Google Maps<\/a> et la brancher dans les param\u00e8tres du plugin. Vous pouvez ajouter une carte Google Map \u00e0 n&rsquo;importe quel widget de votre site. Ensuite, les visiteurs peuvent ouvrir une version interactive plus grande de la carte :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/l-interface-de-google-maps-widget.png\" alt=\"L'interface de Google Maps Widget\" width=\"1050\" height=\"763\"><figcaption class=\"wp-caption-text\">L&rsquo;interface de Google Maps Widget<\/figcaption><\/figure>\n<p>Vous pouvez \u00e9galement utiliser une carte interactive imm\u00e9diatement si vous le souhaitez, et la version Pro vous permet d&rsquo;int\u00e9grer des cartes n&rsquo;importe o\u00f9 sur votre site avec un shortcode.<\/p>\n<h3>Google Maps Easy<\/h3>\n<p><a href=\"https:\/\/wordpress.org\/plugins\/google-maps-easy\/\" target=\"_blank\" rel=\"noopener noreferrer\">Google Maps Easy<\/a> vous aide \u00e0 cr\u00e9er des cartes personnalis\u00e9es avec vos propres marqueurs et annotations.<\/p>\n<p>Lorsque vous ajoutez des marqueurs, vous avez la possibilit\u00e9 de t\u00e9l\u00e9charger vos propres ic\u00f4nes personnalis\u00e9es, d&rsquo;inclure du texte et des images dans la description du marqueur, et bien plus encore. Vous pouvez \u00e9galement contr\u00f4ler le fonctionnement de votre carte, par exemple en choisissant de laisser les utilisateurs zoomer ou non :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/interface-google-maps-easy.png\" alt=\"Interface Google Maps Easy\" width=\"1050\" height=\"656\"><figcaption class=\"wp-caption-text\">Interface Google Maps Easy<\/figcaption><\/figure>\n<p>Une fois que vous avez construit votre carte, vous pouvez l&rsquo;int\u00e9grer en utilisant soit un shortcode, soit une fonction PHP.<\/p>\n<h3>Intergeo<\/h3>\n<p>\u00a0<\/p>\n<p><a href=\"https:\/\/wordpress.org\/plugins\/intergeo-maps\/\" target=\"_blank\" rel=\"noopener noreferrer\">Intergeo<\/a> est une autre option populaire qui vous permet de cr\u00e9er vos propres cartes avec des marqueurs personnalis\u00e9s et d&rsquo;avoir le contr\u00f4le sur les fonctionnalit\u00e9s de la carte.<\/p>\n<p>Une fois que vous aurez install\u00e9 et activ\u00e9 le plugin, vous pourrez construire vos cartes directement \u00e0 partir de votre tableau de bord WordPress :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/interface-intergeo.png\" alt=\"Interface Intergeo\" width=\"1050\" height=\"587\"><figcaption class=\"wp-caption-text\">Interface Intergeo<\/figcaption><\/figure>\n<p>Ensuite, vous pouvez les int\u00e9grer n&rsquo;importe o\u00f9 sur votre site en utilisant un shortcode.<\/p>\n<h3>Gutenberg Block For Google Maps Embed<\/h3>\n<p><a href=\"https:\/\/wordpress.org\/plugins\/embed-gutenberg-block-google-maps\/\" target=\"_blank\" rel=\"noopener noreferrer\">Gutenberg Block For Google Maps Embed<\/a> est un plugin simple qui ajoute un bloc Google Maps d\u00e9di\u00e9 au nouvel \u00e9diteur de blocs WordPress Gutenberg.<\/p>\n<p>Avec ce bloc, vous pouvez int\u00e9grer n&rsquo;importe quelle adresse et aussi choisir :<\/p>\n<ul>\n<li>Les dimensions<\/li>\n<li>Le niveau de zoom<\/li>\n<li>Carte interactive vs carte statique (<em>encore une fois, cette derni\u00e8re m\u00e9thode aide au niveau des performances<\/em>&gt;)<\/li>\n<\/ul>\n<p>Il ne vous permettra pas de cr\u00e9er vos propres cartes personnalis\u00e9es &#8211; mais c&rsquo;est une option pratique si vous utilisez le nouvel \u00e9diteur de blocs et que vous voulez simplement un moyen facile d&rsquo;inclure des cartes simples.<\/p>\n<h2><a id=\"performance\"><\/a>Google Maps peut ralentir votre site WordPress &#8211; Ne le laissez pas faire<\/h2>\n<p>Alors que Google Maps vous permet d&rsquo;int\u00e9grer une tonne de fonctionnalit\u00e9s int\u00e9ressantes \u00e0 votre site gr\u00e2ce \u00e0 ses cartes interactives, il y a un compromis de performance car il doit charger un grand nombre de scripts pour alimenter toutes ces fonctionnalit\u00e9s interactives.<\/p>\n<p>Bref, l&rsquo;int\u00e9gration de cartes interactives Google Maps peut ralentir votre site.<\/p>\n<p>Il y a plusieurs fa\u00e7ons de combattre cela.<\/p>\n<p>Premi\u00e8rement, si vous n&rsquo;avez pas besoin que les gens puissent naviguer interactivement sur votre carte <em>sur votre site Web<\/em>, une fa\u00e7on simple d&rsquo;<a href=\"https:\/\/kinsta.com\/fr\/apprendre\/accelerer-wordpress\/\" target=\"_blank\" rel=\"noopener noreferrer\">acc\u00e9l\u00e9rer les choses<\/a> sans aucun outil tiers est de :<\/p>\n<ul>\n<li>Faire une capture d&rsquo;\u00e9cran de la carte \u00e0 utiliser sur votre site<\/li>\n<li>Lier cette capture d&rsquo;\u00e9cran \u00e0 la carte sur le site Web de Google Maps, ou ouvrez une fen\u00eatre contextuelle avec la carte interactive lorsque l&rsquo;utilisateur clique.<\/li>\n<\/ul>\n<p>De cette fa\u00e7on, votre site ne fait que charger une image normale &#8211; pas tous les scripts associ\u00e9s \u00e0 Google Maps.<\/p>\n<p>Au lieu de le faire manuellement, vous pouvez \u00e9galement utiliser le <a href=\"https:\/\/wordpress.org\/plugins\/aweos-google-maps-iframe-load-per-click\/\" target=\"_blank\" rel=\"noopener noreferrer\">plugin gratuit AWEOS Google Maps iframe load per click<\/a>. Ce plugin remplace automatiquement les cartes Google Maps int\u00e9gr\u00e9es par une image g\u00e9n\u00e9rique. Ensuite, si un utilisateur clique sur le bouton <strong>Charger la carte<\/strong>, il chargera la carte Google Maps compl\u00e8te int\u00e9gr\u00e9e :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/image-de-remplacemen-google-maps.png\" alt=\"Image de remplacement de Google Maps\" width=\"1050\" height=\"775\"><figcaption class=\"wp-caption-text\">Image de remplacement de Google Maps<\/figcaption><\/figure>\n<p>Vous pouvez \u00e9galement utiliser l&rsquo;API statique de Google Maps, qui renvoie une image normale sans JavaScript. Certains plugins Google Maps &#8211; dont <a href=\"https:\/\/wordpress.org\/plugins\/google-maps-widget\/\" target=\"_blank\" rel=\"noopener noreferrer\">Google Maps Widget<\/a> et <a href=\"https:\/\/wordpress.org\/plugins\/embed-gutenberg-block-google-maps\/\" target=\"_blank\" rel=\"noopener noreferrer\">Gutenberg Block For Google Maps Embed<\/a> &#8211; vous permettent d&rsquo;utiliser l&rsquo;API statique lorsque vous cr\u00e9ez vos cartes.<\/p>\n<p>Cependant, nous nous rendons compte que parfois cette approche statique ne suffit pas, et beaucoup de gens veulent int\u00e9grer l&rsquo;exp\u00e9rience interactive de Google Maps directement.<\/p>\n<p>Si c&rsquo;est le cas, une autre bonne fa\u00e7on d&rsquo;acc\u00e9l\u00e9rer Google Maps est d&rsquo;utiliser un <strong>chargement en Lazy load<\/strong>. Avec un chargement en Lazy load, votre site attendra que les visiteurs commencent \u00e0 faire d\u00e9filer la page pour charger les cartes Google Maps int\u00e9gr\u00e9es sous la ligne de flottaison. Cela vous permet de charger vos premi\u00e8res pages rapidement, tout en vous permettant d&rsquo;int\u00e9grer le contenu interactif de Google Maps.<\/p>\n<p>Nous avons d\u00e9j\u00e0 \u00e9crit sur la <a href=\"https:\/\/kinsta.com\/fr\/blog\/lazy-load-wordpress\/\" target=\"_blank\" rel=\"noopener noreferrer\">fa\u00e7on de charger des images et des vid\u00e9os en Lazy load<\/a> et c&rsquo;est le m\u00eame principe que pour Google Maps.<\/p>\n<p>Il y a quelques plugins qui vous permettront de le faire. Par exemple, le plugin <a href=\"https:\/\/wordpress.org\/plugins\/a3-lazy-load\/\" target=\"_blank\" rel=\"noopener noreferrer\">a3 Lazy Load<\/a> vous permet de charger en Lazy load des <a href=\"https:\/\/kinsta.com\/fr\/blog\/iframe-wordpress\/\">iframe<\/a>, ce qui inclut Google Maps :<\/p>\n<figure style=\"width: 1050px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/01\/chargement-lazy-load-google-maps.png\" alt=\"Chargement en Lazy load de Google Maps\" width=\"1050\" height=\"649\"><figcaption class=\"wp-caption-text\">Chargement en Lazy load de Google Maps<\/figcaption><\/figure>\n<p>Les autres options sont :<\/p>\n<ul>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/bj-lazy-load\/\" target=\"_blank\" rel=\"noopener noreferrer\">BJ Lazy Load<\/a><\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/rocket-lazy-load\/\" target=\"_blank\" rel=\"noopener noreferrer\">Lazy Load by WP Rocket<\/a><\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/easy-lazy-loader\/\" target=\"_blank\" rel=\"noopener noreferrer\">Easy Lazy Loader<\/a><\/li>\n<\/ul>\n<h2>R\u00e9sum\u00e9<\/h2>\n<p>Si vous souhaitez simplement int\u00e9grer une carte simple sur votre site, vous pouvez ajouter Google Maps \u00e0 WordPress sans plugin \u00e0 l&rsquo;aide de la fonction d&rsquo;int\u00e9gration de code int\u00e9gr\u00e9e. Ou, vous pouvez utiliser l&rsquo;outil Google My Maps pour cr\u00e9er votre propre carte personnalis\u00e9e et l&rsquo;int\u00e9grer.<\/p>\n<p>Au-del\u00e0 de ces m\u00e9thodes manuelles, il existe \u00e9galement de nombreux plugins Google Maps WordPress qui peuvent vous donner beaucoup de contr\u00f4le sans vous faire quitter votre tableau de bord WordPress.<\/p>\n<p>Quelle que soit la m\u00e9thode que vous choisissez, faites attention \u00e0 l&rsquo;impact de l&rsquo;utilisation de Google Maps sur les performances. Essayez d&rsquo;utiliser Google Maps uniquement en cas d&rsquo;absolue n\u00e9cessit\u00e9 et envisagez des tactiques telles que les images de remplacement ou le chargement en lazy load pour <a href=\"https:\/\/kinsta.com\/fr\/apprendre\/accelerer-wordpress\/\" target=\"_blank\" rel=\"noopener noreferrer\">diminuer l&rsquo;effet n\u00e9gatif sur les performances<\/a>.<\/p>\n<p>Avez-vous d&rsquo;autres questions sur l&rsquo;utilisation de Google Maps sur WordPress ? Faites-le nous savoir dans les commentaires !<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Vous cherchez un moyen d&rsquo;int\u00e9grer le contenu de Google Maps sur votre site WordPress ? Comme beaucoup de choses dans WordPress, il y a plusieurs fa\u00e7ons &#8230;<\/p>\n","protected":false},"author":38,"featured_media":23450,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[103,33],"topic":[1035],"class_list":["post-23424","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-googlemaps","tag-wordpress","topic-extensions-wordpress"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin<\/title>\n<meta name=\"description\" content=\"D\u00e9couvrez ces diff\u00e9rentes fa\u00e7ons d&#039;int\u00e9grer le contenu de Google Maps dans WordPress, utiliser l&#039;API Google Maps et l&#039;emp\u00eacher de ralentir votre site.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin\" \/>\n<meta property=\"og:description\" content=\"D\u00e9couvrez ces diff\u00e9rentes fa\u00e7ons d&#039;int\u00e9grer le contenu de Google Maps dans WordPress, utiliser l&#039;API Google Maps et l&#039;emp\u00eacher de ralentir votre site.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/kinstafrance\/\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/fm.brianleejackson\" \/>\n<meta property=\"article:published_time\" content=\"2019-02-05T02:07:47+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-09-19T11:01:42+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1460\" \/>\n\t<meta property=\"og:image:height\" content=\"730\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Brian Jackson\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"D\u00e9couvrez ces diff\u00e9rentes fa\u00e7ons d&#039;int\u00e9grer le contenu de Google Maps dans WordPress, utiliser l&#039;API Google Maps et l&#039;emp\u00eacher de ralentir votre site.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png\" \/>\n<meta name=\"twitter:creator\" content=\"@brianleejackson\" \/>\n<meta name=\"twitter:site\" content=\"@kinsta_fr\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Brian Jackson\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"15 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/\"},\"author\":{\"name\":\"Brian Jackson\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/person\/079824c00ccc2b7141504f27ea63bef7\"},\"headline\":\"Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin\",\"datePublished\":\"2019-02-05T02:07:47+00:00\",\"dateModified\":\"2024-09-19T11:01:42+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/\"},\"wordCount\":3077,\"commentCount\":2,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png\",\"keywords\":[\"googlemaps\",\"WordPress\"],\"articleSection\":[\"Meilleurs Tutoriels WordPress\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/\",\"url\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/\",\"name\":\"Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png\",\"datePublished\":\"2019-02-05T02:07:47+00:00\",\"dateModified\":\"2024-09-19T11:01:42+00:00\",\"description\":\"D\u00e9couvrez ces diff\u00e9rentes fa\u00e7ons d'int\u00e9grer le contenu de Google Maps dans WordPress, utiliser l'API Google Maps et l'emp\u00eacher de ralentir votre site.\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png\",\"contentUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png\",\"width\":1460,\"height\":730,\"caption\":\"Google Maps WordPress\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/fr\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Extensions WordPress\",\"item\":\"https:\/\/kinsta.com\/fr\/sujets\/extensions-wordpress\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/fr\/#website\",\"url\":\"https:\/\/kinsta.com\/fr\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Solutions d&#039;h\u00e9bergement premium, rapides et s\u00e9curis\u00e9es\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/fr\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/fr\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/fr\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/kinstafrance\/\",\"https:\/\/x.com\/kinsta_fr\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/person\/079824c00ccc2b7141504f27ea63bef7\",\"name\":\"Brian Jackson\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/kinsta.com\/fr\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/79623d815f4ed4c8c2457392d728cb16?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/79623d815f4ed4c8c2457392d728cb16?s=96&d=mm&r=g\",\"caption\":\"Brian Jackson\"},\"description\":\"Brian has a huge passion for WordPress, has been using it for over a decade, and even develops a couple of premium plugins. Brian enjoys blogging, movies, and hiking. Connect with Brian on Twitter.\",\"sameAs\":[\"https:\/\/www.facebook.com\/fm.brianleejackson\",\"https:\/\/www.linkedin.com\/in\/brianleejackson\",\"https:\/\/x.com\/brianleejackson\"],\"url\":\"https:\/\/kinsta.com\/fr\/blog\/author\/brianjackson\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin","description":"D\u00e9couvrez ces diff\u00e9rentes fa\u00e7ons d'int\u00e9grer le contenu de Google Maps dans WordPress, utiliser l'API Google Maps et l'emp\u00eacher de ralentir votre site.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/","og_locale":"fr_FR","og_type":"article","og_title":"Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin","og_description":"D\u00e9couvrez ces diff\u00e9rentes fa\u00e7ons d'int\u00e9grer le contenu de Google Maps dans WordPress, utiliser l'API Google Maps et l'emp\u00eacher de ralentir votre site.","og_url":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/kinstafrance\/","article_author":"https:\/\/www.facebook.com\/fm.brianleejackson","article_published_time":"2019-02-05T02:07:47+00:00","article_modified_time":"2024-09-19T11:01:42+00:00","og_image":[{"width":1460,"height":730,"url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png","type":"image\/png"}],"author":"Brian Jackson","twitter_card":"summary_large_image","twitter_description":"D\u00e9couvrez ces diff\u00e9rentes fa\u00e7ons d'int\u00e9grer le contenu de Google Maps dans WordPress, utiliser l'API Google Maps et l'emp\u00eacher de ralentir votre site.","twitter_image":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png","twitter_creator":"@brianleejackson","twitter_site":"@kinsta_fr","twitter_misc":{"\u00c9crit par":"Brian Jackson","Dur\u00e9e de lecture estim\u00e9e":"15 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/"},"author":{"name":"Brian Jackson","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/person\/079824c00ccc2b7141504f27ea63bef7"},"headline":"Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin","datePublished":"2019-02-05T02:07:47+00:00","dateModified":"2024-09-19T11:01:42+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/"},"wordCount":3077,"commentCount":2,"publisher":{"@id":"https:\/\/kinsta.com\/fr\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png","keywords":["googlemaps","WordPress"],"articleSection":["Meilleurs Tutoriels WordPress"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/","url":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/","name":"Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin","isPartOf":{"@id":"https:\/\/kinsta.com\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png","datePublished":"2019-02-05T02:07:47+00:00","dateModified":"2024-09-19T11:01:42+00:00","description":"D\u00e9couvrez ces diff\u00e9rentes fa\u00e7ons d'int\u00e9grer le contenu de Google Maps dans WordPress, utiliser l'API Google Maps et l'emp\u00eacher de ralentir votre site.","breadcrumb":{"@id":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#primaryimage","url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png","contentUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2019\/02\/google-maps-wordpress.png","width":1460,"height":730,"caption":"Google Maps WordPress"},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/fr\/blog\/google-maps-wordpress\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/fr\/"},{"@type":"ListItem","position":2,"name":"Extensions WordPress","item":"https:\/\/kinsta.com\/fr\/sujets\/extensions-wordpress\/"},{"@type":"ListItem","position":3,"name":"Guide Google Maps WordPress : L\u2019int\u00e9grer avec ou sans plugin"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/fr\/#website","url":"https:\/\/kinsta.com\/fr\/","name":"Kinsta\u00ae","description":"Solutions d&#039;h\u00e9bergement premium, rapides et s\u00e9curis\u00e9es","publisher":{"@id":"https:\/\/kinsta.com\/fr\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/fr\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/fr\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/fr\/wp-content\/uploads\/sites\/4\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/fr\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/kinstafrance\/","https:\/\/x.com\/kinsta_fr","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/person\/079824c00ccc2b7141504f27ea63bef7","name":"Brian Jackson","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/kinsta.com\/fr\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/79623d815f4ed4c8c2457392d728cb16?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/79623d815f4ed4c8c2457392d728cb16?s=96&d=mm&r=g","caption":"Brian Jackson"},"description":"Brian has a huge passion for WordPress, has been using it for over a decade, and even develops a couple of premium plugins. Brian enjoys blogging, movies, and hiking. Connect with Brian on Twitter.","sameAs":["https:\/\/www.facebook.com\/fm.brianleejackson","https:\/\/www.linkedin.com\/in\/brianleejackson","https:\/\/x.com\/brianleejackson"],"url":"https:\/\/kinsta.com\/fr\/blog\/author\/brianjackson\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/23424","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/users\/38"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/comments?post=23424"}],"version-history":[{"count":7,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/23424\/revisions"}],"predecessor-version":[{"id":31255,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/posts\/23424\/revisions\/31255"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/23424\/translations\/en"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/23424\/translations\/it"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/23424\/translations\/fr"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/23424\/translations\/es"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/23424\/translations\/pt"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/23424\/translations\/nl"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/23424\/translations\/de"},{"embeddable":true,"hreflang":"sv","title":"Swedish","href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/23424\/translations\/se"},{"href":"https:\/\/kinsta.com\/fr\/wp-json\/kinsta\/v1\/posts\/23424\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/media\/23450"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/media?parent=23424"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/tags?post=23424"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/fr\/wp-json\/wp\/v2\/topic?post=23424"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}