Najlepšie originálne bloky WordPress [Rýchly prehľad]

Najlepšie originálne bloky WordPress [Rýchly prehľad]

Prinášame vám návod, ako používať editor a bloky Gutenberg WordPress. Prečítajte si novinky o zmenách v blokoch, ktoré prídu už v najbližšej verzii 5.4. Vybrali sme všetky najčastejšie používané bloky, ktoré sa nesmú chýbať na žiadnej webovej stránke. Po vydaní zverejníme ďalšie podrobnosti o všetkých funkciách. [...]

Keď WordPress v roku 2018 oznámil nový editor Gutenberg, boli sme z neho nadšení. Teraz, o pár rokov neskôr, vidíme obrovské zlepšenie. Editor Gutenberg WordPress je skvelý nástroj na tvorbu webových stránok.

S AitThemes CitadelaWP pluginy, môžete vytvoriť špecifický obsah pre prezentáciu webovej stránky spoločnosti, podniku, blogu alebo neziskovej organizácie. Alebo si dokonca môžete založiť nový online podnik. Najdôležitejšími faktormi sú rýchlosť a jednoduchosť úpravy webovej stránky.

Čo je to blok?

Bloky Gutenberg WordPress sú stavebnými jednotkami webovej stránky. Každý z nich má svoje špeciálne miesto a účel. Je veľmi dôležité používať správny blok WordPress pre určitý typ obsahu.

Ako však nájsť najvhodnejší blok, ktorý zodpovedá vášmu zámeru?

Aby ste sa lepšie zorientovali v blokoch WordPress, pripravili sme pre vás tento prehľad tých najobľúbenejších.

Bloky textového obsahu

Existuje niekoľko blokov, ktoré môžete použiť na vloženie textového obsahu na svoje webové stránky. Môžete použiť niekoľko blokov. Od verzie WordPress 5.4 je k dispozícii nové nastavenie, ktorým môžete meniť farbu textu.

  • Odsek
  • Nadpis
  • Citujem
  • Zoznam
  • Vytiahnuť citát
  • Tabuľka
  • Verš
  • Predformátované
Formát farby textu WordPress 5.4

Okrem toho používate blok Classic, ktorý môže byť pre dlhý odsek praktickejší.

Blok tlačidiel

Vytvorenie presvedčivého tlačidla CTA v systéme WordPress je vďaka bloku Button veľmi jednoduché. Nemusíte zadávať vlastné CSS ani rozumieť HTML. Môžete - ale nemusíte - zadať hexadecimálny kód svojej obľúbenej farby, aby tlačidlo vyzeralo pekne a pútavo.

Blok tlačidiel WordPress

Kde použiť blok tlačidiel?

Keď sa návštevník webu dostane na vašu webovú stránku, chcete ho povzbudiť k akcii. Na to slúžia tlačidlá CTA.

Vo všeobecnosti existujú 3 miesta, kde by ste mali použiť blok tlačidiel WordPress:

  • Úvodná stránka - na vykonanie akcie, ktorá povedie k naplneniu vášho cieľa, napríklad prihlásenie sa na odber noviniek, objavenie špeciálnej ponuky alebo registrácia na bezplatné skúšanie.
  • Stránka produktu - v závislosti od toho, ako je vaša stránka produktu vedená, môže na nej byť 1 tlačidlo CTA (KÚPIŤ) alebo viac tlačidiel, napr. podrobnosti o produkte, kúpiť, pridať do zoznamu želaní atď.
  • Blog - tlačidlá CTA môžu odkazovať na ďalší užitočný článok alebo nákup vášho produktu/služby.

Nastavenia bloku tlačidiel

V Inšpektorovi na pravej strane môžete jednoducho spravovať nastavenia tlačidla:

  • Štýl
  • Farba pozadia
  • Farba písma
  • Hranica

Text napísaný v tlačidle CTA by mal byť krátky a jednoduchý a mal by nabádať k akcii, ktorú chcete, aby návštevníci webu vykonali.

Novinky v nasledujúcej verzii WordPress 5.4 (vydanie 31. marca 2020)

Blok tlačidiel bude nahradený novým blokom Buttons blok.
Podľa nového názvu môžete predpokladať, že v jednom blokovom kontajneri budete môcť vytvoriť viac tlačidiel vedľa seba. Často je potrebné vytvoriť napríklad dve CTA naraz: Kúpiť teraz a Čítať viac. Pribudnú aj niektoré nové nastavenia štýlov a farieb. Vyberte si štýl Výplň alebo Obrys a potom farbu pozadia. Môžete si vybrať jednoliate alebo gradientné pozadie. K dispozícii bude niekoľko predvolieb ako východiskový bod pre jednoduchšie doladenie. Dobrou správou je, že všetky existujúce bloky tlačidiel budú funkčné a nie je potrebné ich migrovať.

Blok stĺpcov

Blok stĺpcov je úžasný blok WordPress, ktorý otvára dvere novým rozloženiam. Poskytuje vám viac možností usporiadania prvkov stránky, čo vedie k väčšiemu počtu alternatív dizajnu.

Blok WordPress stĺpcov

Práca s blokom Stĺpce je jednoduchá:

  • Žiadna dodatočná inštalácia zásuvných modulov.
  • Nie je potrebné žiadne kódovanie.
  • Potrebujete len trochu zmyslu pre elegantný dizajn.

V porovnaní s predchádzajúcimi problémami, ktoré ste museli absolvovať pred vydaním editora blokov WordPress, je používanie bloku Stĺpce WordPress veľmi jednoduché.

Ako používať blok Stĺpce?

Ako je uvedené vyššie, blok Stĺpce možno použiť dvoma spôsobmi:

  • Usporiadanie toku textov (v príspevku na blogu alebo na bežnej stránke).
  • Usporiadanie ďalších blokov do stĺpcov.

Usporiadaním textu do stĺpcov, napr. v rámci príspevku na blogu, zvyšujete čitateľnosť a robíte svoju webovú stránku prehľadnejšou a používateľsky prívetivejšou.

Ak však použijete blok Stĺpce na vnorenie iných blokov, ako sú obrázky, texty a tlačidlá, zmeníte celé rozloženie zvolenej stránky a vytvoríte nové návrhy.

Nastavenia bloku stĺpcov

Po vložení bloku stĺpcov na stránku vyberte, koľko stĺpcov chcete. Môže to byť ľubovoľný počet od 2 do 6 stĺpcov. Potom môžete začať písať text alebo pridávať bloky do jednotlivých stĺpcov.

Zarovnanie obsahu bloku stĺpcov môžete nastaviť samostatne pre celý blok aj pre jednotlivé stĺpce. Dokonca si môžete zvoliť aj pomer šírky stĺpca. Takto môže byť jeden stĺpec širší ako druhý.

Obalový blok

Poďme si pohovoriť o hlavičke vašej webovej stránky. Je to časť, ktorá určuje prvý dojem, keď niekto príde na vašu domovskú stránku. Trochu dôležité, však? A vedeli ste, že blok Cover možno použiť ako záhlavie na ktorejkoľvek vašej stránke?

Kryt bloku WordPress

Obálka je základným blokom WordPress, ktorý vám pomôže zapôsobiť na návštevníkov webu. Najmä ak je správne použitý, alebo lepšie povedané, ak je elegantne integrovaný do dizajnu vášho webu.

Kde použiť krycí blok?

Ako bolo uvedené vyššie, blok Cover môžete použiť na ktorejkoľvek stránke. Okrem toho ho možno pridať kamkoľvek na stránku, na rozdiel od záhlavia vašej webovej stránky, ktoré je pevne umiestnené v hornej časti webovej stránky.

Krycí blok možno použiť ako:

  • Záhlavie akejkoľvek stránky vrátane úvodnej stránky.
  • Obrázok alebo video prepísané textom použitým na stránke produktu.
  • Oddeľovač obsahu v príspevku na blogu.

Nastavenia krycieho bloku

Nastavenie bloku Cover je veľmi jednoduché. Najprv si vyberte obrázok alebo video ako pozadie. Namiesto neho môžete použiť aj jednu farbu. Keď máte nastavené pozadie, pridajte nadpis a podnadpis. 

Môžete si vybrať zarovnanie bloku a samozrejme aj zarovnanie textu v ňom.

Zarovnanie krycieho bloku ponúka tieto možnosti:

  • Zarovnať doľava
  • Centrum zarovnania
  • Zarovnať doprava
  • Široká šírka
  • Na celú šírku

Mojím osobným favoritom je farebné prekrytie, ktoré je k dispozícii v inšpektorovi - obrázok na pozadí bloku Cover môžete tónovať do ľubovoľnej farby. Spolu s prispôsobenou veľkosťou a farbou písma môžete vytvoriť krásne kontrasty a konečný vzhľad vášho krycieho bloku bude ohromujúci.

Od verzie WordPress 5.4 si môžete vybrať gradientné pozadie namiesto jednoliateho.

Kryt bloku gradientného pozadia WordPress 5.4

Blok galérie

Prezentujte obrázky na svojich webových stránkach pomocou bloku Galéria. Tento štandardný blok WordPress bol navrhnutý tak, aby uchovával vaše obrázky a pekne ich zobrazoval na akejkoľvek stránke vášho webu. Podobne ako iné bloky WordPress, aj blok Galéria môžete umiestniť kdekoľvek na webovej lokalite alebo v rámci príspevku blogu.

Blok Galéria WordPress

Obrázky môžete nahrať výberom súborov z knižnice médií, z počítača alebo pomocou funkcie drag&drop.

Kde použiť blok Galéria?

V závislosti od typu vašej webovej stránky môžete chcieť vytvoriť komplexnú fotogalériu alebo jednoduchú prezentáciu obrázkov. Blok Galéria môžete použiť na:

  • Vaša domovská stránka
  • Jednotlivé podstránky vytvorené ako albumy vašej fotogalérie
  • Stránky produktu
  • Blogpost

Nastavenia bloku galérie

Okrem rôznych možností zarovnania samotného bloku Galéria je v tomto bloku niekoľko zaujímavých možností, ako napríklad:

  • Počet stĺpcov, do ktorých sú obrázky zoradené.
  • Orezanie obrázka na rovnakú veľkosť (najmenšieho obrázka).
  • Hypertextový odkaz, ktorý vám poskytne možnosť prepojenia na inú stránku alebo mediálny súbor.

Obrázkový blok

Obrázkový blok nie je nič iné ako blok na zobrazenie obrázka na vašej webovej stránke.

Obrázkový blok WordPress

Presne tak. Ak chcete len pridať obrázok na niektorú zo svojich stránok, mali by ste použiť blok Obrázok WordPress. Je síce podobný ostatným prezentovaným blokom, ale existujú v ňom významné rozdiely, vďaka ktorým je ideálny pre jednotlivé obrázky.

Kedy použiť Image block?

Obrázkový blok by sa mal používať najmä vtedy, keď je objekt zobrazený na obrázku pre návštevníka webu obzvlášť dôležitý:

  • Upútajte pozornosť návštevníka webu špecifickým obrázkom.
  • Zobrazenie obrázka s nadpisom.
  • Zobrazte infografiky, ktoré návštevníkom pomôžu lepšie pochopiť diskutovanú problematiku.

Nastavenia bloku obrázkov

Jednou z najväčších výhod bloku Obrázok WordPress sú možnosti veľkosti obrázkov. Veľkosť obrázka môžete jednoducho zmeniť jeho vytiahnutím za roh, vybrať pevnú veľkosť v pixeloch alebo definovať veľkosť v percentách.

Ďalšou významnou možnosťou sú vstupné polia pre alternatívny text, nadpis a odkaz. Dôrazne odporúčam používať tieto polia, pretože zohrávajú dôležitú úlohu pri optimalizácii SEO na stránke.

Blok médií a textu

Prejdime k pokročilejším rozloženiam stránky, ktoré môžete vytvoriť pomocou bloku Médiá a text. Tento základný blok WordPress vám umožňuje kombinovať médiá a text vedľa seba, a to estetickým a kontextovým spôsobom.

Blok médií a textu WordPress

Kde použiť blok Médiá a text?

Hoci blok Médiá a text je najvhodnejší na použitie v príspevkoch na blogu, s trochou predstavivosti ho môžete použiť aj inde. Môžete napríklad vytvoriť pekný prehľad produktov alebo služieb pomocou obrázku a textu vedľa seba.

Nezabudnite pridať blok Tlačidlo do textovej časti bloku Médiá a text, ak sa používa ako prehľad produktov/služieb. Takto môžete navrhnúť peknú sekciu CTA na akejkoľvek stránke.

Výhody bloku Media & text

  • Spojenie obrazu a textu, ktoré do seba kontextuálne zapadajú.
  • Zabránenie nesprávnemu umiestneniu obrázka v rámci príspevku na blogu.
  • Pomoc s odozvou stránky (použite funkciu "Stack on mobile").

Nastavenia médií a textových blokov

Pri pohľade na nastavenie bloku Médiá a text si všimnete pomerne veľa možností zarovnania, pričom niektoré z nich sú v porovnaní s väčšinou ostatných blokov jedinečné.

Zaujímavým a užitočným nastavením tohto bloku je farba pozadia. Vyfarbením oblasti okolo obrázka a textu, ktoré k sebe patria, môžete vizuálne zvýrazniť ich spojenie.

Vloženie odkazu z verzie WordPress 5.4 (31.3.2020). Môžete si vybrať z odkazu, mediálneho súboru alebo stránky s prílohou.

Tabuľkový blok

Blok tabuľky je jedným z príkladov toho, ako sa WordPress zlepšil po zavedení editora blokov WordPress vo verzii 5.0 a ďalších. Kým predtým ste na vloženie tabuľky do webovej stránky WordPress potrebovali zásuvný modul, teraz môžete jednoducho použiť blok Tabuľka.

Tabuľkový blok WordPress

Kde použiť blok tabuľky?

Tabuľky zohrávajú veľkú úlohu pri poskytovaní užitočného obsahu prehľadným a transparentným spôsobom. Väčšina webových stránok určite používa tabuľky. Tu je len niekoľko príkladov použitia tabuliek na rôznych webových stránkach:

  • Porovnanie údajov
  • Cenové tabuľky
  • Technické údaje o výrobku
  • Recepty
  • Prehľad členských balíkov

Mať blok tabuliek ako súčasť bezplatného jadra WordPress je naozaj úžasné.

Nastavenia bloku tabuľky

Pri vkladaní bloku Tabuľka do stránky musíte definovať počet stĺpcov a riadkov tabuľky. Nemajte obavy, tento počet nie je pevne stanovený. Kedykoľvek môžete pridať ďalšie riadky a stĺpce (alebo ich odstrániť).

Potom si vyberte štýl tabuľky: predvolený alebo s pruhmi. Prejdite na zarovnanie a štýl písma a nakoniec vyplňte svoju tabuľku, než ju dokončíte.

Ďalšie možnosti zahŕňajú:

  • Farba pozadia
  • Bunky s pevnou šírkou
  • Záhlavie
  • Zápätie
  • Prepojenie (text v tabuľke môže odkazovať na iné stránky)

Ktorý blok by ste chceli vidieť ako ďalší?

Dúfam, že sa vám páčilo čítanie o našom výbere veľmi užitočných základných blokov WordPress, ktoré sú k dispozícii zadarmo pre každého. Dajte nám vedieť, o ktorých blokoch by ste si chceli prečítať ďalej alebo ktoré funkcie vám v jadre WordPress ešte chýbajú. Ďakujeme za prečítanie!

9 komentáre k “Best original WordPress blocks [Quick Overview]

    1. Dobrý deň, Bryan,

      ďakujem za otázku. Je nám ľúto, že Business Finder+ nie je kompatibilný s blokmi Gutenberg, pretože téma je založená na našom staršom frameworku II, ktorý podporuje tieto pluginy: https://www.ait-themes.club/wordpress-plugins/#businessfinder

      S pozdravom!
      Zlatko
      Tím AIT

  1. Ich habe die Lifetime Membership und jetzt heißt es das Sie meine Fragen nicht beantworten wollen. Deshalb habe ich ja diese Mitgliedschaft gewählt. Technická podpora na 1 rok! Über den Support dauert es oft Tage bis man eine Antwort bekommt. Ich finde die Software gut in manchen Dingen zu kompliziert, aber wenn die Möglichkeit besteht Fragen zu stellen kein Problem. Aber wenn es jetzt heißt ich solle mir einen Programmierer suchen, dann hätte ich dieses Theme ja nicht gebraucht!
    Also ich setze schon ein gewisses Maß an Service voraus!

    1. Ahoj Thomas,

      ďakujem za vašu odpoveď. Ďakujeme, že ste si našli čas a povedali nám, prečo naše služby nesplnili vaše očakávania.
      Vážime si vašu prácu a radi by sme čo najrýchlejšie a správne vyriešili vaše problémy.
      Chápem vašu frustráciu a úprimne sa vám ospravedlňujem za nepríjemnosti, ktoré sme vám spôsobili kvôli neskorým odpovediam.Prosím, vedzte, že naši technici sú pripravení odpovedať vám čo najefektívnejšie a čo najrýchlejšie, keď sa rozhodnete pre prioritnú otázku (samozrejme do niekoľkých pracovných hodín). Zákaznícka podpora je poskytovaná počas pracovných dní od 8.00 do 17.00 hod. stredoeurópskeho času.

      Po druhé,
      Upozorňujeme, že ponúkame tieto služby: https://www.ait-themes.club/services/ a prispôsobenie je špeciálna požiadavka, ktorú neposkytujeme z kapacitných dôvodov atď. Akonáhle budete požadovať ďalšie práce na vašej webovej stránke, mali by ste kontaktovať skúsenosti wordpress vývojár alebo dizajnér.

      Ďakujeme za pochopenie.

      S pozdravom!
      Tím AIT

    1. Ahoj Tony,

      ste migt nájsť odpoveď kontaktovaním wordpress comunity fórum som presvedčený... tak či onak, najlepšie wey by malo byť kontaktovať náš tím podpory na: https://system.ait-themes.club/support/add-question.
      Naši technici sú pripravení odpovedať vám čo najefektívnejšie a čo najrýchlejšie, keď sa rozhodnete pre prioritnú otázku (samozrejme do niekoľkých pracovných hodín). Zákaznícku podporu poskytujeme počas pracovných dní od 8.00 do 17.00 hod. stredoeurópskeho času.

      Ďakujeme za pochopenie.

      Najlepšie!
      Zlatko
      Tím AIT

  2. Mám webovú stránku wordpress. Potrebujem pre ňu navrhnúť vlastnú tému. Ak máte dostatočné znalosti o webovom dizajne, potom prosím vytvorte kompletné video o tom, ako navrhnúť tému wordpressovej nástenky. Som vám naozaj vďačný za tento akt láskavosti.

    1. Dobrý deň,

      ďakujem za napísanie a za zaujímavý nápad a spätnú väzbu.
      Našou hlavnou úlohou je vytvárať produkty založené na systéme WordPress CMS ako šablóny, pluginy, grafiku a našou najvyššou prioritou je neustále pridávať nové funkcie týkajúce sa skupiny produktov Citadela: http://citadelawp.com

      Každopádne váš nápad zvážime a rozhodneme sa.

      S láskavým pozdravom!
      Zlatko
      Tím AIT

Komentáre sú uzavreté.