Elementor navigációs menü - Készítsen lenyűgöző menüt a WordPress webhelyéhez

Keresi a módját annak, hogy egy csodálatos menüt hozzon létre, amely javítja webhelye felhasználói felületét/felhasználói felületét? Ha igen, akkor jó helyen jár. Itt összeállítottunk egy részletes útmutatót, amely segít Önnek.

Először is lépésről lépésre bemutatjuk, hogyan hozhat létre menüt a WordPress webhelyéhez. És ha már rájött erre, akkor eligazítjuk, hogyan használhatja az Elementor Navigation Menu widgetet a WordPress menü testreszabásához és feltöltéséhez.

Tartalomjegyzék:

• Miért van szüksége egyéni navigációs menüre?
• Hozzon létre egy alapvető WordPress menüt az Elementor használatával
• 1. Hozzon létre egy egyszerű menüt a WordPress webhelyéhez
• 2. Válassza ki és testre szabja a navigációs menü elemeket
• 3. Almenük létrehozása - Szülő és gyermek menüelemek (opcionális)
• 4. Kezelje a menü helyét és tegye közzé
• Hogyan lehet navigációs menüt létrehozni az Elementor pro nav 'widget használatával
• Az Elementor Nav-Menu widget főbb jellemzői
• Hozzon létre egy menüt a nav-menu pro widget segítségével
• Mobil érzékeny menü
• Csomagolás

Miért van szüksége egyéni navigációs menüre?

Fontos tudni, hogy a navigációs menük nemcsak a webhely forgalmának növelése, hanem a SEO jobb rangsorolása szempontjából is fontosak.

Valójában a navigációs menüket elsősorban a felhasználók bevonására tervezték, de ez nem az egyetlen cél.

A második legfontosabb tényező, hogy szem előtt tartsuk a „WebCrawler” vagy a botok szerepét, amelyek célja a weboldalak feltérképezése, a tartalom indexelése a megfelelő szintre, és visszajelzés a keresőmotornak a tartalom megfelelő helyen történő rangsorolására.

Ezért ha túl bonyolult menüket készít, akkor a botok számára nehéz lesz rangsorolni a tartalmat, de elveszíti a látogatóit.

Röviden, az „egyszerű navigáció” kulcsfontosságú szerepet játszik a jobb felhasználói élmény javításában, valamint elengedhetetlen szerepet játszik webhelyeink rangsorolásának és forgalmának növelésében.

Kiváló ok sok üzleti webhely számára, hogy egyetlen navigációs ikont tartson a bonyolult menüsor helyett, amely kattintással teljes képernyős menüt tölt be.

A 100% -ban reszponzív navigációs menüvel rendelkező Elementor pro widgetnek köszönhetően kód nélkül hozhat létre képponttökéletes és hihetetlenül rugalmas menüsort.

Ebben az oktatóanyagban bemutatjuk, hogyan használhatja az Elementor navigációs menü widgetet a testreszabott, speciális WordPress menü eléréséhez.

Mielőtt elkezdenénk az Elementor Navigációs widgettel, vizsgáljuk meg, hogyan hozhatunk létre egy egyszerű WordPress menüt az Elementor ingyenes verziója segítségével.

Hozzon létre egy alapvető WordPress menüt az Elementor használatával

Most, hogy létrehozzon egy WordPress menüt, nem kell külön plugin telepítenie. Alapértelmezés szerint a WordPress könnyen használható menükészítővel rendelkezik, amely segít egyszerű navigációs menük létrehozásában webhelyéhez.

Ennek ellenére nem lesz hozzáférése a menü testreszabási lehetőségeihez. Ez átveszi a jelenleg aktív WordPress téma kialakítását. De ha csak ezt szeretné, akkor ez egy kiváló módja a navigációs menü beállításához a WordPress webhelyéhez.

1. Hozzon létre egy egyszerű menüt a WordPress webhelyéhez

Először is be kell jelentkeznie a WordPress háttérprogram irányítópultjára.

Most a bal oldali oldalsávról lépjen a Megjelenés > Menük elemre . Itt egy kétoszlopos elrendezést talál, balra a „Menüelemek hozzáadása”, jobbra pedig a „Menüszerkezet” felirattal.

A menüstruktúra alatt talál egy mezőt a „Menü neve” számára. Ez lesz a neve annak a menünek, amelyet most készítünk. Nevezzük 1 -es menünek.

Megjegyzés : Ne aggódjon. Olvasói nem láthatják a menük nevét. Ez egy olyan funkció, amely segít a különféle menük rendszerezésében.

Miután megadta a menü nevét, kattintson a „Menü létrehozása” gombra, hogy elérhető legyen. Most hozzá kell adnia a különböző menüelemeket.

2. Válassza ki és testre szabja a navigációs menü elemeket

Most jön az a rész, ahol új menüvel töltheti fel a menüpontokat. A bal oldali „Menüelemek hozzáadása” részben talál egy listát azokról a dolgokról, amelyeket felvehet a menübe.

Alapértelmezés szerint ez tartalmazza az oldalak, bejegyzések, céloldalak, egyéni linkek és kategóriák bármelyikét.

csak válassza ki a hozzáadni kívánt menüelemeket a jelölőnégyzet segítségével, majd kattintson a „Hozzáadás a menühez” gombra. Ez feltölti a menüt az összes kiválasztott menüponttal.

Megjegyzés : Figyelje meg, hogy a „Menüelemek hozzáadása” alatt minden egyes szakaszban lehetőség van váltani a – Legfrissebb , Összes megtekintése és Keresés . Ne felejtse el használni ezeket a beállításokat, ha sok elem van.

Ha elkészült az összes menüelem hozzáadásával, nyomja meg a „Mentés menü” gombot, és folytassa a következő lépéssel.

3. Almenük létrehozása - Szülő és gyermek menüelemek (opcionális)

Tudta, hogy alapértelmezés szerint a WordPress lehetővé teszi almenük létrehozását is? Az almenüstruktúra létrehozásakor van egy szülő menüelem és egy alárendelt menüpont.

Amikor a felhasználó a szülői menüpont fölé viszi az egeret, az az alatta rejtett összes gyermekmenüt feltárja.

Hűvös ugye?

Most, hogy létrehozzon egy almenü struktúrát, mindössze annyit kell tennie, hogy kiválaszt egy menüpontot, amely a szülői menüben szeretne szerepelni. Ezután húzza át az összes olyan menüpontot, amelyet gyermekmenüként szeretne használni. Most csak húzza jobbra, és kész!

4. Kezelje a menü helyét és tegye közzé

Most, hogy létrehozta az új menüt és hozzáadott almenüket, itt az ideje kezelni a helyét.

A menüszerkesztő tetején észre kell vennie a „Helyek kezelése” nevű lehetőséget. Kattintson rá, és megjelenik valami hasonló a következő képernyőhöz:

Most az elérhető menüpontok a telepített témától függenek. Ebben a korábbi amp van egy téma, amely 3 menüt támogat.

Miután hozzárendelt egy menüt a rendelkezésre álló menüpontokhoz, kattintson a „Módosítások mentése” gombra, és ennyi.

Most már ismeri a WordPress alapértelmezett összes alapvető menüfunkcióját. Ha azonban több testreszabásra és funkcionalitásra van szüksége, olvassa el az Elementor Pro Nav Menu Widgetet.

Hogyan lehet navigációs menüt létrehozni az Elementor pro nav 'widget használatával

Ha testreszabott navigációs menüt szeretne hozzáadni WordPress webhelyéhez, akkor szüksége lesz az Elementor Pro verzióra. Az Elementor Pro verzió az Elementor navigációs widgettel és sok más speciális funkcióval együtt érkezik, mint például több mint 300 sablon, témakészítő, előugró widget, WooCommerce widgetek és sok más érdekes funkció.

Melyek a magának a Navigációs eszköznek a legfontosabb jellemzői? Itt egy rövid bevezetés.

Az Elementor Nav-Menu widget főbb jellemzői

• A Nav-menü widget szabadságot ad arra, hogy a menüt bárhová elhelyezze. A fejlécen vagy az oldal tetején vagy bárhol.
• Több menüt felvehet a webhelyére, valamint az oldalakra külön-külön vagy globálisan.
• Káprázatos megjelenést mutathat a menüben animáció, lebegő effektusok vagy aktív állapot felhasználásával
• Hozzon létre egy mobilra reagáló menüt a webhelyén, és ellenőrizze, hogyan fog kinézni webhelye a mobil képernyőjén
• Testreszabhatja a menüsor színét, tipográfiáját, párnázatát vagy egyéb beállításait
• Hozzon létre egy tökéletes pixelmenüt a megfelelő pontossággal, az igazítás, a távolság és a párnázás mellett.

Hozzon létre egy menüt a nav-menu pro widget segítségével

Létre kell hoznia egy alapvető WordPress menüt, amint azt a fentiekben említettük, majd testreszabhatja az alapértelmezett WordPress menüt a pro-nav-menu widget segítségével. Miután elkészítette az elsődleges listát, a következő lépés az, hogy hozzáadja azt a kívánt helyhez, azaz a fejléc szakaszhoz.

Most, amikor elvégezte az alapbeállításokat, testreszabhatja a menüt a nav-menu widget segítségével.

A beállítási szakasz legfelső sarkában három lehetőség áll rendelkezésre; Tartalom, stílus és haladó.

Az Elrendezés rész : három lehetősége van vízszintes, függőleges vagy rejtett legördülő harmonika.

• Vízszintes: A vízszintes elrendezés a webhelyek által használt leggyakoribb elrendezés. Balról jobbra terjed a képernyőn.
• Függőleges: Számos webhelyen talál függőleges elrendezést is, különösen azokon a webhelyeken, amelyek kreatív szolgáltatásokat kínálnak. Függőleges elrendezés esetén a navigációs sáv elterjedése felülről lefelé történik.
• Legördülő menü : A legördülő menük is elég gyakoriak. A legördülő menü függőleges elrendezésű, és a felfedéshez a felhasználóval való interakcióra van szükség. Leginkább tiszta kialakításra használják őket.

Igazítás szakasz : ez a szakasz segít a menü szövegeinek összehangolásában; középre, jobbra vagy balra.

Animáció szakasz : ez a szakasz lehetővé teszi animációs effektusok hozzáadását animációs effektusok alatt, felett vagy kettős vonalakkal. Választhat a keret, a háttér és a finom szöveges animációkra is.

Az aláhúzott animációk a következők:

• Fade: A fade animáció a menüpontok alatt fade animációt kínál.
• Dia: A diaanimáció a menüpontok alatti sávot csúsztatja.
• Növekszik : A növekvő animáció közepétől kifelé növekszik, és a növekedés érzetét kelti.
• Bepillanás : Az animáció beugrása alulról felfelé folyik.
• Kiesés: Az animáció áramlása felülről lefelé.

Hasonlóképpen vannak keretes, overline, dupla vonal, háttér és szöveges animációk. Mindegyikük saját animációs készletét kínálja, és saját maga is megnézheti őket, hogy megtudja, mit kap velük.

Mutató szakasz : válassza ki a mutató típusát a legördülő menüből.

Almenü indikátor szakasz : Az Elementor widget számos almenü stíluslehetőséggel rendelkezik. Ahol nemcsak a menü színét, stílusát és hátterét vezérelheti.

Párnázás és menüosztás: a párnázás gyorsan állítható. Módosíthatja a vízszintes párnázást a menüben és az almenüben, a függőleges párnázást, a szóközök között, a jobb, bal és középre igazítást is.

Elementor rendkívül jól közelíti meg a menütávolságot és a párnázást. Keményen dolgoztak az ajtók mögött annak biztosítása érdekében, hogy el tudják juttatni az eszközöket a fejlesztőhöz, hogy könnyen elkészíthessék azt a dizájnt, amelyre gondolnak.

A menüköz sok lehetőséget kínál, többek között:

• Szóköz a menüpontok között
• Vízszintes és függőleges párnázás a menü- és almenüelemekhez
• Középre, balra, jobbra és igazolt igazítás.

Színes háttér és tipográfia : személyre szabott márkájú megjelenést kaphat a kívánt színvilág és háttérszín segítségével. Emellett választhatja az átlátszó vagy félig átlátszó menüopciókat is.

Mint tervező, amennyire csak tud, játszhat ezekkel a lehetőségekkel, és gondoskodhat arról, hogy a hátteret tetszése szerint alakítsa ki.

Mobil érzékeny menü

A mobil az internet fontos része, ezért az Elementor fejlesztői olyan eszközöket is kínálnak, amelyek segítségével a mobilhoz is létrehozhatja a navigációs sávot.

Az Elementor widget lehetővé teszi a WordPress mobil menüpontjainak teljes ellenőrzését. A mobil képernyő nézetét külön beállításokkal állíthatja be a csak mobil képernyőkhöz. Van egy lehetőség a mobil képernyő beállításaira az Elementor beállítás szakaszának alján, ahol megtekintheti a mobil képernyő beállításait.

Röviden, az Elementor mobil menüfunkciói az alábbiak:

• Teljes szélesség mobilon: Lehetőség van teljes vagy korlátozott szélesség beállítására is.
• Táblagép vagy mobil töréspontok: A töréspont beállításokkal megadhatja a mobil menüt mobil vagy táblagép számára.
• Függőleges és harmonika menük: Az Elementor lehetőséget kínál egy összecsukható hamburger ikon megjelenítésére is.
• Igazítás váltása: A hamburger ikon középre, balra vagy jobbra igazítható.
• Félre / középre igazítás: Válassza ki a mobil menü igazítását.

Reszponzív navigáció: A menü érzékeny pozícionálását kínálja.

Csomagolás

A menü bármely weboldal egyik legfontosabb funkciója. Mivel elősegíti a látogatók számára az Ön webhelyének átjárását, és ha okosan összeállított egy listát, az elősegítené a látogatók hosszú ideje tartását az Ön webhelyén. A menü ugyanolyan fontos, mint a webhelyek teljes elrendezése, a fejléc és a lábléc szakasz.

Ezért a menü widgetnek képesnek kell lennie arra, hogy az Ön egyedi márka megjelenését az összes lényeges funkcióval együtt jelenítse meg. Az Elementor Navigation widget olyan funkciókban gazdag képességekkel rendelkezik, amelyek lehetővé teszik az ügyfelek számára, hogy testreszabják a menüszakaszt, hogy az illeszkedjen a márka hangjához. Mostantól használhat egy személyre szabott stílusos menüt a webhelyén, a céloldalon, a fejlécben vagy bármely más olyan területen, ahol meg szeretné jeleníteni.