{"id":9059,"date":"2024-05-07T05:26:05","date_gmt":"2024-05-07T05:26:05","guid":{"rendered":"https:\/\/musilda.cz\/?p=9059"},"modified":"2024-05-07T05:26:05","modified_gmt":"2024-05-07T05:26:05","slug":"wordpress-navod-pro-zacatecniky-krok-za-krokem","status":"publish","type":"post","link":"https:\/\/affinite.io\/cs\/wordpress-navod-pro-zacatecniky-krok-za-krokem\/","title":{"rendered":"WordPress n\u00e1vod pro za\u010d\u00e1te\u010dn\u00edky (krok za krokem)"},"content":{"rendered":"\n
WordPress je opravdu \u0161irok\u00e9 t\u00e9ma, kter\u00e9 pro \u00fapln\u00e9 za\u010d\u00e1te\u010dn\u00edky bude dost mo\u017en\u00e1 matouc\u00ed. Po uskute\u010dn\u011bn\u00ed instalace nejsp\u00ed\u0161e zjist\u00edte, \u017ee nev\u00edte, co p\u0159esn\u011b d\u011blat, jak spr\u00e1vn\u011b postupovat, nebo co kter\u00e9 mo\u017enosti ve WordPressu znamenaj\u00ed. V \u010dl\u00e1nku si rozebereme v\u0161echna mo\u017en\u00e1 nastaven\u00ed a spr\u00e1vn\u00fd postup p\u0159i vytv\u00e1\u0159en\u00ed webu ve WordPressu. <\/p>\n\n\n\n
Ne\u017e se vyd\u00e1me do tvorby samotn\u00e9ho obsahu, bude pot\u0159eba WordPress nejprve spr\u00e1vn\u011b nastavit. N\u00ed\u017ee si uvedeme n\u011bkolik bod\u016f, podle kter\u00fdch lze systematicky postupovat.<\/p>\n\n\n\n
Uk\u00e1\u017eeme si dv\u011b mo\u017enosti, pomoc\u00ed kter\u00fdch lze WordPress web provozovat:<\/p>\n\n\n\n
Na \u00fapln\u00e9m za\u010d\u00e1tku pot\u0159ebujeme pro spr\u00e1vn\u00fd chod WordPressu obstarat kvalitn\u00ed webhosting, kter\u00fd je stavebn\u00edm kamenem ka\u017ed\u00e9ho webu. P\u0159i \u0161patn\u00e9m v\u00fdb\u011bru m\u016f\u017eeme po\u010d\u00edtat s budouc\u00edmi probl\u00e9my, kter\u00fdch se p\u0159i dobr\u00e9m v\u00fdb\u011bru vyvarujeme (rychlost, \u0161patn\u00e1 podpora…). Po zakoupen\u00ed webhostingu n\u00e1sleduje zakoupen\u00ed dom\u00e9ny, kter\u00e1 se s hostingem propoj\u00ed. Obvykle se u jednoho poskytovatele d\u00e1 sehnat jak webhosting, tak dom\u00e9na, co\u017e uleh\u010d\u00ed pr\u00e1ci, a nemus\u00edme tak manu\u00e1ln\u011b nastavovat DNS.<\/p>\n\n\n\n
Zde je p\u00e1r z\u00e1kladn\u00edch bod\u016f, kter\u00e9 p\u0159i v\u00fdb\u011bru hostingu nen\u00ed radno podce\u0148ovat.<\/p>\n\n\n\n
Lok\u00e1ln\u00ed WordPress se hostuje na na\u0161em po\u010d\u00edta\u010di, tak\u017ee se mimo m\u00edstn\u00ed s\u00ed\u0165 k webu nikdo jin\u00fd nedostane. M\u016f\u017eeme si zde natr\u00e9novat pr\u00e1ci s WordPressem, a pot\u00e9 teprve p\u0159ej\u00edt na placen\u00fd webhosting.<\/p>\n\n\n\n
Existuje n\u011bkolik mo\u017enost\u00ed, jak WordPress lok\u00e1ln\u011b nainstalovat. V\u011bt\u0161inu t\u011bchto mo\u017enost\u00ed najdete v \u010dl\u00e1nku „Jak nainstalovat WordPress lok\u00e1ln\u011b zdarma<\/a><\/strong>„. <\/p>\n\n\n\n N\u00e1st\u011bnka WordPressu slou\u017e\u00ed pouze pro na\u0161i p\u0159ehlednost. Jednotliv\u00e9 bloky tu m\u016f\u017eeme libovoln\u011b seskupit a uspo\u0159\u00e1dat.<\/p>\n\n\n\n Zde spravujeme p\u0159\u00edsp\u011bvky WordPressu. Defaultn\u011b je zde jeden p\u0159\u00edsp\u011bvek ji\u017e vytvo\u0159en\u00fd. Vytvo\u0159en\u00e9 p\u0159\u00edsp\u011bvky se na webu nebudou zobrazovat do t\u00e9 doby, dokud tak nenastav\u00edme (Nastaven\u00ed > Zobrazov\u00e1n\u00ed<\/a>).<\/p>\n\n\n\n Sou\u010dasn\u00fdm editorem p\u0159\u00edsp\u011bvk\u016f je ji\u017e n\u011bjakou tu dobu GutenBerg, ve kter\u00e9m m\u016f\u017eeme rovn\u011b\u017e stav\u011bt str\u00e1nky. P\u0159\u00edsp\u011bvky se daj\u00ed jednodu\u0161e „slo\u017eit“ z dostupn\u00fdch GutenBeg blok\u016f<\/strong><\/a>. Bloky sta\u010d\u00ed pouze p\u0159et\u00e1hnout a upravit.<\/p>\n\n\n\n V prav\u00e9m horn\u00edm rohu ka\u017ed\u00e9ho p\u0159\u00edsp\u011bvku m\u016f\u017eeme nastavit n\u00e1sleduj\u00edc\u00ed:<\/p>\n\n\n\n V knihovn\u011b m\u00e9di\u00ed nalezneme ve\u0161ker\u00e9 obr\u00e1zky a soubory, kter\u00e9 byly na webu nahr\u00e1ny. Ne\u017e na web nahrajete obr\u00e1zek, ujist\u011bte se, \u017ee je ve spr\u00e1vn\u00e9m form\u00e1tu a z\u00e1rove\u0148 dob\u0159e optimalizovan\u00fd (nej\u010dast\u011bj\u0161\u00ed chyba za\u010d\u00e1te\u010dn\u00edk\u016f!). Norm\u00e1ln\u00ed velikost obr\u00e1zku by se m\u011bla nejl\u00e9pe pohybovat pod hodnotou 300 Kb<\/strong>. Kritick\u00e1 hranice m\u016f\u017ee b\u00fdt u obr\u00e1zk\u016f nad 1 MB<\/strong>, pokud se vylo\u017een\u011b nejedn\u00e1 o portfolio fotografa.<\/p>\n\n\n\n Pou\u017e\u00edv\u00e1n\u00ed obr\u00e1zk\u016f s velkou velikost\u00ed m\u016f\u017ee katastroficky ovlivnit rychlost na\u010d\u00edt\u00e1n\u00ed cel\u00e9ho webu. Doporu\u010den\u00fd form\u00e1t obr\u00e1zku pro webov\u00e9 str\u00e1nky je .webp<\/strong>, kter\u00fd lze maxim\u00e1ln\u011b optimalizovat bez ztr\u00e1ty kvality.<\/p>\n\n\n\n Optimalizace obr\u00e1zku se d\u00e1 prov\u00e9zt nap\u0159\u00edklad pomoc\u00ed pluginu Imagify<\/strong><\/a>, nebo d\u00edky online n\u00e1stroj\u016fm je\u0161t\u011b p\u0159ed nahr\u00e1n\u00edm do WordPressu (TinyJPG…).<\/p>\n\n\n\n U ka\u017ed\u00e9ho obr\u00e1zku m\u00e1me krom\u011b vlastnost\u00ed i mo\u017enost n\u011bkter\u00fdch zm\u011bn:<\/p>\n\n\n\n Ihned po instalaci WordPressu se na webu vytvo\u0159\u00ed dv\u011b z\u00e1kladn\u00ed str\u00e1nky, kter\u00e9 m\u016f\u017eeme smazat a za\u010d\u00edt vytv\u00e1\u0159et na\u0161e vlastn\u00ed.<\/p>\n\n\n\n Nejlep\u0161\u00ed je za\u010d\u00edt domovskou str\u00e1nkou, kter\u00e1 se bude zobrazovat p\u0159i prvotn\u00ed n\u00e1v\u0161t\u011bv\u011b webu. Stejn\u011b jako p\u0159\u00edsp\u011bvky se str\u00e1nky vytv\u00e1\u0159ej\u00ed pomoc\u00ed GutenBerg blok\u016f. Str\u00e1nka lze vytvo\u0159it dv\u011bma zp\u016fsoby:<\/p>\n\n\n\n Tato mo\u017enost zabere v\u00edce \u010dasu, ale p\u0159inese origin\u00e1ln\u00ed design. P\u0159i vytvo\u0159en\u00ed str\u00e1nky klikneme na plusko a u v\u00fdb\u011bru blok\u016f zvol\u00edme „Proch\u00e1zet v\u0161e“, kde najdeme ve\u0161ker\u00e9 dostupn\u00e9 bloky, se kter\u00fdmi m\u016f\u017eeme nad\u00e1le pracovat.<\/p>\n\n\n\n Defaultn\u011b m\u00e1me k dispozici velk\u00e9 mno\u017estv\u00ed dostupn\u00fdch vzor\u016f, kter\u00e9 m\u016f\u017eeme na na\u0161i str\u00e1nku vlo\u017eit a libovoln\u011b upravit. Stejn\u011b jako v\u00fd\u0161e klikneme po vytvo\u0159en\u00ed str\u00e1nky na plus, u v\u00fdb\u011bru blok\u016f zvol\u00edme „Proch\u00e1zet v\u0161e“ a v lev\u00e9m panelu zvol\u00edme „Vzory“.<\/p>\n\n\n\n Najdeme zde v\u011bt\u0161inu pot\u0159ebn\u00fdch sekc\u00ed pro tvorbu komplexn\u00edho webu. Vzor\u016f m\u016f\u017eeme na jednu str\u00e1nku vlo\u017eit hned n\u011bkolik.<\/p>\n\n\n\n Nejprve mus\u00edme m\u00edt vytvo\u0159enou libovolnou str\u00e1nku, kterou sta\u010d\u00ed publikovat. To, jak\u00e1 str\u00e1nka bude vedena jako domovsk\u00e1 zm\u011bn\u00edme v Nastaven\u00ed > Zobrazov\u00e1n\u00ed > Na \u00favodn\u00ed str\u00e1nce zobrazit > Statickou str\u00e1nku > Na\u0161e libovoln\u00e1 str\u00e1nka<\/strong>.<\/p>\n\n\n\n Krom\u011b \u00favodn\u00ed str\u00e1nky zde m\u016f\u017eeme tak\u00e9 nastavit str\u00e1nku pro vypisov\u00e1n\u00ed vytvo\u0159en\u00fdch p\u0159\u00edsp\u011bvk\u016f.<\/p>\n\n\n\n Jakmile n\u00e1m nap\u0159\u00edklad k p\u0159\u00edsp\u011bvk\u016fm za\u010dnou chodit koment\u00e1\u0159e, zde je m\u016f\u017eeme p\u0159ehledn\u011b z jednoho m\u00edsta spravovat. Doporu\u010duji na webu nastavit antispam, kter\u00fd zabr\u00e1n\u00ed odes\u00edl\u00e1n\u00ed fale\u0161n\u00fdch koment\u00e1\u0159\u016f.<\/p>\n\n\n\n Po instalaci WordPressu se n\u00e1m aktivuje v\u00fdchoz\u00ed \u0161ablona a hned n\u011bkolik dal\u0161\u00edch se automaticky nainstaluje. Doporu\u010duji nechat pouze jednu v\u00fdchoz\u00ed \u0161ablonu, u kter\u00e9 pou\u017e\u00edvat v\u00fdhradn\u011b jej\u00ed child verzi<\/strong><\/a>. <\/p>\n\n\n\n V\u00fdb\u011br \u0161ablony je jedn\u00edm z nejd\u016fle\u017eit\u011bj\u0161\u00edch prvk\u016f WordPressu a jej\u00ed p\u0159echod k jin\u00e9 m\u016f\u017ee p\u0159i rozjet\u00e9m webu zp\u016fsobovat probl\u00e9my, proto by se m\u011blo v\u00fdb\u011brem vhodn\u00e9 \u0161ablony za\u010d\u00edt.<\/p>\n\n\n\n Pro n\u00e1\u0161 web m\u016f\u017eeme vybrat \u0161ablonu zdarma, zaplatit si licenci n\u011bkter\u00e9 z pr\u00e9miov\u00fdch \u0161ablon (v\u00fdhodou \u010dasto b\u00fdv\u00e1 z\u00e1kaznick\u00e1 podpora a detailn\u00ed dokumentace), nebo si nejl\u00e9pe naprogramovat vlastn\u00ed \u0161ablonu, kter\u00e1 bude obsahovat pouze funkce, kter\u00e9 jsou na webu pot\u0159eba.<\/p>\n\n\n\n Podle \u010deho vybrat spr\u00e1vnou \u0161ablonu?<\/p>\n\n\n\n V editoru lze upravit jednotliv\u00e9 polo\u017eky, jako je header, footer, str\u00e1nku pro 404. Krom\u011b toho zde m\u016f\u017eeme tak\u00e9 nastavit navigaci, glob\u00e1ln\u00ed stylov\u00e1n\u00ed a vlastn\u00ed vzory.<\/p>\n\n\n\n Pluginy, jsou r\u016fzn\u00e9 dopl\u0148ky, kter\u00e9 m\u016f\u017eeme pou\u017e\u00edvat pro roz\u0161\u00ed\u0159en\u00ed, nebo zm\u011bnu sou\u010dasn\u00fdch mo\u017enost\u00ed WordPressu. V repozit\u00e1\u0159i m\u016f\u017eeme nal\u00e9zt pluginy t\u00e9m\u011b\u0159 na v\u0161e, a\u0165 u\u017e se jedn\u00e1 o plugin pro zrychlen\u00ed webu, SEO, optimalizaci fotek, roz\u0161\u00ed\u0159en\u00ed blok\u016f pro GutenBerg…<\/p>\n\n\n\n \u010cl\u00e1nky o pluginech, kter\u00e9 by v\u00e1m mohli pomoci s v\u00fdb\u011brem spr\u00e1vn\u00fdch plugin\u016f pro v\u00e1\u0161 WordPress web najdete zde<\/strong><\/a>.<\/p>\n\n\n\n I p\u0159es v\u0161echny v\u00fdhody, kter\u00e9 pluginy poskytuj\u00ed, maj\u00ed sv\u00e9 negativa:<\/p>\n\n\n\n \u010castou chybou u za\u010d\u00e1te\u010dn\u00edk\u016f b\u00fdv\u00e1 v\u00fdb\u011br n\u011bkolika plugin\u016f pro tu samou v\u011bc. V praxi to m\u016f\u017ee vypadat tak, \u017ee pou\u017e\u00edv\u00e1me dva r\u016fzn\u00e9 pluginy pro SEO, cachov\u00e1n\u00ed… co\u017e nen\u00ed spr\u00e1vn\u00e9, proto\u017ee mohou mezi pluginy vznikat konflikty.<\/p>\n\n\n\n Tato sekce slou\u017e\u00ed pro spr\u00e1vu u\u017eivatel\u016f na webu. Najdeme zde na\u0161eho u\u017eivatele (role administr\u00e1tora), kter\u00e9ho jsme vytvo\u0159ili p\u0159i instalaci WordPressu. M\u016f\u017eeme vytvo\u0159it libovoln\u00e9 mno\u017estv\u00ed u\u017eivatel\u016f, u kter\u00fdch bychom nem\u011bli zapomenout nastavit pravomoce (tzv. \u00farove\u0148).<\/p>\n\n\n\n Tip<\/strong>: nikdy bychom nem\u011bli nech\u00e1vat jm\u00e9no u\u017eivatele „admin“, proto\u017ee vzhledem k jeho \u010dast\u00e9mu pou\u017e\u00edv\u00e1n\u00ed m\u016f\u017eeme riskovat bezpe\u010dnost na\u0161eho webu (jm\u00e9no admin je \u010dast\u00fdm c\u00edlem \u00fato\u010dn\u00edk\u016f).<\/p>\n\n\n\n Po vytvo\u0159en\u00ed \u00fa\u010dtu p\u0159ijde u\u017eivateli na email potvrzen\u00ed o vytvo\u0159en\u00ed \u00fa\u010dtu a z\u00e1rove\u0148 po\u017eadavek na zm\u011bnu hesla. V\u00fdchoz\u00ed role u\u017eivatele je „n\u00e1v\u0161t\u011bvn\u00edk“ (lze zm\u011bnit v Nastaven\u00ed > Obecn\u00e9<\/strong>), co\u017e mu nep\u0159id\u00e1v\u00e1 \u017e\u00e1dn\u00e1 pr\u00e1va pro jakoukoliv editaci na webu. Jednotliv\u00e9 u\u017eivatelsk\u00e9 role<\/strong> si vysv\u011btl\u00edme n\u00ed\u017ee:<\/p>\n\n\n\n V n\u00e1stroj\u00edch WordPressu si uvedeme pouze dva nejd\u016fle\u017eit\u011bj\u0161\u00ed body, kter\u00e9 stoj\u00ed za zm\u00ednku:<\/p>\n\n\n\n Ve zdrav\u00ed webu zjist\u00edme, jak\u00e9 jsou doporu\u010den\u00ed pro zlep\u0161en\u00ed na\u0161eho webu a dal\u0161\u00ed d\u016fle\u017eit\u00e9 informace (velikost datab\u00e1ze, verze PHP…).<\/p>\n\n\n\n Bli\u017e\u0161\u00ed informace o tomto n\u00e1stroji najdete v \u010dl\u00e1nku „Co je to zdrav\u00ed webu<\/strong><\/a>„.<\/p>\n\n\n\n Editor soubor\u016f nej\u010dast\u011bji pou\u017eijeme, pokud budeme cht\u00edt ovlivnit ur\u010dit\u00e9 chov\u00e1n\u00ed \u0161ablony. Zm\u011bny chov\u00e1n\u00ed \u0161ablony se prov\u00e1d\u00ed v souboru functions.php<\/strong>. Abychom p\u0159i aktualizaci \u0161ablony nep\u0159i\u0161li o zm\u011bny, mus\u00edme pou\u017e\u00edvat Child theme<\/strong><\/a>.<\/p>\n\n\n\n Z\u00e1sahy nezku\u0161en\u00fdch u\u017eivatel\u016f do souboru \u0161ablony m\u016f\u017ee na webu zp\u016fsobit nevratn\u00e9 zm\u011bny! <\/p>\n\n\n\nNastaven\u00ed WordPressu – administrace<\/h2>\n\n\n\n
N\u00e1st\u011bnka<\/h3>\n\n\n\n
<\/a><\/figure>\n\n\n\n
P\u0159\u00edsp\u011bvky<\/h3>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Editor p\u0159\u00edsp\u011bvk\u016f<\/h4>\n\n\n\n
Nastaven\u00ed p\u0159\u00edsp\u011bvku<\/h4>\n\n\n\n
<\/a><\/figure>\n\n\n\n
\n
\n
\n
\n
\n
M\u00e9dia<\/h3>\n\n\n\n
<\/a><\/figure>\n\n\n\n
M\u00e9dia > Nastaven\u00ed obr\u00e1zku<\/h4>\n\n\n\n
\n
\n
\n
<\/a><\/figure>\n\n\n\n
Str\u00e1nky<\/h3>\n\n\n\n
<\/a><\/figure>\n\n\n\n
\n
<\/a><\/figure>\n\n\n\n
\n
<\/a><\/figure>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Jak nastavit str\u00e1nku jako domovskou?<\/h4>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Koment\u00e1\u0159e<\/h3>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Vzhled<\/h3>\n\n\n\n
Vzhled > \u0160ablony<\/h4>\n\n\n\n
<\/a><\/figure>\n\n\n\n
\n
Vzhled > Editor<\/h4>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Pluginy<\/h3>\n\n\n\n
<\/a><\/figure>\n\n\n\n
\n
U\u017eivatel\u00e9<\/h3>\n\n\n\n
<\/a><\/figure>\n\n\n\n
U\u017eivatel\u00e9 > Vytvo\u0159en\u00ed nov\u00e9ho u\u017eivatele<\/h4>\n\n\n\n
<\/a><\/figure>\n\n\n\n
\n
\n
\n
\n
\n
\n
N\u00e1stroje<\/h3>\n\n\n\n
<\/a><\/figure>\n\n\n\n
N\u00e1stroje > #1 Zdrav\u00ed webu<\/strong><\/h4>\n\n\n\n
<\/a><\/figure>\n\n\n\n
N\u00e1stroje > #2 Editor souboru \u0161ablony<\/strong><\/h4>\n\n\n\n
<\/a><\/figure>\n\n\n\n
Nastaven\u00ed<\/h3>\n\n\n\n