WP témy

Ako som si vyberal WordPress šablónu na blog (časť 1.)

18. októbra 2016

Jedného dňa som si povedal, že by bolo fajn nájsť si nejakú ultra štýlovú a rýchlu WordPress šablónu (respektíve inak povedané WordPress tému) na môj blog. A potom som si povedal, že by bolo fajn rovno spísať ako som postupoval, že by sa vám to mohlo zísť.

V tomto článku popíšem prvý krok výberu šablóny na blog, a to premyslenie požiadaviek. Tak som si teda sadol a zamyslel sa nad tým, čo vlastne od budúcej WordPress témy očakávam. Nižšie menujem hlavné oblasti požiadaviek, na ktoré som sa zameral.

Responzívnosť

Toto považujem za úplnú samozrejmosť. Vyše 50% návštev mi chodí z mobilných zariadení a tabletov a očakáva sa,  že toto číslo bude v budúcnosti ešte narastať. Pri výbere šablóny som si adeptov testoval zväčšovaním/zmenšovaním okna prehliadača, alebo cez google resizer tool.

Testovanie responzívnosti web stránky

Ak máte poruke tablet a mobil, odporúčam si otestovať demo šablóny aj priamo na týchto zariadeniach. Z vlastnej skúsenosti viem, že v niektorých prípadoch sa môže šablóna úplne inak správať na reálnom mobilnom zariadení ako keď skúšame takéto zariadenie imitovať na počítači. Dôvodom môže byť technológia a prístup, ktorým je šablóna naprogramovaná (konkrétne dôvodom môže byť napríklad iný operačný systém zariadenia –  Android / iOs / Windows Phone…).

Podpora prehliadačov

Tu nadviažem na prvú požiadavku. Okrem rôznych typov zariadení je žiadúce otestovať si demo šablóny aj na rôznych typoch prehliadačov – chrome, firefox, safari, internet explorer (tu by som šablóne aj odpustil ak by trucovala a nezobrazovala sa správne, pretože ako programátori vedia, IE je „prúser“ od Microsoftu). Prípadne si môžete otestovať šablónu aj na ďalších menej používaných prehliadačov typu Opera a podobne.

Test podpora prehliadačov

Webdizajn

Webdizajn je čisto citová záležitosť. Teoreticky by ste si mali vyberať WordPress šablónu podľa typu blogu a publika. Avšak ja to beriem tak, že to bude moja stránka, na ktorú sa budem dívať prakticky každý deň, tak chcem aby lahodila môjmu oku. Dôležité je nezabudnúť, že webdizajn stránky by mal vždy podliehať úrovni použiteľnosti webu pre návštevníkov (takzvanej UX – „user experience“). To znamená, že je vám naprd mať krásny dizajn ak sú v jeho dôsledku návštevníci vašej stránky zmätený, stratený, dezorientovaní a bezradní na vašom webe.

Konkrétne pre môj blog som mal ako požiadavku bočné rolovacie menu, lebo ho proste milujem. Ďalej som si predstavoval minimalistický dizajn a na domovskú stránku zoznam článkov vo forme masonry vzhľadu alebo grid vzhľadu (mriežky) s viacerými veľkosťami blokov:

Mriežkový vzhľad web stránky

Funkčnosť šablóny

Tu zahrniem viaceré požiadavky na WordPress šablónu, ktoré by ste mohli mať a ktoré je vhodné vedieť pred samotným výberom šablóny:

1. Podpora multijazyčnosti

Ak plánujete viacjazyčný web, mala by šablóna podporovať multijazyčnosť, konkrétne napríklad plugin wpml alebo polylang. Ja osobne používam wpml, ktorý som už úspešne nasadil na viaceré web stránky. S druhým zatiaľ nemám skúsenosť, ale oba majú dobré referencie.

2. Podpora eshopu („eCommerce“ riešenia)

Ak plánujete zapojiť aj eshop, treba si dať pozor, že šablóna to musí podporovať. Konkrétne by mala podporovať napríklad najrozšírenejšie eshop riešenie pre WordPress – woocommerce plugin.

3. Podpora slovenských znakov

Na toto si tiež treba dať pozor. Písmo (font) šablóny nemusí podporovať naše typické slovenské „hieroglyfy“ a potom by to mohlo dopadnúť podobne katastrofálne ako keď si otvoríte instagram cez počítač: instagram-chyba-v-pismeDúfajme, že to chlapci kóderi z instagramu čím skôr fixnú a že ani my na to nebúdeme zabúdať. Najlepšie na otestovanie našej potenciálnej šablóny by bolo mať možnosť vložiť si pangram na otestovanie slovenskej diakritiky. Najlepšie by bolo vložiť si ho do nadpisov, podnadpisov, textu a widgetov. A to aj vo verzii s veľkými písmenami:

Nezvyčajné kŕdle šťastných figliarskych ďatľov učia pri kótovanom ústí Váhu mĺkveho koňa Waldemara obžierať väčšie kusy exkluzívnej kôry.

NEZVYČAJNÉ KŔDLE ŠŤASTNÝCH FIGLIARSKYCH ĎATĽOV UČIA PRI KÓTOVANOM ÚSTÍ VÁHU MĹKVEHO KOŇA WALDEMARA OBŽIERAŤ VÄČŠIE KUSY EXKLUZÍVNEJ KÔRY.

Žiaľ veľa krát nemáme možnosť otestovať si to pred nainštalovaním šablóny. Taktiež vám pri deme môže zobrazovať zlé znaky, ale po nainštalovaní zistíte, že téma má možnosť zvoliť si vhodné písmo (musí mať font-subset Latin Extended). Ak zistíte, že vám niektoré znaky zobrazuje zle, nezúfajte, sú možnosti ako si to opraviť, ale to je mimo rámca tohto článku.

4. Jazyk šablóny

Bolo by fajn aby bola šablóna už preložená do požadovaného jazyka / jazykov (v mojom prípade slovenčiny). Alebo aby aspoň obsahovala .POT šablónu na preklad. Ale nezúfajte ani v prípade, že neobsahuje .POT, vieme si pomôcť použitím pluginu Loco Translateibaže to je už časovo a technicky mierne náročnejšie.

5. Podpora rôznych formátov článku

WordPress dovoľuje nastaviť si v rámci editácie článku jeho formát (v angličtine „post formats“, viď obrázok nižšie). Ale je na tvorcoch témy, či to do nej zapracujú. Napríklad ja plánujem využívať vo svojom blogu aj citáty, videá a galérie a požadujem aby sa podľa toho vhodne zobrazovali. Preto budem od svojej šablóny vyžadovať podporu rôznych formátov článku.wordpress-formaty-obsahu

6. Rýchlosť šablóny

To je samo sebou že chcem mať rýchly web, aby som neodradil návštevníkov blogu ani googleboty (robotíky od googlu ktoré mi budú indexovať web). Preto som si otestoval demo šablóny cez nástroj pingdom:

Test rýchlosti web stránky

Myslím si, že najpodstatnejší ukazovateľ z výsledku, ktorý som z nástroja obdržal, je čas načítania stránky. Ak vám tento čas vyjde pri deme šablóny do 2 sekúnd tak to je prijateľné, pretože si ho vieme na našom reálnom blogu výrazne okresať. A to výberom kvalitného hostingu, inštaláciou kešovacieho (cache) pluginu na rýchlosť a optimalizáciou veľkosti obrázkov. Ja používam (a považujem za nejlepší) kešovací plugin  W3 Total Cache. Na optimalizáciu veľkosti obrázkov používam plugin EWWW Image Optimizer.

Ešte by som rád v rýchlosti vysvetlil prečo používam (a prečo by som aj pre vás odporúčal) hosting od websupportu. Majú automatickú inštaláciu WordPressu, čo sa zíde začiatočníkom a pokročilejším používateľom to šetrí čas. V inštalácii majú už zahrnuté, nastavené a serverovo vyladené vyššie spomínané pluginy W3 Total Cache a EWWW Image Optimizer. Ich servre majú SSD disky. Výsledkom je veľmi vysoká rýchlosť webu, ako môžete vidieť aj na príklade môjho blogu na obrázku vyššie. A to je pre mňa cool :).

7. Prítomnosť page buildera

Ťažko to je preložiť do slovenčiny, ale preložil by som to ako vizuálny skladač stránky. Ide o nástroj, pomocou ktorého si môžete sami tvoriť vnútro stránok z rôznych prvkoch a rôzne ich umiestňovať. Najlepšie asi bude ukázať to na obrázku:

Divi builder

Na obrázku je konkrétne Divi builder, ktorý patrí medzi najlepšie. Vo všeobecnosti, page builder môže byť súčasťou témy (napríklad divi builder je aj súčasťou divi témy), alebo vo forme samostatného pluginu. Preto aj keď vami zvolená téma nebude žiadny page builder obsahovať, môžete si ho doinštalovať ako plugin. Najlepšie hodnotený builder vo forme bezplatného pluginu je Page Builder by SiteOrigin.

Ja builder na svoj blog nepotrebujem, preto ho nebudem od šablóny vyžadovať. Dokonca naopak, bude u mňa žiadané ak moja šablóna nebude žiadny obsahovať. Dôvodom je, že každá funkcionalita šablóny navyše, takisto každý použitý plugin, prispieva svojím dielom k znižovaniu rýchlosti web stránky.

8. Kvalita kódu šablóny

Kvalitu kódu viem ako programátor posúdiť už z demo stránky, ale pre laika to môže byť ťažké. Téma môže vyzerať krásne, ale na pozadí môže byť „škaredý“ kód. Jednou z možností je prebehnúť si tému cez validátor kódu od W3C, čo je medzinárodná organizácia zodpovedná za štandardizáciu tých našich internetov (www). Ďalšia možnosť je použitie seo-servis.cz nástroja:

Analýza zdrojového kódu

Nezľaknite sa, ak vám tieto nástroje zobrazia nejaké chyby kódu, treba rátať s tým, že väčšina dostupných tém bude mať nejaké nedostatky. Ide iba o to, aby to nebolo červené more chýb :). A to najpodstatnejšie k tomuto bodu som si nechal nakoniec – prečo by sme sa mali zaujímať o kvalitu kódu témy? Pretože zle nakódená téma môže podstatne ublížiť nášmu SEO. A to nechceme.

9. Dokumentácia

Bol by som rád, aby moja šablóna obsahovala dokumentáciu, aby som nemusel tápať kde a ako nastavím jednotlivé prvky šablóny. Veľa bezplatných tém z wordpress.org žiaľ neobsahuje dokumentáciu, takže nás stojí dodatočný čas nájsť si a otestovať kde čo a ako nastaviť. Oproti tomu veľa platených tém u najväčšieho predajcu šablón má vysokú úroveň dokumentácie (sú „well documented“). Je to jedna z požiadaviek, ktoré predajca požaduje od tvorcov tém.

V konečnom dôsledku je na rozhodnutí každého z nás, či budeme požadovať šablónu s dokumentáciou. čo sa týka mňa tak áno. V práci aj súkromí som už mal možnosť vyskúšať veľa rôznych šablón a každá mala úplne inde jednotlivé nastavenia (inak napísané, neexistujú jednotné pravidlá od WordPress-u ako usporiadať nastavenia témy). Ja som toho názoru, že čas sú peniaze a nechcem ho míňať zbytočným hľadaním jednotlivých nastavení, radšej miniem ušetrený čas na písanie článkov.

Záver

Požiadavky mám premyslené, tak budem pokračovať ďalej na samotné hľadanie šablóny. Ale to si nechám do ďalšieho článku ;). Dúfam že vám tento článok niečo priniesol, či už ste začiatočníci vo WordPresse alebo pokročilí. Alebo že vás aspoň pobavil :).

P.S.: úplným začiatočníkom môže pomôcť kniha o wordpresse, ktorá dodá ten správny základ. Netreba sa obávať, že je staršia, WordPress sa odvtedy nijako radikálne nezmenil. Pre ľudí, ktorí vedia po anglicky existuje veľa výborných kníh a online zdrojov na internete.

Ako som si vyberal WordPress šablónu na blog (časť 1.)
5 (100%) 10 hlasov

Comments (8)

    Pingback: Ako si spraviť WordPress blog? (návod krok za krokom) | jurosko.sk

  • august 14, 2017 by Lucia Vrablecová

    Lucia Vrablecová

    Ahoj Vlado, dúfam, že ťa neurazím tykaním:)

    Naozaj skvele si napísal tento článok spolu aj s časťou no.2, kde si priamo vyberal danú tému. Pochopila som všetko a hneď aj vyskúšala.. a trošku som sa zasekla na výbere témy… nevedel by si mi pomôcť? Ako si sám radil, toto boli moje kritéria na šablónu: responzívnosť, jednoduchý dizajn keďže časť cieľovej skupiny bude staršia a bude stratená pri rôznych vychytávkach a trendoch, translation ready – jazyk – najlepsie slovencina, dobrá dokumentácia, woocommerce, kalendár na eventy, asi aj ten page builder.

    Už som sa pýtala na radu na jednom blogu a dostala som odpoveď DIVI. Chcela by som počuť viacero názorov.

    Vytvorila som si web klub podnikavých žien (ako o.z.) a chcem organizovať nejaké zájazdy, besedy, prednášky, workshopy, sprostredkovať divadlá, festivaly atď…Do budúcna rozmýšľam, že nejaké zájazdy by som potom aj priamo cez net ponúkala aby sa dali rovno z karty zaplatiť …Nevravím, že hneď ..možno po roku
    Tieto témy ma zaujali:

    themeforest
    1. AVADA
    2. ENFOLD

    ait themes
    1. Langwitch
    2. Solitudo

    Vedel by si mi poradiť čo by sa môjmu zámeru najviac hodilo, resp. tvoje skúsenosti, s ktorou šablónou nič nepokazím ba naopak budem s ňou spokojná a web bude dobre vyzerať?

    Veľmi pekne ďakujem za pomoc
    Luc

  • august 14, 2017 by Vladimír Juroško

    Vladimír Juroško

    Ahoj Lucia,

    Určite ma neurazíš tykaním 🙂

    Ait themes som ešte nemal tú česť vyskúšať, tak tie neviem posúdiť.
    S enfoldom, avadou a divi som už úspešne vybudoval viacero webov. Podla môjho názoru sú približne na rovnakej úrovni. Responzívnosť a podpora woocommerce je u všetkých samozrejmosťou. Avada sa mi zdá oproti divi a enfolde zložitejšia na nastavenie, ale zase sa v nej dá nastaviť viac vecí. Divi má najpriateľskejšie používateľské prostredie a zdá sa mi rýchlejšia na pochopenie.

    V tvojom prípade sú podľa mňa všetky tri vhodné, určite výberom hociktorej z nich nič nepokazíš.
    Ja by som sa prikláňal k divi alebo avade.

    Dám ti aj tip na plugin na kalendár udalostí – tento je najpoužívanejší a mám s nim výborne skúsenosti, veľa vecí sa v ňom dá spraviť: https://wordpress.org/plugins/the-events-calendar/

    Keby si chcela ešte niečo vedieť, tak sa pokojne sa pýtaj. Rád ti poradím 🙂

    • august 14, 2017 by Lucia Vrablecová

      Lucia Vrablecová

      Ahoj Vlado,
      veľmi pekne ďakujem za pomoc a takú rýchlu odpoveď:-) teším sa z toho pluginu (určite ho stiahnem keď si zakúpim jednu z odporúčaných tém). Úprimne povedané, trošku viac sa mi páčia demá Avady, ale nakoľko som zelenáč v tejto oblasti asi uprednostním jednoduchšiu a intuitívnejšiu manipuláciu s daným systémom, nech si trošku pomôžem. Takže pôjdem do tej Divi.
      Ďakujem za ochotu pomôcť. Ak si s niečím nebudem vedieť dať rady a nebude to prílíš vyčerpávajúci dotaz, tak sa opýtam:-)
      Pekný večer prajem

      • august 15, 2017 by Vladimír Juroško

        Vladimír Juroško

        Lucia, pokojne si vyber Avadu, keď sa ti viac páči dizajn dema. Verím tomu, že s ňou zvládneš pracovať. Má kvalitne spravený návod. Ak budeš potrebovať pomoc, tak mi tu kľudne napíš a rád ti pomôžem 🙂

  • august 15, 2017 by Lucia Vrablecová

    Lucia Vrablecová

    Ďakujem Vlado…Nesmej sa mi ale celkom sa mi páči tá Avada Church:-) myslím štruktúra tej stránky, že kostru by som ako tak mala a potom by som na to nadviazala a skúsila ju prerobiť podľa svojich predstáv a potrieb…u Divi som také podobné demo nevidela, ale tak zasa by som si to tam podobným spôsobom asi vedela vyskladať, že? No ešte pouvažujem.. Každopádne veľmi pekne Ti ďakujem:) potom pošlem ten môj výtvor na zhodnotenie teda až to bude na svete:)

  • august 15, 2017 by Vladimír Juroško

    Vladimír Juroško

    Lucka, avada church moze byt 🙂 Vsak na nazve nezalezi, mne sa tiez viac krat hodila tema na inu oblast ako bola zaradena…urcite sa tu potom pochval svojim vytvorom, som zvedavy 🙂

  • august 16, 2017 by Lucia Vrablecová

    Lucia Vrablecová

    Neviem, či to bude na chválenie;) ale určite sa ozvem..ešte raz velmi pekne ďakujem za pomoc Vlado:)

Pridaj komentár

TOPlist TOPlist

Pin It on Pinterest

Zdieľať

Jasné, že sa zaujímaš o WordPress!

Pridaj sa medzi ďalších majiteľov webov na mojom mailing liste a dostávaj návody, tipy a triky ako prvý.

Môžeš byť bez obáv. Spam nenávidím rovnako ako ty.
%d blogerom sa páči toto: