Jak si vytvořit webové stránky ve WordPressu v 10 krocích

Chcete si sami vytvořit webové stránky? Pak jistě sami moc dobře víte, že mít webové stránky je v dnešní době, kdy jsou lidé zvyklí vyhledávat informace a nakupovat na internetu, důležité více než kdy jindy. Díky kvalitnímu webu vzbudíte pozitivní první dojem u nových návštěvníků, oslovíte potenciální zákazníky a zvyšujete tak svoje prodeje. Webové stránky jsou dnes jedním z hlavních marketingových kanálů pro podnikatele. 

Webové stránky jsou vaší vizitkou na internetu

U webdesignu platí stejně jako všude jinde, že dostanete to, za co si zaplatíte. Pokud chcete mít levné webové stránky, můžou být méně kvalitní a ve výsledku pak může vaše firma v očích zákazníka působit nejen zastarale, ale i nedůvěryhodně. A ztráta vaší reputace vás může stát víc, než jste za webdesign ušetřili. Je tedy dobré tvorbu webových stránek nepodcenit a věnovat jí patřičnou pozornost.

Vytvořit si webové stránky podle svých představ však nemusí být jednoduché. Tvorba webových stránek a její technologie a trendy se rychle vyvíjí a web tak za 2-3 roky zastarává. Proto je důležité se jeho tvorbě a správě pravidelně věnovat. Vždycky se totiž najde něco dalšího, co je potřeba upravit a přidat. Kvalitní web by měl mít dobré zabezpečení, pravidelné zálohy, optimalizaci pro vyhledávače a především kvalitní a unikátní obsah, který podpoříte osobitou grafikou.

Pokud toho o tvorbě webových stránek mnoho nevíte, můžete být pro vás těžké odlišit, co mají webové stránky obsahovat, kdo je dobrý a spolehlivý webdesigner a celkově se v celém procesu budete ztrácet. Můžou se také lišit vaše požadavky a očekávání od toho, co ve výsledku obdržíte, a nemusíte tak být s výsledkem spokojeni. Proto pro vás může být rozumné řešení si web vytvořit svépomocí. V tom to článku najdete podrobný návod, který vás provede tvorbou webových stránek v redakčním systému WordPress krok za krokem.

Vytvořte si sami své webové stránky ve WordPressu

Je mi jasné, že ne všichni mají na začátku svého projektu prostředky na kvalitní webové stránky vytvořené od webdesignera. Když si web vytvoříte sami, můžete nejen ušetřit spoustu peněz za vývojáře a webdesignery, ale navíc si na svém webu budete schopni upravovat většinu věcí sami a nebudete závislí na jednom dodavateli. Zato ale o to víc budete muset vložit svého času a energie.  

Začít s tvorbou webových stránek vám může připadat náročné, zejména, pokud nejste technický typ a neumíte programovat. Já vám v tomto návodu ukážu, jak si vytvořit web v deseti krocích. Když se budete tímto tutoriálem řídit, budete mít jednoduchý, moderní a profesionálně vypadající web, který vás bude reprezentovat. Také jsem se pro vás snažila minimalizovat náklady a udělat tak tvorbu webových stránek finančně dostupnější.

Pokud jste webové stránky ještě nikdy nevytvářeli, začněte podle mého návodu a postupujte krok za krokem a svůj web postupně rozvíjejte. Potřebné znalosti a zkušenosti získáte pouze tím, že budete na svém webu aktivně pracovat a zkoušet nové funkce. Začněte s několika málo stránkami a postupně přidávejte další a doplňujte zajímavý a atraktivní obsah. A vaši zákazníci si váš nový web jistě zamilují a budou se na něj rádi pravidelně vracet.

Prohlédněte si ukázkový web Květinářství Hortenzie, který si podle tohoto návodu můžete vytvořit.

Krok 1: Úvodní analýza před tvorbou webu

Tento první krok bývá často podceňovaný. Lidé chtějí prostě web o 10 stránkách, podobný jako má konkurence a aby byl co nejlevnější. Pokud ale chcete, aby váš web uspěl proti vaší konkurenci, musíte být lepší než oni. A k tomu potřebujete mít vytvořený kvalitní plán a strategii.

Vzbudit v lidech důvěru je ten nejtěžší úkol a měly by k tomu směřovat všechny vaše aktivity. Webové stránky by měly být založené nejen na dobrém designu, ale především na kvalitním obsahu. Texty by měly poskytovat návštěvníkům užitečné informace a přesvědčit je k nákupu právě od vás.

Proto, ještě než se pustíte do tvorby webových stránek, zodpovězte si otázky z článku Úvodní analýza před tvorbou webu, abyste měli připravené podklady a nemuseli web v průběhu pracně předělávat. Sepište si, co od nového webu očekáváte a co všechno by měl umět, kdo jsou vaši zákazníci a co na webu hledají, kdo je vaše konkurence a v čem jste vy lepší než oni.

Krok 2: Objednávka domény a webhostingu

Pro tvorbu webu ve Wordpressu potřebujete doménu, stáhnout si WordPress a nainstalovat ho na webhosting. Většina webhostingů dnes nabízí možnost instalace WordPressu jedním kliknutím přímo v administraci.

Jak vybrat doménu

Doména je vaše adresa na internetu, která tvoří součást vaší značky. Výběr vhodné domény je velmi individuální. Nejčastěji bude doména spojena s vaším jménem, s vaší značkou a nebo oborem působení vašeho podnikání.

Snažte se zvolit něco jednoduchého a intuitivního, aby si lidé dokázali vaši doménu snadno zapamatovat. Dokázali ji vyslovit, sami ji napsat do adresního řádku a nemuseli ji tak složitě dohledávat. Pokud nemůžete najít volnou doménu, zkuste přidat nějaké slovo navíc, které vystihuje vaše podnikání.

V českém prostředí lidé očekávají .cz doménu, v mezinárodním prostředí je nejpopulárnější doména s koncovkou .com. Já bych vám doporučila vybrat si jako hlavní doménu krátkou variantu bez pomlčky a případně si dokoupit ještě variantu s pomlčkou, aby vám ji nezabrala konkurence.

Jak vybrat webhosting

Webhosting je pronájem prostoru na cizím serveru. Nemusíte tak provozovat vlastní server, ale můžete si pronajmout prostor od poskytovatele webhostingu. Společnost se za vás stará o servery, operační systém, databáze atd. a vy si jen nainstalujete WordPress jedním kliknutím a pravidelně platíte faktury. Aktuální technické požadavky WordPressu na hosting najdete zde.

Výběru vhodného webhostingu věnujte patřičnou pozornost, protože je pak mnohem složitější web přesouvat na jiný webhosting. Doporučuji vám zakoupit webhosting a doménu u stejné společnosti. Ušetřených pár korun nestojí za to domény na jiný webhosting přesměrovávat a ani to není předmětem tohoto návodu. Pro začátek začněte s nižším hostingovým plánem a upgradujte na vyšší, pokud se zvýší návštěvnost a velikost vašeho webu. 

O výběru webhostingu jsem pro vás připravila článek Srovnání webhostingů pro WordPress. Jedná se o výběr těch nejpoužívanějších webhostingů pro WordPress. Mnou vybrané webhostingy nabízí instalaci WordPressu jedním kliknutím, což vám tvorbu webu výrazně zjednoduší. 

Pokud nakoupíte webhosting a doménu přes některý z mých odkazů na tomto webu, já získám provizi z prodeje, vy nezaplatíte nic navíc a přispějete tak na provoz a další rozvoj tohoto webu. Děkuju za vaši případnou podporu :). 

V následujících návodech používám webhosting Wedos, který je nejprodávanějším webhostingem v Česku. Je vhodný pro weby, které si můžete vytvořit podle tohoto návodu. Ale konečný výběr webhostingu je jen na vás a záleží na vašich požadavcích. Připravila jsem jednoduchý návod, jak si objednat webhosting a doménu u Wedosu.

Krok 3: Instalace WordPressu a nastavení HTTPS zabezpečení

Po zakoupení a aktivaci webhostingu na doméně si můžete nainstalovat redakční systém WordPress. Řada webhostingových společností nabízí instalaci jedním kliknutím, které je jednoduché pro běžné uživatele. Návod, jak to udělat, najdete většinou v nápovědě vašeho webhostingu.

Instalace WordPressu na Wedosu

Jak si WordPress naistalovat, najdete v návodu Jak nainstalovat WordPress na webhostingu od Wedosu.

Nastavení HTTPS zabezpečení

V dnešní době je také důležité na webu používat šifrovanou komunikaci přes protokol HTTPS. Na webu to poznáte tak, že vedle URL adresy se zobrazuje zelený zámeček. Jinak hrozí, že vás vyhledávače budou vidět jako nedůvěryhodné a budou vás penalizovat. Napsala jsem o tom článek Proč mít na webu HTTPS.

Jak na webu HTTPS zabezpečení nastavit u webhostingu Wedos se dozvíte v článku Jak nastavit HTTPS na WordPressu u Wedosu.

Krok 4: Seznámení s prostředím WordPressu a úvodní nastavení

A nyní už se po všech peripetiích můžete konečně pustit do úprav vašeho vysněného webu.

Přihlášení do WordPressu

Adresa pro přihlášení do WordPressu je standardně www.vasedomena.cz/wp-admin nebo www.vasedomena.cz/wp-login.php. Vyplňte přihlašovací jméno a heslo, které jste zadali při instalaci.

Úvodní nastavení WordPressu

Je řada věcí, které si v nastavení WordPressu můžete upravit. Těmi nejdůležitějšími jsou název webu a určení hlavní stránky a blogu. Ale důležité je i zobrazování pro vyhledávače. Upravit si můžete také jazyk, čas, formát URL adresy a další. Na co v nastavení nezapomenout si přečtěte v článku Úvodní nastavení WordPressu.

Krok 5: Výběr a instalace šablony (vzhledu webu)

To, co výrazně ovlivňuje vzhled a funkčnost vašeho webu, je jeho šablona. Proto je potřeba věnovat velkou pozornost jejímu výběru. K dispozici jsou tisíce šablon různé kvality, placených i zdarma . Také si můžete nechat vytvořit šablonu na míru.

Šablony můžete najít pro různé typy webů jako jsou magazíny, firemní weby, portfolia, vzdělávací weby, blogy a další. Šablony nabízí různé rozložení stránky, formátování, barvy, fonty a další prvky. Kvalita kódu ovlivňuje rychlost webu, která stejně jako design působí na uživatele. 

Se šablonou se nejlépe pracuje, když je na webu alespoň nějaký obsah. Proto šablony často obsahují demo obsah, který můžete na web importovat a upravovat ho k obrazu svému. 

Jak vybrat šablonu

Výběr šablony je jedním ze zásadních kroků při tvorbě webu, který výrazně spolu s obsahem ovlivní jeho kvalitu. Každý máme rozdílný vkus a požadavky na web. Proto je těžké dávat univerzální doporučení. Jediným kritériem by neměla být nízká cena.

Vybírejte si šablonu, která bude odpovídat vašemu typu webu, bude se vám líbit její vzhled a rozložení obsahu a podporuje funkce a pluginy, které na webu chcete mít. Prohlédněte si demo verzi šablony, abyste viděli různé varianty stránek, které šablona nabízí.

Dívejte se po šablonách s pozitivními recenzemi, velkou uživatelskou základnou a aktivním vývojem. Samozřejmostí by měla být uživatelská podpora a dokumentace s návody. Šablona by měla být rychlá, bezpečná a responzivní (přizpůsobená pro mobily a tablety).

Se správně vybranou šablonou se vám bude dobře pracovat a nebude ji muset nesmyslně ohýbat. Pozornost věnujte i licenci, pod kterou je šablona prodávána. Zvažte také, jaký pagebuilder pro úpravu webu šablona používá.

Pro začátečníky doporučuji šablony zdarma, které jsou skvělé pro seznámení se s WordPressem. Kvalitní šablony zdarma ve zjednodušených verzích nabízí řada ověřených tvůrců. Mohou však nabízet méně funkcí a omezené možnosti nastavení.

Šablony zdarma naleznete v repozitáři WordPressu. Nejoblíbenějším místem pro nákup placených šablon je největší tržiště Themeforest. Oblíbené víceúčelové šablony jsou Astra, Divi, OceanWP a Themify.

V tomto základním návodu budeme pracovat se šablonou Twenty Twenty, která je zdarma a je jednou ze základních šablon WordPressu. Používá editor Gutenberg. Návod na to, jak šablonu nainstalovat a nastavit, najdete v článku Nastavení a úprava šablony Twenty-Twenty.

Krok 6: Rozšíření funkčnosti webu pluginy

Pluginy jsou aplikace, které když nainstalujete do WordPressu, přidají mu užitečné funkce. Můžete opět najít pluginy placené i zdarma. Všechno důležité o pluginech se dozvíte v článku 5+1 WordPress pluginů, které musíte mít.

Krok 7: Blog

Další věcí, kterou byste na svém webu neměli vynechat je blog. Samotný WordPress byl původně navržen pro tvorbu blogů. Blog je výborný prostředek pro propagaci vašeho podnikání hned z několika důvodů. Čím více kvalitních článků napíšete, tím vás budou mít vyhledávače i návštěvníci raději. Pokud budete pravidelně přidávat články o vašem oboru, čtenáři se budou vzdělávat a uvidí, že jste odborníkem na vaše podnikání. Snadno můžete sdílet novinky a budovat vztah se svými zákazníky.

O blogování jsem napsala sérii článků Jak úspěšně blogovat.

Krok 8: Tvorba stránek a příspěvků v editoru

Rozdíl mezi stránkou a příspěvkem

Na webu můžete vkládat obsah jako stránky nebo jako příspěvky. Stránka by na rozdíl od příspěvku měla mít trvalejší hodnotu. Typickou ukázkou jsou Hlavní stránka, Portfolio, O mně, Nabídka produktů a služeb, Obchod nebo Kontakty. Aby mohli návštěvníci stránky najít, je třeba na ně přidat odkaz do menu nebo do jiné stránky.

Příspěvky jsou podobné deníkovým zápiskům nebo zpravodajským článkům. Příspěvky se automaticky publikují v sekci Blog, Aktuality, Novinky, atd. – záleží na tom, jak stránku pojmenujete. Příspěvky se řadí na blogu podle data vydání a nejnovější jsou obvykle nahoře. Můžete je třídit do kategorií a přidat k nim štítky. K příspěvkům je také možné přidávat komentáře.

Blokový editor Gutenberg vs. page buildery

Blokový editor Gutenberg je standardní součástí každé nové instalace WordPressu. Používá bloky, do kterých je možné vkládat obsahové prvky. Je vhodný především k tvorbě příspěvků, ale je možné v něm upravovat i stránky.

Page buildery jsou pluginy, které umožňují upravovat stránky systémem drag and drop (vezmi a pusť). Na web tak můžete jednoduše vkládat jednotlivé prvky a upravovat je tak, jak je poté uvidíte na webu. Říká se jim tzv. WYSIWYG editory (what you see is what you get) – to, co vidíte, to dostanete. Můžete si tak snadno vytvořit web bez programování. Pagebuildery jsou vhodné pro tvorbu stránek, protože nabízí mnohem více možností a větší flexibilitu než editor Gutenberg.

Nejoblíbenějšími page buildery jsou Elementor, Divi, Beaver Builder a WPBakery. Některé šablony jsou vytvořené přímo pro tyto page buildery. K dispozici mají spoustu předpřipravených vzhledů stránek, které můžete snadno importovat na svůj web, upravit jejich obsah a zveřejnit. Hlavními kritérii pro výběr page builderu je nabídka elementů, dostupné šablony, jednoduchost použití a cena.

My v tomto návodu pro tvorbu webových stránek a v dalších návodech zdarma budeme pracovat s blokovým editorem Gutenberg. V placených kurzech budeme navíc používat page builder Elementor. Který si díky jednoduchému použití oblíbili miliony uživatelů a je v základní verzi zdarma. Elementor nabízí řadu prvků, které je možné ještě rozšířit dalšími pluginy a využívá ho řada placených i neplacených šablon.

Jak upravovat příspěvky a stránky v editoru Gutenberg se dozvíte v článku Jak vytvořit stránku a příspěvek ve WordPressu.

Krok 9: Nastavení menu a widgetů

Menu je hlavní navigací na webu. Dobrá navigace je klíčová pro uživatelskou zkušenost s webem (User Experience – UX). Na webu můžete mít několik typů menu – např. hlavní menu a menu pro sociální sítě. Záleží na vaší šabloně, kde všude a jaká menu zobrazuje. O tom, jak nastavit menu, jsem psala v článku Jak upravit šablonu v oddíle Jak upravit WordPress menu.

Widgety jsou funkční bloky, které se zobrazují v postranních panelech blogu (tato šablona to neumožňuje) a v zápatí (na konci stránky). Obvyklými prvky jsou Vyhledávání, nejnovější příspěvky, archiv článků, kategorie příspěvků atd. O nastavení widgetů se dozvíte z výše zmíněného článku v oddíle Jak upravit WodrPress widgety.

Krok 9: Údržba a rozvoj webu

Krok 10: Propagace webu

Web bez propagace je jen online leták, který najdou jen lidé, kteří znají vaši URL adresu.