# Google Térkép

Ez a leírás segítséget ad a **Google Térkép Widget** Beállításában és stílusának módosításában.

#### GOOGLE TÉRKÉP WIDGET LÉTREHOZÁSA

**Drag and Drop** módszerrel adhat az oldalához hozzá Google Térkép Widgetet.

<div class="vc_row wpb_row vc_row-fluid" id="bkmrk-megjegyz%C3%A9s%3A%C2%A0a-widget"><div class="wpb_column vc_column_container vc_col-sm-12"><div class="vc_column-inner"><div class="wpb_wrapper"><div class="wpb_text_column wpb_content_element "><div class="wpb_wrapper">  
</div></div><div class="vc_message_box vc_message_box-standard vc_message_box-rounded vc_color-info vc_custom_1599650507901"><div class="vc_message_box-icon">  
</div><div class="ricsi info alert alert-info"><span class=".">**Megjegyzés:** A widget az **Alapértelmezett Stílussal** jön létre amelyet a beállított sablon ad, azonban ez szabadon **módosítható**.</span></div></div></div></div></div></div>  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Map-dragdrop.png)

#### SZERVEZETI ADATOK

1. Amikor az **Új jelölő hozzáadása**-ra kattint, akkor lehetősége van módosítani a **Szervezeti adatokat** mint például a Szervezet név, cím, és egyéb információk.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Map-details.png)

1. Hozzáadhat például **Hivatkozás szöveget**-et a szervezeti adatokhoz, az egyéb információkhoz, ami egy **Link** fog megjeleníteni. Ha szeretné módosítani az **Ikon**-t válassza az **Ikon típust**-t, alapértelmezésben a **Alapértelmezett** kerül beállításra a widget létrehozása során.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Map-link-text.png)

1. Alapértelmezésben a **Alapértelmezett** kerül beállításra a widget létrehozása során, Ha például **Kép**-et szeretne beállítani az **Ikon** helyett jelölőként, akkor válassza a **kép** lehetőséget. Mindezek mellett módosíthatja a **Ikon típust**, az **Ikon**-t, az **Ikon szín**-t és a **betű méretet**, valamint az **Ikon méretet**.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Map-font-type.png)

1. Jelölje be a **Driving Direction Text and Link** felirat előtti **jelölő négyzetet** térképen az útvonal tervezés megjelenjen. Ha bejelöli a **Zoom** opciót, akkor lehetőség lesz a **zoom-in** és a **zoom-out** funkciók használatára a térképen. Bejelölheti az **Embed Code** opciót is a Google Térkép beágyazásához.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Map-zoom.png)

#### GOOGLE TÉRKÉP BEÁGYAZÁSA

Abban az esetben ha bejelölte a **Google Embed code** opciót akkor a **Google Térkép**-et beágyazhatja egy **Iframe Kód** segítségével, ehhez a kapott kódot illessze be az Embed code mezőbe.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Embed-googlemap.png)

#### TÖBB HELYSZÍN

Kattintson az **Add new Marker** gombra ahhoz, hogy új helyszínt adhasson hozzá a térképhez. A **Scroll Zooming** opció bejelölésével közelíthető távolítható lesz a térkép.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Map-marker.png)

#### TÉRKÉP TÍPUSA ÉS A TÉRKÉP STÍLUSA

Választhat az előredefiniált **térkép típusok** közül a lehulló listából, valamint kiválasztható az előredefiniált **Térkép stílus** is.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Map-type.png)

#### TÉRKÉP EGYEDI STÍLUSOK

1. Válassza a **Custom** lehetőséget a Térkép stílusok közül ahhoz, hogy egyedi stílust állíthasson be. Kattintson a **Snazzy Maps** gombra a Google Térkép **egyedi stílusának** megadásához.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Map-custom-style.png)

1. Illessze be az **egyedi kódot** a Custom Style szövegmezőbe.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Map-code.png)

#### HELYSZÍN LISTA

Jelölje be a **Location List** **jelölő négyzetet** a helyszín lista megjelenítéséhez. A listaoszlopok száma **oszlopszámot** ad a kiválasztott listában a helylisták megjelenítéséhez. A lista **maximális szélessége** megadja a Helyi lista megjelenítéséhez szükséges teljes szélességet.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/Map-location-list.png)