Articles

Jak přizpůsobit barvy šablony WordPressu

Vloženo v sekci Marketing, WordPress od WP Engine

Poslední aktualizace 23. prosince, 2020

customize wordpress theme colors

customize wordpress theme colors

Jednou z nejlepších částí používání WordPressu je, že získáte přístup k tisícům motivů, které můžete použít k přizpůsobení stylu svých stránek. Někdy se však stane, že najdete dokonalé téma, jen abyste zjistili, že neobsahuje barevné schéma, které se vám líbí.

To může být frustrující, ale nemusí to zhatit vaše plány. S trochou práce můžete změnit barevné možnosti tématu a zajistit, aby vaše webové stránky vypadaly přesně podle vašich představ.

V tomto článku se budeme zabývat dvěma způsoby, jak můžete přizpůsobit barvy tématu WordPress, včetně ručního přístupu a metody zásuvných modulů. Začněme!

Jak změnit barvy motivu WordPressu

V této části si ukážeme, jak změnit barvy motivu WordPressu ručním způsobem. K tomu budete chtít použít „podřízené téma“, abyste při aktualizaci „rodičovského“ tématu nepřišli o žádné provedené změny.

Nastavení podřízeného tématu je navíc téměř vždy chytrý nápad, pokud plánujete provést nějaké vlastní změny v rámci webu. Pojďme si říct, jak to udělat.

Krok 1: Vytvoření dětského motivu

Dětský motiv je kopie rodičovského motivu, která dědí stejné styly. Můžete provádět změny v jeho kódu, aniž byste ovlivnili kód nadřazeného motivu, a ty se nepřepisují, když potřebujete motiv aktualizovat. Tento přístup umožňuje bezpečně upravovat styl webu, takže pokud uděláte nějakou chybu, můžete se vrátit k nadřazenému motivu a začít znovu.

Pokud jde o vytvoření podřízeného motivu, můžete postupovat dvěma způsoby. Za prvé můžete postupovat ručně, což popisujeme v tomto článku a můžeme to shrnout do čtyř kroků:

  1. Připojte se ke svému webu prostřednictvím protokolu FTP (File Transfer Protocol) pomocí klienta, jako je například FileZilla.
  2. Přejděte do složky Motivy WordPress.
  3. Vytvořte novou složku pro své podřízené téma.
  4. Nastavte soubor style.css pro své podřízené téma.

Můžete se však místo toho rozhodnout použít zásuvný modul, pokud vám nevyhovuje ruční úprava souborů WordPressu. Pro tento scénář doporučujeme nástroj Child Theme Configurator. Pomocí tohoto pluginu můžete vygenerovat podřízené téma a nakonfigurovat jeho nastavení pomocí jednoduché nabídky.

Můžete samozřejmě použít jakoukoli metodu, kterou preferujete. Jakmile je vaše podřízené téma nastaveno, můžete jej aktivovat a přejít k dalšímu kroku.

Krok 2: Přihlášení do WordPressu a otevření nástroje pro přizpůsobení

Předtím, než budete moci změnit barvy tématu WordPressu, budete se muset přihlásit do ovládacího panelu. Jakmile se tam dostanete, přejděte na kartu Vzhled > Editor:

how to customize wordpress themes

how to customize wordpress themes

Tady najdete jednoduchý textový editor, který vám umožní měnit soubory vašeho dětského motivu. Mějte na paměti, že to můžete udělat také pomocí FTP a svého oblíbeného textového editoru, ale výsledek bude stejný v obou případech.

Pokud si chcete raději prohlédnout provedené změny naživo, můžete také upravit barvy svého motivu pomocí nástroje WordPress Customizer. Za tímto účelem přejděte na kartu Vzhled > Přizpůsobení a poté otevřete část Další CSS:

change wordpress theme colors

change wordpress theme colors

V obou případech budete muset použít kaskádové styly (CSS), abyste změnili barvy svého motivu. K tomu slouží náš poslední krok.

Krok 3: Změna barev motivu WordPressu

Tento krok je poměrně jednoduchý, pokud již znáte CSS. Každý prvek v rámci vašeho tématu má svůj vlastní název nebo „třídu“, na kterou se můžete zaměřit pomocí kódu CSS. Musíte vědět, jaká je příslušná třída, a pak ji pomocí barevných kódů HEX změnit.

Pokud například chcete změnit barvu pozadí svého motivu, můžete do svého podřízeného motivu přidat takovýto úryvek CSS (pomocí některé z metod uvedených v minulé části):

background-color: #XXXXXX;

První část tohoto kódu cílí na správnou třídu prvku, který chcete změnit. Pak stačí zadat barvu HEX, kterou chcete použít. Jakmile budete hotovi, nezapomeňte změny uložit do souboru stylů vašeho tématu.

Naštěstí, protože používáte podřízené téma, můžete volně experimentovat, aniž byste se museli obávat, že něco na svém webu rozbijete. Pokud s CSS začínáte, podívejte se na tento návod, jak identifikovat prvky na webu. Pak si můžete hrát s kódy barev HEX, dokud nenajdete kombinaci, která se vám bude líbit.

Pluginy, které mění barvy tématu WordPressu

Pokud raději používáte pluginy než CSS, jistě vás potěší, že existuje několik možností, které můžete použít k přizpůsobení barev tématu WordPressu. Projdeme si dva z našich oblíbených nástrojů.

Plugin 1: Konfigurátor dětských motivů

change font color in wordpress

change font color in wordpress

Konfigurátor dětských motivů je naší nejlepší volbou, protože umožňuje jak vytvořit dětský motiv, tak přizpůsobit jeho barevné schéma. To znamená, že můžete přeskočit mnoho kroků, kterým jsme se věnovali dříve, a začít experimentovat s barevnými paletami mnohem rychleji. S tímto doplňkem budete moci měnit barvy písma, tóny pozadí a mnoho dalšího.

Plugin 2: Central Color Pallete

how to change wordpress color scheme

how to change wordpress color scheme

Jak už název napovídá, Central Color Pallete umožňuje měnit barevnou paletu tématu. Tento doplněk se dobře integruje s mnoha oblíbenými tématy a doplňky a umožňuje vám přeskočit proces používání editoru WordPress pro výběr a přepínání barev. Dva ze zásuvných modulů, se kterými Central Color Palette bez problémů spolupracuje, jsou Beaver Builder a Elementor.

Aktualizujte svůj digitální WordPress s WP Engine

Nezávisle na tom, jaké téma si vyberete, budete potřebovat webového hostitele, který vám poskytne stabilitu a výkon, které budete potřebovat pro provoz a přizpůsobení svého webu. S WP Engine získáte obě tyto vlastnosti a přístup k hvězdnému týmu podpory.

Pokud jste spíše kutilové, zveřejňujeme také spoustu návodů, které můžete použít při řešení problémů nebo provádění změn na svých webových stránkách. Podívejte se na naše plány a vyzkoušejte nás!