Hogyan adjunk fejlécet a WordPressben? Használja a WordPress Customizer vagy a Cover blokkot a fejléc képének testreszabásához.

Hogyan adjunk fejlécet a WordPressben? Használja a WordPress Customizer vagy a Cover blokkot a fejléc képének testreszabásához.

Egyetérthet velünk abban, hogy egyetlen weboldal sem teljes fejléc nélkül. Tudtad, hogy a WordPressben két különböző lehetőséged van fejléc létrehozására? Ebben a bemutatóban elmagyarázzuk az egyes különbségeket.

Valódi fejléc kép

A klasszikus WordPress fejléc, ahogy azt te is tudod, az összes különböző oldalon használatos. Ez általában egy széles, téglalap alakú doboz oldalról oldalra. Belsejében található a logó vagy a weboldal neve, a szlogen és a menüpontok. Oda beilleszthetsz egy háttérképet is, amit fejlécképnek hívnak. A fejléckép kiválóan alkalmas a látogatók figyelmének felkeltésére és a weboldal általános megjelenésének és hangulatának kialakítására. Önön múlik, hogy diszkrét fejlécképet vagy domináns képet használ, amely a látogatók figyelmét a weboldal navigációjára irányítja.

WordPress fejléc kép
A leggyakrabban használt fejléctípus - fejléckép a weboldal tetején

Hogyan szerkesztheti a fejlécet a WordPress Customizerben

Alapértelmezés szerint a fejléc képe a WordPress Customizer segítségével módosítható. Ezt a WordPress adminisztrációból és a weboldaladról is elérheted:

  • Közvetlenül a WP adminból, csak navigáljon a Megjelenés -> Testreszabás
  • A frontendben, ha bejelentkeztél, kattints a "Testreszabás" gombra a felső sávban.

A testreszabó tartalmazza az aktuálisan aktív téma összes alapvető megjelenési beállítását. Ezért a fejléckép beállításainak helye az aktív témától függ. Az Citadela témában a fejlécképet a következő menüpontban adhatja hozzá és szerkesztheti meg Testreszabás -> Megjelenés -> Fejléc háttér.

Fejléc hozzáadása a Customizer segítségével
Fejléc hozzáadása a Customizer segítségével

Fejléc kép beállításai

Nem számít, milyen fejlécképet választ, azt az igényei szerint konfigurálhatja. Érdekes hatást érhet el a "Fejléckép ismétlés" használatával. A következő beállításokat konfigurálhatja:

  • Csempe
  • Csempe vízszintesen
  • Csempe függőlegesen
  • No Repeat (ha nem szeretné megismételni a képet)
Bekapcsolva a fejléc képismétlés funkció
A fejléc kép csempehatása

Egyéb beállítások a WordPressben - Fejléc kép mérete

Egy másik lehetőség a fejléc szerkesztésére és a kép beállítására a megfelelő méret beállítása. A fejléc képmérete a következő három lehetőséggel rendelkezik:

  • Eredeti - megtartja az eredeti képméretet
  • Borító - a feltöltött képet átméretezzük, hogy illeszkedjen oldalról oldalra, a képet ki is lehet vágni, hogy illeszkedjen.
  • Tartalmazza a címet. - a fejléc kép mérete úgy lesz beállítva, hogy a teljes kép látható legyen
3 lehetőség a fejléc képméretére
Nézze meg, hogyan nézhetnek ki a különböző fejlécek a méretük szerint - eredeti, borító és tartalmazott méretben

Beállíthatja a kép pozícióját a fejlécen belül, és beállíthatja a háttér rögzítését.

Fejlécként működő fedőblokk

Ahogy már említettük a cikk elején, többféleképpen is szerkeszthetjük a fejlécet a WordPress szerkesztőben. A Customizer használata mellett használhatod a WordPress egyik alapvető blokkját, a Cover blokkot is. Szóval mi a különbség?

A Customizerrel létrehozott klasszikus fejléc az egész weboldalra vonatkozik, míg a Cover blokk lehetővé teszi, hogy bármely oldalhoz vagy poszthoz címlapképet adjon, amely alapvetően fejlécképként működik. Akár többször is használhatja egy oldalon vagy poszton, különböző beállításokkal.

Hol használható Cover block

A borítóblokk szélesebb körben alkalmazható a weboldalon, mint a klasszikus weboldal fejléc. A Cover blokk széles, teljes szélességű címképet ad a tartalomhoz. Használhatja a blogbejegyzések tartalmának vizuális elkülönítésére. Minden egyes posztrész saját fejlécképet kap, amely a következő tartalomhoz kapcsolható. Nagyszerű tulajdonsága, hogy közvetlenül a Cover blokk belsejébe írhat szöveget. Ez a szöveg a kép fölött fog megjelenni.

Borítókép mint fejléckép a blogbejegyzésben
Blogbejegyzés fejléc képpel, amely a Cover blokkon keresztül lett hozzáadva

Kezdőlap fejléc

A borítóblokk a weboldal fejléce helyett is használható, ha eredeti megjelenést szeretne elérni. Mivel a Cover blokk különböző igazítási lehetőségeket biztosít, beállíthatja a tartalom szélességére vagy teljes szélességűvé teheti. A teljes szélességű fejléc nagy háttérképként is használható. De ne feledkezzen meg az Oldalcím kikapcsolásáról az Citadela témában. Erre a lépésre akkor van szükség, ha a Cover blokkot a weboldal fejléceként szeretné használni.

Fejléc teljes szélességű háttérképként
Teljes szélességű fejléc a honlapon

Hogyan hozzunk létre fejlécet a Cover blokk használatával

Első lépésként hozzá kell adnod a Cover blokkot. A következő módon adhatod hozzá bármelyik oldalhoz vagy poszthoz:

Kattintson a "+" jelre a felső sávban vagy a tartalomban bárhol a "+" jelre. Ezután egyszerűen keresse meg a Cover blockot.

Fedőlap blokk hozzáadása a "+" gombra kattintva
Fedőlap hozzáadása a "+" segítségével

Egy másik gyors módja a blokk hozzáadása a blokk neve után a "/" betűvel.

A slash használata a Cover block hozzáadásához
Adjon hozzá egy slash és írja be a Cover blockot, hogy hozzáadja ezt a blokkot a tartalmi területhez.

Miután hozzáadta a Cover blokkot, kap egy helyet a kép vagy videó feltöltéséhez. Képet a Médiatárból is kiválaszthat. A kiválasztott képet vagy videót fejlécként fogja használni.

Fejléc címe

Érdekes dolog a Cover blokk segítségével hozzáadott fejléc, hogy a kép fölé írhatsz szöveges címet. Ez a cím a szakasz fejléceként is használható, például blogbejegyzésekben. Lehetőség van arra is, hogy bármilyen URL-t hozzáadjon.

Cím a fejlécben
Cím a fejlécben

A Cover block beállítása

A borítóblokk a blokk eszköztárral igazítható. A tartalmi területen belül balra, jobbra vagy középre igazítható. Széles vagy teljes szélességűre is beállítható. Ezeket az opciókat támogatnia kell az aktív témának, amelyet a webhely építéséhez használ.

Fedélblokk igazítása
A Cover blokkot többféleképpen is beállíthatja, hogy elérje a fejléc tökéletes megjelenését.

Borítókép beállításai

A borítókép megjelenése módosítható az Ellenőrben. Ha fix háttérként állítja be, a kép nem gördül az oldal többi tartalmával együtt, hanem mindig a helyén marad.

A Fókuszpont kiválasztó segítségével kiválaszthatja, hogy a kép melyik része jelenjen meg a fejlécben. A képpel még tovább dolgozhat. Például beállíthatja az Overlay színét és a háttér átlátszatlanságát. Mindkét beállítás segít a fejléc utolsó simításában. Ha a blogbejegyzésen belül használja a Cover blokkot, a megfelelő színséma és átlátszóság használatával a kívánt hangulatot adhatja a bejegyzésének. Legyen óvatos ezekkel a beállításokkal, mivel a címszövegnek jól láthatónak kell lennie.

Színátfedés és átlátszóság beállítása
A megfelelő színfelület kiválasztásával szemet gyönyörködtető fejléceket hozhat létre.

Videó fejléc készítése

A Cover blokk használható videó lejátszására is a weboldal fejlécében. Ezzel megragadhatja a látogatók figyelmét, vagy népszerűsítheti termékét vagy szolgáltatását. Vannak több támogatott videó formátum, a leggyakrabban az .mp4 formátumot használhatja.

Nagyszerű dolog, hogy a videó fölé is írhat címet, igazíthatja, teljes szélességűvé teheti, vagy beállíthatja a Color overlay-t. A Cover blokk beállításai minden médiatípus esetében ugyanazok.

Milyen tapasztalatai vannak a fejlécekkel kapcsolatban? Próbáltad már a Cover blokkot fejléc létrehozására? Jobban szereted a klasszikus weboldal fejlécet a WordPress testreszabó segítségével? Oszd meg velünk az alábbi hozzászólásokban.