Ir para o conteúdo principal

My Maps location : locais e categorias

1. Obtenha uma chave da API do Google Maps

Cada vez que você usar as APIs do Google Maps, se seu domínio foi criado depois de 22 de junho de 2016, você deve incluir uma chave para validar sua solicitação.
Obtenha uma chave e ative a API: https://developers.google.com/maps/documentation/javascript/get-api-key

Mais informações: https://developers.google.com/maps/documentation/javascript/usage?hl=en

O primeiro passo é criar um projeto e digite o nome do projeto.

 

criar-api-chave

 

Se eu quiser permitir todas as solicitações de meudominio, o padrão a seguir é * .joomunited.com / *
Se você quiser permitir apenas um único domínio, por exemplo meudominio.com, o padrão seria joomunited.com/*


Em um ambiente de host local, você pode colocar qualquer chave válida e ela funcionará sem nenhuma referência de domínio.

 

domínio-api-padrão


A chave de API é gerada então, esta é a chave que você precisa copiar para adicionar ao My Maps location .

 

criado por API

 

Adicione a chave à localização do My Maps Location .

Em Componentes > My Maps Location > Visualização de Opções , você pode adicionar uma chave na configuração.

 

maps-configuration

 

Cole a chave.

 

chave add-api

 

Resumo passo a passo:


Portanto, os passos que sigo são

  • Acesse o Google API Console
  • Crie ou selecione um projeto
  • Clique em Continuar para habilitar a API e quaisquer serviços relacionados
  • Na página Credenciais, obtenha uma chave do navegador (e defina as credenciais da API)
  • Para evitar roubo de cota, proteja sua chave de API seguindo essas práticas recomendadas

2. Gerenciar categorias de localização

A localização é classificada em categorias. Essas categorias podem ser exibidas como filtro no front-end ou usadas como um parâmetro predefinido em um item de menu para carregar alguns locais categorizados.
 

categoria-filtro-front-end

 

Se você tiver muitos locais, é recomendável usar categorias.
Você pode criar categorias e subcategorias. Para criar uma categoria, vá em My Maps location > Category e clique em New

 

localizações de categorias

 

Em seguida, na tela de categoria, você precisará adicionar um título e uma categoria pai, caso deseje criar uma subcategoria

 

pai da categoria

 

Você também pode definir um marcador padrão para a localização na categoria usando a guia Seleção de marcadores

 

categoria de marcador

 

Nota: uma categoria é criada por padrão chamada "Minha categoria", permitindo que você comece a adicionar locais diretamente após a instalação

3. Crie um local

Para criar um local, vá em My Maps location > Locais > Novo

Existem 3 campos obrigatórios:

  • Nome da localização
  • Categoria da localização
  • Detalhes da localização (endereço)      

 

Para o endereço, você tem 3 soluções para adicioná-lo:

  • Use o campo de pesquisa (recomendado)
  • Navegue até o mapa e use o cursor para apontar um local
  • Preencha um endereço (deve ser válido no Google Maps)

 

Para adicionar um local ao mecanismo de pesquisa, digite o nome do local que você deseja adicionar.

 

adicionar local

 

Na seleção, os campos de latitude e longitude serão preenchidos automaticamente. Meus mapas também são integrados ao Google Places! Isso significa que você pode procurar uma loja ou qualquer outra coisa que esteja registrada no Google Maps; nosso componente obterá todas as informações do local.

 

Google-place

 

 

Você também pode mover-se no mapa e colocar um marcador diretamente, o resultado será o mesmo e você receberá uma latitude e uma longitude automaticamente.

 

ponto do mapa

 

Cuidado com o campo de endereço e o código postal, se você o preencher manualmente, ele deve corresponder a um endereço conhecido do Google Maps.

 

campos de endereço

 

Todas as outras informações do local (descrição, horas, ...) são exibidas na visão detalhada do local.

O link de contato na edição de detalhes do local é a possibilidade de adicionar um link de contato, mailto ou URL por local. No frontend, haverá um botão de contato que abrirá a URL ou executará a ação mailto.

 

9

 

4. Outras informações de localização

Em cada local, você pode adicionar uma imagem e um marcador. 

  • Imagem do local: a imagem será exibida como uma miniatura na dica de ferramenta do local e em um tamanho maior na página de detalhes do local.
  • Usar ícone de categoria: Use o ícone que você colocou no campo de categoria de meus locais no mapa
  • Fundo do marcador: escolha a cor do marcador de fundo
  • O marcador será exibido no mapa como ícone do marcador de localização. Você também tem alguns conjuntos de marcadores interessantes para seus locais incluídos na extensão de local do My Maps Location .
  • Usar um link personalizado substituirá o link para os detalhes do local por um URL personalizado.

 

marcador-imagem-localização

 

My Maps location está usando o recurso multilíngue nativo do Joomla. Você pode definir um idioma em categorias de localização e em localizações. Na troca de idioma, os locais serão filtrados como qualquer outro conteúdo do Joomla para exibir o conteúdo aprovado no idioma.

 

língua

 

O campo de descrição do local é um dos mais importantes.
Ele será exibido na página de detalhes do local e, dependendo do tema, como um texto de introdução do local nos resultados da pesquisa. Mais importante, a descrição é um editor WYSIWYG com todo o plugin carregado dentro, significa que você pode fazer o que quiser nele (imagens, vídeos ...).

 

localização-descrição

 

Aqui está o texto de introdução exibido nos resultados da pesquisa de local.

 

resultados de texto no local

 

O campo de tags é o mesmo sistema de tags do Joomla. Você pode adicionar tags e subtags e carregá-lo no frontend como filtro. Para gerenciar todas as tags, basta carregar o componente tag do Joomla: Menu Component > Tags
No frontend, dependendo da configuração, as tags podem ser exibidas como checkbox (como abaixo) ou como uma lista suspensa.

 

filtro de tag

 

My Maps Location tem campos adicionais para preencher meta informações (para mecanismos de pesquisa). Esses campos são carregados na página de detalhes do local.

 

Meta informação

 

5. Exibir locais no frontend

Para exibir seus locais no front-end, você pode usar:

  • Um menu para exibir o mecanismo de pesquisa de localização, localização única ou categoria de localizações
  • Um módulo para exibir um campo de pesquisa ou selecionar um conjunto de locais
  • Um botão do editor para exibir locais únicos ou múltiplos em qualquer editor

Carregar locais em um menu

No gerenciador de menus do Joomla, adicione um elemento e selecione como tipo “Pesquisa e exibição de local”. Ele exibirá o mecanismo de pesquisa de localização com filtros.
Selecione “Visualização de detalhes do local” para exibir um único local predefinido.

 

menu de localização

 

Se você selecionar “Pesquisa e exibição de local” , você terá alguns parâmetros de exibição. Alguns podem substituir os parâmetros padrão do componente.

 

main-menu-config

 

Na guia principal do menu, você pode configurar:

  • Digite o endereço: você pode forçar a exibição de um endereço padrão no carregamento da página. Pode ser deixado vazio
  • Distância: a distância para bloquear a pesquisa, referindo-se ao endereço acima. Pode ser deixado como -1 (padrão)
  • Categoria: carregue uma categoria específica de localização
  • Limite de pesquisa: limite o número de resultados da pesquisa. 10 retornará apenas os 10 primeiros resultados na pesquisa de local
  • Ordenação: ordene os resultados da pesquisa por data, título, distância (padrão)

 

mml-menu-advanced

 

Em seguida, na guia do menu My Maps Location , você pode configurar:

  • Selecione o componente: local do My Maps Location ou todas as integrações de terceiros, como K2, Jomsocial ...
  • ID de categoria padrão (extensões de terceiros): categoria padrão para carregar quando uma extensão de terceiros está em uso, como K2, Hikashop ou Adsmanager, ID de lista CB para construtor de comunidade
  • Locais de categoria secundária : exibe também locais de resultados de pesquisa de subcategorias, não apenas aquela selecionada acima
  • Tema: selecione um dos 3 temas padrão, largura total e barra lateral da pesquisa e o tema de exibição de resultados disponível para o item de menu
  • Provedor de mapas: Selecione Google Maps, Bing Maps, Mapbox, OpenStreetMap, Baidu ou Mapquest para estilizar seus mapas
  • Habilitar tags de pesquisa : permite que as consultas de pesquisa sejam feitas usando nomes de tags de localização
  • Designs: dependendo da origem do mapa, você tem vários tipos e cores de mapa
  • Camada do mapa: adicione alguns dados (camada) aos seus mapas. Existem camadas KML, camada de tráfego, camada de trânsito e camada de bicicleta.
  • URL da camada do Google Map: Use a camada de dados para armazenar seus dados personalizados ou para exibir dados GeoJSON em um mapa do Google
  • Tipo de Bing Maps: Se o Bing Maps for o seu provedor de mapas, selecione a aparência e os dados do Bing Maps
  • Tipo do OpenStreetMap: se o OpenStreetMap for o seu provedor de mapas, você pode adicionar alguns dados (camada) aos seus mapas
  • Dica de ferramenta de localização: no carregamento do mapa, abra automaticamente a dica de ferramenta de localização após a pesquisa de localização
  • Zoom do mapa: defina um nível de zoom padrão no mapa
  • Opções de largura e altura dos resultados de mapas e pesquisas

 

Exibição de front-end com base no tema

 

map-search-themes

 

Resultado para uma única exibição de pesquisa de local:

bridgewater-location


Exibir locais usando um módulo

My maps location vem com 2 módulos para localizações nativas + outro para integração de terceiros (como um módulo para exibir localizações de itens K2)

O módulo Mapa permite que você exiba suas localizações com os mesmos filtros do menu, mas em uma posição de módulo. Os locais serão exibidos como Mapa ou Lista. Você pode selecionar um conjunto de locais ou selecionar categorias de locais.

 

map-module

 

My Maps Location Map – O módulo de pesquisa exibirá um mecanismo de pesquisa com alguns filtros como opção, como a largura do mapa ou o componente em que o local será pesquisado (procure por localização K2 apenas por exemplo).

 

módulo de pesquisa

 

Módulo de exibição no front-end:

 

search-map-frontend-modules

 

 

Exibir locais usando um botão do editor


O botão do editor será carregado em seu editor Joomla (geralmente em artigos ou módulos HTML personalizados).
Você verá o botão na parte inferior do seu editor. Ao clicar, você verá uma caixa de luz que permite selecionar um ou vários locais que você adicionou anteriormente.

 

botão do editor de mapa

 

Então você pode selecionar um ou algum local e apertar o botão para adicioná-lo ao seu artigo.
Se você não especificar nenhum nível de zoom, ele será carregado automaticamente para caber na sua área de localização. O código da tag que você verá em seu editor WYSIWYG será como este modelo: {mymaplocations mapid width height}

Ex: {mymaplocation id = 1 width = 58% height = 400px zoom = 10 type = google} este código exibirá um mapa com o ID do local = 1, com 58% de largura, 400px de altura, 10 vezes de zoom e tipo Google. Usando a vírgula para adicionar mais de um local em um mapa. Ex: {mymaplocation id = 1 width = 58% height = 400px zoom = 10 type = google} the location ID = 1, 2, 3.