Skutočný svetový sprievodca používaním Gutenberga

Gutenberg je nový editor príspevkov, ktorý bude publikovaný s verziou WordPress 5. Jeho názov je odvodený od Johannesa Gutenberga, ktorý vynašiel tlačiareň. Matt Mullenweg, zakladateľ WordPress, a jeho tím sa snažia zjednodušiť vytváranie obsahu pomocou WordPress. Aby sme boli spravodliví, Gutenberg ešte nie je oficiálne pripravený na použitie v produkčných systémoch. To znamená, neinštalujte ho na svoju živú webovú stránku, nebude fungovať 100% správne.

Používatelia WordPress by si však mali uvedomiť, že prichádza Gutenberg. Vývojári už robia svoje témy a doplnky kompatibilné s novým konceptom „Bloky“ – a používatelia WordPress by sa mali s týmito blokmi tiež oboznámiť.

V tomto krátkom úvode vám uvediem skutočný príklad toho, ako môžete začať používať Gutenberg, a vysvetlím, prečo je to dobrý nápad. V skutočnosti už možno používate podobné nástroje, ale ja predbieham.

Zmení Gutenberg spôsob, akým používame WordPress?

Skrátka áno. Gutenberg plánuje nahradiť súčasný editor príspevkov a zaviesť nový systém, ktorý je viac tvorcom stránok než jednoduchým textovým editorom. Podľa Joela Rasmussenazdôvodnenie je celkom jednoduché:

Editor sa bude snažiť vytvoriť novú stránku a zážitok z vytvárania príspevkov, vďaka ktorému bude písanie bohatých príspevkov jednoduché a bude mať „bloky“, ktoré zjednodušia to, čo si dnes môže vyžadovať krátke kódy, vlastný kód HTML alebo „záhadné mäso“.

Ak ste niekedy používali krátke kódy v bežnom editore WordPress, budete vedieť, aká únavná môže byť práca s nimi. A nenechajte ma začať s prechodom z doplnku na tvorbu jednej stránky na iný. Všetky sa spoliehajú na svoje vlastné krátke kódy, takže kopírovanie rozloženia nie je ľahko možné. Bez ohľadu na to, aký typ vizuálneho editora používate, takmer určite budete musieť prebudovať celé svoje rozloženia, ak by ste chceli prejsť na nový editor.

Čítať:  SEO stránky produktu: 11 tipov na optimalizáciu stránky produktu

Bude teda Gutenberg novým vizuálnym editorom? Myslím, že nebude. V skutočnosti je Gutenberg nastavený ako a editor obsahu, nie nástroj na tvorbu stránok, ktorý môžete použiť na vytváranie celých rozložení. Samozrejme, nemôžem povedať, čo prinesie budúcnosť. Ale nateraz a pravdepodobne aj ďalšie roky si nemyslím, že Gutenberg bude schopný postaviť celé rozloženie. Ukázalo sa, že vývoj nového editora je dosť náročný, Automatticu by sa odporúčalo, aby sa nedotýkal tematického ekosystému jedným dychom. Preto si myslím, že stále uvidíme tvorcov vizuálnych stránok, ale Gutenberg s nimi bude môcť komunikovať. Neskôr v tomto príspevku vám uvediem príklady toho, ako populárne doplnky a témy na tvorbu stránok s integrovanými vizuálnymi editormi v súčasnosti spolupracujú s Gutenbergom.

Pointa je, že s WordPress 5 sa všetci dočkáme nového editora príspevkov. Zatiaľ čo klasický editor je už prenesený do doplnku, a teda by ste ho mohli naďalej používať, nakoniec ho WordPress v určitom okamihu opustí a urobí z Gutenberga jediný editor. A to nemusí byť zlé.

Písanie príspevku s Gutenbergom

Môžete sa obávať, že vytváranie obsahu je teraz oveľa časovo náročnejšie ako predtým. Môžem vás ubezpečiť, že nebude, a to z dvoch dôvodov. V prvom rade si Automattic nemôže dovoliť komplikovať používanie WordPressu. Sú si dobre vedomí toho, že drvivá väčšina ich používateľov nedokáže pochopiť alebo napísať kód, takže ich cieľom je čo najjednoduchšie používanie Gutenberga. Po druhé, na používanie Gutenberga si zvyknete rýchlejšie, než si myslíte. Dokonca aj v súčasnom stave prototypu je písanie príspevkov neuveriteľne priamočiare a jednoduché. Uvidíš, čo tým myslím.

Pozrite si túto vzorovú stránku, ktorú vytvoril vývojár WP Joel Asmussen: http://moc.co/sandbox/example-post/

Nie je to krásne, ako môžete použiť Gutenberga na usporiadanie prvkov obsahu? Bude veľmi jednoduché napríklad pridávať stĺpce na prezentáciu obsahu vedľa seba, pridávať iniciály do odstavcov, pridávať obrázky v rôznych veľkostiach a šírkach (dokonca širších ako obsah textu).

Takže s Gutenbergom môžete začať celkom jednoducho. Ako som už povedal, pred začatím si vytvorte novú lokalitu alebo vytvorte skúšobnú kópiu svojej lokality. Plán spravovaného hosťovania spoločnosti Hostinger uľahčuje vytváranie pracovných stránok. Ak si nie ste istí, či váš hostiteľ ponúka túto funkciu, odporúčam vám porozprávať sa s jeho pracovníkmi podpory. Určite NECHCETE používať Gutenberg na svojej hlavnej stránke, kým nebude oficiálne uvoľnená pre produkčné webové stránky.

Čítať:  Kompletný sprievodca mobilným obchodom: Ako optimalizovať svoj obchod pre úžasný zážitok z mobilného nakupovania

Po prihlásení na svoju pracovnú stránku (odteraz ju budem nazývať „ihrisko“) môžete Gutenberga aktivovať potvrdením tejto správy na paneli WordPress:

alebo inštaláciou z úložiska doplnkov:

Po aktivácii Gutenberga uvidíte nový editor pri úprave príspevku, stránky alebo vlastného typu príspevku. Na snímke obrazovky nižšie uvidíte článok s názvom „Vitajte v editore Gutenberg“, ktorý vám poskytne pekný prehľad o všetkých prvkoch, ktoré môžete použiť. Navrhujem, aby ste tento článok použili na oboznámenie sa s používaním nového editora. Keď napríklad upravíte textový blok, v stĺpci napravo uvidíte nastavenia:

Je celkom jednoduché pridať iniciálku, zmeniť veľkosť písma, pracovať s farbami atď. Najmä veci, ako je nastavenie farby pozadia pre určitú časť obsahu, môžu byť zložité a môžu vyžadovať prispôsobenie HTML a CSS pomocou aktuálneho editora – Gutenberg robí to celkom jednoduché.

Uvidíte, že blok, ktorý práve upravujete, sa zvýrazní jemným sivým okrajom. V závislosti od typu bloku, na ktorom pracujete (text, obrázok, stĺpce, zoznam, …), sa automaticky aktualizujú nastavenia v malej lište v hornej časti bloku a v pravom stĺpci. Napríklad galéria má úplne inú funkciu ako textový blok:

Všimnite si, že aj keď sú nastavenia galérie nastavené na dva stĺpce, Gutenberg zobrazuje spodný obrázok v jednom stĺpci. Je dosť inteligentné, aby ste si všimli, že počet obrázkov v galérii je nerovnomerný. Zobrazenie posledného obrázka v rovnakom stĺpci ako prvý a zmenšenie jeho veľkosti tak, aby sa zmestilo do tohto stĺpca, by malo za následok prázdne miesto hneď vedľa obrázka (kde by bol umiestnený štvrtý obrázok). Keďže to nevyzerá skvele, Gutenberg ukazuje posledný obrázok v plnej šírke a to zase vyzerá fantasticky. Sú to malé detaily, ako je tento, vďaka ktorým som presvedčený, že sa s Gutenbergom v budúcnosti budeme baviť.

Čítať:  Začína sa to podobať na decembrové zhrnutie tweetov

Majte však na pamäti, že Gutenberg je stále v režime prototypu. Zistíte, že niektoré prvky nebudú fungovať podľa očakávania. Vezmite si napríklad blok „Stĺpce“. Takto vyzerajú tri stĺpce na veľkej obrazovke zo stolného počítača:

Nie je to zlé, ale rád by som vedel ovládať medzery medzi stĺpcami, aby sa text každého stĺpca nepribližoval k ďalšiemu. Tiež som očakával, že stĺpce sa na mobilných zariadeniach preusporiadajú pod sebou, takže každý stĺpec je zobrazený v celej šírke a obsah je ľahko čitateľný. Ale namiesto toho sa stĺpce len zúžia:

Zdá sa, že s obsahom ukážky to nie je až taký veľký rozdiel. Nasledujúca snímka obrazovky však upozorní na problém s nereagujúcimi stĺpcami:

Môžete vidieť, že text sa k sebe skutočne približuje, iniciály ho veľmi sťažujú na čítanie a obrázok v druhom stĺpci sa vznáša v nejakom zvláštnom prázdnom priestore. Od spolupráce s inými tvorcami stránok som očakával, že sa stĺpce usporiadajú takto:

Toto rozloženie by bolo oveľa ľahšie čitateľné – ale opäť by bola pekná možnosť ovládať medzery medzi blokmi.

Som si istý, že komunita WordPress už na problémoch, ako je tento, pracuje a som si istý, že Matt Mullenweg nevydá Gutenberga bez toho, aby boli tieto základy opravené. Zatiaľ je to len niečo, čo sa dá očakávať pri testovaní Gutenberga (napokon, oficiálne je to prototyp).

Funguje to s mojou témou?

Snímky obrazovky, ktoré som vám doteraz ukázal, sú len z predvolenej témy Twenty Seventeen. Bude to však fungovať s vašou témou? Nemôžem to povedať, pretože je tam príliš veľa tém. Nasmerujem vás však správnym smerom, keď zistíte, či Gutenberg s vašou témou pracuje alebo nie.

Metóda 1: Preskúmajte online novinky od tvorcov tém

Mnohé z veľkých spoločností zaoberajúcich sa vývojom tém majú radi Téma Fusion alebo StudioPress sledujú vývoj Gutenberg hneď od začiatku a robia svoje témy kompatibilnými s Gutenbergom.

Čítať:  Ako obsluhovať aktíva pomocou efektívnej vyrovnávacej pamäte Pol...

Dokonca aj vývojári populárnych vizuálnych editorov ako Beaver Builder alebo Visual Composer robia svoje doplnky kompatibilné s Gutenbergom. Je zaujímavé vidieť ich rozdielne prístupy a stojí za to ich porovnať. Beaver Builder vám dáva na výber buď pomocou Gutenberg alebo Beaver Builder pri vytváraní alebo úprave stránky. Na druhej strane Visual Composer vytvoril „Gutenbergov prvok kompatibility“, v ktorej môžete využiť Gutenbergove funkcie pri vytváraní celkovej stránky/príspevku pomocou Visual Composer. Nie som si istý, či existuje „správny“ alebo „nesprávny“ prístup k tomu, aby boli doplnky na tvorbu stránok kompatibilné s Gutenbergom. Ale je dobre vidieť tú snahu!

Ak máte pochybnosti, môžete si vygoogliť názov svojej témy a pridať do dopytu „gutenberg“, aby ste zistili, či vaši tvorcovia tém už publikovali vyhlásenie súvisiace s Gutenbergom. Ak nie, prejdite na „Témy“ vo vašom backende WP a vyberte aktuálnu tému. Potom kliknite na zvýraznený odkaz a navštívte webovú stránku vývojárov vašich tém. Je veľmi pravdepodobné, že na tejto webovej lokalite budete môcť odoslať lístok podpory alebo iný typ správy.

Metóda 2: Vytvorte pracovné miesto a otestujte

Druhú metódu som už načrtol v obsahu vyššie, ale chcem vám ju tu stručne vrátiť späť. Vytvorením pracovnej kópie vášho webu (plán WordPress spoločnosti Hostinger zahŕňa bezplatnú fázu) sa budete môcť bezpečne pohrať s Gutenbergom a uvidíte, ako dobre funguje s vašou témou.

Táto metóda je mojou preferovanou voľbou a odporúčaním, pretože je to oveľa praktickejší prístup. Aj keď by ste mali venovať pozornosť tomu, či vaši vývojári tém dokonca len pracujú na kompatibilite Gutenberg, mali by ste sa tiež oboznámiť s používaním Gutenberg. Vďaka možnosti používať Gutenberg bude prechod na WordPress 5 oveľa plynulejší.

Zostaňte v obraze s najnovším Gutenbergovým obsahom, prihláste sa na odber blogu Hostinger alebo nás sledujte Twitter.

Nové Publikácie:

ODPORÚČANIE