WordPress návody

Jak přidat vlastní CSS styly do WordPress stránky

styly
Autor příspěvku Tomáš Cirkl

Někdy je třeba udělat drobnou úpravu vzhledu webu a tvorba child theme se může zdát zbytečně komplikovaná. Zároveň však nechcete, aby došlo ke ztrátě těchto úprav při aktualizaci šablony nebo pluginů. V tomto článku si ukážeme jak do WordPress jednoduše vložit CSS vlastní styly.

Přihlašte se do WordPress a v levém menu vyberte Vzhled → Přizpůsobit.

Zobrazí se Customizér a v jeho levém menu vyberte položku CSS.

Customizér

Customizér

Zobrazí se editor, do kterého vložte nebo napište vlastní CSS styly.

Přidání vlastních stylů

Přidání vlastních stylů

Nakonec stačí kliknout na tlačítko Publikovat a máte hotovo.

Editor obsahuje základní kontrolu vložených stylů a na případné chyby dokáže upozornit.

Proč nevkládat vlastní styly do šablony, ale radši využít plugin nebo child theme?

Úprava stylů šablony nebo pluginu přímo v originální složce se nedoporučuje, protože při aktualizaci je velká šance, že dojde k přepsání upravovaných souborů a tedy i k ztrátě úprav.

Nejlepší způsob jak upravovat šablonu je pomocí child theme. Tento způsob však může být pro začátečníky zbytečně složitý a při drobných úpravách vzhledu stačí využít zabudovaný editor, který umožňuje vložení vlastního CSS.

Při využití sekce Přizpůsobit se nemusíte bát aktualizací a případné ztráty úprav. Zároveň ani při změně šablony nedojde ke ztrátě stylů. Což oceníte v případě, že jste je použili například k nastylování kontaktního formuláře.

O autorovi

Tomáš Cirkl

Baví mě Internet a zvláště pak redakční systém WordPress. Jsem pravidelným účastníkem a přednášejícím na WordCamp Praha a WordPress konferencích.

4 komentáře

  • Dobrý den,

    rád bych se zeptal, zda nevíte o nějakém spolehlivém pluginu pro přidání celého vlastního css souboru do šablony, aniž bych musel zapisovat ručně do základních souborů?

    Děkuji za odpověď

    Jirka

      • Dobrý den,

        děkuji za informaci. Ještě bych měl jeden dotaz.

        Vytvořil jsem si child šablonu, ve které je prázdný soubor style.css. A nyní chci upravit barvu titulku z bílé na modrou

        h1.site-title { color: blue }

        a/ když to zapíši do základního interního editoru wordpressu, barva titulku se změní na modrou

        b/ když to přes ftp zapíši do souboru style.css, uložím a načtu nově stránku, barva se nezmění

        Zkoušel jsem to u více šablon, ale u žádné se mi to nepovedlo zprovoznit. Chtěl jsem upravovat soubory přes ftp programem Sublime Text, protože žádný z pluginů (co jsem zkoušel) nemá řádné našeptávání – vždy našeptávají vše a ne jen příslušné hodnoty k atributům. Nechápu, proč to nefunguje, nedokázal byste poradit, jak to přes ST zprovoznit?

        Děkuji za odpověď

        Jirka

        • Zdravím,
          ten style.css máte načtený? Zkuste ještě CTRL+F5 případně přidat !important.

Zanechat komentář

Nadcházející školení: Tvorba webu s Divi (Praha 19.9.2019) a WordPress pro začátečníky (Praha 3.10.2019)

Získejte více informací o WordPress!

Připojte se do našeho emailového seznamu a nenechte si ujít informace, novinky a návody ze světa WordPressu.

Úspěšně jste se zapsali do našeho newsletteru. Děkujeme!

Tomáš Cirkl

Tomáš Cirkl

WordPress specialista

Blog WPlama.cz píši už více než 3 roky. O WordPress přednáším a pořádám školení. Pro své klienty vytvářím a spravuji webové stránky.