A WordPress 5.0-tól kezdve a CMS-rendszer felhasználói új webtartalom-szerkesztővel rendelkeznek. Az oldal létrehozásakor az ún blokkok. Az egyes blokkok szerkeszthetők. A következő oktatóanyagban arról fogunk beszélni, hogyan használhatjuk a Gutenberg szerkesztőt webhelytartalom létrehozására.
Mi az a Gutenberg?
A Gutenberg a WordPress új alapértelmezett szerkesztője . Más elven működik, mint az eddig használt TinyMCE szerkesztő. Teljesen új webdesign-élményt kínál azáltal, hogy blokkokat hoz létre blokkok segítségével. Az egyes blokkokban úgy lehet szöveggel dolgozni, mint egy szövegszerkesztőben.
A blokkok a felhasználó konkrét elképzelései szerint mozgathatók és csoportosíthatók az oldalon. Gutenbergnek köszönhetően a felhasználónak lehetősége van jobban személyre szabni az oldal megjelenését és elrendezését.
Mi az a blokk?
A blokkok egy oldal tartalmi részei . Létrehozhat blokkot szövegek, widgetek, képek, videók, idézetek és hasonlók számára. Az egyes blokkokkal folytatható a munka. A weboldal létrehozásának előnye a drag and drop funkció, amellyel egyszerűen mozgathatók a blokkok.
Hogyan készítsünk oldalt a Gutenberg szerkesztőben
Új oldal létrehozásához nyissa meg az Oldalak ›Új hozzáadása menüpontját az oldaladminisztrációban. A következő oldal nyílik meg:
Írjon egy címet a megjelenített blokkba. Megtalálja a webhelyszolgáltatás szerkesztésének lehetőségét is . A csigát bármikor szerkesztheti a címre kattintva. Csak kattintson az oldal URL-je mellett található Szerkesztés gombra.
Blokkok létrehozása
A cím beírása után további szöveget adhatunk az előre beállított szövegbeviteli blokkhoz, vagy beszúrhatunk saját blokkot is. Ehhez kattintson a plusz ikonra: . Itt választhatja ki a hozzáadni kívánt tartalom típusát.
Példámban úgy döntöttem, hogy hozzáadok egy bekezdést. A bekezdésblokkban megtalálja a betűtípus-beállításokat, az igazítást és a hivatkozás beszúrására szolgáló ikont. A blokkszerkesztő eszköztár végén található egy gomb további szerkesztési lehetőségekhez . Használhatja például blokkbeállítások elrejtésére, másolására, HTML-ként való szerkesztésére, újrafelhasználható blokkokhoz való hozzáadásra és blokk eltávolítására.
További lehetőségeket talál a szöveghez a képernyő jobb oldalán . A betűtípus-beállítások elérhetők. Kiválaszthat egy betűméretet több előre beállított lehetőség közül, vagy beállíthat sajátot. Választhat háttérszínt, szövegszínt is, vagy beállíthatja saját speciális beállításait.
A blokkok szerkesztésének lehetőségei közvetlenül a blokk felett, valamint a képernyő jobb oldalán az egyes blokktípusoktól függően eltérőek.
Blokktípus módosítása
Az oldal létrehozásakor bármikor módosíthatja a blokk típusát. Ezt az aktív blokk feletti első gombra kattintva teheti meg . Itt mindig az aktív blokktípus karaktere jelenik meg. A kattintás után megjelenik a blokkok listája, amelyek közül választhat.
Blokk típusok
Az oldalak létrehozásakor többféle blokk áll rendelkezésre. Világos listában vannak elrendezve, amely több részre oszlik:
Leggyakrabban használt – a leggyakrabban használt blokktípusok, például bekezdés, kép, galéria és hasonlók jelennek meg itt.
Közvetlen elemek – van egy blokk a közvetlen képhez.
Gyakori blokkok – Itt blokkokat talál a képekhez, videókhoz, fájlokhoz, listákhoz, hivatkozásokhoz és az oldal egyéb gyakran használt részeihez.
Formázás – lehetővé teszi formázott tartalom hozzáadását, például táblázatot, kódot, egyéni HTML-t, de egy blokkot is hozzáadhat egy klasszikus WordPress szövegszerkesztőben.
Elrendezési elemek – Itt találhat blokkokat oldaltörésekhez, gombokat, oszlopokat vagy egy blokkot előre elkészített elrendezéssel a média és a szöveg számára.
Widgetek – a rendelkezésre álló lehetőségeknek köszönhetően rövid kódokat, kategóriákat, legutóbbi megjegyzések listáját és hasonlókat adhat hozzá.
Beágyazott – Lehetővé teszi külső tartalom, például YouTube, Twitter, Instagram, Facebook és egyéb tartalmak beágyazását.
Hogyan készítsünk alapvető elrendezést az oldalon
Kezdjük egy egyszerű oldallal. Elegendő, ha van rajta cím, szöveg, kép, pontozott lista és képgaléria.
Szöveg hozzáadása
A cím megadása után egyszerűen kezdje el az írást az előre beállított blokkban. Gutenberg minden bekezdéshez külön blokkot hoz létre. Nem kell minden alkalommal hozzáadnia az oldalhoz. Csak annyit kell tennie, hogy nyomja meg az Enter billentyűt. Az új bekezdésblokk magától jön létre.
Kép hozzáadása
Kép hozzáadásához válassza ki a megfelelő blokkot a blokklistából. A blokkok listája a képernyő bal felső sarkában található plusz ikon képére kattintva jelenik meg. Kiválaszthat egy képet a médiakönyvtárból, vagy feltöltheti az oldalra.
A feltöltés után azonnal megjelenik az oldal elrendezésében. A képernyő jobb oldalán állítsa be a kép méretét, töltse ki az alternatív szöveget, vagy szúrjon be egy hivatkozást.
Felsorolásos lista hozzáadása
Válassza ki a megfelelő blokkot a listából. Szöveg szerkesztésekor lehetőség van számozott lista kiválasztására, hivatkozás beszúrására stb.
Képgaléria hozzáadása
Válasszon ki egy blokkot a galériához a blokkok listájából. Utána töltsd fel a képeket. A galériablokkban módosíthatja az igazítást, beszúrhat vagy eltávolíthat egy képet. A képernyő jobb oldalán a galériában található oszlopok számának beállítására és képek kivágására szolgáló funkciókat talál.
A blokkok mozgatása
Az egyes blokkok áthelyezhetők az oldalon. A szükséges gombok akkor jelennek meg, amikor az egérmutatót az áthelyezni kívánt blokk fölé viszi. Két fel és le nyíl van a mozgatáshoz. Ezek mindig egy pozícióval feljebb vagy lejjebb mozgatják a kiválasztott blokkot. A nyilak között talál egy ikont a drag & drop funkcióhoz . Ha fölé viszi az egeret, megjelenik egy kéz, amelyet egyszerűen megfogva a blokkot a kívánt helyre mozgathatja.
A létrehozott blokkok újrafelhasználása
Ha létrehozott egy blokkot, amelyet később újra fel szeretne használni, kattintson a További beállítások ikonra. A blokk tetején található funkciómenüben találja. Itt válassza a Hozzáadás az újrafelhasználható blokkhoz lehetőséget.
Így minden alkalommal hozzáférhet a létrehozott blokkokhoz, amikor új bejegyzést hoz létre. A mentett blokkok megjelennek a blokktípusok listájában az Újrafelhasználható alatt . Kezelhetők is. Visszaállíthatja őket normál blokkká, vagy eltávolíthatja őket a menüből.
További jellemzők
Számos hasznos funkció áll rendelkezésre oldalak vagy cikkek létrehozásához. Először nézzük meg az oldal tetején található gombokat.
Az ikonok közül az elsőt már említettem. Blokk hozzáadására szolgál egy oldalhoz.
A vissza és előre nyilat nem kell ábrázolni – egy lépéssel előre vagy hátra visznek.
i – itt láthatod a tartalom szerkezetét.
Érdekes funkciót kínál az utolsó gomb- blokk navigáció . Az egyes blokkok sorrendjének megjelenítése mellett a kiválasztott blokkra való gyors ugrásra is szolgál.
További funkciókat az oldal jobb oldalán talál. Lehet, hogy már ismer néhányat a WordPress-szel végzett korábbi munkákból. Mások újak.
Dokumentum – Lehetővé teszi a dokumentumbeállítások elérését, például az oldal URL-jének szerkesztését, illusztrációs kép hozzáadását és a megjegyzések engedélyezését. A kategóriák és címkék hozzárendelése is elérhető a közzétételi oldalon. Szöveget is hozzáadhat az összefoglalóhoz.
Blokk – Ennek a gombnak néhány funkcióját már említettem a Blokkok létrehozása részben. Ezek a kiválasztott blokktípustól függően eltérőek.
Előnézet – Az előnézet gomb az oldal vagy bejegyzés élő előnézetét jeleníti meg.
Közzététel – Ezzel a gombbal közzéteheti az oldalt. Ha egy meglévő oldalt szerkeszt, a Közzététel gomb helyett egy Frissítés gomb jelenik meg.
Permalink – Itt szerkessze az URL szöveges részét.
Oldal tulajdonságai – Oldalsablon beállítására és szülőoldal hozzárendelésére szolgál.
További eszközök és lehetőségek megjelenítése – az oldal jobb felső sarkában található utolsó gomb a További eszközök és lehetőségek megjelenítése . Íme néhány szolgáltatás, például a reflektorfény mód, amelyek segítségével oldal létrehozásakor egy adott blokk tartalmára összpontosíthat.
Itt található a vizuális szerkesztő és a kódszerkesztő közötti váltás, valamint a teljes képernyős mód is. Ezenkívül billentyűparancsokat, újrafelhasználható blokkok kezelésének lehetőségét és egyéb oldalbeállítási lehetőségeket is talál.
Haladó tippek
Megemlítek néhány fejlettebb szerkesztő funkciót is:
Gyors blokk létrehozása
Megkönnyítheti a munkáját, így nem kell mindig egy adott blokkot keresnie a listában. Csak annyit kell tennie, hogy beír egy perjelet és a blokk nevének első betűit az előre beállított blokkban :
/názov bloku
Amint elkezdi a gépelést, megjelenik a megfelelő opciók listája.
A forráskód szerkesztése
Az oldal forráskódja a létrehozás minden lépésében szerkeszthető. Ezt az ikonra kattintva teheti meg . Itt keresse meg a kódszerkesztő opciót.
Teljes képernyős mód aktiválása
A Gutenberg szerkesztőben az oldalmenü felkínálásával felesleges elvonás nélkül dolgozhat. Görgessen az oldal jobb felső sarkába, és kattintson . Itt találja a Full Screen Mode funkciót. Kiválaszthatja a Spotlight módot is, hogy még jobban fókuszáljon egy adott blokkra.
Billentyűparancsok használata
A Gutenberg számos speciális billentyűparancs használatát teszi lehetővé a szokásos billentyűparancsokon kívül. Például:
- Az oldalsáv beállításainak megjelenítése vagy elrejtése Ctrl + Shift +
- visszavonja a legutóbbi módosításokat Ctrl + Z
- hajtsa végre újra a visszavont módosításokat Ctrl + Shift + Z
A Ctrl + Shift + H billentyűkombinációval nyissa meg a parancsikonok listáját.
Bővítse a lehetőségeket bővítményekkel
Ha bővíteni szeretné tervezési lehetőségeit, telepítse a Gutenberg egyik bővítményét. A Stackable plugin például előre elkészített blokkok gyűjteményét kínálja. Érdekes főoldalakat fog létrehozni. Az Otter Blocks szintén nagyszerű bővítmény. Hozzon létre blokkokat, például árakat, Google Térképet és egyebeket.
Íme néhány válasz a gyakran ismételt kérdésekre
Mi van, ha nem akarom használni a Gutenberget?
Egyes felhasználók megkérdezik, hogy a WordPress lehetővé teszi-e a korábbi TinyMCE szerkesztő használatát. Igen, lehetséges. Ebben az esetben a Gutenberg deaktiválható. Mindössze annyit kell tennie, hogy telepíti a WordPress Classic Editor bővítményt .
Változik a régi tartalom?
Az oldalon lévő összes tartalom változatlan marad. Gutenberg egy adott oldalt vagy cikket egy blokkban helyez el. Erre a célra Gutenberg áll rendelkezésre úgynevezett klasszikus blokk. Ez lehetővé teszi, hogy úgy dolgozzon az eredeti tartalommal, mint a klasszikus TinyMCE szerkesztőben.
Egyszerűen szerkesztheti az eredeti tartalmat egy klasszikus blokkban, vagy átalakíthatja blokkokká . A kívánt funkciót a További lehetőségek ikon alatt találja . A tartalommal úgy is dolgozhat, mintha blokkszerkesztőben hozta volna létre.