Jak používat záhlaví a zápatí s Elementor

Záhlaví a zápatí webu jsou základními prvky. Ve většině případů záhlaví poskytuje navigační odkazy, které zjednodušují navigaci do různých částí webu. Na druhou stranu zápatí obsahuje důležité informace, které mohou návštěvníci webu vyžadovat, jako je adresa firmy nebo kontaktní údaje, abychom uvedli několik amp .

Záhlaví a zápatí poskytuje aktuální téma uživatele na WordPress. Ty jsou obvykle dobře navržené a vhodné pro většinu jejich použití. Pokud však chcete upravit svá témata, budete muset změnit kód; V tomto případě se hodí plugin moduly Page Builder. Můžete je použít k vytvoření a změně komponent webové stránky, aniž byste znali jakýkoli kód.

Tento tutoriál nás naučí, jak vytvořit záhlaví a zápatí webu. Bude použit Elementor Pro (protože základní verze Elementoru neobsahuje funkce nejdůležitější pro tvorbu těchto komponent). Stáhněte si tedy Elementor Pro a ujistěte se, že je zapnutý.

Proč byste si jako tvůrce stránek měli vybrat Elementor?

Elementor je nejpokročilejší tvůrce stránek, který uživatelům umožňuje používat prémiové prvky k vytváření nádherných návrhů a rozvržení. Je to velmi výhodné pro nováčky, kteří nemají žádné předchozí znalosti kódování. Editor drag 'n' drop v Elementor umožňuje uživatelům přesouvat widgety a položky.

Elementor je vizuální tvůrce stránek, který uživatelům umožňuje vidět, jak jejich stránky vypadají bez přepínání režimů.

Dalším přesvědčivým argumentem pro použití Elementoru je, že většinu práce lze dokončit bez nákladů. Jejich bezplatná edice je více než schopná poskytnout dostatečné možnosti úprav stránek. Projdeme si však bezplatnou i placenou verzi, abyste si mohli vybrat tu, která nejlépe vyhovuje vašim potřebám.

Níže jsou uvedeny některé z důležitých aspektů Elementoru, díky kterým se vyplatí:

  • Funkce drag and drop je podporována.
  • Má velké množství šablon.
  • Celkem existuje více než 90 widgetů.
  • Pro responzivní podporu není vyžadováno žádné kódování.
  • K dispozici jsou možnosti opakování a zpět.
  • K dispozici je automatické ukládání.

Pomohlo by, kdybyste se před vytvořením jedinečného záhlaví rozhodli pro obecné uspořádání požadovaných sekcí záhlaví a zápatí. Pohled na předem připravené rozvržení sekce záhlaví vám může poskytnout mnoho možností.

Můžete si vybrat z různých sekcí záhlaví; nejběžnější a moderně vypadající záhlaví obsahuje logo webu v levém rohu, navigační panel uprostřed a sekci vyhledávacího panelu vpravo.

Existuje nekonečné množství možností a můžete si vytvořit libovolné rozvržení.

Zvolil jsem předpřipravenou šablonu záhlaví č. 7; Toto je nejběžnější a nejjednodušší přístup k použití záhlaví na webu WordPress. Zkopírujte a vložte název šablony záhlaví do Šablony > Záhlaví > šablona vyhledávání > vložte zkopírovaný název záhlaví .

Když najdete požadovanou šablonu záhlaví, vyberte „Upravit pomocí Elementor“ a budete přesměrováni do sekce Tvůrce záhlaví Elementor Pro.

Pojďme tuhle párty odstartovat.

Co je to záhlaví a co dělá?

Horní část vaší webové stránky se nazývá „záhlaví webu“. Záhlaví je obvykle stejné na celém webu. Některé webové stránky však používají různá záhlaví pro různé části webu.

Návrh záhlaví poskytne vašim uživatelům první dojem z vašeho webu, ať už se dostali na vaši domovskou stránku, stránku s informacemi nebo jiný individuální obsah. A pokud je dobře navržený, upoutá pozornost uživatele a přiměje ho k dalšímu posouvání a čtení.

Záhlaví může také pomoci při propagaci identity značky vaší společnosti.

Používám funkce, jako je logo společnosti, písmo, barvy a celkový jazyk značky.

Navigace na webu, vyhledávání na webu, nákupní košík (pro prodejní weby), tlačítka s výzvou k akci (CTA) a další funkce, které zlepšují uživatelský dojem a zvyšují míru konverze, to vše se nachází v záhlaví.

Zápatí je část webové stránky, která se zobrazuje ve spodní části stránky. Obvykle se zobrazují neustále na celém webu, na všech stránkách a příspěvcích, podobně jako v záhlaví.

Zápatí jsou často přehlíženy, což je plýtvání potenciálem, protože se objevují na každé stránce webu. Jsou stejně důležité pro hlavičky.

Váš návrh zápatí může zobrazovat užitečné a životně důležité informace, jako je registrace k newsletteru, informace o autorských právech, podmínky použití a soukromí, mapa webu, kontaktní informace, mapy, navigace na webových stránkách a mnoho dalšího, v závislosti na zvoleném nastavení.

Jak vytvořit záhlaví

V této sekci vytvoříme vlastní záhlaví. Nedělejte si starosti, pokud to vypadá zastrašující; nebudeme začínat od nuly. Místo toho použijeme šablony Elementór Pro, navržené designérským týmem Elementor.

Vývoj šablony záhlaví

Na panelu administrátora WordPress umístěte kurzor na Šablony a kliknutím na Přidat nový vytvořte naši hlavičku.

Jakmile budete nasměrováni, objeví se modální okno. vyberte Záhlaví , pojmenujte Záhlaví a klikněte na „ Vytvořit šablonu “:

vytvořit šablonu

Tím se spustí editor Elementor. Poté se vám zobrazí seznam šablon, ze kterých si můžete vybrat. Vyberte si tedy ten, který vás osloví:

Jakmile si vyberete šablonu, měla by se zobrazit v horní části sekce úprav Elementor:

Vytvoření loga: Prvním krokem je vytvoření loga. Nastavte logo v živém editoru webu a vložte jej do záhlaví. Vyberte logo kliknutím na Identitu webu.

Jakmile se rozhodnete pro logo, klikněte na Publikovat .

Logo vašeho webu by nyní mělo být v záhlaví, pokud obnovíte rozhraní Elementor:

Poté můžete provést libovolné změny.

Provádění změn v nabídce záhlaví

Další věc, kterou bychom měli udělat, je změnit menu. Pokud jste vygenerovali nabídku, šablona ji automaticky začlení:

Zde je struktura naší nabídky, kterou můžete vidět v šabloně záhlaví:

Pokud máte více než jednu nabídku, můžete v případě potřeby aktualizovat obsah.

Jeho vlastnosti můžete upravovat stejně jako jakýkoli jiný widget.

Pokud potřebujeme přidat další položky, můžeme do naší hlavičky přidat další sekce:

Začněme přidáním záhlaví a některých ikon sociálních médií:

Poté můžete provést libovolné změny. Takto dopadla naše úprava:

Publikace záhlaví

Jakmile dokončíte úpravy, můžete nyní záhlaví publikovat. amp použijeme záhlaví na celém našem webu , takže tuto volbu vybereme po výběru Přidat podmínku:

A tady je ex amp le na stránku z našich živých stránkách:

Proces vytváření zápatí je velmi podobný procesu vytváření záhlaví. Chcete-li jej vytvořit, vytvořte novou šablonu zápatí takto:

Pak se rozhodněte pro šablonu. Zápatí mají různé tvary a velikosti. Některé obsahují informace o firmě, zatímco jiné mají kontaktní formuláře. Vyberte šablonu, která je vhodná pro vaše požadavky.

Šablona, ​​kterou jsme vybrali pro naše webové stránky, je následující:

Záhlaví uvidíte, jakmile začnete upravovat (pokud nastavíte podmínku, že se zobrazí na všech stránkách).

Změňte zápatí podle potřeby; Takto vypadá naše revize:

Po dokončení publikujte zápatí:

Dokončený produkt

Takto vypadá konečný výsledek. Na našem webu se nyní používá záhlaví i zápatí:

Toto je nejdůležitější fáze a musíte zajistit, aby sekce záhlaví a zápatí reagovaly. Protože nabídka v plné šířce obvykle nevyhovuje mobilnímu zobrazení, musíte vědět, jak bude váš návrh vypadat na mobilní obrazovce. Responzivní přepínače ve spodní části postranního panelu Elementor mohou změnit verzi pro mobily a karty.

Odezvu záhlaví a zápatí můžete otestovat různými způsoby. Pro ex amp le, můžete použít nástroje jako Browserstack, CrossBrowser testování a Google Resizer, aby zajistily, že vaše webové stránky jsou tak citlivé, jak je to možné. Můžete to udělat také ručně experimentováním s různými zařízeními.

Dotahování věcí do konce

Doufám, že vám tato příručka pomohla při rychlém vývoji vašich jedinečných sekcí záhlaví a zápatí pomocí Elementor Pro. WordPress má mnoho funkcí, ale umožňuje pouze několik úprav v záhlaví a zápatí, které nakonec opraví tvůrce stránek Elementor Pro. Díky daleko lepší kontrole nad prvky vašeho webu můžete nyní lépe demonstrovat vizi vašeho webu. Kromě toho byla funkčnost Elementoru vylepšena pomocí bezplatných doplňků, které uživatelům umožňují přizpůsobit své webové stránky pomocí pokročilejších funkcí.

Zanechat komentář

Vaše e-mailová adresa nebude zveřejněna. Povinná pole jsou označena *