Vodič za WordPress Gutenberg editor

Šta je Gutenberg editor

Gutenberg je block editor koji je zamenio klasični WordPress-ov editor (TinyMCE) od verzije WordPress 5.0. Umesto jednog velikog tekstualnog polja, Gutenberg koristi sistem blokova gde je svaki element sadržaja - paragraf, slika, naslov, lista, video - poseban blok koji možete nezavisno uređivati, premestati i stilizovati.

Ime je dobio po Johannesu Gutenbergu, izumitelju štamparije sa pokretnim slovima. Isto kao što je Gutenbergova štamparija revolucionisala kreiranje sadržaja u 15. veku, WordPress Gutenberg editor revolucionise način na koji kreiramo web sadržaj.

Ako dolazite sa klasičnog editora, prelazak na Gutenberg može delovati zbunjujuce na početku. Naš vodič za pravljenje sajta u WordPress-u pokriva osnove koje će vam pomoći. Ali kada savladate osnove, Gutenberg nudi mnogo više fleksibilnosti i kontrole nad izgledom vašeg sadržaja bez potrebe za poznavanjem HTML-a ili CSS-a.

Osnove rada sa blokovima

Dodavanje blokova

Da dodate novi blok, kliknite na plavi "+" dugme koje se pojavljuje između blokova ili u gornjem levom uglu editora. Otvara se meni sa svim dostupnim blokovima organizovanim po kategorijama: Text, Media, Design, Widgets, Theme i Embeds. Možete i jednostavno kucati "/" u praznom paragrafu da brzo pretražite blokove.

Najčešći blokovi

• Paragraph: Osnovni blok za tekst. Podržava bold, italic, linkove i inline formatiranje.
• Heading: Naslovi od H2 do H6. Koristite ih za strukturiranje sadržaja (H1 je obično naslov posta).
• Image: Ubacivanje slika sa opcijama za veličinu, poravnanje, alt tekst i link.
• List: Bullet liste i numerisane liste sa ugnjezdenim stavkama.
• Quote: Istaknuti citati sa stilizovanim izgledom.
• Gallery: Galerija slika sa automatskim rasporedom i lightbox prikazom.
• Cover: Slika sa tekstom preko nje - odlično za sekcije sa pozadinskom slikom.
• Columns: Organizujte sadržaj u kolone (2, 3 ili više) za složenije layout-e.

Uređivanje i premestanje blokova

Svaki blok ima toolbar koji se pojavljuje iznad njega kada ga selektujete. Toolbar sadrži opcije specifične za taj tip bloka. Na desnoj strani editora, panel sa podešavanjima nudi dodatne opcije za selektovani blok (boje, tipografija, razmaci).

Blokove možete premestati drag-and-drop metodom ili koristeći strelice gore/dole u toolbar-u. Možete ih i grupisati, kopirati, duplirati ili konvertovati u drugi tip bloka (na primer, paragraf u naslov).

Napredni blokovi

Group blok

Group blok vam omogućava da kombinujete više blokova u jednu celinu. Ovo je korisno za primenu zajedničkie pozadinske boje, razmaka ili border-a na grupu blokova. Na primer, možete grupisati naslov, paragraf i dugme u "kartu" sa pozadinskom bojom i zaobljenim ivicama.

Columns blok

Columns blok kreira višekolonski layout. Možete birati između predefinisanih varijanti (50/50, 33/33/33, 25/50/25 itd.) ili ručno podešavati širinu svake kolone. Unutar svake kolone možete dodavati bilo koje blokove. Na mobilnim uređajima, kolone se automatski slagaze vertikalno.

Table blok

Za prikaz tabelarnih podataka, Table blok nudi jednostavan način za kreiranje tabela bez HTML-a. Možete podesiti broj redova i kolona, stilizovati zaglavlje i podnozje tabele i primeniti prugasti stil za bolju citljivost. Za kompleksnije tabele, razmotrite plugin poput TablePress.

Reusable blokovi (Synced Patterns)

Od WordPress 6.3, reusable blokovi su preimenovani u "Synced Patterns". Ovo je jedna od najmorinijih funkcionalnosti Gutenberg-a. Možete sačuvati bilo koji blok ili grupu blokova kao pattern koji zatim koristite na više stranica.

Ključna razlika: kada promenite synced pattern, promena se automatski primenjuje na SVE stranice gde je taj pattern korišćen. Ovo je idealno za elemente koji se ponavljaju na više stranica - pozivi na akciju (CTA), kontakt informacije, promotivni baneri, newsletter forme.

Da kreirate synced pattern: selektujte blok ili više blokova, kliknite na tri tačke u toolbar-u, odaberite "Create pattern" i imenujte ga. Za ubacivanje na drugu stranicu, pronađite ga u Patterns sekciji block inserter-a.

Precice na tastaturi

Precice na tastaturi dramatično ubrzavaju rad u Gutenberg-u. Evo najkorisnijih:

• / (slash): U praznom paragrafu, otvara brzu pretragu blokova.
• Ctrl+Shift+D: Duplira selektovani blok.
• Ctrl+Alt+T: Dodaje novi blok iznad trenutnog.
• Ctrl+Alt+Y: Dodaje novi blok ispod trenutnog.
• Ctrl+Shift+Z: Redo (ponavljanje opozvane akcije).
• Ctrl+Z: Undo (opoziv poslednje akcije).
• Escape: Selektuje blok (prelazak iz editing u select mode).
• Enter: Kreiranje novog bloka ispod.
• Ctrl+Shift+,: Sakriva/prikazuje bočni panel sa podešavanjima.
• Shift+Alt+H: Prikazuje sve dostupne precice na tastaturi.

Na Mac-u koristite Cmd umesto Ctrl. Ove precice rade u svim modernim verzijama WordPress-a.

Saveti za efikasniji rad

Koristite "List View" (Ctrl+Alt+O) da vidite strukturu svih blokova u hijerarhijskom prikazu - posebno korisno za duge stranice. Isprobajte "Fullscreen" mod za rad bez distrakcija. Koristite "Top Toolbar" opciju ako vam smeta toolbar koji iskace iznad svakog bloka. Organizujte često korišćene blokove u patterns za brže kreiranje sadržaja.

Zaključak

Gutenberg editor je mocran alat koji transformiše način na koji kreirate sadržaj u WordPress-u. Blok pristup vam daje vizuelnu kontrolu bez potrebe za kodom, synced patterns stede vreme na ponavljajucem sadržaju, a precice na tastaturi ubrzavaju svakodnevni rad. Investirajte vreme u učenje Gutenberg-a - ono će se visetestruko vratiti. Za optimalne performanse editora, koristite hosting optimizovan za WordPress kroz brže i kvalitetnije kreiranje sadržaja.