A fejlécek és láblécek használata az Elementorral

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 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ő.

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.

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.

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:

Meg kell jelennie az Elementor szerkesztési szakaszának tetején, miután kiválasztott egy sablont:

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.

Ha döntött a logó mellett, kattintson a Közzététel gombra .

Ha frissíti az Elementor felületet, akkor webhelye logójának a fejlécben kell lennie:

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:

Íme a menüszerkezetünk, amelyet a fejléc sablonjában láthat:

Ha egynél több menüje van, szükség esetén frissítheti a tartalmát.

A tulajdonságait ugyanúgy szerkesztheti, mint bármely más widgetet.

Ha további elemeket kell hozzáadnunk, további részeket is hozzáadhatunk fejlécünkhöz:

Kezdjük azzal, hogy adjunk hozzá egy fejlécet és néhány közösségi média ikont:

Ezt követően tetszőleges módosításokat végezhet. A szerkesztésünk így alakult:

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

És itt van egy amp élő oldalunk oldalára:

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:

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.

A weboldalunkhoz választott sablon a következő:

A fejléc azonnal megjelenik, amint elkezdi a szerkesztést (ha beállítja azt a feltételt, hogy az minden oldalon megjelenjen).

Szükség szerint módosítsa a láblécet; Így néz ki revíziónk:

A lábléc közzététele a befejezés után:

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:

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.

Hanson F.

Legutóbbi hozzászólások

WordPress téma összehasonlítás: Astra vs OceanWP

A két legnépszerűbb WordPress téma a piacon az Astra és az OceanWP. Szakmai…

2022. január 2

A WordPress hírtéma összehasonlítása: Újság vs. Astra

Egy kiváló hírwebhely létrehozásához nem szükséges webtervezővé válni. Mi…

2021. október 25

Hozzon létre egy hírekkel kapcsolatos webhelyet Újság témával

A Newspaper téma az egyik legjelentősebb WordPress téma, amelyet a tagDiv, egy…

2021. október 18

Hogyan építsünk fel e-kereskedelmet az Avada WooCommerce builder segítségével

Amikor egy online áruház létrehozásáról van szó, a WooCommerce a legjobb beépülő plugin . Azt…

2021. október 4

A ragadós fejléc és a görgetőeffektusok használata az Elementorral

A fejléc általában az első dolog, amit az ember meglát, amikor felkeresi a webhelyét,…

2021. szeptember 21

Az Avada fejléc, lábléc és oszlopelrendezés-készítő használata

Saját oldalkészítőnk, az Avada Builder mostantól két felületen is elérhető: Avada…

2021. szeptember 16