--- site_name: WPlama site_description: "Správa, opravy a vývoj WordPress webů a e-shopů" site_url: https://www.wplama.cz contact_email: info@wplama.cz title: "Seriál „Obecný úvod do WordPressu“: 6. část – Úprava vzhledu pomocí CSS a PHP" url: https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/ date: 2014-05-28 modified: 2019-07-11 author: Martin H. type: post categories: [WordPress obecně] tags: [css, php, šablony, vzhled] --- WordPress obecně # Seriál „Obecný úvod do WordPressu“: 6. část – Úprava vzhledu pomocí CSS a PHP [MH **Martin H.**](https://www.wplama.cz/author/snyll/) Publikováno 28. 5. 2014 Aktualizováno **11. 7. 2019** 3 min čtení Pozor: Článek je z roku 2014. Některé postupy se mohly změnit. ![php](https://www.wplama.cz/wp-content/uploads/2014/05/php.jpg "php") Nejste spokojeni se **vzhledem svého WordPress** webu? Vyzkoušejte úpravu šablony pomocí **CSS a PHP**. Každá vizuální šablona není nic jiného než sada obrázků, CSS dokumentů, javaskriptových souborů a PHP skriptů. Kterýkoliv z nich můžete přímo upravit a změnit tak vzhled webu k obrazu svému. Než začnete upravovat, přečtěte si ještě o child šablonách: [Jak vytvořit child theme a proč ho využívat](https://www.wplama.cz/jak-vytvorit-child-theme-a-proc-ji-vyuzivat/) ### Čím editovat soubory šablony Jednotlivé soubory šablony můžete editovat dvěma způsoby. Pokročilejší uživatelé či programátoři jistě sáhnou po změně **CSS či PHP souborů** v jejich oblíbeném vývojovém prostředí nebo běžném textovém editoru. Po každé změně však musí upravené dokumenty znovu nahrát na webserver prostřednictvím FTP klienta, což se nemusí být zrovna moc pohodlné. Méně zkušení uživatelé tak mohou využít jednu z funkcionalit WordPressu – **editor zdrojových kódů**. Ten je dostupný v menu **Vzhled | Editor**. Tady je k dispozici seznam všech relevantních souborů právě aktivované šablony, které lze vybrat a jednoduše upravit v editačním okně. ### Které soubory upravit Kdo chce upravovat soubory WordPress šablony, měl by samozřejmě alespoň trochu znát nejen **principy CSS stylování a PHP skriptů**, ale také strukturu WordPress šablony a funkci jednotlivých souborů. Ze všech editovatelných souborů je zde rozhodně nejdůležitější dokument **style.css**, který definuje, jak se budou informace na webu zobrazovat, popisuje tedy vizuální stránku webu. Většina ostatních souborů, především PHP skripty pak definují obsah webu, tedy co se bude zobrazovat. Klíčová je pak zejména tato **šestice souborů**: - header.php – definuje hlavičku webu, - footer.php – definuje patičku webu, - sidebar.php – definuje postranní nabídku a menu, - index.php – definuje hlavní stránku, - single.php – definuje podobu příspěvku, - page.php – definuje podobu stránky. Změnou těchto PHP dokumentů můžete nastavit, které informace z databáze se mají použít a kde se mají zobrazit. Stylem CSS pak definujete jejich konkrétní vizuální podobu. ### Všechný díly seriálu „Úvod do WordPressu“ [Seriál „Obecný úvod do WordPress“: 1. část – Před instalací](https://www.wplama.cz/serial-obecny-uvod-do-wp-1-cast/ "Wordpress seriál") [Seriál „Obecný úvod do WordPress“: 2. část – Instalace](https://www.wplama.cz/serial-obecny-uvod-do-wordpress-2-cast-instalace/ "Wordpress seriál") [Seriál „Obecný úvod do WordPress“: 3. část – Základní nastavení](https://www.wplama.cz/serial-obecny-uvod-do-wordpress-3-cast-zakladni-nastaveni/ "Wordpress seriál") [Seriál „Obecný úvod do WordPress“: 4. část – Pokročilé možnosti nastavení](https://www.wplama.cz/serial-obecny-uvod-do-wordpress-4-cast-pokrocile-moznosti-nastaveni/ "Wordpress seriál") [Seriál „Obecný úvod do WordPress“: 5. část – Úprava vzhledu pomocí motivů](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-5-cast-uprava-vzhledu-pomoci-motivu/ "Wordpress seriál") Seriál „Obecný úvod do WordPress“: 6. část – Úprava vzhledu pomocí CSS a PHP [Seriál „Obecný úvod do WordPress“: 7. část – V praxi](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-7-cast-v-praxi/ "Wordpress seriál") [Seriál „Obecný úvod do WordPress“: 8. část – Vhodná rozšíření](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-8-cast-vhodna-rozsireni/ "Wordpress seriál") [Seriál „Obecný úvod do WordPress“: 9. část – Tvorba obsahu](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-8-cast-tvorba-obsahu/ "Wordpress seriál") [Seriál „Obecný úvod do WordPress“: 10. část – Statistiky a měření návštěvnosti](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-10-cast-statistiky-a-mereni-navstevnosti/ "Wordpress seriál") [Seriál „Obecný úvod do WordPress“: 11. část – Aktualizace a zálohy](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-11-cast-aktualizace-a-zalohy/ "Wordpress seriál") - [#css](https://www.wplama.cz/stitek/css/) - [#php](https://www.wplama.cz/stitek/php/) - [#šablony](https://www.wplama.cz/stitek/sablony/) - [#vzhled](https://www.wplama.cz/stitek/vzhled/) Sdílet - - [](mailto:?subject=Seriál „Obecný úvod do WordPressu“: 6. část – Úprava vzhledu pomocí CSS a PHP&body=Seriál „Obecný úvod do WordPressu“: 6. část – Úprava vzhledu pomocí CSS a PHP https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/) - [](https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.wplama.cz%2Fserial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php%2F) - [](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fwww.wplama.cz%2Fserial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php%2F) MH Autor Martin H. Hobby programátor, IT nadšenec a nepoučitelný kritik. 46 článků [Všechny články autora →](https://www.wplama.cz/author/snyll/) ## Komentáře (12) [Přidat komentář →](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#respond) L Lucie [8. 1. 2016](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-27582) Měla bych dotaz ohledně úprav v WP Editoru. Vytvořila jsem child theme, ale po jeho otevření v editoru se mi zobrazuje pouze soubor style.css a jedna šablona stránky.php. Potřebovala bych tam nakopírovat i ostatní šablony.php. Nevíte, jak na to? Předem díky za odpověď. [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-27582) TC Tomáš Cirkl WPlama [8. 1. 2016](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-27583) Child theme slouží k tomu, aby jste při úpravách (ať už vhledu nebo funkce) vybrané šablony nemuseli upravovat původní zdrojové soubory a mohli šablonu aktualizovat bez ztráty úprav. Pokud child šabloně potřebujete další soubory z původní šablony, můžete je zkopírovat přes FTP. Například pomocí programu File Zilla. [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-27583) M Milan [11. 1. 2016](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-27623) Věnujete se problematice Child theme ještě na jiných místech? [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-27623) TC Tomáš Cirkl WPlama [11. 1. 2016](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-27625) Ano, napsal jsem k tomu celý článek [https://www.wplama.cz/jak-vytvorit-child-theme-a-proc-ji-vyuzivat/](https://www.wplama.cz/jak-vytvorit-child-theme-a-proc-ji-vyuzivat/) [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-27625) --- --- --- --- K Katy [11. 4. 2017](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-53196) Dobry den, kdyz si stahnu vlastni THEME z wordpressu, co jake slozky ho mam pridat v adresari wordpress? Kdyz totiz otevru index, tak mi to vypisuje, ze nenaslo zadne PHP funkce – get header apod :/ DEKUJI [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-53196) TC Tomáš Cirkl WPlama [11. 4. 2017](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-53212) Zdravím, složka na ftp je ve wp-content/themes/. [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-53212) --- --- M Michael [5. 5. 2017](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-54282) Dobrý den, když udělám změny např. v single.php a později dojde k aktualizaci šablony, bude tento soubor přepsán nebo zůstanou mé úpravy zachovány? [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-54282) --- IM Ivan Markuš [7. 9. 2017](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-57145) dobrý deň s WordPressom nemám skúsenosti, poznám skôr Joomlu 🙁 otázka: Ako sa dá upraviť šírka textového poľa v šablóne Tventy Seventeen, alebo Fepper. Viem, že cez Editor, ale kde a v ktorom skripte je nastavenie šírky? Teraz tam je príliš úzky stlpec, a ten by som chcel nastaviť na širší. Veľmi pekne ďakujem za radu vopred. Príjený deň [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-57145) --- J Josef [5. 10. 2017](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-57944) V nastavení šablony stačí přepnout ze dvou sloupců na jeden a upravit šířku v style.css Můžete nastavit třeba na 1000px .page-one-column .panel-content .wrap { max-width: 1000px; } [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-57944) --- J Jan [10. 1. 2018](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-62699) Zdravím, děkuji za návod. Nicméně, potřeboval bych menší radu: koupil jsem prémiovou šablonu. Chci aby vypadala stejně jako v demu – samozřejmě, že si ji upravím. Šablonu jsem nainstaloval ve formě zip – nahrál…a nevypadá ani zdaleka tak, jako je vidět v demu při koupi. Nevíte náhodou, jestli není nějaký rychlý krok, jak tuto šablonu plně aktivovat? ps. všechny pluginy, které mi to doporučilo jsem nainstalovat (kromě wookomerce) [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-62699) TC Tomáš Cirkl WPlama [10. 1. 2018](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-62700) Dobrý den, autoři šablon někdy také nabízí import nastavení a obsahu. Pak by šablona mě vypadat přesně jako v demu. [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-62700) --- --- J Jitka [19. 2. 2018](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-64440) Děkuji, moc mi pomohla informace o editoru zdrojáku přímo ve WP, neměla jsem o něm zdání. Už dřív jsem přidávala úpravy css přímo v šabloně, v Přizpůsobit, ale nyní jsem potřebovala změnit anglické texty na české, a ty byly ve zdrojáku. Díky Vám se mi to povedlo! [Odpovědět](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#comment-64440) --- ### Přidat komentář [Zrušit odpověď](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-6-cast-uprava-vzhledu-pomoci-css-a-php/#respond) [← Předchozí článek Jak vybrat správný hosting pro WordPress](https://www.wplama.cz/jak-vybrat-spravny-hosting-pro-wordpress/) [Další článek → Seriál „Obecný úvod do WordPressu“: 7. část – V praxi](https://www.wplama.cz/serial-obecny-uvod-do-wordpressu-7-cast-v-praxi/) Související ## Mohlo by vás zajímat [Všechny články z rubriky WordPress obecně →](https://www.wplama.cz/wordpress/obecne/) ![opravene verze php rijen 2026 720x405](https://www.wplama.cz/wp-content/uploads/2026/10/opravene-verze-php-rijen-2026-720x405.webp "opravene verze php rijen 2026 720x405") WordPress obecně ### [Kritická oprava PHP: co znamená pro váš WordPress web](https://www.wplama.cz/kriticka-oprava-php-rijen-2026/) 21. 10. 2026 8 min čtení --- ![wordpress 7.1 mary lou](https://www.wplama.cz/wp-content/uploads/2026/08/wordpress-7.1-mary-lou.webp "wordpress 7.1 mary lou") WordPress obecně ### [WordPress 7.1 „Mary Lou“](https://www.wplama.cz/wordpress-7-1-mary-lou/) 24. 8. 2026 6 min čtení --- ![wordpress 7.0 armstrong](https://www.wplama.cz/wp-content/uploads/2026/05/wordpress-7.0-armstrong.webp "wordpress 7.0 armstrong") WordPress obecně ### [WordPress 7.0 “Armstrong”](https://www.wplama.cz/wordpress-7-0-armstrong/) 22. 5. 2026 6 min čtení ---