A Divi teljes képernyős térképmoduljai megkönnyítik a személyre szabott Google Maps integrálását az oldal mindenhol. Akár korlátlan tűket is hozzáadhat a térképhez, és beállíthat egy egyéni kiindulási helyet. A modulok térképei normál szélességű formátumban is vannak, ezért mindenképpen ellenőrizze ezt is!
Google Maps API-kulcs
Az API kulcs követelmények a Maps modul használatához. API-kulcs megszerzéséhez jelentkezzen be a Google Developers Console, amely végigvezeti Önt a folyamaton, és automatikusan aktiválja a Google Maps JavaScript API-t és az összes kapcsolódó szolgáltatást. Az első dolog, amit felkérnek, egy új projekt létrehozása.
Ezután meg kell adnia a projekt nevét. Bármilyen nevet adhat a projektnek. Ebben a példában egyszerűen „Térképnek” neveztem el. Azt is megadhatja a domain név webhelyének (adjon hozzá egy *-ot, ha engedélyezi a hozzáférést a www.domain.com és a domain.com oldalról), hogy megbizonyosodjon arról, hogy jogosult az API-kulcsára.
Miután létrehozott egy megnevezett projektet, megjelenik egy használható API kulcs.
Miután megszerezte az API-kulcsot, be kell másolnia / beillesztnie azt a témabeállítások panelbe az alábbiak szerint: Divi >> Témaopciók >> Általános beállítások >> Google Maps API-kulcs
Hogyan kell hozzáadni a Divi teljes képernyőkártya modult
Mielőtt teljes képernyős térképmodult adna az oldalához, először be kell ugrania a Divi Builderbe. Egyszer a Divi téma telepítve van a webhelyére, észrevesz egy gombot Használja a Divi Buildert a bejegyzésszerkesztő felett, amikor új oldalt hoz létre. Kattintson erre a gombra a Divi Builder aktiválásához és az összes Divi Builder modul eléréséhez. Ezután kattintson a gombra Használja a Visual Builder alkalmazást hogy a generátort vizuális módban indítsa el. Kattintson a gombra is A Visual Builder engedélyezése amikor az előtérben böngészi a webhelyet, ha csatlakozik a WordPress irányítópultjához.
Miután belépett a Visual Builder programba, a szürke plusz gombra kattintva új modult adhat hozzá az oldalához. Új teljes szélességű modulok csak teljes szélességű szakaszokon belül adhatók hozzá.
Ha új oldalt indít, ne felejtse el először hozzáadni a teljes szélességű szakaszt az oldalához.
Keresse meg a teljes szélességű térkép modult a modulok listájában, és kattintson rá, hogy hozzáadja az oldalához. A modok listája kereshető, ami azt jelenti, hogy beírhatja a "teljes képernyős térkép" szót is, majd az Enter gombra kattintva automatikusan megtalálja és hozzáadja a teljes szélességű térkép modult! A modul hozzáadása után a modul opcióinak listája fogadja. Ezek az opciók három fő csoportra vannak felosztva: Tartalom , Fogamzás et fejlett .
Példa felhasználási esetre: Teljes szélességű térképmodul hozzáadása egy névjegyoldalhoz
A teljes szélességű térképmodul nagyszerű módja annak, hogy vállalkozása helyét bemutassa a kapcsolatfelvételi oldalon. Hasznos és vonzó funkció, hogy több gombostűt is hozzáadhat a térképhez, hogy kiemelje a különböző helyeket és üzleti információkat.
Ebben a példában hozzáadok egy teljes szélességű térképmodult a hely- és üzleti információk megjelenítéséhez, egyéni gombostűvel a térképhez.
fontos : Győződjön meg arról, hogy érvényes Google API-kulcsot adott meg a Beállítások panelen Divi téma. A térképmodul nem fog működni nélküle.
A Visual Builder használatával adjon hozzá egy Teljes szélesség szakaszt a kapcsolattartó oldal aljára. Ezután helyezze be a Teljes szélességű térkép modult az új szakaszába. A teljes szélességű térképbeállítások Tartalom lapján adja meg a vállalati címet a Térképközpont cím lehetőség alatt. A térkép középcíme a térkép középpontja.
Ezután kattintson + Új elem hozzáadása hogy létrehozza az első tűt. Frissítse a következőket:
Cím: [adja meg a hely címét] Tartalom: [írja be a PIN-kód tartalmát (cím és telefonszám)] Térkép címe: [adja meg az adott hely címét]
A beállítások mentése
Ez minden. Mostantól egy teljes szélességű dinamikus térképmodul található a kapcsolattartó oldal alján, amelyre kattintható tűvel láthatja el a vállalat adatait.
Teljes szélességű térképmodul-tartalmi beállítások
A Tartalom fülön megtalálja a modul összes tartalmi elemét, például szöveget, képeket és ikonokat. Minden, ami irányít mi jelenik meg a modulban, mindig megtalálható ezen a lapon.
Google API-kulcs
A Térkép modul a Google Maps API-t használja, és érvényes Google API-kulcs szükséges a működéséhez. A Térkép modul használata előtt győződjön meg arról, hogy hozzáadta az API-kulcsot a Beállítások panelen Divi téma.
Térképközpont cím
Adjon meg egy címet a térkép középpontjához, és a cím geokódolásra kerül, és megjelenik az alábbi térképen. Ez akkor hasznos, ha több csap van, és azt szeretné, ha a térképet egy adott és pontosabb helyen nagyítanák. Egyszerűen beírhat egy címet szabványos formátumban, például: "1235 Sunny Road, Some City, State, 88343".
Adminisztráció címke
Ez megváltoztatja a konstruktor modul címkéjét az egyszerű azonosítás érdekében. Amikor a WireFrame nézetet használja a Visual Builder alkalmazásban, ezek a címkék a Divi Builder felület modulblokkjában jelennek meg.
Teljes szélességű térkép-tervezési lehetőségek
A Tervezés lapon megtalálja a modul összes stíluslehetőségét, például a betűtípusokat, a színeket, a méretezést és a térközt. Ezen a lapon módosíthatja a modul megjelenését. Minden Divi modulnak hosszú a tervezési beállítások listája, amelyek segítségével bármit megváltoztathat.
Egérkerék Zoom
Itt kiválaszthatja, hogy a zoom szintjét az egér kereke vezérli-e vagy sem. Gyakran a legjobb kikapcsolni ezt az opciót, hogy a látogatókat ne zavarják, amikor lefelé görgetnek az oldalon, és beragasztják az egér kerekét a térkép iframe-jébe. Ez különösen igaz a teljes szélességű kártyamodulokra.
Húzható nagyítás
Itt választhatja ki, hogy a kártyát mozgatható-ea mobileszközökön.
Használja a szürkeárnyalatos szűrőt
Ha engedélyezi ezt az opciót, akkor a térkép szürkeárnyalatos képként jelenik meg.
Speciális teljes szélességű térképbeállítások
A Haladó lapon olyan lehetőségeket talál, amelyeket a tapasztaltabb webtervezők hasznosnak találhatnak, például egyéni CSS és HTML attribútumokat. Itt alkalmazhat egyedi CSS-t a modul számos elemére. Alkalmazhat egyedi CSS osztályokat és azonosítókat is a modulra, amelyek felhasználásával testreszabhatja a modult a gyermek téma style.css fájljában.
CSS azonosító
Adjon meg egy opcionális CSS azonosítót, amelyet ehhez a modulhoz használ. Az azonosító felhasználható egyedi CSS-stílus létrehozására vagy az oldal egyes szakaszaira történő hivatkozásokra.
CSS osztály
Adja meg az ehhez a modulhoz használandó opcionális CSS osztályokat. Egy CSS osztály felhasználható egyedi CSS stílus készítéséhez. Több osztályt is felvehet, szóközzel elválasztva. Ezeket az osztályokat fel lehet használni a Divi gyermek témában, vagy az egyéni CSS stíluslapban, amelyet hozzáad az oldalához vagy a webhelyéhez a Divi téma beállításai vagy a Divi Builder oldal beállításai segítségével.
Egyéni CSS
Az egyedi CSS alkalmazható a modulra és a modul bármely belső elemére is. Az Egyéni CSS részben talál egy szövegmezőt, ahol egyedi CSS stíluslapokat adhat hozzá minden elemhez. Az ezekben a beállításokban található CSS bejegyzések már stíluscímkékbe vannak csomagolva. Tehát csak pontosvesszővel elválasztva adja meg a CSS-szabályokat.
láthatóság
Ez az opció lehetővé teszi azoknak az eszközöknek a vezérlését, amelyeken a modul megjelenik. Választhatja a modul deaktiválását táblagépeken, okostelefonokon vagy asztali számítógépeken egyenként. Ez akkor hasznos, ha különböző modokat szeretne használni különböző eszközökön, vagy ha le akarja egyszerűsíteni a mobil tervezését bizonyos elemek eltávolításával az oldalról.
Egyedi, teljes szélességű térképtartalom-beállítások
Cím
Új pin létrehozásakor hozzárendelhet címet. Ez a cím akkor jelenik meg a mezőben, amikor az egérrel a térkép csapjára mutat.
Tartalom
Új PIN-kód létrehozásakor hozzárendelhet egy tartalmi szövegblokkot. Ez a szöveg akkor jelenik meg a mezőben, amikor az egérrel a térkép csapjára mutat.
Térkép cím
Pontosan ez a hely a térképen, ahol az új PIN-kód megjelenik. Megadhatja a címet szabványos formátumban.
[vc_row center_row=”yes”][vc_column width=”1/2″][vcex_button target=”blank” layout=”expanded” align=”center” font_family=”Raleway” font_weight=”700″ style=”flat” custom_background=”#18b69d” custom_hover_background=”#118d7a” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]DIVI TÉMA LETÖLTÉSE [/vcex_button][/vc_column][vc_colum /1″][vcex_button url=”https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=2&url=23065&tid40632=tutorials” target=”blank” layout=”expanded” align=”center” font_family = ”Raleway” font_weight=”1″ style=”flat” custom_background=”#c700e” custom_hover_background=”#4226d8f” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]LETÖLTÉS TEMPLATES DIVI[/vcex_button][/vc_column][/vc_row]
Egyéb Divi oktatóanyagok
- 5 weboldalak éttermi felhasználásra Divi téma
- Hogyan lehet szöveget hozzáadni a Divi WooCommerce termékhez?
- Hogyan változtathatja meg a menü színét a Divi oldalak között
- Hogyan lehet személyre szabni egy blog rácsát a Divi-vel
- Hogyan kell használni a szerepe Divi szerkesztő WordPress
- Hogyan készítsünk teljes képernyős Divi csúszkát?
- Hogyan változtathatja meg a menük színét a Divi oldalak között
- Funkciók, amelyeket valószínűleg nem ismer a Divi-ről
- A Divi Builder használata a WordPress-en
- Hogyan használjuk a Divi video scrolling modult
- A Divi Builder Flip modul használatának módja
- Hogyan adhatunk hozzá egy beszámolót a Divi Builderhez
- A Divi szövegmodul használata
- Hogyan lehet létrehozni egy csúszkát a Divi-n
- A Divi felhasználói szerepkör szerkesztése
- A Divi Social Media használata
- Hogyan lehet használni az üzlet modult a WordPress Divi témában?
- A Divi oldalsáv moduljának használata
- A Divi áratábla modul használatának módja
- A Divi kiadványok címmoduljának használata
- Hogyan adhatunk hozzá egy Divi video modult
- A cikk navigációs moduljának használata
- A Divi keresőmodul használata
- A Divi pénztárca moduljának használata
- A személyi modul használata a Divi Builder-en
- A pénztárca moduljának használata a Divi szűrővel
- A teljes szélességű csúszka modul használata
- A Divi Builder képmodul használata
- A Divi Builder teljes szélességű navigációs moduljának használata
- A képgaléria modul használata
- A Divi Builder teljes szélességű kártya moduljának használata
- A Divi teljes szélességű portfólió moduljának használata
- A Divi teljes szélességű fejléc moduljának használata
- A Divi számláló modul használata
- Hogyan lehet használni a Divi Builder cikkcsúszkáját?
- A Divi Email Optin modul használata
