Media - toewijzen

Gebruik de Kaart inhoudstype om een kaart toe te voegen van Google Maps Platform aan de Page Builder stadium. U kunt bijvoorbeeld een kaart aan een blok toevoegen en vervolgens het blok aan het blok toevoegen Over ons en Contact opnemen pagina's.

Om het meeste van te krijgen van Google Maps Platform, kunt u de kaart aanpassen, uw opslagplaatsen benadrukken en Google gebruiken Plaatsen om uitgebreide informatie over je winkel aan iedereen toe te voegen Google Maps.

Voordelen van het insluiten van een Google-kaart

  1. Biedt kopers een volledig bereik aan informatie over je bedrijf (telefoonnummer, website, revisies, sterrenwaarderingen, enzovoort) op je site.

  2. Een Google-kaart markeert meestal nabijgelegen attracties, parken, restaurants, enzovoort. Deze informatie helpt uw klanten uw fysieke plaats bepalen en hun reis plannen.

  3. Maakt het voor klanten gemakkelijk om het adres voor uw fysieke opslag te vinden zonder de behoefte om een nieuw browser venster te openen en uw plaats te verlaten.

  4. Als u een keten van fysieke winkels hebt, kunt u door het toevoegen van een Google Map op uw site uw merkbekendheid en geloofwaardigheid in de vorm van gemarkeerde items vergroten.

Voorbeeld van storefront - kaart met locatie

NOTE
Als u belangrijke wijzigingen aanbrengt in Page Builder wordt aangeraden de Levensduur beheersessie om te voorkomen dat de sessietime-out optreedt terwijl u werkt.

Gereedschap Kaart

De kaarttoolbox verschijnt wanneer u over de kaartcontainer beweegt.

Gereedschap
Pictogram
Beschrijving
Verplaatsen
Pictogram Verplaatsen {width="25"}
Hiermee verplaatst u de kaart naar een andere positie in het werkgebied.
(label)
Map
Identificeert de huidige inhoudscontainer als een kaart. Houd de muis boven de kaartcontainer om de gereedschapset te zien.
Instellingen
Instellingenpictogram {width="25"}
Hiermee opent u de pagina Kaart bewerken, waarin u de eigenschappen van de kaart en de container kunt wijzigen.
Verbergen
Pictogram verbergen {width="25"}
Hiermee verbergt u de huidige kaart.
Tonen
Pictogram tonen {width="25"}
Hiermee geeft u de verborgen kaart weer.
Dupliceren
Pictogram Dupliceren {width="25"}
Hiermee maakt u een kopie van de kaart.
Verwijderen
Pictogram verwijderen {width="25"}
Hiermee verwijdert u de kaart uit het werkgebied.
NOTE
Verborgen elementen worden opgeslagen in de database en onzichtbaar voor klanten. Deze elementen zijn echter zichtbaar voor zoekmachines en andere bots die uw site kruipen. Ze worden ook geretourneerd als onderdeel van de inhoud als ze worden opgevraagd via een API-aanroep met een kenmerk van onzichtbaarheid, tenzij u ze uit het werkgebied verwijdert.

Configureren Google Maps voor uw beheerder

Voordat u een kaart toevoegt, moet u eerst een account voor een gratis proces van Google Maps Platform. De gratis proefversie duurt 12 maanden en omvat een krediet van € 300. Als je je creditering opgebruikt, factureert Google je account niet zonder je toestemming.

Stap 1: Krijg uw Google Maps API-sleutel

Afhankelijk van of u al een Google Maps -toets, gebruikt u een van de volgende procedures om de API-sleutel te verkrijgen die vereist is voor de configuratie. Als u een Google Maps sleutel, moet u een plaatsbeheerder zijn geautoriseerd om het factureren voor uw rekening toe te laten. Als u niet klaar bent om een Google Maps Platformaccount, kunt u deze stap overslaan en voorlopig de tijdelijke kaart gebruiken.

  1. Ga naar de Google Cloud Platform Console.

  2. Klik het project drop-down en selecteer of creeer het project waarvoor u een API sleutel wilt toevoegen.

  3. Om uw API geloofsbrieven te vormen, volg instructies in de Google Maps documenten.

  4. Kopieer de API-sleutel naar het klembord.

Stap 2: configureren Google Maps in Commerce

  1. In de Beheerder zijbalk, ga naar Stores > Settings>Configuration.

  2. In het linkerdeelvenster onder General, kiest u Content Management.

  3. Uitbreiden Expansiekiezer Advanced Content Tools.

    Geavanceerde gereedschappen voor inhoud {width="600" modal="regular"}

    Voor meer informatie over de configuratieopties van Geavanceerde hulpmiddelen van het Beheer van de Inhoud, zie Referentiehandleiding voor configuratie.

  4. Voor Google Maps API Key plakken, plakt u de sleutel die u in stap 1 hebt gekopieerd.

  5. Klik op Test Key.

    Als er een probleem is met uw sleutel, keert u terug naar de Google Maps Platformsite om het probleem op te lossen. Probeer het vervolgens opnieuw.

  6. Klik op Save Config.

Een kaart toevoegen aan het werkgebied

  1. Open de pagina, het blok of het dynamische blok voor Page Builder werkruimte.

  2. In de Page Builder deelvenster, uitvouwen Media en sleep een Map tijdelijke aanduiding naar het werkgebied.

    Een kaart naar het werkgebied slepen {width="600" modal="regular"}

    Indien Google Maps Platform is geconfigureerd voor uw winkel. Er wordt een kaart weergegeven voor uw winkellocatie.

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

    Indien Google Maps Platform is nog niet geconfigureerd voor uw winkel, maar er wordt een tijdelijke kaart weergegeven.

    Google Maps Plaatsaanduiding {width="600" modal="regular"}

Een locatie voor een aangepaste kaart toevoegen

  1. Houd de muisaanwijzer boven de kaartcontainer om de gereedschapset weer te geven en kies de optie Instellingen ( Instellingenpictogram {width="20"} ).

  2. In de rechterbovenhoek van het dialoogvenster Edit Map ​pagina, klikt u Add Location.

  3. Voer de Location Name dat u aan de speld op de kaart wilt worden geassocieerd.

  4. Verzamel de locatiecoördinaten die u wilt gebruiken voor de aangepaste locatie.

    Als alternatief, in Position kunt u het punt in de weergegeven kaart verslepen.

    Ga zo nodig naar Google Maps in een nieuw browservenster en gebruik een van de volgende methoden om de coördinaten op te halen:

    Kaartcoördinaten {width="600" modal="regular"}

    Methode 1: Kopiëren van URL

    • Voer in de linkerbovenhoek het adres in het dialoogvenster Search en klik op Zoeken ( Zoekpictogram {width="20"} ).

    • Kopieer de coördinaten in de URL en plak ze in een notedop.

    Methode 2: Kopie van "Wat is hier?"

    • Klik met de rechtermuisknop op het rode punt dat de locatie op de kaart markeert en kies What’s here? in het menu.

    • Kopieer in het weergegeven label de tekst, inclusief de coördinaten, en plak de tekst in een notitiepad.

  5. Voer in elk van de Coordinates vakken.

    U kunt ook zoveel van de resterende informatie invoeren die u op de kaart beschikbaar wilt hebben.

  6. Verwerk andere informatie die u aan de kaartlocatie wilt koppelen:

    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 layout-auto
    Optie Beschrijving
    Phone Number Het telefoonnummer van de locatie.
    Street Address Het adres van de straat van de locatie.
    City De stad van de locatie.
    Region/State Het gebied of de staat van de plaats.
    Zip/Postal Code De postcode of postcode van de locatie.
    Country Het land van de locatie.
    Comment Opmerkingen die u wilt opnemen.
  7. Klik op Save.

    De nieuwe locatie wordt weergegeven op de kaart en in het locatieraster van de kaart op de Edit Map ​pagina.

    Page Builder - locatieraster met kaarten {width="600" modal="regular"}

De kaart opmaken styling

Gebruik de Google Maps De Tovenaar van de Stijl van het platform om één van zes vooraf bepaalde thema's toe te passen of een douanethema tot stand te brengen. U kunt een JSON-bestand genereren met de stijleigenschappen van de kaart of een koppeling naar de gestileerde kaart.

De kaartstijl wijzigen

  1. In de Beheerder zijbalk, ga naar Stores > Settings>Configuration.

  2. In het linkerdeelvenster onder General, kiest u Content Management.

  3. Uitbreiden Expansiekiezer Advanced Content Tools.

  4. Onder de Google Maps Style tekstvak, klik op Kaartstijl maken.

    Deze handeling opent de Google Maps Wizard Platformstijlen op een apart tabblad kunt u een stijl definiëren voor uw Google Maps Platformproject.

  5. Klikken Create a Style en volgt u de geleverde instructies.

    Klik op Finish.

  6. De voltooide stijl als code JSON of als URL uitvoeren zodat u het aan kunt toevoegen Commerce configuratie.

    • JSON: Klik onder het vak met de gegenereerde JSON-code op Copy JSON.

    • URL: Klik onder het vak met de gegenereerde URL op Copy URL.

  7. Ga terug naar het tabblad Admin-browser en plak de gegenereerde code of URL in het dialoogvenster Google Maps-stijl doos.

    Als u een URL gebruikt, vervangt u de YOUR_API_KEY plaatsaanduiding met uw Google Maps API-sleutel. Deze URL is gekoppeld aan uw opgemaakte Google Map.

  8. Klik in de rechterbovenhoek op Save Config.

De kaartinstellingen wijzigen

  1. Houd de aanwijzer boven de kaartcontainer om het gereedschapvak weer te geven en kies de optie Instellingen ( Instellingenpictogram {width="20"} ).

  2. Wijzig desgewenst de basisinstellingen:

    table 0-row-2 1-row-2 2-row-2 layout-auto
    Optie Beschrijving
    Height Hiermee geeft u de hoogte van de weergegeven kaart op in pixels.
    Show Controls Hiermee bepaalt u of de standaard Google Map-besturingselementen worden weergegeven.
  3. Wijzig de Advanced ​instellingen naar wens:

    • Als u de horizontale positionering wilt bepalen van de kaartinhoud die aan de container is toegevoegd, kiest u een Alignment:

      table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 layout-auto
      Optie Beschrijving
      Default Hiermee past u de standaardinstelling voor uitlijning toe die is opgegeven in het stijlblad van het huidige thema.
      Left Hiermee lijnt u de inhoud uit langs de linkerrand van de kaartcontainer, waarbij rekening wordt gehouden met de opgegeven opvulling.
      Center Hiermee wordt de inhoud in het midden van de kaartcontainer uitgelijnd, waarbij rekening wordt gehouden met de opgegeven opvulling.
      Right Hiermee lijnt u de inhoud uit langs de rechterrand van de kaartcontainer, waarbij rekening wordt gehouden met de opgegeven opvulling.
    • Stel de Border stijl toegepast op alle vier zijden van de kaartcontainer:

      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
      Optie Beschrijving
      Default Past de standaardrandstijl toe die door het bijbehorende stijlblad wordt gespecificeerd.
      None Geeft geen zichtbare indicatie van de containerranden.
      Dotted De containerrand wordt weergegeven als een stippellijn.
      Dashed De containerrand wordt weergegeven als een onderbroken lijn.
      Solid De containerrand wordt weergegeven als een effen lijn.
      Double De containerrand wordt weergegeven als een dubbele lijn.
      Groove De containerrand wordt weergegeven als een gegroefde lijn.
      Ridge De containerrand wordt weergegeven als een afgeronde lijn.
      Inset De containerrand wordt weergegeven als een inzetlijn.
      Outset De containerrand wordt weergegeven als een omtreklijn.
    • Als u een andere randstijl dan None, vult u de weergaveopties voor de rand in:

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

      table 0-row-2 1-row-2 2-row-2 3-row-2 layout-auto
      Optie Beschrijving
      Border Color Geef de kleur op door een staal te kiezen, op de kleurkiezer te klikken of door een geldige kleurnaam of een gelijkwaardige hexadecimale waarde in te voeren.
      Border Width Voer het aantal pixels in voor de lijnbreedte van de rand.
      Border Radius Voer het aantal pixels in om de grootte te bepalen van de straal die wordt gebruikt om elke hoek van de rand te afronden.
    • (Optioneel) Geef de namen op van CSS classes van het huidige stijlblad toe te passen op de kaartcontainer.

      Scheid meerdere klassennamen met een spatie.

    • Voer in pixels waarden in voor de Margins and Padding om de buitenmarges en de binnenopvulling van de kaartcontainer op te geven.

      Ga elke overeenkomstige waarde in het diagram van de kaartcontainer in.

      table 0-row-2 1-row-2 2-row-2 layout-auto
      Containergebied Beschrijving
      Margins De hoeveelheid lege ruimte die wordt toegepast op de buitenrand van alle zijden van de container.
      Padding De hoeveelheid lege ruimte die wordt toegepast op de binnenrand van alle zijden van de container.
      note note
      NOTE
      Opvulling is niet beschikbaar voor het inhoudstype Kaart.
  4. Klik op Save om de instellingen toe te passen en terug te keren naar de Page Builder werkruimte.

De rastergrootte wijzigen

De rastergrootte bepaalt de grootte van de kaart voor een kolom op de Page Builder in het werkgebied. De kaart is standaard 12 kolommen breed, met een maximum van 16 kolommen.

  1. In de Beheerder zijbalk, ga naar Stores > Settings>Configuration.

  2. In het linkerdeelvenster onder General, kiest u Content Management.

  3. Uitbreiden Expansiekiezer Advanced Content Tools.

  4. Werk de rasteropties naar wens bij:

    note note
    NOTE
    Wis indien nodig de Use system value Schakel het selectievakje in om deze instellingen te wijzigen.
    • Voor Default Column Grid Size Voer een nieuwe waarde in voor de standaardgrootte van het raster.

    • Voor Maximum Column Grid Size Voer een nieuwe waarde in voor de standaardmaximale rastergrootte.

    Instellingen voor rastergrootte van kolom {width="600" modal="regular"}

  5. Klik op Save Config.

recommendation-more-help
85b60248-86a4-4d5f-9933-5179643f608d