Přejít k hlavnímu obsahu

Jak přidat název dynamického webu a slogan do globální záhlaví Divi

Divi: nejjednodušší téma WordPress k použití

Divi: Nejlepší WordPress téma všech dob!

více Stahování 701.000, Divi je nejoblíbenější téma WordPress na světě. Je kompletní, snadno použitelný a je dodáván s více než šablonami 62 zdarma. [Doporučeno]

Znalost přidání dynamického názvu webu a sloganu do globální záhlaví Divi bude užitečná při vytváření webových stránek Divi. A je k tomu několik dobrých důvodů. Na jedné straně ne všechny weby mají logo. Název webu je dobrá náhrada loga. Dalším důvodem je posílení vaší značky zahrnutím důležitých informací na vaše stránky, kde je uvidí každý.

V tomto kurzu vám ukážeme, jak přidat název a slogan dynamického webu do globálního záhlaví Divi. Toto řešení dynamicky extrahuje název a slogan webu z backendu WordPress. Navíc budete mít všechny výkonné možnosti designu Divi, abyste si mohli upravit název a slogan, jakkoli chcete!

Možný výsledek

Zde je ukázka designu, který postavíme v tomto tutoriálu.

Šablona globální hlavičky dynamického názvu webu 6

Všimněte si nadpisu a sloganu stránky uprostřed střední části záhlaví, které se dynamicky zobrazuje.

Příklad úpravy názvu Divi

Stažení zdarma

Připojte se k Divi Newlsetter a my vám pošleme e-mailem kopii balíčku Ultimate Divi Landing Page Layout Pack spolu s mnoha dalšími bezplatnými a úžasnými zdroji, tipy a triky Divi. Postupujte podle něj a za chvíli budete mistrem Divi. Pokud jste již přihlášeni k odběru, jednoduše zadejte svou e-mailovou adresu a kliknutím na Stáhnout otevřete balíček rozvržení.DOWNLOAD

Chcete-li šablonu importovat, přejděte do části Divi> Generátor motivů.

Klikněte na ikonu přenositelnosti v pravém horním rohu stránky.

V rozevíracím okně přenositelnosti vyberte kartu importu a vyberte soubor ke stažení z počítače.

Poté klikněte na tlačítko import.

Vyberte divi šablonu

Po dokončení bude celková šablona záhlaví k dispozici v nástroji Divi Theme Builder.

Upravit globální záhlaví divi

V následujícím se přesuneme k designu.

Název webu a slogan na WordPress

Každý web WordPress má název webu a slogan. Název webu je v podstatě název webu a slogan je krátká fráze, která obvykle vysvětluje, o co se jedná.

Při instalaci WordPress není neobvyklé přidat název webu a zapomenout na něj.

Vytvořte si snadno svůj web pomocí Elementoru

Elementor vám umožní snadno vytvořit jakýkoli design webových stránek s profesionálním vzhledem. Přestaňte platit drahé za to, co můžete udělat sami. [Zdarma]

Přizpůsobte si název divi

Někteří lidé si ani neuvědomují, že slogan existuje, natož aby si ho aktualizovali. Když navíc použijete motiv Divi, ve výchozím nastavení se na vašem webu nezobrazí název a slogan, takže je snadné je ignorovat. Název a slogan webu jsou však nezbytnou součástí webu a vyhledávače je rozpoznají.

Název a slogan webu můžete ve WordPressu kdykoli vyhledat a aktualizovat tak, že přejdete na řídicí panel WordPressu a přejdete na Nastavení> Obecné.

Nebo můžete použít jinou cestu pomocí přizpůsobovače motivu a aktualizovat název webu v obecném nastavení.

Přizpůsobte si identitu wordpressu

Nyní, když víme, kde je název webu a slogan na backendu WordPress, prozkoumejme, jak je můžeme přidat do záhlaví Divi!

Jak přidat dynamický název webu a slogan do globální záhlaví v Divi

Import předem navržené šablony globálního záhlaví

V tomto tutoriálu se zaměříme na to, jak přidat název a slogan dynamického webu do existujícího záhlaví namísto vytvoření úplného záhlaví od začátku. Ušetří vám čas a zlepší přehlednost. Takže pro spuštění tohoto návrhu záhlaví importujeme předdefinovanou globální šablonu záhlaví z našeho čtvrtá sada generátorů témat .

Jakmile máte stáhl balíček vytvoření téma , rozbalte soubor a vyhledejte výchozí soubor JSON šablony webové stránky.

Pak přejděte na Divi> Theme Builder.

Klikněte na ikonu přenositelnosti vpravo nahoře. V rozbalovacím okně přenositelnosti vyberte výchozí soubor JSON šablony webové stránky a klikněte na tlačítko Importovat.

Import modelu Divi

Jakmile je šablona přidána do nástroje pro tvorbu motivů, odstraňte šablonu zápatí a kliknutím upravte celkovou hlavičku.

Odebrat šablonu ze zápatí

Přidání názvu a sloganu dynamického webu do záhlaví

Uvnitř editoru rozložení šablony uvidíte předem připravenou záhlaví. Okamžitě můžeme začít provádět přizpůsobení.

Hledáte ty nejlepší témata a pluginy aplikace WordPress?

Stáhněte si ty nejlepší pluginy a témata aplikace WordPress na Envato a snadno si vytvořte své webové stránky. Již více než stahování 49.720.000. [EXCLUSIVE]

Přesunout logo

Chcete-li začít, přetáhněte modul obrázku, který zobrazuje logo (dynamicky), ze středního sloupce horního řádku do levého sloupce horního řádku.

Přidejte modul výzvy k akci a zobrazte název a slogan webu

Poté přidejte nový modul Výzva k akci do prostředního sloupce horního řádku (kde bylo logo).

Přizpůsobte výzvu k akci

K zobrazení názvu a sloganu webu použijeme modul Výzva k akci.

Ale než začnete přidávat obsah, nejprve vyberte NE, chcete-li použít barvu pozadí.

Nakonfigurujte akce s výzvou k akci

Přidejte dynamický název webu

V nastavení obsahu umístěte kurzor na pole pro zadávání nadpisů a klikněte na ikonu „Použít dynamický obsah“. Poté v seznamu vyberte možnost „Název webu“.

Přidejte dynamický slogan webu

Poté najeďte myší nad oblast těla a vyberte ikonu „Použít dynamický obsah“. Poté v seznamu vyberte možnost „Slogan webu“.

Přidejte slogan webu divi

Přidejte dynamický odkaz na domovskou stránku

Je běžné, že název webu po kliknutí přesměruje na domovskou stránku, zvláště pokud nahrazujete logo. Chcete-li přesměrovat celý kurz na domovskou stránku, přidejte odkaz na domovskou stránku jako dynamický obsah do adresy URL odkazu na kurz.

Přidejte odkaz na domovskou stránku

Návrh textu názvu a sloganu webu

Nyní se na záhlaví dynamicky zobrazuje název a popisek webu. Nyní musíme jen přidat styl. Nezapomeňte, že musíme upravit text nadpisu tak, aby byl navržen nadpis webu, a text těla, aby navrhoval slogan.

Přejděte na kartu Návrh a aktualizujte následující:

  • Písmo názvu: Heebo
  • Titulek písma: tučné
  • Styl písma názvu: TT
  • Velikost textu nadpisu: 32 px (na ploše), 24 pixelů (na tabletu a telefonu)
  • Rozmístění nadpisu: 0.3em
  • Tělo Font: Roboto
  • Styl písma těla: kurzíva
  • Barva textu těla:
  • Velikost textu: 13px
  • Mezera mezi písmeny: 0.1em
  • Výška linie těla: 1m
Přizpůsobte si titulní písmo divi

Chcete-li pomoci s centrováním, odstraňte výchozí výplň pod textem těla přidáním následujícího vlastního CSS do popisu propagace:

odsazení dole: 0px
Přidejte vlastní kód divi css

Další úpravy designu

V této poslední části tutoriálu provedeme některé další úpravy návrhu záhlaví, aby se zajistilo, že položky zůstanou vertikálně vystředěny v každém sloupci, a dá tlačítku jedinečný design. K tagline přidáme také před a za šikmý řádek (jen pro kopy).

Svisle centrování sloupců / obsahu

Právě teď je horní řádek aktivní „Vyrovnat sloupcové výšky“, který používá vlastnost flex. Můžeme to vydělávat přidáním malého fragmentu CSS, abychom se ujistili, že všechny sloupce zůstávají vertikálně vystředěny uvnitř řádku. Chcete-li to provést, otevřete nastavení pro horní řádek a do hlavního prvku přidejte následující CSS:

Zarovnat položky: střed;

Aktualizace sloupce pomocí tlačítka

Dále otevřete nastavení pro sloupec 3 v horním řádku a odstraňte barvu pozadí a výplň.

Snadno vytvořte svůj online obchod

Stáhněte si zdarma WooCommerce, nejlepší e-commerce pluginy pro prodej vašich fyzických a digitálních produktů na WordPress. [Doporučeno]

Přizpůsobte tlačítko kontaktu divi

Aktualizace pozadí tlačítka

Poté otevřete nastavení modulu tlačítka a aktualizujte pozadí novým gradientem pozadí následujícím způsobem:

  • Pozadí přechodu Levá barva: #ffffff
  • Barva přechodu na pravé pozadí: # 1dbf73
  • Směr přechodu: 135deg
  • Počáteční pozice: 10%
  • Koncová pozice: 0%
Přizpůsobte pozadí tlačítka divi

Přidání před a za znaky do sloganu

Každý prvek dynamického obsahu lze změnit kliknutím na ikonu ozubeného kola. Chcete-li do sloganu přidat znaky před a za, otevřete nastavení modulu výzvy k akci obsahujícího slogan a klikněte na ikonu úprav v dynamickém obsahu sloganu webu. Poté přidejte znaky k položkám před a po.

Zobrazit slogan divi

Konečný výsledek

Chcete-li zobrazit výsledek, otevřete libovolnou stránku na vašem webu. Měli byste vidět nádherný název a slogan dynamického webu!

Konečný výsledek divi

Závěrečné myšlenky

Je opravdu hezké mít možnost přizpůsobit celkovou hlavičku pomocí dynamického názvu a sloganu. Zdá se to jako něco, co bude užitečné pro mnoho webů. Také se mi líbí myšlenka zahrnout kromě loga i název webu a slogan pro ještě silnější zastoupení značky.

Zdroj: Elegantní téma

Tento článek obsahuje komentáře 0

Zanechat komentář

Vaše e-mailová adresa nebude zveřejněna. Povinné položky jsou označeny *

Tato stránka používá společnost Akismet ke snížení nežádoucích účinků. Přečtěte si další informace o tom, jak se používají vaše komentáře.

Zpět na začátek
0 akcie
podíl
tweet
Zadat