Oxygen Gutenberg Integration

Mi ez és milyen problémát old meg?

Az Oxygen Gutenberg Integration az Oxygen Builder hivatalos kiegészítője. Híd a dizájn és a tartalomszerkesztés között: az Oxygenben felépített komponenseket Gutenberg blokkokká alakítja, így a tartalomszerkesztők a natív WordPress blokkszerkesztőben dolgozhatnak, miközben a layout és a stílus központilag, az Oxygenben marad kontroll alatt. Ez megelőzi a „szétcsúszó” oldalakat, egységesíti a szerkesztői élményt, és gyorsítja a karbantartást.

Hogyan működik röviden

• Az Oxygenben megtervezett szekciókat/komponenseket blokkként regisztrálod.
• A WordPress szerkesztőben ezek az „Oxygen Blocks” kategóriában jelennek meg.
• A blokkoknak kijelölhetsz szerkeszthető mezőket (pl. szöveg, kép, link), amelyeket a tartalomszerkesztők Gutenbergben módosítanak.
• Teljes oldalakat is szerkeszthetővé tehetsz „Full Page Blockként”.
• A „Client mode” elrejti az Oxygen felületet a kijelölt felhasználóknál/bejegyzéstípusoknál.
• A renderelés továbbra is az Oxygenen keresztül történik; a WordPress téma‑rendszer nem vesz részt.

A bővítményt külön kell telepíteni és licencelni (külön licencmező az Oxygen beállításain belül).

Fő funkciók részletesen

• Oxygen elemekből Gutenberg blokkok: Bármely Oxygen szekciót vagy komponenst gyorsan blokká alakíthatsz. A Gutenbergben a saját, kategorizált „Oxygen Blocks” között találod meg őket. Egész oldalakat is publikálhatsz „Full Page Block” módban, hogy az oldal teljes tartalma a blokkszerkesztőből legyen módosítható.

• Tartalmi mezők kijelölése és szerkesztése: A blokkokon belül meghatározod, hogy mely mezők legyenek szerkeszthetők (például szöveg, rich text, képek, ikonok, link URL‑ek, szekcióháttér-képek). A szerkesztő felület kiemeléssel jelzi, pontosan melyik elemhez tartozik az adott mező, így nem tévedsz el a komponensben.

• Központi dizájnfrissítés: Ha az Oxygenben módosítod egy blokk dizájnját, a változtatás minden előforduláson érvényesül. A Gutenbergben megadott tartalmi értékek megmaradnak, így a dizájn és a tartalom elválik egymástól.

• „Client mode” és jogosultságok: Elrejtheted az Oxygen szerkesztőt adott szerepkörök vagy bejegyzéstípusok esetén. Az ügyfelek/tartalomszerkesztők csak a Gutenberget látják, így nem tudják véletlenül felülírni a layoutot.

• Újrafelhasználás több webhelyen: A blokkokat megoszthatod és telepítheted más site‑okra az Oxygen beépített könyvtárával vagy a WordPress import/export eszközeivel.

• Teljesítmény finomhangolás: Kikapcsolhatod a „Gutenberg Blocks CSS” betöltését, ha nem használsz natív Gutenberg blokkokat. Ezzel gyorsíthatod a betöltést; ha mégis használsz natív blokkokat, szükség lehet saját CSS‑re.

• Licenc és frissítés: A kiegészítő saját licencmezőt kap az Oxygen beállításai között; a frissítések és a hibakeresés ehhez a licenchez kötődnek.

Gyakorlati példák

• Márkakomponens-könyvtár: Készíts hős szekciót, ártáblát, CTA‑sávot Oxygenben. Jelöld szerkeszthetőként a címet, leírást, gombszöveget és képet. A szerzők Gutenbergben variálhatják a tartalmat, a tipográfia és a spacing központilag egységes marad.

• Landing oldalak „Gutenberg‑esítése”: Az oldalt Full Page Blockként teszed szerkeszthetővé. A marketing csapat a megszokott blokkszerkesztőben frissít, miközben a rács, a komponensek és a reszponzív viselkedés érintetlen marad.

• Ügyfélátadás: Bekapcsolod a client mode‑ot, és elrejted az Oxygent a szerkesztő szerepkörnél. Az ügyfél csak azokat a mezőket látja és módosítja, amelyeket erre kijelöltél.

• Többsite‑os projektek: Ugyanazokat a Oxygen‑blokkokat használod több webhelyen. Ha frissíted a dizájnt, mindenhol egységesen megjelenik, a helyi tartalom közben megmarad.

Telepítés és első blokk lépésről lépésre

1. Telepítés: Aktiváld az Oxygent, majd telepítsd és aktiváld az Oxygen Gutenberg Integration kiegészítőt.
2. Licenc: Az Oxygen beállításain belül add meg a kiegészítő licenckulcsát.
3. Blokk létrehozása:
   • Oxygen → Block Library → új blokk; vagy
   • Structure panel: Section/Div → „Copy to Block”; vagy
   • Oldalszinten: Oxygen meta box → „Make This Full Page Editable In Gutenberg”.
4. Szerkesztés Gutenbergben: Keresd az „Oxygen Blocks” (vagy „Oxygen Full Page Blocks”) kategóriát, illeszd be a blokkot, majd szerkeszd a kijelölt mezőket.

Oxygen → Block Library → Add New
Structure panel → jobb klikk Section/Div → Copy to Block
Oldal szerkesztése → Oxygen meta box → Make This Full Page Editable In Gutenberg

Előnyök és értékajánlat

• Idő- és költségmegtakarítás: Egyetlen helyen végzett dizájnmódosítás mindenhol érvényesül.
• Kevesebb hibalehetőség: A tartalom külön szerkeszthető, a layout védett.
• Gyors szerkesztői munka: A szerzők a natív Gutenberg felületen dolgoznak.
• Skálázhatóság: Ugyanaz a komponenskönyvtár több site‑on használható.
• Teljesítmény‑kontroll: Felesleges CSS kikapcsolása, célzott optimalizálás.

Célközönség

• Ügynökségek és fejlesztők, akik Oxygennel építenek, de a tartalmat a csapat vagy az ügyfél Gutenbergben szeretné szerkeszteni.
• Marketing és tartalomcsapatok, akiknek a gyors, biztonságos tartalomfrissítés fontos, dizájnkockázat nélkül.
• Többsite‑os működés vagy franchise hálózatok, ahol egységes márkakomponensek szükségesek.

Korlátok és megjegyzések

• Előnézeti korlátok: Bizonyos dinamikus elemek (pl. repeater, dinamikus adatok) a Gutenbergben csak placeholdert mutathatnak; a frontenden rendben megjelennek.
• Téma‑függetlenség: Az Oxygen letiltja a WordPress téma‑rendszert; a renderelést az Oxygen sablonjai végzik. A blokktémás/FSE funkciók itt nem célzottak.
• CSS beállítás: Ha letiltod a Gutenberg Blocks CSS‑t, és natív blokkokat használsz, külön stílusra lehet szükség.
• Függőség: A blokkok működéséhez az Oxygen és a kiegészítő aktív jelenléte szükséges.

Best practice tippek

• Csak a valóban tartalmi mezőket tedd szerkeszthetővé; a struktúrát és spacinget hagyd Oxygen kontroll alatt.
• Adj egyértelmű mezőcímkéket és leírásokat, hogy a szerkesztők tudják, mit módosítanak.
• Tervezz újrafelhasználható komponensekben (atomok → molekulák → szekciók), hogy skálázni tudd a könyvtárat.
• Használd a client mode‑ot és a szerepkör‑szabályokat a biztonságos átadásért.