A webhely fejlécei és láblécei alapvető elemek. A legtöbb esetben a fejléc olyan navigációs hivatkozásokat biztosít, amelyek leegyszerűsítik a webhely különböző részeire történő navigálást. Másrészt a lábléc olyan létfontosságú információkat tartalmaz, amelyekre a webhely látogatóinak szüksége lehet, mint például a vállalkozás címe vagy elérhetősége, hogy néhány amp említsünk .
A fejléceket és a lábléceket a felhasználó aktuális témája biztosítja a WordPress-en. Ezek általában jól megtervezettek, és a legtöbb felhasználáshoz megfelelőek. Ha azonban testre szeretné szabni a témákat, módosítania kell a kódot; Ilyenkor jönnek jól a Page Builder plugin . Használhatja őket weboldal-összetevők létrehozására és módosítására a kód ismerete nélkül.
Ez az oktatóanyag megtanítja nekünk, hogyan készítsünk webhely fejlécet és láblécet. Az Elementor Pro kerül felhasználásra (mivel az Elementor alapverziója nem tartalmazza az ezen összetevők létrehozásához legfontosabb funkciókat). Tehát töltse le az Elementor Pro-t, és ellenőrizze, hogy be van-e kapcsolva.
- Miért válassza az Elementort oldalkészítőnek?
- Az Elementor lehetővé teszi az egyéni fejléc és lábléc fő elrendezésének kiválasztását.
- Mi az a fejléc és mit csinál?
- Mi az a lábléc pontosan?
- Hogyan készítsünk fejlécet
- Fejléc sablon fejlesztése
- Változások végrehajtása a fejléc menüben
- Fejléc kiadvány
- Hogyan készítsünk láblécet
- Lábléc sablon fejlesztése
- Lábléc módosítások
- Késztermék
- Vizsgálja meg a fejléc és lábléc szakaszok reagálóképességét.
- A dolgok lezárása
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-29.png)
Miért válassza az Elementort oldalkészítőnek?
Az Elementor a legfejlettebb oldalkészítő, amely lehetővé teszi a felhasználók számára, hogy prémium elemeket alkalmazzanak gyönyörű tervek és elrendezések létrehozásához. Nagyon hasznos azoknak a kezdőknek, akiknek nincs előzetes kódolási ismerete. Az Elementor drag 'n drop szerkesztője lehetővé teszi a felhasználók számára a widgetek és elemek mozgatását.
Az Elementor egy vizuális oldalkészítő, amely lehetővé teszi a felhasználók számára, hogy módváltás nélkül lássák, hogyan jelennek meg oldalaik.
Egy másik nyomós érv az Elementor használata mellett, hogy a legtöbb munka költség nélkül elvégezhető. Ingyenes kiadásuk több mint képes megfelelő webhelyszerkesztési lehetőségeket biztosítani. Azonban mind az ingyenes, mind a fizetős verziót áttekintjük, így kiválaszthatja az igényeinek leginkább megfelelőt.
Az alábbiakban felsoroljuk az Elementor néhány fontos szempontját, amelyek miatt érdemes:
- A fogd és vidd funkció támogatott.
- Nagy számú sablonja van.
- Összesen több mint 90 widget található.
- A reszponzív támogatáshoz nincs szükség kódolásra.
- Újra- és visszavonási lehetőségek állnak rendelkezésre.
- Az automatikus mentés elérhető.
Az Elementor lehetővé teszi az egyéni fejléc és lábléc fő elrendezésének kiválasztását.
Segítene, ha egy egyedi fejléc kidolgozása előtt döntene a kívánt fejléc- és láblécszakaszok általános elrendezéséről. Az előre elkészített fejlécszakasz-elrendezés megtekintése számos választási lehetőséget kínálhat.
Különféle fejlécrészek közül választhat; a legelterjedtebb és legmodernebb megjelenésű fejléc bal szélső sarokban egy webhely logója, középen egy navigációs sáv, a jobb oldalon pedig egy keresősáv található.
Végtelen lehetőségek rejlenek, és tetszőleges elrendezést készíthet.
A sz.-t választottam. 7 előre elkészített fejléc sablon; Ez a leggyakoribb és legegyszerűbb módszer a fejléc használatára a WordPress webhelyeken. Másolja ki és illessze be a fejléc sablon nevét a Sablonok > Fejléc > keresési sablonba > illessze be a másolt fejléc nevét .
Ha megtalálta a kívánt fejlécesablont, válassza a „Szerkesztés az Elementorral” lehetőséget, és az Elementor Pro fejléckészítő szakaszába kerül.
Kezdődjön a buli.
Mi az a fejléc és mit csinál?
Weboldalának felső részét „webhelyfejlécnek” nevezik. A fejléc általában ugyanaz az egész webhelyen. Egyes webhelyek azonban különböző fejléceket használnak a webhely különböző részeihez.
A fejléc kialakítása biztosítja a felhasználóknak az első benyomást a webhelyről, függetlenül attól, hogy megérkeztek-e a kezdőlapra, az oldalra vagy más egyéni tartalomra. És ha jól van megtervezve, akkor megragadja a felhasználó figyelmét, és további görgetésre és olvasásra csábítja.
A fejléc segíthet a vállalat márkaidentitásának népszerűsítésében is.
Olyan funkciókat használok, mint a cég logója, betűtípusa, színei és általános márkanyelve.
A webhelyen való navigáció, a webhelyen történő keresés, a bevásárlókosár (értékesítési oldalakhoz), a cselekvésre ösztönző (CTA) gombok és egyéb olyan funkciók, amelyek javítják a felhasználói élményt és növelik a konverziós arányt, mind megtalálhatók a fejlécekben.
Mi az a lábléc pontosan?
A lábléc a weboldal egy része, amely az oldal alján jelenik meg. Általában folyamatosan jelennek meg a webhelyen, minden oldalon és bejegyzésben, hasonlóan a fejlécekhez.
A lábléceket gyakran figyelmen kívül hagyják, ami a potenciál elpazarlása, mivel a webhely minden oldalán megjelennek. Ugyanolyan fontosak a fejlécek szempontjából.
A lábléc kialakítása hasznos és létfontosságú információkat jeleníthet meg, például hírlevél regisztráció, szerzői jogi információk, használati feltételek és adatvédelem, webhelytérkép, kapcsolatfelvételi adatok, térképek, webhelynavigáció és még sok más, a választott beállításoktól függően.
Hogyan készítsünk fejlécet
Ebben a részben személyre szabott fejlécet fogunk létrehozni. Ne aggódjon, ha ez megfélemlítőnek tűnik; nem kezdjük elölről. Ehelyett az Elementór Pro sablonjait használjuk, amelyeket az Elementor tervezőcsapata tervezett.
Fejléc sablon fejlesztése
A WordPress adminisztrációs panelén vigye az egérmutatót a Sablonok , és kattintson az Új hozzáadása elemre a fejléc létrehozásához.
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-30.png)
Egy modális ablak jelenik meg az átirányítás után. Válassza ki a fejlécet a legördülő menüből, nevezze el a fejlécet, és kattintson a „ Sablon létrehozása ” gombra:
Ezzel elindul az Elementor szerkesztő. Ezt követően megjelenik a sablonok listája, amelyek közül választhat. Tehát válasszon egyet, amelyik tetszik:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-31.png)
Meg kell jelennie az Elementor szerkesztési szakaszának tetején, miután kiválasztott egy sablont:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-32.png)
Logó készítése: Az első lépés egy logó létrehozása. Állítsa be a logót a webhely Élő szerkesztőjében, hogy elhelyezze a fejlécben. Válasszon egy logót a Webhelyazonosító gombra kattintva.
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-1300x725.gif)
Ha döntött a logó mellett, kattintson a Közzététel gombra .
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-33-1300x729.png)
Ha frissíti az Elementor felületet, akkor webhelye logójának a fejlécben kell lennie:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-34.png)
Ezt követően bármilyen módosítást elvégezhet.
Változások végrehajtása a fejléc menüben
A következő lépés az étlap megváltoztatása. Ha létrehozott egy menüt, a sablon automatikusan beépíti azt:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-35.png)
Íme a menüszerkezetünk, amelyet a fejléc sablonjában láthat:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-36.png)
Ha egynél több menüje van, szükség esetén frissítheti a tartalmát.
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-1.gif)
A tulajdonságait ugyanúgy szerkesztheti, mint bármely más widgetet.
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-2.gif)
Ha további elemeket kell hozzáadnunk, további részeket is hozzáadhatunk fejlécünkhöz:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-3.gif)
Kezdjük azzal, hogy adjunk hozzá egy fejlécet és néhány közösségi média ikont:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-4.gif)
Ezt követően tetszőleges módosításokat végezhet. A szerkesztésünk így alakult:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-37.png)
Fejléc kiadvány
Most már közzéteheti a fejlécet, miután befejezte a módosítást. amp a fejlécet a teljes webhelyünkön használjuk a Feltétel hozzáadása lehetőséget választva ezt a lehetőséget választjuk
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-5-1300x695.gif)
És itt van egy amp élő oldalunk oldalára:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-38-1300x737.png)
Hogyan készítsünk láblécet
Lábléc sablon fejlesztése
A lábléc elkészítésének folyamata meglehetősen hasonló a fejléc létrehozásához. Egy ilyen létrehozásához hozzon létre egy új lábléc sablont, például:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-39-1300x713.png)
Ezután döntsön a sablon mellett. A láblécek különböző formájú és méretűek. Egyesek szilárd információkat tartalmaznak, míg mások kapcsolatfelvételi űrlapokat tartalmaznak. Válassza ki az igényeinek megfelelő sablont.
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-40-1300x714.png)
A weboldalunkhoz választott sablon a következő:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-41-1300x715.png)
Lábléc módosítások
A fejléc azonnal megjelenik, amint elkezdi a szerkesztést (ha beállítja azt a feltételt, hogy az minden oldalon megjelenjen).
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-6-1300x717.gif)
Szükség szerint módosítsa a láblécet; Így néz ki revíziónk:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-42-1300x515.png)
A lábléc közzététele a befejezés után:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-7-1300x714.gif)
Késztermék
Így néz ki a kész eredmény. A fejléc és a lábléc is használatban van weboldalunkon:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-8-1300x731.gif)
Vizsgálja meg a fejléc és lábléc szakaszok reagálóképességét.
Ez a legfontosabb fázis, és gondoskodnia kell arról, hogy a fejléc és lábléc szakaszok reagáljanak. Mivel a teljes szélességű menü általában nem illik a mobil nézethez, tudnia kell, hogyan fog megjelenni a terv a mobil képernyőjén. Az Elementor oldalsáv részének alján található reszponzív kapcsolók módosíthatják a mobil és a lap verzióját.
Különféle módon tesztelheti a fejléc és a lábléc válaszkészségét. Használhat amp olyan eszközöket, mint a Browserstack, a CrossBrowser Testing és a Google Resizer annak biztosítására, hogy weboldalai a lehető legreszponzívabbak legyenek. Ezt manuálisan is megteheti, különféle eszközökkel kísérletezve.
A dolgok lezárása
Remélem, ez az útmutató segített Önnek az egyedi fejléc- és láblécrészek gyors fejlesztésében az Elementor Pro használatával. A WordPress számos funkcióval rendelkezik, de csak néhány módosítást tesz lehetővé a fejlécben és a láblécben, végül az Elementor Pro oldalkészítővel javítva. A webhely elemeinek sokkal jobb ellenőrzésével most jobban bemutathatja webhelye jövőképét. Ezenkívül az Elementor funkcionalitása javult ingyenes kiegészítők használatával, lehetővé téve a felhasználók számára, hogy fejlettebb képességekkel testreszabják webhelyeiket.