Chcete vytvořit vlastní zápatí v DIVI?
Jednou z nejdůležitějších částí tvůrce témat Divi je schopnost dynamicky přidávat globální zápatí na vaše webové stránky a příspěvky.
Jakmile vytvoříte zápatí, můžete jej automaticky přidat na jakýkoli typ stránky nebo příspěvku, který chcete, pomocí nástroje Divi's theme builder.
V tomto tutoriálu vás krok za krokem provedeme procesem vytváření a přidávání globálního zápatí do Webové stránky.
přehled
Než se vrhneme na tutoriál, podívejme se na zápatí, které budeme navrhovat.
Kancelář
Přejděte do Divi Theme Builder a přidejte globální zápatí
- Přejděte na Divi > Theme Builder a klikněte na „ Přidejte globální zápatí«
- Vybrat " Vytvořte globální zápatí«
Přizpůsobte sekci #1
Barva pozadí
Otevřete sekci, kterou na stránce najdete, a změňte barvu pozadí sekce.
- Pozadí: #000000
vzdálenost
Přepnout na kartu Styl a poté změňte nastavení mezer pro sekci.
- Okraj (nahoře, vlevo a vpravo): 6vw
- Vnitřní okraj (levý a pravý): 30 pixelů
hraniční
Poté přidejte horní okraj vlevo a vpravo.
- Zaoblený obdélník vlevo nahoře: 20 pixelů
- Zaoblený obdélník vpravo nahoře: 20 pixelů
Stínová krabička
V nastavení sekce také zahrňte stín rámečku.
- Síla rozostření luku: 135 pixelů
- Barva písma titulků: rgba (0,0,0,0.18)
Přidejte nový řádek do sekce
Struktura kolony
Pokračujte přidáním řádku do sekce pomocí následující struktury sloupců:
Přidejte do sloupce modul Text
Přidejte název velikosti H2 (nadpis 2)
Vložte textový modul s obsah o velikosti H2.
Nastavení textu H2
Přepněte na kartu Styl modulu a příslušně upravte parametry textu H2:
- Písmo záhlaví: Poppins
- Tlumené světlé záhlaví: polotučné
- Zarovnání textu: Na střed
- Barva textu záhlaví: #ffffff
- Velikost textu záhlaví: 31px (počítač), 24px (tablet), 18px (telefon)
- Výška záhlaví: 1,6 em
dimenzování
Přidejte také maximální šířku modulu.
- Maximální šířka: 700 pixelů
Přidat modul tlačítka do sloupce
Přidat text na tlačítko
Vložte modul Button těsně pod modul Text ve vašem sloupci a zadejte text podle vašeho výběru.
zarovnání
Přepněte na kartu Styl modulu a změňte zarovnání tlačítka na střed.
- Zarovnání tlačítek: na střed
Nastavení tlačítek
Pokračujte přizpůsobením tlačítka.
- Použít vlastní styly pro tlačítko: Ano
- Velikost textu tlačítka: 12px
- Barva textu tlačítka: #000000
- Tlačítko pozadí: #FFFFFF
- Tlačítko šířky ohraničení: 0 pixelů
Čtěte také: Jak zobrazit stránku blogu jako karusel v DIVI
- Poloměr okraje tlačítka: 100 px
- Rozteč písmen tlačítka: 1 px
- Písmo tlačítka: Poppins
- Tlačítko Soft Light: Polotučné
- Tlačítko kopírovat styl: TT
vzdálenost
Přidejte také vlastní hodnoty vnitřního okraje.
- Vnitřní okraj (nahoře a dole): 14px
- Vnitřní okraj: Levý (40px); Vpravo (58px)
Sekce 2
Přidejte druhou „normální“ sekci pod předchozí.
Barva pozadí
Změňte barvu pozadí
- Pozadí: #ffffff
vzdálenost
Poté odstraňte všechny vnitřní okraje (nahoře a dole).
- Vnitřní okraj (nahoře a dole): 0px
Hranice
Do sekce také přidejte poloměr ohraničení.
- Zaoblený obdélník (vlevo nahoře): 20 pixelů
- Zaoblený obdélník (vpravo nahoře): 20 pixelů
Stínová krabička
A dokončete nastavení sekce přidáním jemného stínu rámečku.
- Síla rozostření rámečku: 135 pixelů
- Barva písma titulků: rgba(0,0,0,0.18)
Přidejte nový řádek do sekce
Struktura kolony
Jakmile dokončíte nastavení sekce, přidejte nový řádek pomocí následující struktury sloupců:
dimenzování
Bez přidání jakýchkoli modulů otevřete nastavení řádku a změňte je následovně:
- Použít vlastní šířku okapu: Ano
- Rozteč sloupců: 1
- Harmonizovat výšky sloupců: Ano
- Maximální šířka: 100%
- Maximální šířka: 100%
vzdálenost
Poté z řádku odeberte výchozí vnitřní okraje (nahoře a dole).
- Vnitřní okraj (nahoře a dole): 0px
Rozteč sloupců
Pokračujte otevřením nastavení sloupců a přidejte vlastní hodnoty odsazení.
- Vnitřní okraj (nahoře a dole): 100 pixelů (počítač), 50 pixelů (tablet a telefon)
- Vnitřní okraj (levý a pravý): 100 pixelů (počítač), 50 pixelů (tablet a telefon)
Přidejte modul Text #1 do sloupce
Přidat obsah
Nyní do něj můžeme přidávat moduly. Přidejte do sloupce modul Text a vložte jej obsah De votre choix.
Nastavení textu
Přepněte na kartu Styl modulu a podle toho upravte parametry textu:
- Písmo textu: Poppins
- Tloušťka písma textu: Tučné
- Barva textu: #000000
- Velikost textu: 17px
- Zarovnání textu: Na střed
vzdálenost
Poté přidejte vlastní (horní a spodní) okraje.
- Horní okraj: 10 pixelů
- Dolní okraj: 30px
Přidejte do sloupce modul Separator
Přímo pod textový modul přidejte modul Oddělovač.
viditelnost
Ujistěte se, že možnost " Zobrazit oddělovač Je povoleno.
- Zobrazit oddělovač: Ano
Linka
Změňte barvu čáry na černou.
- Barva štítku: #000000
dimenzování
Změňte také nastavení velikosti rozdělovače.
- Maximální šířka: 15%
- Zarovnání textu: Na střed
Přidejte modul Text #2 do sloupce
Přidat obsah
Pokračujte přidáním dalšího modulu Text do sloupce a také a obsah De votre choix.
Přidání odkazu
Vložte odkaz na stránku, na kterou má tento modul odkazovat.
Nastavení textu
Poté přepněte na kartu Styl a změňte nastavení textu následovně:
- Písmo textu: Poppins
- Text měkkého světla: Jasný
- Barva textu Text: #777777
- Text Velikost textu: 15 px
- Zarovnání textu: Na střed
vzdálenost
Přidejte také okraj (nahoře a dole).
- Okraj (nahoře a dole): 10 px
Klonujte textový modul #2 podle potřeby
Jakmile dokončíte druhý modul Text, můžete jej klonovat tolikrát, kolikrát potřebujete (v závislosti na tom, kolik klikacích prvků zápatí chcete zahrnout).
Upravit obsah a odkazy
Nezapomeňte upravit obsah modulu a odkazy pro každý duplikát.
Klonujte celý sloupec dvakrát
Jakmile dokončíte sloupec a jeho moduly, můžete jej dvakrát naklonovat.
Barva pozadí sloupce 2
Poté otevřete nastavení pro sloupec 2 a změňte barvu pozadí.
- Pozadí: #f9f9f9
Upravit obsah a odkazy
Nezapomeňte upravit veškerý obsah a odkazy v každém duplicitním sloupci.
Přidat nový sloupec
Dále do řádku přidejte čtvrtý sloupec.
Barva pozadí
Změňte barvu pozadí nového sloupce.
- Pozadí: #0fffc7
vzdálenost
Upravte vnitřní okraje následovně:
- Vnitřní okraj (nahoře a dole): 70px
- Vnitřní okraj (levý a pravý): 50 pixelů
Do sloupce 4 přidejte modul „Sledujte nás na sociálních sítích“.
Přidejte sociální sítě
Pokračujte přidáním modulu " Sledujte nás na sociálních sítích ve sloupci 4 a vložte sociální sítě dle vašeho výběru.
Resetovat styly ikon sociálních médií
Klikněte na Obnovit styly prvků rolí pro každou ze sociálních sítí.
zarovnání
Poté přepněte na kartu Styl a upravte zarovnání modulu.
- Zarovnání textu: Na střed
Nastavení ikon
Změňte také barvu ikon sociálních sítí.
- Barva ikony: #000000
Přidejte modul pro volbu e-mailu do sloupce 4
Vložit mod" Email Optin "pod modulem" Sledujte nás na sociálních sítích«
Vymazat obsah a název modulu
Emailový účet
Poté přidejte e-mailový účet. Pokud nepřidáte e-mailový účet, modul se po ukončení nástroje pro tvorbu motivů nezobrazí.
Odstraňte barvu pozadí
- Použít barvu pozadí: Ne
Nastavení pole
Přepnout na kartu Styl a změňte nastavení pole následovně:
- Pole barev pozadí: rgba(0,0,0,0)
- Pole barev textu: #000000
- Písmo Champs: Poppins
- Velikost textu polí: 13px
- Šířka polí: 1 px
Nastavení tlačítek
Přizpůsobte také tlačítko svého modulu.
- Použít vlastní styly pro tlačítko: Ano
- Velikost textu tlačítka: 12px
- Barva textu tlačítka: #000000
- Tlačítko pozadí: #FFFFFF
- Šířka ohraničení: 0px
- Poloměr okraje tlačítka: 100 px
- Rozteč písmen tlačítka: 1 px
- Písmo tlačítka: Poppins
- Tlačítko ztlumení světla: polotučné
- Tlačítko kopírovat styl: TT
Viz také: Jak vytvořit lepící kontaktní formulář v DIVI
- Odsazení tlačítek (nahoře a dole): 15 pixelů
Přidejte modul dynamického textu do sloupce 4
Dalším a posledním modulem, který potřebujeme k dokončení tohoto návrhu, je modul Text.
Aktivovat možnost „ Používejte dynamický obsah".
Poté vyberte možnost „ dnešní datum".
A změňte nastavení dynamického obsahu následovně:
- Přední strana: Copyright ©
- Po: | Všechna práva vyhrazena
- Formát data: Celní
- Vlastní formát data: 20 let
Nastavení textu
Dále přejděte na kartu styl a změňte nastavení textu:
- Písmo textu: Poppins
- Barva textu Text: #000000
- Text Velikost textu: 16 px
vzdálenost
Doplňte parametry modulu přidáním okraje a voila!
- Horní okraj: 50 pixelů
Uložit globální zápatí a možnosti tvůrce motivů
Až budete hotovi, před ukončením stavitele si práci uložte. Divi téma.
Jakmile opustíte rozvržení šablony, uložte všechny změny v tvůrci motivů a máte hotovo!
přehled
Nyní, když jsme prošli všemi kroky, pojďme se naposledy podívat na výsledek.
Stáhnout DIVI hned!!!
Proč investovat do čističky vzduchu?
V tomto tutoriálu jsme vám ukázali, jak snadné je vytvořit krásné vlastní globální zápatí pomocí Divi's theme builder.
Doufáme, že vás tento tutoriál inspiruje k vytvoření krásných globálních zápatí pro vaše další projekty Divi.
Pokud máte nějaké obavy nebo návrhy, najděte nás v sekci komentářů diskutovat o tom.
Můžete však také konzultovat naše zdroje, pokud potřebujete více prvků k realizaci vašich projektů vytváření internetových stránek, nahlédněte do našeho průvodce na internetu Vytvoření blogu WordPress nebo ten, který je zapnutý Divi: nejlepší téma WordPress všech dob.
Mezitím sdílejte tento článek na různých sociálních sítích.
...
