jak přizpůsobit záhlaví v WordPress: průvodce pro začátečníky

hledáte snadný způsob přizpůsobení záhlaví WordPress?

vzhledem k tomu, že záhlaví je umístěno v horní části každé stránky, hraje zásadní roli při brandingu vašeho webu, pomáhá návštěvníkům navigovat a propaguje váš nejdůležitější obsah.

Chcete – li však získat co nejvíce výhod z záhlaví vašeho webu, potřebujete způsob, jak jej upravit, což mnoho témat nenabízí.

v tomto příspěvku budeme sdílet některé různé taktiky, které můžete použít k přizpůsobení záhlaví v WordPress pomocí jednoduchých drag-and-drop rozhraní a vlastního kódu.

nejjednodušší možností je použít téma Astra a jeho tvůrce hlaviček drag-and-drop, ale budeme také sdílet některé další taktiky, které budou fungovat s jakýmkoli tématem WordPress.

co je záhlaví WordPress?

hlavička WordPress je část vašeho webu, která se zobrazí v horní části každé stránky. Typicky, obsahuje alespoň dva prvky na minimum:

• logo/identita webu
• navigační menu (y)

například, jak vypadá záhlaví na blogu Astra. Můžete vidět, že obsahuje logo Astra a dvě samostatné navigační nabídky:

v závislosti na vašich potřebách můžete také zahrnout další prvky, jako jsou ikony sociálních médií, vyhledávací pole, promo akce, vaše telefonní číslo a další informace.

pokud někdy potřebujete vidět, jak to funguje, záhlaví WordPress je obsaženo v záhlaví.soubor php ve vašem tématu WordPress.

jak přizpůsobit hlavičku WordPress pomocí Astra

pokud chcete plnou kontrolu nad hlavičkou WordPress, bezplatné téma Astra vám poskytuje drag-and-drop, no-code způsob, jak plně přizpůsobit hlavičku WordPress.

budete mít možnost vidět své změny hned na živém náhledu vašich webových stránek a můžete snadno přidat různé typy obsahu, jako jsou tlačítka, sociální ikony, vyhledávací pole a další.

Chcete-li začít, budete chtít nainstalovat a aktivovat téma Astra. Můžete také importovat jednu ze stovek předem vytvořených demo stránek, abyste se rychle dostali do provozu. Pokud potřebujete pomocnou ruku s některým z těchto kroků, máme spoustu průvodců, kteří vám pomohou:

• Jak nainstalovat Astra
• jak importovat starter sites

jakmile máte základní web připraven k provozu, zde je návod, jak přizpůsobit hlavičku pomocí Astra.

1. Otevřete nástroj Astra Header Builder

Chcete-li začít, přejděte na vzhled → přizpůsobit na hlavním panelu WordPress a spusťte nativní Přizpůsobovač WordPress. Poté vyberte možnost tvůrce záhlaví:

jakmile spustíte nástroj header builder, uvidíte novou sadu možností, kde můžete ovládat rozvržení záhlaví:

2. Přidejte a uspořádejte obsah záhlaví

nyní pro zábavnou část-přidávání obsahu. Můžete vidět, že máte tři řádky v záhlaví builder. Každý řádek řídí obsah pro jinou část záhlaví:

1. nad hlavičkou
2. primární hlavička – zde vložíte svůj „hlavní“ obsah.
3. pod hlavičkou

budete absolutně chtít zahrnout obsah do primární hlavičky a pak máte možnost přidat obsah nad nebo pod podle vašich potřeb.

Chcete-li přidat obsah, můžete kliknout na místo, kam chcete přidat obsah. Tím se otevře sada možností:

• primární menu
• sekundární menu
• Logo
• tlačítko
• vyhledávání
• sociální
• HTML 1
• HTML 2

Všimněte si, že při přidávání obsahu uvidíte méně možností. Můžete například přidat své logo pouze jednou, takže tato možnost zmizí, jakmile již přidáte logo do záhlaví:

jakmile přidáte nějaký obsah, můžete kliknutím na tento obsah otevřít jeho nastavení. Pokud například přidáte tlačítko, budete moci ovládat text tlačítka a odkaz.

můžete také otevřít Nastavení návrhu a přizpůsobit věci dále:

pokud chcete změnit uspořádání obsahu nebo jej přesunout do jiného řádku, vše, co musíte udělat, je přetáhnout jej:

3. Přizpůsobte Rozvržení záhlaví

výše jsme vám ukázali, jak přizpůsobit jednotlivé prvky uvnitř záhlaví. Máte také několik možností, jak přizpůsobit hlavičku jako celek.

nejprve můžete přejít na kartu Návrh hlavního tvůrce záhlaví a ovládat šířku a rozteč záhlaví. Můžete také kliknout na ikonu ozubeného kola pro každý řádek záhlaví a přizpůsobit jeho výšku a design:

4. Experimentujte s různými typy záhlaví

v závislosti na tom, zda používáte bezplatnou verzi Astra nebo Astra pro, získáte také přístup k dalším typům záhlaví, jako jsou průhledné záhlaví (zdarma) a lepivé záhlaví (Pro).

můžete použít stejný záhlaví a zápatí builder výše navrhnout transparentní nebo lepkavé záhlaví. Tyto možnosti uvidíte v části Typy záhlaví. Kliknutím na ně rozbalíte nastavení a navrhnete různé typy záhlaví:

tři další způsoby přizpůsobení záhlaví WordPress

zatímco nástroj Astra drag-and-drop header builder nabízí nejjednodušší způsob přizpůsobení záhlaví WordPress, existují i další taktiky, které můžete použít bez ohledu na to, jaké téma používáte.

zde jsou některé z nejlepších strategií …

1. Použijte nastavení Přizpůsobovače motivu

většina témat WordPress vám dává určitou kontrolu nad hlavičkou vašeho webu v nativním Přizpůsobovači WordPress. Je nepravděpodobné, že získáte úroveň detailů, kterou vám Astra poskytuje, ale získáte několik možností, jak ovládat vzhled a funkce záhlaví.

tyto možnosti se budou lišit v závislosti na motivu, ale obvykle je můžete otevřít kliknutím na modrou ikonu tužky vedle prvků v záhlaví. Například v novém výchozím motivu Twenty Twenty-One můžete vidět, že jste schopni přizpůsobit svůj:

• Logo
• Nadpis stránky
• Menu

pokud potřebujete nějakou další pomoc, můžete nahlédnout do dokumentace vývojáře motivu.

2. Použijte Elementor a bezplatný plugin pro vlastní záhlaví

Pokud nejste obeznámeni s Elementorem, je to vizuální návrhový nástroj drag-and-drop, který můžete použít k vytvoření obsahu na vašem webu. S volným Elementor-Header, zápatí & bloky šablony vlastní záhlaví WordPress plugin, můžete použít bezplatnou verzi Elementor navrhnout vlastní WordPress záhlaví.

tento plugin funguje perfektně s volným tématem Astra, stejně jako s jakýmkoli jiným tématem WordPress, které můžete používat.

Chcete-li začít, nainstalujte a aktivujte bezplatný plugin z WordPress.org. budete také muset nainstalovat bezplatnou verzi Elementoru, pokud jste tak již neučinili.

jakmile to uděláte, přejděte na vzhled → zápatí záhlaví & bloky a klikněte na Přidat nový:

pojmenujte šablonu a zvolte záhlaví podle typu šablony. Můžete také použít možnosti zobrazení na nebo uživatelských rolích k zacílení záhlaví na konkrétní obsah / uživatele.

poté publikujte hlavičku a kliknutím na Upravit pomocí Elementoru otevřete visual builder:

nyní můžete plně přizpůsobit záhlaví pomocí vizuálního rozhraní drag-and-drop společnosti Elementor. Plugin vám také dává nové záhlaví, zápatí & blokuje widgety, které můžete použít k přidání důležitých prvků webu, jako je logo vašeho webu nebo navigační nabídka:

Chcete-li se dozvědět více o používání Elementoru, podívejte se na náš úplný návod Elementor nebo recenzi Elementor.

3. Použijte vlastní kód (pokročilý)

a konečně, pokud jste pokročilý uživatel, můžete také přizpůsobit hlavičku WordPress pomocí vlastního kódu. Chcete-li to provést, budete potřebovat alespoň pracovní znalosti HTML, PHP a CSS, takže to není volba pro netechnické uživatele.

pokud tyto kódovací jazyky neznáte, budete se chtít držet jedné z předchozích metod v tomto seznamu.

existují dvě části pro použití kódu k přizpůsobení záhlaví:

• HTML / PHP-to řídí skutečný obsah v záhlaví.
• CSS-to řídí styl záhlaví.

jak jsme již zmínili, obsah záhlaví vašeho webu je umístěn v záhlaví.php soubor. Chcete-li přizpůsobit obsah záhlaví, budete muset pracovat přímo s tímto souborem. Nebo některá témata, například Astra, také nabízejí háčky, které můžete použít k přidání obsahu do záhlaví.

v Průvodci Astra visual hooks můžete vidět, že máte několik možností přizpůsobení záhlaví:

Chcete – li upravit záhlaví motivu.php soubor přímo, měli byste použít podřízené téma, abyste se ujistili, že při aktualizaci motivu nepřepíšete změny.

na druhou stranu, pokud používáte háčky, nemusíte používat podřízené téma, pokud používáte plugin, jako jsou háčky Astra nebo úryvky kódu. Pokud přidáte háčky přímo do funkcí vašeho motivu.php soubor, měli byste stále používat podřízené téma, ačkoli.

s Astra Pro máte také možnost přidat háčky pomocí funkce vlastního rozvržení Astra Pro.

úhledná věc na vlastních rozvrženích Astra Pro je, že pomocí pravidel zobrazení můžete přesně řídit, kdy se změny zobrazí. Můžete například do záhlaví přidat vlastní obsah, který se zobrazí pouze přihlášeným uživatelům.

to je způsob, jak přizpůsobit obsah záhlaví-ale co styl?

Chcete-li přizpůsobit styl záhlaví, můžete styl upravit.css soubor přímo, pokud používáte podřízené téma. Nebo můžete použít další oblast CSS v aplikaci WordPress Customizer a přidat do záhlaví své vlastní styly.

Přizpůsobte si záhlaví WordPress dnes

vaše záhlaví WordPress hraje zásadní roli v úspěchu vašeho webu. Pomáhá označit váš web, vést návštěvníky ke klíčovému obsahu, propagovat důležité informace nebo sociální profily, a mnoho dalšího.

nejjednodušší způsob, jak získat plnou kontrolu nad hlavičkou vašeho webu, je použít bezplatné téma Astra. S Astra získáte přístup k vizuálnímu nástroji drag-and-drop header builder. Nepotřebujete žádný kód ani externí pluginy – získáte 100% kontrolu nad hlavičkou přímo uvnitř WordPress Customizer.

v jiných situacích můžete také použít nastavení přizpůsobení jiného motivu, Elementor-Header, zápatí & blokuje plugin šablony nebo vlastní kód, pokud máte technické znalosti.