A színpad

A színpad a modulszerkesztő központi munkaterülete, ahol vizuálisan megtervezed és elrendezed a tartalmat.

Hat dolgot érdemes ismerned rajta:

1. a színpadterület,
2. az átméretező fogantyúk,
3. a színpad tartalma,
4. a színpad felső sávja,
5. a rétegeszköztár,
6. a helyi menü.

A színpadterület

A képernyő közepén áll a színpadterület. Itt látod a modult olyan méretben, amelyet a felső sáv színpadméret-kijelzője mutat.

A színpad átméretező fogantyúi

Ha eszközméretet váltasz, a színpad először a hozzá tartozó tartalomfolyam-tároló méretére áll. Az átméretező fogantyúkkal viszont megnézheted, hogyan néz ki az elrendezés két eszközméret között is.

Példa: az Asztali gép és a Mobil méret aktív, szélességük 1240px, illetve 480px, de azt is látni szeretnéd, mi történik 800px szélességnél. Fogd meg a színpad bal vagy jobb oldali fogantyúját, és húzd addig, amíg az elrendezés 800px széles nem lesz.

Átméretezés közben a magasság és a szélesség a felső sáv színpadméret-kijelzőjén látszik. A méretet úgy is megnézheted, ha az egeret a háttérréteg fölé viszed: a bal felső sarokban a magasság, a jobb felső sarokban a szélesség jelenik meg.

Az ilyen átméretezés nem módosítja a tartalomfolyam-tárolók méretdefinícióit. Azokat a Beállítások → Modulbeállítások panel Tartalomfolyam fülén, a Tartalomfolyam-tároló szakaszban változtathatod.

A színpad tartalma

A színpadterületen a színpad tartalma áll: a háttérréteg, a hozzáadott rétegek és az esetleges statikus dia rétegei.

A réteg kijelöléséhez kattints rá. A kijelölt réteget kék keret veszi körül, a bal felső sarka fölött pedig megjelenik a rétegeszköztár.

https://minta-bolt.hu/wp-admin/admin.php?page=revslider&view=editor&module=1&slide=1

Ha másik réteget jelölsz ki, a kék keret és a rétegeszköztár odébb költözik. Ha a kijelölt réteg gyermekréteg, a szülőréteg kerete is látszik. A képen a Headline réteg van kijelölve, a szülője a Group.

A színpad felső sávja

A színpad fölött egy címke mutatja az éppen aktív szerkesztési módot. A képeken ez Tervezési mód, Animációs mód vagy Műveleti mód. A módok közötti váltás az oldalsávon történik, a feliratot a szerkesztő magától átírja.

A módokról külön fejezetek szólnak: Tervezési mód, Animációs mód és Műveleti mód.

A rétegeszköztár

Tervezési módban, ha kijelölsz egy réteget, a bal felső sarka fölött megjelenik a rétegeszköztár. Gyors szerkesztőeszközöket tartalmaz, például igazítást, kettőzést, törlést és szövegszerkesztést.

Az eszközök a réteg típusától függnek. A fenti képen egy szövegréteg eszköztára látszik. Egy csoportréteg (Group) eszköztára más gombokat tartalmaz.

A helyi menü

Tervezési módban, ha a kijelölt rétegre jobb gombbal kattintasz, helyi menü nyílik. Ez további szerkesztőeszközöket ad, a kijelölt réteg típusától függően.

Nagyítás és görgetés

• Nagyítás: tartsd lenyomva a CTRL billentyűt (Macen a ⌘-t), és görgess az egérrel. A nagyítás a kurzor helyére középpontos, a nagyítás mértéke rövid ideig látszik a színpadterület tetején. Ha a nagyított színpad kilóg a látható területből, görgetősávok jelennek meg.
• Mozgatás: tartsd lenyomva a SZÓKÖZ billentyűt, és húzd a színpadot.

Rétegek kijelölése

• Egy réteg kijelöléséhez kattints rá. A kijelölt réteget kék keret veszi körül.
• Ha a réteg egy tárolóban (csoportban, sorban vagy oszlopban) van, a kattintás közvetlenül a beágyazott réteget jelöli ki, és a szülő tároló kerete is látszik.
• Ha a kijelölt vagy fölé vitt réteg relatív pozíciójú, a margóit rózsaszín, a belső térközét kék szín jelzi a színpadon.
• Több réteg kijelöléséhez tartsd lenyomva a SHIFT billentyűt, és kattints egymás után a rétegekre. A közös kijelölést keret veszi körül, a rétegútvonal a „több elem kijelölve” feliratot mutatja, és a rétegeszköztár helyett az igazítóeszköztár jelenik meg.
• Üres helyre kattintva a dia hátterét jelölöd ki. Az ESC megszünteti a kijelölést.
• Ha egy réteget nehéz eltalálni, jelöld ki a Rétegek oldalsávon vagy az idővonalon.

Rétegek mozgatása

• Az abszolút pozíciójú réteget húzással szabadon mozgathatod. Húzás helyett a nyílbillentyűk 1 képponttal, a SHIFT + nyílbillentyűk 10 képponttal mozgatják a kijelölt réteget.
• A relatív pozíciójú réteg a testvérrétegekkel együtt a tartalomfolyamban áll, ezért húzáskor a folyamban egy másik helyre kerül. Ha oszlop vagy csoport fölé húzod, a réteg abba kerül bele. A SHIFT lenyomva tartásával a tároló mellé teheted be, nem bele.

Igazítási segédvonalak és illesztés

Húzáskor segédvonalak jelennek meg, amint a réteg széle közelít egy igazítási célhoz: a színpad közepéhez vagy a többi réteg széléhez, középvonalához. Ha az illesztés be van kapcsolva, a réteg a közelítéskor pontosan a célhoz ugrik. Ezeket a Globális beállítások szerkesztő füle állítja, az Editor viselkedése szakaszban (lásd: Globális beállítások): a segédvonalak be- és kikapcsolása, az igazítási küszöb, az illesztés be- és kikapcsolása és az illesztési küszöb.

Rétegek átméretezése

A kijelölt réteg keretén lévő fogantyúkkal méretezheted át a réteget. A SHIFT lenyomva tartásával az arányos átméretezést kapcsolod be vagy ki. Szöveg- és gombrétegen a fogantyúra duplán kattintva a réteg mérete auto lesz, vagyis a tartalmához igazodik.

Sor és oszlop hozzáadása

Ha egy sor (Row) vagy annak egy oszlopa (Column) van kijelölve, két kerek kék gomb jelenik meg a színpadon. A sor alatti gomb új sort, a sor jobb szélén lévő gomb új oszlopot ad hozzá.

A rétegeszköztár gombjai

A rétegeszköztár akkor jelenik meg, ha Tervezési módban egyetlen réteget jelölsz ki. A kijelölt réteg bal felső sarka fölött áll, vagy alatta, ha fölötte nincs hely. A dia hátterénél nem jelenik meg. Egyes gombok fölé víve kis legördülő panel nyílik a rokon lehetőségekkel.

Gomb	Mikor látszik	Mit csinál
Rétegek csoportosítása	Ha a réteg nem csoport, sor vagy oszlop	Új csoportot (Group) hoz létre, amely a kijelölt réteget tartalmazza.
Elem hozzáadása	Csoport, sor vagy oszlop kijelölésekor	Megnyitja a Hozzáadás oldalsávot, hogy a tárolóba új réteget tehess.
Réteg beszúrása	Relatív pozíciójú rétegnél	Új réteget ad a tartalomfolyamban a kijelölt elé vagy mögé.
Kép forrása	Kép- és alakzatrétegnél	Cseréli a megjelenített képet: WordPress-médiatár, SR-könyvtár (az elemkönyvtár) vagy AI-képgenerálás.
Kép szerkesztése	Képrétegnél	Megnyitja a képszerkesztő ablakot (kompozíció, fények, színek, effektek, görbék, szűrők, elmosás, előbeállítások).
Videó forrása	Videórétegnél	Videó cseréje a WordPress-médiatárból vagy az SR-könyvtárból.
SVG forrása	SVG-ikon rétegnél	SVG cseréje a WordPress-médiatárból vagy az SR-könyvtárból.
Hang forrása	Hangrétegnél	A WordPress hangfájl-választóját nyitja meg.
Szövegréteg szerkesztése	Szövegrétegnél	Megnyitja a réteg szövegbeállításait a jobb oldalsávon.
Szövegigazítás	Szöveg-, csoport- és oszlopréteg	Balra, középre vagy jobbra igazítja a szöveget a rétegen belül.
Pozíció	Csoportban vagy oszlopban lévő rétegnél	REL (relatív) vagy ABS (abszolút) pozícionálás.
Megjelenítés	Relatív pozíciójú rétegnél	Blokk vagy Soron belüli blokk viselkedés a tartalomfolyamban.
Sortörés utána	Relatív pozíciójú, soron belüli blokk szövegrétegnél	Bekapcsolva a soron belüli blokk testvérrétegek a következő sorba kerülnek.
Réteg igazítása	Abszolút pozíciójú rétegnél	3×3-as rács: a réteget a szülő tároló valamelyik sarkához, széléhez vagy közepéhez igazítja.
X és Y pozíció	Abszolút pozíciójú rétegnél	Kiírja a koordinátákat, kattintásra pontos képpontértékeket gépelhetsz be.
3D forgatás	Sor és oszlop kivételével minden rétegnél	Bekapcsolva az X, Y és Z forgatási fogantyúk jelennek meg, mellettük a szögek és egy visszaállító gomb (mind a három szög 0 lesz). A szabad forgatáshoz a színpadon bárhol húzhatsz.
Kettőzés és törlés	Mindig	Réteg kettőzése, illetve törlése.
Oszlopszélesség	Oszlopnál	A sor szélességének törtrészeként (például 1/2) mutatja az oszlop szélességét, átírható.
Oszlop mozgatása balra, jobbra	Oszlopnál	Eggyel odébb teszi az oszlopot a soron belül.
Tartalom igazítása	Oszlopnál	A gyermekrétegek függőleges igazítása: fent, középen vagy lent.
Sorzóna	Sornál	A sort a dia három sorzónája (felső, középső, alsó sorok) között mozgatja.

A Megjelenítés két értéke:

• Blokk: a réteg bekezdésként viselkedik, a saját szélességétől függetlenül a teljes szabad szélességet elfoglalja, igazítását a szülő réteg nem szabályozhatja.
• Soron belüli blokk: a réteg szövegsorként viselkedik, csak a szükséges szélességet foglalja el, így mellette testvérrétegek is elférnek, és igazítását a szülő szabályozhatja.

A Pozíció két értéke:

• REL: a réteg és a többi relatív pozíciójú testvére úgy rendeződik, hogy ne fedjék egymást.
• ABS: a réteget pontos X és Y koordináták helyezik el.

Az igazítóeszköztár

Ha több réteget jelölsz ki (SHIFT + kattintás), a rétegeszköztár helyett az igazítóeszköztár jelenik meg. Az igazítás a kijelölés egészéhez viszonyít: a „balra igazítás” például a kijelölt rétegek bal szélét a kijelölés legbaloldalibb széléhez igazítja.

Gomb	Mit csinál
Balra, középre, jobbra igazítás	A bal szélet, a vízszintes középvonalat, illetve a jobb szélet egyenlővé teszi.
Felülre, középre, alulra igazítás	A felső szélet, a függőleges középvonalat, illetve az alsó szélet egyenlővé teszi.
Elosztás vízszintesen, függőlegesen	A rétegeket egyenletesen osztja el a megfelelő tengely mentén.
Elrendezés sorként	A rétegeket egyetlen vízszintes sorba rendezi.
Elrendezés oszlopként	A rétegeket egyetlen függőleges oszlopba rendezi.
Elrendezés rácsként	A rétegeket sorokból és oszlopokból álló rácsba rendezi.
Indítás egy időben	Az idővonalon az összes kijelölt réteg animációját a legkorábbi kezdési időpontra állítja. Mindegyik réteg megtartja a saját időtartamát, az animáció nélküli réteg marad. Ez nem a helyzetet, hanem az időzítést módosítja, ezért külön blokkban áll.
Rétegek csoportosítása	Új csoportot hoz létre az összes kijelölt rétegből.

A helyi menü

Tervezési módban jobb gombbal kattintva egy rétegre helyi menü nyílik. A jobb kattintás ki is jelöli a kurzor alatti réteget, üres helyen a dia hátterét. A menü minden rétegtípusnál ugyanazokat a pontokat mutatja. Egyetlen kivétel van: képrétegnél a Szerkesztés lenyíló lista tetején három további pont áll a kép cseréjéhez és szerkesztéséhez (WordPress-médiatár, Slider Revolution elemek, képszerkesztő).

https://minta-bolt.hu/wp-admin/admin.php?page=revslider&view=editor&module=1&slide=1

A képen a rétegeszköztár és a jobb kattintásra nyíló helyi menü látszik.

• Szerkesztés: a réteg beállítópaneljeit nyitja meg a jobb oldalsávon: Réteg, Stílus, Extra stílus, Interakció, Láthatóság, Animáció, Parallaxis és Műveletek.
• Másolás: a teljes réteg (a kijelölt rétegek) vagy a réteg egyes részei másolhatók, hogy máshol felhasználd őket: háttér, stílus (a háttérrel együtt), extra stílus, interakció, méret, pozíció, láthatóság, animációs kockák, animáció és jelenetek együtt, parallaxis.
• Beillesztés: a korábban másolt réteget a kijelölt elé vagy mögé illeszti.
• Duplikálás: lemásolja a kijelölt réteget.
• Törlés: eltávolítja a kijelölt réteget a diáról.
• Mutatás/elrejtés: elrejti a réteget a színpadon, vagy újra megmutatja.
• Zárolás/feloldás: a zárolt réteg nem jelölhető ki és nem mozgatható a színpadon.
• Menü kikapcsolása: kikapcsolja a helyi menüt, így a jobb kattintás nem nyitja meg.

Billentyű- és egérparancsok

A teljes lista a szerkesztőben a Beállítások gomb → Billentyűparancsok → Színpad fülön is megnézhető.

Parancs	Hatás
SZÓKÖZ + húzás	A színpad mozgatása.
CTRL/⌘ + egérgörgő	Nagyítás a kurzor felé.
Nyílbillentyűk	A kijelölt réteg(ek) mozgatása 1 képponttal.
SHIFT + nyílbillentyűk	Mozgatás 10 képponttal.
DEL	A kijelölt réteg törlése.
ESC	Kijelölés megszüntetése.
SHIFT + átméretezés	Arányos átméretezés be- és kikapcsolása.
SHIFT + húzás	A relatív pozíciójú réteg oszlop vagy csoport mellé kerül, nem bele.
Duplakattintás a szöveg- vagy gombréteg fogantyúján	A méret auto lesz.