Editér Gutenberg je založen na „blocích“. Při vkládání textu, obrázků a dalšího obsahu v podstatě přidáváte bloky odpovídajícího typu a upravujete je. Tento přístup je velmi flexibilní a umožňuje přesně kontrolovat styl a umístění každého prvku. Zde jsou podrobné kroky postupu:
1. Vložení textu: Vytvořte obsah pomocí bloků „Odstavec“ a „Nadpis“.
Text je hlavní částí článku. Gutenberg uskutečňuje formátování textu pomocí bloků „odstavce“ a „nadpisy“ a postup je následující:
1. Vložte text odstavce (obsah hlavního textu).
- Metoda 1Po vstupu na stránku pro editaci článku se automaticky zobrazí výzva „Začněte psát nebo stiskněte / pro přidání bloku“. Po přímém zadání textu systém automaticky vytvoří blok „Odstavec“.

- Metoda 2Klkněte na ikonu „+“ v editační oblasti (vložení bloku), vyhledejte „odstavec“ a klikněte na něj. Po vytvoření bloku prázdného odstavce můžete do něj zadat obsah.

Nastavení formátu:

Pokud vyberete blok odstavce, na pravé straně se zobrazí panel „Blok“ (nastavení bloku), kde můžete provést následující nastavení:
- Způsob zarovnání (vlevo, uprostřed, vpravo, na obou stranách);
- Velikost písma (malá, normální, velká, extra velká);
- Barva textu (vyberte klepnutím na barvové pole, dbejte na kontrast s barvou pozadí a zajistěte čitelnost);
- Barva pozadí (přidání barvy na pozadí odstavce pro zvýraznění důležitých informací).
2. Vložte nadpis (rozdělte obsah na úrovně).
Nadpisy slouží k rozdělení článku na jednotlivé části (například kapitoly nebo oddíly) a doporučuje se používat je v hierarchii „H1–H6“ (H1 je obvykle hlavní nadpis článku, který je ve výchozím nastavení umístěn v horní části editační stránky, a proto jej není nutné opakovaně přidávat).
Návod k použití:

- Klikněte na ikonu „+“ v editační oblasti, vyhledejte „Nadpis“ a vyberte jej, čímž se vytvoří blok nadpisu.
- Zadejte text nadpisu (například „I. Přípravné práce před instalací“).
- Vyberte blok a v pravém panelu zvolte „Úroveň nadpisu“ H2–H6 (H2 pro primární nadpisy, H3 pro sekundární nadpisy atd.).
TechnikaPo zadání textu jej označte a stiskněte tlačítko Ctrl+B(Tlustým písmem) nebo Ctrl+I(Zvýrazněno) Umožňuje rychle nastavit styl textu.
II. Vložení obrázku: Přidejte obrázek pomocí bloku „Obrázek“ a optimalizujte jej.
Obrázky mohou články zpříjemnit a zatraktivnit. Gutenbergův blok „Obrázky“ umožňuje nahrát obrázky, upravit jejich styl a optimalizovat je. Postup je následující:

1. Tři způsoby, jak vložit obrázek
- Způsob 1: Nahrát nový obrázekKlkněte na ikonu „+“ → Vyhledejte „Obrázky“ → Klikněte na „Nahrát“ → Vyberte obrázkový soubor na počítači → Počkejte, až se nahrání.
- Způsob 2: Použijte obrázky z mediální knihovny.Pokud již byl obrázek nahrán (například obrázek, který jste již dříve vložili), klikněte na blok „Obrázky“, vyberte „Médiální knihovna“ → zaškrtněte cílový obrázek → klikněte na „Vybrat“.
- Způsob 3: Přímé vložení obrázkuZkopírujte obrázek do počítače (kliknutím pravým tlačítkem na „Kopírovat“), poté se vraťte do editační oblasti a klikněte pravým tlačítkem na „Vložit“. Systém automaticky vytvoří blok s obrázkem a nahraje jej.
2. Upravte styl obrázků (nezbytná optimalizace)
Pokud vyberete blok obrázku, můžete v pravém panelu nastavit následující klíčové parametry:

- Zarovnání:
- Levé zarovnání / pravé zarovnání: obrázky jsou umístěny na okraji a text je zobrazen kolem nich;
- Centrované zarovnání: obrázek se zobrazí uprostřed a text bude nahoře i dole;
- Široké zarovnání: obrázek vyplní celou šíři editační oblasti (vhodné pro velké obrázky).
- VelikostZměňte poměr pomocí posuvníku „šířka“ (doporučujeme ponechat zaškrtnutou volbu „omezený poměr“, aby se obrázek nedeformoval).
- odkaz (na webové stránce)Klíkněte na pole „Odkaz“ a můžete obrázek propojit s jinou stránkou (například při kliknutí na obrázek se přesměruje na stránku s vysokým rozlišením). Pokud odkaz nepotřebujete, můžete toto pole nechat prázdné.
- Alternativní text (Alt text)Zadejte popis obrázku (například „Screenshoty instalace WordPressu“), který pomůže vyhledávačům identifikovat obsah obrázku, zlepší SEO a usnadní přístupnost.
3.Řešení běžných problémů
- Nahrání obrázku selhalo: zkontrolujte velikost obrázku (doporučená velikost jednoho obrázku je maximálně 5 MB), formát (podporované formáty jsou JPG, PNG a WebP) nebo aktualizujte stránku a zkuste to znovu.
- Neostré obrázky: Ujistěte se, že nahráváte původní obrázky (s rozlišením nejméně 1000 pixelů na šířku) a že je nezvětšujete nad původní velikost.
III. Vložení videa: Přidejte místní nebo online video pomocí bloku „Video“.
Ať už se jedná o videa, která jste natočili sami, nebo videa z platforem jako YouTube nebo Bilibili, můžete je vložit do bloku „Video“:

1. Vložte místní video (video, které jste nahráli sami)
- Klepněte na ikonu „+“ → Vyhledejte „Video“ → Vyberte „Nahrát“ → Vyberte video soubor z počítače (podporovány jsou formáty MP4 a WebM).
- Po dokončení nahrávání se video automaticky zobrazí v bloku a můžete na něj kliknout a otestovat jeho přehrání.
PozorMístní video soubory jsou poměrně velké, mohou zabírat místo na serveru a zpomalovat načítání. Doporučujeme používat tuto metodu pouze pro malá videa (do 100 MB), zatímco pro větší videa je vhodnější využít online platformy.
2. Vložte online video (doporučeno!).
Vložení prostřednictvím odkazu na video platformu nevyžaduje využití prostoru na serveru a načítá se rychleji:
- Otevřete video platformu (například YouTube, Bilibili nebo Tencent Video), najděte cílové video a zkopírujte odkaz pro sdílení (například
https://www.bilibili.com/video/BV123456)。 - V editovací oblasti Gutenbergu přímo vložte odkaz → systém automaticky rozpozná a vytvoří video blok, který zobrazí video přehrávač.
Podporované platformyNa hlavních platformách, jako jsou YouTube, Bilibili, Tencent Video, Youku a iQiyi, stačí po vložení odkazu počkat 2–3 sekundy a video se načte.
3. Úprava stylu videa
Pokud vyberete video blok, na pravé straně panelu můžete provést následující nastavení:

- Zarovnání (stejně jako u obrázků, zarovnání doleva / napravo umožňuje, aby se text obtočil kolem obrázku);
- Šířka (upravte velikost přehrávače videa na maximálně 1000 pixelů šířky, aby se zabránilo tomu, že se video nezobrazí celé na mobilním zařízení);
- Automatické přehrávání: Nedoporučuje se ho zapínat (většina prohlížečů automatické přehrávání blokuje, což může negativně ovlivnit uživatelskou zkušenost).
4. Vložení odkazu: propojení textu a obrázků s dalším obsahem.
Odkazy jsou „cévy“ webových stránek, které propojují obsah s dalšími stránkami a externími webovými stránkami. Gutenberg podporuje přidávání odkazů na texty a obrázky.

1. Přidání odkazu (hypertextového odkazu) k textu.
- Vyberte text, ke kterému chcete přidat odkaz (například „Klikněte pro zobrazení podrobného návodu“).
- Klkněte na ikonu „Odkaz“ (ve tvaru řetězu) v nabídce nástrojů nahoře nebo stiskněte klávesovou zkratku.
Ctrl+K。 - Vložte adresu odkazu do vstupního pole (například odkaz na stránku v rámci webu).
https://你的域名/教程nebo externí odkazyhttps://example.com)。 - Volitelné nastavení:
- Zvolte možnost „Otevřít v nové kartě“ (externí odkazy se doporučuje aktivovat, aby návštěvníci neopouštěli vaši webovou stránku).
- Kliknutím na ikonu „Nastavení odkazu“ (malý ozubený kolo) můžete přidat název odkazu (text nápovědy zobrazovaný při přejezdu myši nad odkazem).
- Klikněte na „Enter“ nebo „Aplikovat“ k dokončení nastavení. Text se změní na modrý a bude podtržený, což znamená, že odkaz byl úspěšně přidán.
2. Přidejte odkaz k obrázku.

- Vyberte blok obrázku a v pravém panelu najděte vstupní pole „Odkaz“.
- Zadejte adresu odkazu (například kliknutí na obrázek přesměruje na stránku s podrobnostmi o produktu).
- Zvolte možnost „Otevřít v nové kartě“ (podle potřeby) a klikněte na prázdné místo pro uložení.
3. Odstraňte odkaz.

- Textový odkaz: Vyberte text s odkazem a klikněte na ikonu „Odebrat odkaz“ na panelu nástrojů (řetěz s křížem) nebo stiskněte klávesovou zkratku
Ctrl+KPozději odstraňte adresu odkazu. - Odkaz na obrázek: Vyberte obrázek a adresu můžete odstranit v poli „Odkaz“ na pravé straně.
5. Tipy pro začátečníky
- Klávesové zkratky pro práci s bloky:
- Rychlé přidání bloku: zadejte
/+ Název bloku (například/图片\nPřímo vyvolat blok s obrázky); - Mobilní bloky: Po výběru bloku stiskněte tlačítko
↑/↓Klávesy se šipkami nebo přetažení ikony „⋮⋮“ na levé straně bloku; - Odstranění bloku: Po výběru bloku stiskněte tlačítko
DeleteKlávesou Delete nebo kliknutím na ikonu „Smazat“ na panelu nástrojů bloku.
- Rychlé přidání bloku: zadejte
- Náhled v reálném časeKlíkněte na tlačítko „Náhled“ v pravém horním rohu editovací stránky a zkontrolujte, zda odkaz funguje a zda se obrázky/videa zobrazují správně.
- Vyhněte se nadměrnému formátování.Barvy textu a pozadí by neměly být příliš rozmanité (doporučuje se nepoužívat více než tři barvy) a měly by zajistit přehlednost stránky. Velikost obrázků a videí by měla být stejná (například šířka všech 800 pixelů), což přispěje k jejich větší estetické přitažlivosti.
Pomocí výše uvedených kroků můžete snadno vkládat a upravovat text, obrázky, videa a odkazy v Gutenberg Editoru. Nezapomeňte, že každý prvek je samostatným „blokem“. Po výběru můžete upravit nastavení v pravém panelu a dosáhnout přesného formátování. Po několika pokusech to zvládnete rychle a snadno!