Képes tartalmi kártyák – Képes tartalmi kártyák
Több kép + szöveg kártya váltott desktop elrendezéssel és mobilbarát egymás alatti megjelenéssel.
Képes tartalmi kártyák – Képes tartalmi kártyák
A kártyák desktopon két oszlopban, választható vagy automatikusan váltott oldalsó képpozícióval jelennek meg. Kártyánként külön kérhető Fent képpozíció is, amikor desktopon a kép a saját képoszlopának tetejéhez igazodik, miközben a kétoszlopos kép + szöveg elrendezés megmarad. A szöveges rész kártyánként Balra, Középen vagy Jobbra igazítható. Mobilon a kép továbbra is a szöveg fölé rendeződik, a kártyák alatt pedig opcionális szerkeszthető információs blokk is használható.
Mire érdemes használni?
Képpel támogatott, egymásra épülő tartalmi részekhez.
Blokk működése
Blokk beállításai
Ezek a beállítások minden blokk szerkezeti és navigációs működését egységesen vezérlik.
- Megjelenési változat: meghatározza a blokk elrendezését és az elérhető tartalmi mezőket. Változatváltás után ellenőrizd az előnézetet.
- Dobozos háttér megjelenítése: alapból bekapcsolt V1 megjelenési kapcsoló. Kikapcsolva az adott blokk fő háttér/doboz/keret/árnyék rétege eltűnik, miközben a tartalom, a gombok, az űrlapmezők, a Blog- és árkártyák funkcionális belső kártyái megmaradnak.
- Dekoráció: a Sablon, vizuális stílus, színtéma és betűtípus panelen globálisan kapcsolható, és itt globális dekorációtípus, bal/jobb oldali alaphely, valamint Egyedi kép esetén saját logó/ikon is választható. Bekapcsolva a legtöbb nem-Hero blokk Megjelenés csoportjában külön felülírható az Alapértelmezett, Nincs dekoráció, az öt vizuális profilhoz igazított dekoráció vagy az Egyedi kép. A kiválasztott profil egy fő háttérdekorációként jelenik meg, nem ad külön másodlagos after díszítést. Egyedi képhez SVG, áttetsző PNG vagy WEBP logó/ikon ajánlott; fotók és részletgazdag képek dekorációként kevésbé mutatnak jól.
- Aktív blokk: kikapcsolva a blokk nem jelenik meg a nyilvános oldalon, de a beállításai megmaradnak és később visszakapcsolható.
- Megjelenés a menüben: a „Menüben jelvény” a blokk saját szakaszához görgető normál menüpontot ad. A „Menü csak mobilon” ettől függetlenül is bekapcsolható: a menüpont neve mező feliratát használja, desktopon nem látszik, és külön mobil cél slugot is kaphat.
- Menünév és mobil menüikon: a menüben látható felirat és a mobilnézetben használható ikon. A menünév legyen rövid és egyértelmű.
- Kiemelt menüpont: ahol elérhető, külön vizuális hangsúlyt ad a főmenüben az adott blokk linkjének.
- Főmenü és almenük: a menüben lévő aktív blokkokból opcionálisan főmenü/almenü kapcsolat építhető. Ha nincs ilyen kapcsolat, a régi egyszerű, egyszintű menü változatlan marad.
- Mobilos menütérkép: mobilon a főmenük és almenük egy közös hierarchikus nézetben láthatók. A Főmenüvé és Almenüvé műveletek külön gombot kaptak; almenü csak a főmenü kiválasztása után menthető, sorrendje fel/le gombbal módosítható, és másik főmenü alá is áthelyezhető.
- Sorrend: az Elhelyezett blokkok listában látható szám mutatja a tényleges oldalbeli pozíciót. Bezárt állapotban a fogantyúval átrendezhető; az új sorrend automatikusan mentődik.
- Menüsorrend: ha több blokk megjelenik a menüben, azok menüpozícióját is az oldalon beállított blokksorrend határozza meg. A Menüstruktúra panel bal oldali „Menüben lévő blokkok” listája a tényleges menü- és oldalsorrendet mutatja: ha itt sorrendezel, a menüpont helye és a blokk oldalbeli pozíciója is változik. Ugyanez fordítva is igaz: az Elhelyezett blokkoknál rendezett menüben lévő blokk a főmenü/almenü panelen is frissül. Normál menüpont innen húzható főmenünek vagy egy meglévő főmenü alá almenünek. A középső Főmenük oszlopban a főmenük kiválaszthatók, de a főmenük sorrendjét a bal oldali Menüben lévő blokkok lista és az Elhelyezett blokkok tényleges oldalsorrendje határozza meg. Már főmenü/almenü szerepű elemet előbb vissza kell állítani az X ikonnal; az almenük csak a lenyílóban jelennek meg.
- Duplikálás és törlés: a blokk másolható, ha a változat darabszámkorlátja engedi; törléskor a blokk és a hozzá tartozó mentett tartalom eltávolításra kerül.
Tartalmi mezők
Tartalom szerkesztése
Az alábbi funkciók a kiválasztott változat tényleges, jelenlegi mezősémájából származnak.
A változat fő funkciói
- Ismételhető kép + szöveg kártyák címmel, leírással és opcionális gombbal.
- Desktop képpozíció: bal, jobb vagy automatikus váltás.
- Mobilon automatikus egymás alatti elrendezés kézi sortörések nélkül.
- Cover vagy contain képmegjelenítés és egységes képarány.
- Kártyánként Balra, Középen vagy Jobbra állítható szövegpozíció; a listajelölők közép/jobbra igazításnál is a szöveg mellett maradnak.
- Ismételhető kártyák üresen maradt törölt elem kiszűrésével.
- Kép, ALT, felső címke, cím, formázott leírás és opcionális gomb.
- Cover/contain képmód, Alap/Fent kártyaszintű képpozíció és 16:9, 4:3 vagy 1:1 képarány; Fent módban desktopon nem kerül a kép a szöveg fölé, csak a saját oszlopában felülre igazodik.
- Kártyánként Balra/Középen/Jobbra szövegpozíció, listáknál a marker igazításának megőrzésével.
- Opcionális alsó TipTap tartalom fontos megjegyzésekhez vagy feltételekhez.
- Mobilbarát automatikus sorrend.
Megjelenés
Elrendezés és megjelenés
A blokk elrendezése, igazítása és vizuális működése.
- MegjelenésElőre meghatározott lehetőségek közül választható beállítás. A kártyák vizuális hangsúlyát állítja.
- Kártyák közötti térközElőre meghatározott lehetőségek közül választható beállítás.
- KéparányElőre meghatározott lehetőségek közül választható beállítás. Egységes képarányt ad a kártyák képeinek.
- Dobozos háttér megjelenítéseBe- és kikapcsolható funkció. Alapból bekapcsolt. Kikapcsolva a blokk fő doboz/háttér/keret/árnyék rétege eltűnik, így kevésbé csempés, nyitottabb megjelenést kap. A tartalom, az elrendezés, a gombok, az űrlapmezők, a Blog- és árkártyák belső működése megmarad.
- Dekoráció típusaElőre meghatározott lehetőségek közül választható beállítás. Alapértelmezett értéknél a blokk megtartja a jelenlegi vizuális stílushoz tartozó dekorációját. A Nincs dekoráció csak ennél a blokknál kapcsolja ki a dekorációt; a profil-dekorációk a kiválasztott karaktert használják.
- Dekoráció helyeElőre meghatározott lehetőségek közül választható beállítás. Alapértelmezett értéknél a blokk a globális dekorációhelyet követi. Egyedi választással balra vagy jobbra tehető a fő dekoráció. Mobilon a dekoráció kisebb és kevésbé hangsúlyos.
- Dekorációs képKép feltöltése vagy cseréje; a rendszer reszponzív képváltozatokat készít. Egyedi kép dekorációhoz. Legjobb eredményt SVG, áttetsző PNG vagy WEBP logó/ikon ad. A fájl legfeljebb 1 MB és 1200 × 1200 px lehet.
- Egyedi kép megjelenítéseElőre meghatározott lehetőségek közül választható beállítás. Alapértelmezett esetén a globális egyedi dekoráció módját követi. A Lágy háttérelem halványabb, dekoratívabb megjelenést ad.
- Egyedi kép átlátszóságaElőre meghatározott lehetőségek közül választható beállítás. Alapértelmezett esetén a globális átlátszóságot követi. Logókhoz általában a 10–20% közötti érték ad finom háttérhatást.
- Egyedi kép méreteElőre meghatározott lehetőségek közül választható beállítás. Alapértelmezett esetén a globális méretet követi.
- Egyedi kép forgatásaElőre meghatározott lehetőségek közül választható beállítás. Alapértelmezett esetén a globális forgatást követi. A kisebb döntés dekoratívabb, de nem zavaró hatást ad.
Blokk fejléc
Blokk fejléc
A szakasz főcíme, alcíme és bevezető szövege.
- Felső kis címkeRövid szöveg vagy felirat.
- Blokk címeRövid szöveg vagy felirat. Rövid, konkrét cím, amely összefogja az alatta lévő képes kártyákat.
- Rövid bevezetőFormázott, Tiptap-alapú tartalom. Opcionális bevezető. Üresen hagyva nem jelenik meg.
Alsó tartalom
Alsó tartalom
A blokk ehhez a tartalmi csoporthoz tartozó beállításai.
- Alsó szerkeszthető tartalom megjelenítéseBe- és kikapcsolható funkció. Bekapcsolva a kártyák alatt egy külön, TipTap editorral szerkeszthető információs tartalom jelenik meg.
- Alsó tartalomFormázott, Tiptap-alapú tartalom. Opcionális megjegyzés vagy kiegészítő szöveg a kártyák alatt. Csak akkor jelenik meg, ha az alsó tartalom kapcsoló aktív.
Bővíthető elemek
Ismételhető tartalmi elemek
Az elemek hozzáadhatók, törölhetők és a fogantyúval átrendezhetők. A sorrend a nyilvános oldalon is érvényesül.
Ismételhető elem
Képes tartalmi kártyák
Kép + szöveg párokhoz. Desktopon a kép balra vagy jobbra kerülhet, mobilon minden kártya rendezett egymás alatti elrendezésre vált.
maximum 12 elem.
Egy „Kártya” szerkeszthető adatai
- KépKép feltöltése vagy cseréje; a rendszer reszponzív képváltozatokat készít.
- Kép alt szövegeRövid szöveg vagy felirat.
- Kép megjelenéseElőre meghatározott lehetőségek közül választható beállítás. Borító módban a kép kitölti a képterületet, szükség esetén vágással. Teljes kép módban a teljes kép látszik.
- KéppozíciójaElőre meghatározott lehetőségek közül választható beállítás. Alap módban a kép a kártya függőleges közepére igazodik. Fent módban a kétoszlopos elrendezés megmarad, csak a kép a saját oszlopában felülre igazodik.
- Kép helye desktoponElőre meghatározott lehetőségek közül választható beállítás. Desktopon balra, jobbra vagy automatikusan váltva jelenik meg. Mobilon a kép mindig a szöveg fölé kerül.
- SzövegpozícióElőre meghatározott lehetőségek közül választható beállítás. A kártya felső címkéjének, címének, leírásának és gombjának vízszintes igazítását állítja.
- Felső kis címkeRövid szöveg vagy felirat.
- CímRövid szöveg vagy felirat.
- LeírásFormázott, Tiptap-alapú tartalom.
- Gomb felirataRövid szöveg vagy felirat.
- Gomb hivatkozásaBelső blokkazonosító, belső URL, külső URL, e-mail- vagy telefonhivatkozás.
- Felső kis címke színeEgyedi szín választása; üres/Default értéknél a téma alapstílusa marad.
- Cím színeEgyedi szín választása; üres/Default értéknél a téma alapstílusa marad.
- Gomb felirata színeEgyedi szín választása; üres/Default értéknél a téma alapstílusa marad.
Mozgás és megjelenés
Animáció
A blokk belépési animációja külön kapcsolható. Az első két aktív helyen választható LCP-védelem csak a frontend futást függeszti fel, az adminban elmentett animációt, effektet és sebességet nem törli. A blokk harmadik vagy későbbi helyre mozgatva automatikusan újra animálódik. A rendszer kompozit tulajdonságokra épülő effektet használ, és tiszteletben tartja a csökkentett mozgás beállítást.
- Kapcsold be vagy ki az animációt az adott blokknál. A fejléc badge-e már összecsukott állapotban is mutatja az animáció állapotát.
- Válaszd ki az effektet, a sebességet, a késleltetést és – ahol elérhető – az elemek lépcsőzetes sorrendjét.
- Az első két aktív blokknál az LCP-védelem az ajánlott állapot. Sorrendváltáskor a rendszer Igen / Nem kérdéssel felajánlja, de az első két blokk Animáció részében később manuálisan is be- vagy kikapcsolható. Az animáció adminbeállítása minden esetben megmarad; harmadik vagy későbbi helyen automatikusan újra működik, és az „Animáció aktív” badge jelenik meg.
- A rendszer nem tiltja globálisan a hover/transition effekteket: csak az LCP-védett első két blokk belépő animációja szünetel a gyorsabb első renderelés miatt.
- Az animáció nem változtatja meg a blokk tartalmát vagy sorrendjét, csak a megjelenés módját.
Használati javaslatok
- Több, képpel illusztrált magyarázó szakaszhoz ezt használd a kézi sortörések helyett.
- A kártyaképek kártyaszélességre optimalizált responsive sizes értéket kapnak, ezért érdemes továbbra is nagy, de jó minőségű forrásképet feltölteni.
- A kártyák alatti alsó tartalmat csak rövid, tisztázó megjegyzéshez használd, ne fő üzenetként.
- Olyan tartalomhoz használd, ahol a Tartalomszerkesztőben már túl sok kézi sortörésre lenne szükség.
- A kártyák szöveghossza legyen közel azonos, hogy desktopon kiegyensúlyozott maradjon a ritmus.