Guia Completo: Como Incorporar o Google Maps no WordPress

Como incorporar um único local do Google Maps no WordPress

Vamos começar com a maneira mais básica de mostrar uma localização do Google Maps em seu site WordPress. Se você deseja apenas incorporar um mapa com um único local ou visualização, não precisa de ferramentas ou plug-ins sofisticados – tudo o que você precisa é colar o código de incorporação do Google Maps em seu site WordPress .

Veja como tudo funciona:

Acesse o site do Google Maps normalmente e pesquise o local que deseja incorporar. Você pode pesquisar qualquer coisa. Isso é:

• Um país inteiro
• Uma cidade específica
• Um negócio específico
• O que você disser

Isso realmente não importa!

Assim que tiver a localização que deseja mostrar no mapa, procure o botão Compartilhar na barra lateral esquerda:

Você deve ver um pequeno pop-up aparecer. Clique na opção Incorporar mapa nesse pop-up:

Em seguida, escolha o tamanho desejado no menu suspenso. E depois de selecionar o tamanho desejado, copie o código na caixa:

Agora, vá para a postagem ou página do WordPress onde você deseja incorporar a caixa do Google Maps.

No Editor do WordPress, vá para a guia Texto e cole o código que você copiou do Google Maps no local onde deseja que seu mapa apareça:

Agora, publique sua postagem normalmente e você verá sua caixa do Google Maps no front-end do seu site WordPress:

Fácil o suficiente, certo?

Você também pode usar um método semelhante para incorporar as direções do Google Maps no WordPress. A única diferença é a interface inicial. Em vez de ver o botão Compartilhar imediatamente, você precisará clicar no ícone do hambúrguer e escolher a opção Compartilhar ou incorporar mapa :

Como incorporar o Google Maps com vários marcadores de localização no WordPress

Se você deseja incorporar uma caixa do Google Maps com vários marcadores de localização no WordPress, as coisas são um pouco diferentes.

Embora eu mostre dois plug-ins do Google Maps para WordPress para ajudá-lo a fazer isso na próxima seção, você não precisa de um plug-in para fazer isso .

Em vez disso, você pode criar seu próprio mapa usando o Google My Maps e incorporar esse mapa no WordPress usando um método semelhante ao descrito acima.

Para começar, vá para o Google My Maps e clique em Começar para iniciar a interface. Na interface, clique na opção Criar um novo mapa :

Em seguida, use a interface para construir seu mapa. Pode ser um pouco complicado começar – mas quando você pega o jeito, é bem fácil de usar. Você pode pesquisar coisas usando a caixa de pesquisa e adicionar marcadores no mapa usando o botão Marcador :

Quando estiver satisfeito com seu mapa, clique no ícone de três pontos na parte superior e selecione Incorporar no meu site .

Então, assim como antes, você pode colar o código que o Google Maps fornece na guia Texto do Editor do WordPress para exibir o mapa em seu site WordPress.

Plugins do WordPress para ajudá-lo a trabalhar ainda mais com o Google Maps

Embora você realmente não precise de um plug-in para lidar com a incorporação básica do Google Maps, como mostrei acima, os plug-ins podem ser úteis se você quiser mais flexibilidade (ou se quiser uma maneira mais amigável de implementar essa flexibilidade).

A maioria dos plugins realmente não faz nada que você não poderia fazer sozinho com graxa de cotovelo suficiente - mas eles tornam muito mais fácil e amigável. Aqui estão alguns plugins legais para ajudá-lo a trabalhar melhor com o Google Maps.

WP Google Maps

O WP Google Maps é o plug-in gratuito do Google Maps mais popular no diretório de plug-ins do WordPress.org.

Ele ajuda você a criar suas próprias exibições personalizadas do Google Maps usando marcadores de mapa que você escolher e diferentes temas de mapa. Basicamente, é uma implementação mais amigável do processo que acabei de descrever acima.

A única desvantagem é que a versão gratuita só permite criar um único mapa. Se você precisar de vários mapas, precisará comprar a versão premium ou usar uma solução diferente.

Para começar, instale e ative o WP Google Maps. Como está listado no WordPress.org, você pode fazer isso diretamente no painel do WordPress.

Depois de ativá-lo, vá para a nova opção Mapas na barra lateral para começar.

Antes de criar seu primeiro mapa, porém, você precisará obter uma chave de API JavaScript do Google Maps e inseri-la nas configurações do plug-in. Você pode fazer isso seguindo estas instruções:

Depois de inserir sua chave de API, você pode editar o Meu primeiro mapa padrão ( lembre-se – a versão gratuita deste plugin só permite criar um mapa ):

Use a interface para construir seu mapa. Então, quando terminar, você pode incorporá-lo em qualquer lugar do seu site usando o shortcode:

É super fácil e flexível – a única desvantagem é a limitação de um mapa na versão gratuita.

Construtor de mapas

Outra boa opção para criar incorporações do Google Maps com um plug-in do WordPress é o Maps Builder.

Depois de instalar e ativar o plug-in, você receberá uma nova guia do Google Maps na barra lateral do painel. Assim como no WP Google Maps, você precisará adicionar uma chave de API do Google Maps antes de começar a usar o plug-in.

Depois de fazer isso, você pode ir para Google Maps → Adicionar novo para criar um novo mapa. Nessa interface, clique no botão Open Map Builder para iniciar a interface amigável:

Lá, você pode construir seu mapa usando a barra lateral do plugin:

Quando terminar, você pode usar o shortcode criado pelo plugin para incorporar o mapa em qualquer lugar do seu site WordPress.

Localizador de lojas WP

Se você deseja usar especificamente o Google Maps para exibir vários locais de lojas em seu site WordPress ( um desejo comum! ), talvez seja melhor usar um plug-in de localizador de lojas dedicado.

Embora você possa encontrar vários plugins para fazer isso, eu gosto do WP Store Locator porque é flexível e parece ótimo.

Use o módulo do Google Maps do seu construtor de páginas favorito

A maioria dos construtores de páginas do WordPress inclui um elemento/módulo dedicado do Google Maps para ajudá-lo a incorporar o conteúdo do Google Maps em seus designs.

Por exemplo, o popular plug-in Divi Builder inclui um módulo do Google Maps que você pode personalizar um pouco através da interface do plug-in:

Portanto, se você já estiver usando um construtor de páginas, verifique se o construtor de páginas possui uma ferramenta do Google Maps antes de sair correndo para encontrar um plug-in dedicado do Google Maps,

Um ajuste divertido para usuários avançados

Esse método é avançado e requer conhecimento de código – portanto, se você é iniciante, fique à vontade para ignorá-lo.

Mas se você conhece o WordPress e os campos personalizados, pode usar um campo personalizado para criar automaticamente um mapa com base no esquema de URLs do mapa do Google Maps.

Por exemplo, você pode criar um campo no back-end do WordPress onde um usuário só precisa colar o endereço em um local.

Então, com um pouco de pré-processamento para remover espaços, você pode inserir esse endereço em algo como abaixo em um iframe nos arquivos de template do seu tema:

E voilá! Tudo o que um usuário precisa fazer é inserir um endereço no Editor do WordPress e uma incorporação do Google Maps aparecerá automaticamente no front-end desse local.

Novamente – este método definitivamente requer um conhecimento básico de PHP e campos personalizados – mas é um truque legal para economizar algum tempo.

Encerrando as coisas

Se você quer apenas fazer algo básico, como incorporar um local regular do Google Maps no WordPress ou ficar mais avançado com vários marcadores de mapa ou criação automática de mapas, você tem muitas opções.

Para incorporar mapas únicos, você provavelmente pode pular os plug-ins e usar apenas o código de incorporação normal do Google Maps. Mas se você deseja criar mapas com vários locais e ter fácil controle sobre o estilo, os dois plug-ins do Google Maps são boas opções.

E, finalmente, se você estiver usando um construtor de páginas, verifique se já possui um elemento do Google Maps antes de recorrer a uma solução externa.