blok

Gutenberg: nový výchozí blokový editor pro WordPress

Ve WordPress 5.0 byl původní editor obsahu nahrazen zbrusu novým blokovým editorem pojmenovaným Gutenberg.

Nový blokový editor přináší zcela nový způsob tvorby obsahu ve WordPress a do výchozího nastavení přináší funkce, podobné těm, které již znáte z ostatních page builderů, jako je například Divi.

V tomto návodu si ukážeme jak nový výchozí WordPress editor používat a jak s ním vytvářet obsah.

Jaký je rozdíl mezi blokovým editorem Gutenberg a původním klasickým editorem?

Předtím, než se pustíme do popisu samotného nového editoru, se podívejme na rozdíl mezi klasickým editorem a blokovým editorem.

Zde je, jak vypadá klasický editor ve WordPress:

Klasický editor
Klasický editor

S verzí WordPress 5.0 a výše pak při tvorbě příspěvku můžete vidět následující editor:

Gutenberg
Gutenberg

Jak můžete vidět, jedná se o zcela rozdílné editory pro tvorbu obsahu.

Klasický editor byl textový editor, který pomáhal formátovat text podobně jako například MS Word.

Nový editor používá zcela jiný přístup, kterému se říká blokový (proto blokový editor).

Bloky jsou prvky obsahu, které přidáváte a pomocí nich stavíte svou stránku nebo příspěvek.

Pro každý prvek obsahu (text, obrázek, video, galerie, audio, seznam atd.) můžete využít specifický blok. Vlastní bloky si také mohou přidávat pluginy.

Proč je nový blokový editor lepší než klasický editor?

Nový WordPress editor nabízí jednodušší cestu, jak do stránky nebo příspěvku vložit jiné typy obsahu.

Například, když jste předtím potřebovali do obsahu vložit tabulku, museli jste k tomu použít specifický plugin (například Tablepress).

S novým editorem jen vyberete blok Tabulka, nastavíte počet sloupců a řádků a naplníte obsahem.

Blok Tabulka
Blok Tabulka

Bloky v obsahu můžete libovolně přesouvat nahoru i dolu a vytvořit tak poutavý obsah.

Guttenberg je odpovědí na populární “page buildery” jako jsou Divi nebo Elementor a stejně jako oni, i on dokáže tvořit rozmanitější webové stránky s lepší kontrolou obsahu a struktury.

Jak pracovat s novým WordPress editorem Guttenberg

Blokový editor byl navržen tak, aby byl co nejjednodušší, flexibilní a intuitivní. I když vypadá výrazně jinak, než jeho předchůdce, stále umožňuje provádět stejné věci. Pojďme si postupně projít tvorbu obsahu s pomocí nového blokového editoru Guttenberg.

Tvorba nového příspěvku nebo stránky za pomocí blokového editoru

Postup při tvorbě obsahu je stále stejný, vyberete zda chcete vytvářet stránku nebo příspěvek a kliknete na Vytvořit příspěvek/stránku v podmenu nebo na tlačítko v horní části obrazovky.

Tvorba příspěvku
Tvorba příspěvku

Otevře se nová stránka a spustí se nový blokový editor.

Jak přidat blok v Guttenbergu

První blok na každé stránce je Název.

Po jeho vyplnění si pomocí klávesy tab nebo kurzorem myši zobrazíte možnosti přidání dalších bloků.

Vytvořit nový příspěvek
Vytvořit nový příspěvek

Ve výchozím nastavení je dalším blokem Odstavec, který umožní rovnou začít psát obsah stránky.

Ale pokud chcete vložit jiný blok, stačí kliknout na ikonu + a ze seznamu vybrat nový blok. Ikonu + najdete na několika místech.

Ikona +
Ikona +

Pokud víte, jaký blok chcete použít, můžete začít psát jeho název a dojde k automatickému filtrování nabídky.

Blok Galerie
Blok Galerie

V případě, že nechcete využít myš, můžete začít procházet bloky i pomocí zadání “/”.

Použití lomítka propřidání bloku
Použití lomítka pro přidání bloku

Práce s bloky v novém editoru

Každý blok má svůj panel nástrojů, který se zobrazuje v jeho horní části. Nabídka tlačítek se vždy odvíjí od bloku, který upravujete.

Například na obrázku je panel nástrojů u bloku Odstavec, kde najdete především tlačítka pro formátování obsahu.

Nabídka nástrojů u bloku
Nabídka nástrojů u bloku

Kromě této nabídky nástrojů má každý blok ještě vlastní nastavení v pravém sloupci vedle editoru.

Další nastavení bloku
Další nastavení bloku

Pořadí bloků můžete měnit jejich chycením a přetažení myši nebo pomocí tlačítek nahoru a dolu na levé části bloku.

Posunutí bloku
Posunutí bloku

Ukládání a znovu využití bloku v Guttenberg

Jednou z užitečných funkcí je možnost uložení bloku a jeho znovupoužití. Díky tomu můžete rychle vytvářet opakující se prvky stránek nebo příspěvků.

U bloku, který si takto chcete uložit klikněte na jeho menu (ikona tří teček nad sebou) a zvolte možnost Přidat k opakovatelným blokům.

Přidat k opakovatelným blokům
Přidat k opakovatelným blokům

Budete vyzváni, abyste blok pojmenovali. Nakonec klikněte na tlačítko uložit.

Uložení bloku
Uložení bloku

Blok se uloží a při přidávání nového bloku si jej můžete vybrat ze seznamu Opakovatelné. Použít jej můžete kdekoliv na webu.

Opakovatelné
Opakovatelné

Všechny takto uložené bloky se ukládají do databáze a můžete je spravovat tak, že kliknete na odkaz Spravovat všechny opakovatelné bloky v sekci Opakovatelné.

Spravovat všechny opakovatelné bloky
Spravovat všechny opakovatelné bloky

Zde můžete bloky upravovat, mazat nebo třeba pomocí exportu/importu přesouvat na jiné WordPress instalace.

Publikování obsahu a správa nastavení v blokovém editoru Gutenberg

Každý WordPress příspěvek nebo stránka obsahuje různá meta nastavení. Mezi nimi najdete například datum publikování, rubriky, štítky, náhledový obrázek, atd.

Všechna tato nastavení najdete v pravém sloupci při úpravě obsahu dané stránky nebo příspěvku.

Nastavení stránky nebo příspěvku
Nastavení stránky nebo příspěvku

Přidávání vybraných bloků v novém editoru

Nový editor umí vše, co uměl ten předchozí. Nicméně tvorba obsahu by měla být rychlejší a elegantnější než dříve.

Vložení obrázku

Je zde připravený blok Obrázek. Stačí vložit blok a nahrát obrázek nebo jej vybrat z mediální knihovny.

Blok obrázek
Blok obrázek

Nahrát obrázek můžete také přetažením souboru do okna prohlížeče.

Jakmile je obrázek nahraný, zobrazí se lišta nástrojů pro blok Obrázek a v pravé nabídce nastavení najdete položky jako alt obrázku, velikost nebo nastavení odkazu.

Nastavení obrázku
Nastavení obrázku

Vložení odkazu

Blokový editor obsahuje několik bloků, do kterých je možné vložit text. Nejčastěji používanějším bývá blok Odstavec.

Všechny bloky, které umožňují vložení textu mají v panelu nástrojů ikonu pro vložení odkazu.

Vložení odkazu
Vložení odkazu

Vložení galerie

Blog Galerie funguje podobně jako blok Obrázek. Vložíte jej a vyberete obrázky, které chcete mít v galerii.

Blok Galerie
Blok Galerie

Vložení shortcodu

Všechny shortody fungují stejně jako v klasickém editoru. Pro jejich vložení můžete použít blok Odstavec nebo Zkrácený zápis.

Blok Zkrácený zápis
Blok Zkrácený zápis

Nové bloky v Gutenbergu

Gutenberg editor sliboval vyřešení starých problémů s použitelností.

Níže najdete některé vylepšení práce s obsahem, které nový blokový editor přinesl.

Přidání obrázku k textu

Nový blok Média a text umožňuje vložení obrázku vedle textu.

Blok Média a text
Blok Média a text

Přidání tlačítka

Přidání tlačítka v klasickém editoru bylo zbytečně složité. Gutenberg vše zjednodušuje a obsahuje blok Tlačítko.

Blok Tlačítko
Blok Tlačítko

Tvorba tabulek

Gutenberg obsahuje blok Tabulka, přes který jednoduše uděláte základní tabulky bez nutnosti znalosti HTML nebo CSS. Tabulku můžete zpětně upravovat, takže není problém přidat další sloupce nebo řádky.

Blok Tabulka
Blok Tabulka

Vytváření obsahu ve více sloupcích

Schopnost vytvářet obsah ve více sloupcích bylo něco, co v klasickém editoru prakticky vůbec nebylo. Blokový editor obsahuje speciální blok Sloupce, kterým si můžete určovat počet sloupců na řádce. Maximální počet je šest sloupců.

Blok Sloupce
Blok Sloupce

Tipy pro použití Gutenbergu

Pojďme si ukázat nějaké tipy nastavení nového editoru.

Panel nástrojů v horní části obrazovky

Pokud vám nevyhovuje nastavení plovoucího panelu nástrojů u každého bloku, můžete si jej přenastavit do horní lišty. Stačí, když v nastavení zaškrtnete možnost Horní panel nástrojů.

Horní panel nástrojů
Horní panel nástrojů

Klávesové zkratky

Použijte klávesou zkratku Shift + Alt + H nebo klikněte na nastavení a Klávesové zkratky a zobrazí se okno s nabídkou klávesových zkratek, které můžete v Gutenbergu používat.

Klávesové zkratky
Klávesové zkratky

Často kladené dotazy ve spojení s Gutenbergem

Co se stane s mými starými příspěvky a stránkami? Budu je moci upravovat?

Ano, starý obsah zůstane nezměněn. Pokud chcete, můžete si jej dokonce převést do nového editoru. Uděláte to tak, že v pravém horním rohu klasického editoru rozbalíte menu skryté pod ikonou tří teček a z nabídky vyberete možnost Převést na bloky.

Můžu i nadále používat starý editor?

Ano, můžete. K jeho aktivování slouží plugin Klasický editor. Více jsme o něm psali v článku Jak deaktivovat Gutenberg a vrátit původní visuální editor.

Co dělat, když nový editor není kompatibilní se šablonou nebo pluginem, který používám?

Gutenberg byl ve vývoji opravdu dlouhou dobu. To dalo vývojářům spoustu času, aby udělali svůj produkt kompatibilní. V případě, že to tak neudělali nebo je zde i přesto chyba, můžete nainstalovat plugin Klasický editor a počkat na aktualizaci nebo najít alternativní šablonu či plugin.

Správa WordPress webu

Nemusíte na to být sami. Pomůžeme vám s pravidelnou údržbou i novými vylepšeními.

Více informací

7 názorů na “Gutenberg: nový výchozí blokový editor pro WordPress”

  1. Ahoj, když přidám blok sloupce, lze nastavit šířku jednotlivých sloupců?
    Např: 3 sloupce , první šířka 10%, druhý 20%, třetí 70% šířky stránky.
    Nemůžu na to přijít. Pavel

  2. xDante1986

    Zdravím, díky za návod a rady, ale za mě teda jeden z nejhorších updatů, který jsem zažil, základ je vymyšlený dobře, ale tolik věcí, které mi nejdou udělat a vždy narazím na omezení…. nejsem člověk, který umí programovat v htlm kódu, takže jsem vždy vše řešil editorem a tady prostě tápu, bloky mi nejdou vytvořit vedle sebe do bloku když vloží malý obrázek a vedle toho dám název tak se mi podbarví nějakým default režimem. V případě potřeby nemohu dát do tabulky obrázek apod.

    Díky za radu o pluginu na klasický editor, když vidím kolik aktivních instalací proběhlo asi nejsem jediný, kdo je z toho nového blokového systému rozhořčen.

  3. xDante1986

    Dobrý den,

    mohu jeden dotaz nechápu výhodu bloku tabulka…sice mi to udělá řádky apod, ale když pak chci s tabulkou cokoliv udělat, tak jsem slepý nemůžu vycentrovat text nic…nejsou tam žádné jednoduché funkce na použití ale naopak se to hodně ztížilo. Zkusil jsem dokonce vycentrovat buňku pomocí TEXT ale píše mi to chybu a tak jsem po půl hodině boje vzal html funkční kod vložil ho do bloku tabulky a ono to má problém s jakýmkoliv standardním html kódem.

    existuje nějaký plugin na editaci tabulek v bloku?

    Díky

  4. Dobrý den,
    používám na webu pluginy The Event Calendar a Divi Plus, oba vytvářejí custop typy příspěvků a defauktně používají klasický editor. Chtěla bych i tyto typy příspěvků pro tyto pluginy vytvářet v Gutenberg editoru. Jde to nějak přepnout?
    Ani po nainstalování pluginu Gutenberg (který ale asi už není potřeba instalovat, Gutenberg by měl být součástí wordpressu a defaultní příspěvky v Gutenbergu vytvářím i bez pluginu) se custom typy příspěvků v pluginech nedají v Gutenbergu vytvářet, stále je k dispozici jen klasický editor.
    Děkuji!

Diskuze

Vaše e-mailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *

Nákupní košík

Neuteklo vám něco?

Pokrok a WordPress na nikoho nečekají, tak nám tu raději nechte e-mail, ať o nic nepřijdete!

Zkontrolujte svoji doručenou poštu nebo spam koš, abyste mohli svůj e-mail potvrdit.

Vylaďte WordPress stránky s naším tahákem

V e-booku najdete informace a rady pro WordPress od A do Z. Zadejte e-mail a my vám WordPress tahák pošleme.

Zkontrolujte svoji doručenou poštu nebo spam koš, abyste mohli svůj e-mail potvrdit.

Přejít nahoru