A WooCommerce-blokkok használata

A WooCommerce több blokkot ad a szerkesztőhöz, amelyekkel bejegyzésekben, oldalakon, mintákban és sablonokban alakíthatod a katalógust, kiemelheted a termékeket, és kényelmes pénztárat adhatsz a vásárlóknak. Ez a fejezet az alapokat foglalja össze: hogyan szúrsz be blokkot, hol találod a beállításait, és mit tehetsz, ha valami nem úgy működik, ahogy várod.

Mi kell hozzá

A WooCommerce webhelyszerkesztő-funkcióit blokkos témával használhatod a legteljesebben. Blokkos témánál a Megjelenés → Szerkesztő oldalon szerkesztheted a sablonokat, a sablonrészeket és az oldalakat. Klasszikus témánál blokkokat csak a bejegyzésekben és az oldalakon használhatsz, a sablonokhoz nincs hozzáférésed; ilyenkor a Megjelenés → Testreszabás oldalt, az Oldalak → Összes oldal listát, vagy a téma, illetve az oldalszerkesztő saját szerkesztőjét használd. Ha egy harmadik féltől származó oldalszerkesztő vezérli a tartalmat, annak saját sablon- vagy oldalszerkesztőjét nyisd meg.

Ha egy blokk hiányzik vagy furcsán viselkedik, frissítsd a WordPresst és a WooCommercet a legújabb stabil változatra, aztán ellenőrizd, hogy az aktív téma támogatja-e a használni kívánt szerkesztési módot.

A blokkok az oldalad és a boltod tartalmi elemei: minden, amit egy oldalhoz adsz, blokk. Sok WooCommerce-blokk a helyzettől függő, dinamikus tartalmat mutat (például a vásárló kosarának termékeit). A webhelyszerkesztőben ezek mintatartalommal jelennek meg.

Blokk beszúrása

Többféleképpen is hozzáadhatsz blokkot:

• A szerkesztő bal felső sarkában a + ikonnal megnyitod a blokkbeszúrót. Itt kereshetsz blokkot, és minden blokknál kis előnézet és leírás látszik.
• A szerkesztőmezőben egy blokk fölött, mellett vagy alatt szintén megjelenik egy + ikon.
• Gyors megoldás a perjeles parancs: gépeld be, hogy /, majd a blokk nevének elejét, és a javaslatok közül válassz.

A blokkbeszúróban a blokk nevének elejére vagy egy kulcsszóra (például „kép” vagy „címsor”) kereshetsz.

Blokk törlése

1. Jelöld ki a blokkot.
2. Kattints a blokk eszköztárának vagy a listanézetnek a hárompontos ikonjára.
3. Válaszd a törlés lehetőséget.

A billentyűparancs is működik: Macen Control + Option + Z, Windowson Shift + Alt + Z. Egyes blokkok a Delete vagy a Backspace billentyűvel is törölhetők.

Néhány sablon helyőrző blokkokat tartalmaz, amelyek jelzik, hol jelenik meg a bolt tényleges tartalma a közzététel után. Ezeket ne töröld, amíg nem teszteled, mi történik: hiányzó információ vagy hibák keletkezhetnek a boltban.

Ha egy blokkot nem találsz

Előfordul, hogy egy blokk nem érhető el a beszúróban. Ennek az oka, hogy a blokkokat meghatározott helyekre lehet korlátozni:

• Csak bizonyos területen használható blokkok. A Kosár kiegészítő ajánlatok blokk például csak a Kosár blokk Kosár tételei részében helyezhető el.
• Egy környezet csak bizonyos blokkokat enged. A Kosár blokk Kosár végösszegei részébe például csak ezek kerülhetnek: bekezdés, kép, elválasztó és Elfogadott fizetési módok.
• Egy sablonban vagy területen csak egy példány lehet. Az Elfogadott fizetési módok blokk a Kosár végösszegei részében csak egyszer szerepelhet.

Ezek a szabályok biztosítják, hogy a blokkok a megfelelő helyen működjenek, és ne törjék meg az elrendezést.

Blokk testreszabása

Jelöld ki a blokkot a tartalomban, vagy keresd meg a listanézetben. A beállításait két helyen éred el: a blokk eszköztárán és a beállítások oldalsávján.

A blokk eszköztára

Kijelölés után a blokk fölött vagy alatt megjelenik az eszköztár. Az ikonok fölé víve a tooltip megmondja, mit csinálnak.

https://minta-bolt.hu/wp-admin/post.php?post=6&action=edit

A képen a Kosár blokk eszköztára, a bal oldalon a listanézet, jobbra a blokk beállításai látszanak.

A legtöbb blokk eszköztárán ezek az elemek vannak:

Elem	Mit csinál
Átalakítás	A blokkot hasonló típusúvá alakítja. A Kosár blokkot például klasszikus kosárrá is átalakíthatod.
Húzás	A hat pontot tartva a blokkot az oldal másik részére húzhatod.
Mozgatás fel/le	A blokkot egy hellyel feljebb vagy lejjebb lépteti.
Igazítás	A blokk elhelyezése: balra, jobbra, középre, és ha a téma támogatja, széles vagy teljes szélességű.
További lehetőségek	A három függőleges pont menüje (lásd lent).

A További lehetőségek menü ezeket a műveleteket tartalmazza:

• Másolás: a blokkot a vágólapra másolja.
• Duplikálás: másolat az eredeti alatt.
• Beszúrás elé / mögé: üres hely a blokk fölött vagy alatt egy új blokknak.
• Stílusok másolása és beillesztése: egy blokk stílusát átviheted egy másikra.
• Csoportosítás / csoport szétbontása: több blokkot egy csoportba fogsz, ami hasznos színek és térközök közös beállításához.
• Zárolás: letiltja a blokk mozgatását és/vagy törlését.
• Minta létrehozása: a testreszabott blokkot mintaként menti, hogy máshol is használhasd.
• Átnevezés: a blokk új nevet kap a listanézetben.
• Áthelyezés: kiválasztod az oldal egy másik részét, ahová a blokk kerül.
• Szerkesztés HTML-ként: a blokk tartalmát HTML-ben szerkesztheted.
• Törlés: eltávolítja a blokkot.

Nem minden blokknál érhető el mindegyik: zárolt blokknál például nincs törlés, és a mozgatás sem biztos. Egyes blokkok eszköztára saját elemeket is tartalmaz, például a Kép blokkon hivatkozás hozzáadása vagy körbevágás.

Ha egy másik blokkba ágyazott blokkot jelölsz ki, az eszköztártól balra egy külön gomb jelenik meg. Erre kattintva a közvetlen szülő blokkot jelölheted ki.

A blokk beállításai oldalsáv

Az oldalsáv a kijelölt blokk további beállításait tartalmazza, és blokkonként más. Ha nem látod, kattints a mentés gomb melletti Beállítások gombra a szerkesztő jobb felső sarkában. Az oldalsáv tetején két lap van: az aktuális blokk beállításaihoz a Blokk lapot nézd. Egyes blokkoknak nincs beállításuk az oldalsávon.

Zárolt blokkok

A zárolás megakadályozza, hogy egy blokkot elmozdíts vagy töröljenek. Mintáknál és sablonoknál hasznos.

• A szerkesztőben zárolt blokk: te zároltad, és a blokk eszköztárának hárompontos menüjéből bármikor feloldhatod.
• Fejlesztő által zárolt blokk: a sablon szintjén zárolták, hogy védjék a lényeges elrendezést és működést. Sok WooCommerce-sablon így véd blokkokat: nem engedi, hogy a szükséges környezetükből kimozdítsd őket, és megtartja a sorrendjüket. Ezeket általában nem tudod feloldani.

A listanézetben a zárolt blokkok mellett lakat ikon látszik (a képen a Kosár blokk Filled Cart és Empty Cart részénél).

Ha egy blokk nem szerkeszthető vagy nem található

1. Ellenőrizd, hogy a megfelelő oldalt, sablont vagy sablonrészt szerkeszted-e.
2. Nyisd meg a listanézetet, és jelöld ki a szülő blokkot vagy területet, ahová a blokk tartozik.
3. Ha a blokk mellett lakat van, vagy az adott környezetben nem érhető el, a sablon vagy a szülő blokk korlátozhatja.
4. A WordPress vagy a WooCommerce frissítése után töltsd újra a szerkesztőt, mentsd el a módosítást, és nézd meg az érintett oldalt a boltban.
5. Ha az eredmény nem jó, vond vissza a módosítást, vagy állítsd vissza a sablon korábbi változatát, mielőtt újra próbálkozol.

Klasszikus sablonok, helyőrző blokkok és rövidkódok

Ha a blokkos változattal gond van, a Kosár és a Pénztár blokkot visszaalakíthatod a klasszikus, rövidkódos változatra az Átalakítás gombbal. A lépéseket a Kosár és pénztár blokkok fejezetben találod.

A sablonokról és a blokkos téma és a WooCommerce kapcsolatáról a sablonrészekről szóló fejezetben olvashatsz.