Media - Mappa

Fornisce agli acquirenti una gamma completa di informazioni sulla tua attività (numero di telefono, sito Web, recensioni, valutazioni a stelle e così via) direttamente sul tuo sito.

Una mappa Google solitamente evidenzia le attrazioni vicine, parchi, ristoranti e così via. Queste informazioni aiutano i clienti a determinare l'ubicazione fisica e a pianificare il viaggio.

Consente ai clienti di trovare facilmente l’indirizzo del negozio fisico senza dover aprire una nuova finestra del browser e lasciare il sito.

Se disponi di una catena di negozi fisici, l’aggiunta di una Google Map sul sito ti aiuta a rafforzare la brand awareness e la credibilità sotto forma di elementi evidenziati.

Passa alla console della piattaforma Google Cloud.

Fai clic sull’elenco a discesa del progetto e seleziona o crea il progetto per il quale desideri aggiungere una chiave API.

Per configurare le credenziali API, segui le istruzioni nella documentazione di Google Maps.

Copia la chiave API negli Appunti.

Nella barra laterale Admin, passa a Stores > Settings>Configuration.

Nel pannello a sinistra in General, scegli Content Management.

Espandere Advanced Content Tools.

{width="600" modal="regular"}

Per ulteriori informazioni sulle opzioni di configurazione degli strumenti avanzati di Content Management, vedere la Guida di riferimento alla configurazione.

Per Google Maps API Key, incolla la chiave copiata nel passaggio 1.

Fare clic su Test Key.

Se si è verificato un problema con la chiave, tornare al sito di Google Maps Platform per risolvere il problema. Riprovare.

Dopo aver verificato la chiave, fare clic su Save Config.

Aprire la pagina, il blocco o il blocco dinamico nell'area di lavoro Page Builder.

Nel pannello Page Builder, espandere Media e trascinare un segnaposto Map nell'area di visualizzazione.

{width="600" modal="regular"}

Se Google Maps Platform è configurata per il tuo archivio, viene visualizzata una mappa per il percorso del tuo archivio.

{width="600" modal="regular"}

Se la piattaforma Google Maps non è ancora configurata per l'archivio, verrà visualizzata una mappa segnaposto.

Segnaposto {width="600" modal="regular"}

Passa il puntatore del mouse sul contenitore della mappa per visualizzare la casella degli strumenti e scegli l'icona Impostazioni ( {width="20"} ).

Nell'angolo superiore destro della pagina Edit Map ​fare clic su Add Location.

Immettere Location Name che si desidera associare al pin sulla mappa.

Raccogli le coordinate di posizione che desideri utilizzare per la posizione personalizzata.

In alternativa, nella casella Position è possibile trascinare il pin nella mappa visualizzata.

Se necessario, passare a Google Maps in una nuova finestra del browser e utilizzare uno dei metodi seguenti per ottenere le coordinate:

{width="600" modal="regular"}

Metodo 1: Copia dall'URL

• Nell'angolo superiore sinistro immettere l'indirizzo nella casella Search e fare clic sull'icona Cerca ( {width="20"} ).

• Copia le coordinate nell’URL e incollale in un blocco note.

Metodo 2: Copia da "What's here?"

• Fare clic con il pulsante destro del mouse sul pin rosso che indica la posizione sulla mappa e scegliere What’s here? nel menu.

• Nell'etichetta visualizzata, copiare il testo, incluse le coordinate, e incollarlo in un blocco note.

Immettere i numeri, senza la virgola, in ciascuna delle caselle Coordinates.

È inoltre possibile immettere tutte le informazioni rimanenti che si desidera siano disponibili sulla mappa.

Compilare le altre informazioni che si desidera associare alla posizione della mappa:

Al termine, fare clic su Save.

La nuova posizione viene visualizzata nella mappa e nella griglia della posizione della mappa nella pagina Edit Map.

{width="600" modal="regular"}

Nella barra laterale Admin, passa a Stores > Settings>Configuration.

Nel pannello a sinistra in General, scegli Content Management.

Espandere Advanced Content Tools.

Nella casella di testo Google Maps Style fare clic su Crea stile mappa.

Questa azione apre la Google Maps Creazione guidata Stile piattaforma in una scheda separata, in cui è possibile definire uno stile per il progetto Google Maps Platform.

Fare clic su Create a Style e seguire le istruzioni fornite.

Al termine, fare clic su Finish.

Esporta lo stile completato come codice JSON o come URL in modo da poterlo aggiungere alla configurazione Commerce.

• JSON: sotto la casella con il codice JSON generato, fare clic su Copy JSON.

• URL: sotto la casella con l'URL generato, fare clic su Copy URL.

Torna alla scheda del browser Amministratori e incolla il codice o l'URL generato nella casella Stile mappe Google.

Se utilizzi un URL, sostituisci il segnaposto YOUR_API_KEY con la tua chiave API Google Maps. Questo URL è collegato alla tua mappa Google formattata.

Nell'angolo superiore destro fare clic su Save Config.

Passa il puntatore del mouse sul contenitore della mappa per visualizzare la casella degli strumenti e scegli l'icona Impostazioni ( {width="20"} ).

Modifica le impostazioni di base in base alle esigenze:

Modificare le impostazioni di Advanced ​in base alle esigenze:

• Per controllare il posizionamento orizzontale del contenuto della mappa aggiunto al contenitore, scegliere un Alignment:

  table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 layout-auto
  Opzione	Descrizione
  Default	Applica l'impostazione predefinita di allineamento specificata nel foglio di stile del tema corrente.
  Left	Allinea il contenuto lungo il bordo sinistro del contenitore di mappe, tenendo conto della spaziatura specificata.
  Center	Allinea il contenuto al centro del contenitore di mappe, tenendo conto di eventuali spaziature specificate.
  Right	Allinea il contenuto lungo il bordo destro del contenitore mappa, tenendo conto di eventuali spaziature specificate.

• Imposta lo stile Border applicato a tutti e quattro i lati del contenitore mappa:

  table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 5-row-2 6-row-2 7-row-2 8-row-2 9-row-2 10-row-2 layout-auto
  Opzione	Descrizione
  Default	Applica lo stile di bordo predefinito specificato dal foglio di stile associato.
  None	Non fornisce alcuna indicazione visibile dei bordi del contenitore.
  Dotted	Il bordo del contenitore viene visualizzato come una linea tratteggiata.
  Dashed	Il bordo del contenitore viene visualizzato come una linea tratteggiata.
  Solid	Il bordo del contenitore viene visualizzato come linea continua.
  Double	Il bordo del contenitore viene visualizzato come una doppia riga.
  Groove	Il bordo del contenitore viene visualizzato come una linea scanalata.
  Ridge	Il bordo del contenitore viene visualizzato come una linea scanalata.
  Inset	Il bordo del contenitore viene visualizzato come una linea interna.
  Outset	Il bordo del contenitore viene visualizzato come una linea di contorno.

• Se si imposta uno stile di bordo diverso da None, completare le opzioni di visualizzazione del bordo:

  {width="600" modal="regular"}

  table 0-row-2 1-row-2 2-row-2 3-row-2 layout-auto
  Opzione	Descrizione
  Border Color	Specificate il colore scegliendo un campione, facendo clic sul selettore del colore oppure immettendo un nome di colore valido o un valore esadecimale equivalente.
  Border Width	Immettere il numero di pixel per lo spessore della linea del bordo.
  Border Radius	Immettere il numero di pixel per definire la dimensione del raggio utilizzato per arrotondare ogni angolo del bordo.

• (Facoltativo) Specificare i nomi di CSS classes dal foglio di stile corrente da applicare al contenitore delle mappe.

  Separare più nomi di classe con uno spazio.

• Immettere i valori, in pixel, per Margins and Padding per specificare i margini esterni e la spaziatura interna del contenitore mappa.

  Immetti ogni valore corrispondente nel diagramma contenitore mappa.

  table 0-row-2 1-row-2 2-row-2 layout-auto
  Area contenitore	Descrizione
  Margins	Quantità di spazio vuoto applicata al bordo esterno di tutti i lati del contenitore.
  Padding	Quantità di spazio vuoto applicata al bordo interno di tutti i lati del contenitore.

  note note
  NOTE
  La spaziatura non è disponibile per il tipo di contenuto Mappa.

Al termine, fare clic su Save per applicare le impostazioni e tornare all'area di lavoro Page Builder.

Nella barra laterale Admin, passa a Stores > Settings>Configuration.

Nel pannello a sinistra in General, scegli Content Management.

Espandere Advanced Content Tools.

Aggiornare le opzioni della griglia in base alle esigenze:

• Per Default Column Grid Size, immettere un nuovo valore per la dimensione predefinita della griglia.

• Per Maximum Column Grid Size, immettere un nuovo valore per la dimensione massima predefinita della griglia.

{width="600" modal="regular"}

Al termine, fare clic su Save Config.