Ebben a menüpontban meghatározhatod, hogy a webáruház különböző oldalai – például a Termék részletek vagy a Termék lista oldal – milyen elrendezésben jelenjenek meg. Az elérhető elrendezések közül egyszerűen, néhány kattintással kiválaszthatod a számodra legmegfelelőbbet. A módosításokat ezt követően azonnal ellenőrizheted a webáruházban is.
Sablonszerkesztő
Itt az oldalkinézetek menüben választhatod ki az egyes oldalrészekhez tartozó előre elkészített elrendezéseket. Választhatsz többféle listanézetből, többféle termékoldal típusból.
Triton Oberon sablonok esetén az új admin felületet használók a tartalmi elemeket is átrendezhetik az új sablonszerkesztő funkciónak köszönhetően. Fogd és vidd módszerrel szabadon átrendezheted a főoldal tartalmait, a termékkártyák elemeit vagy akár teljesen egyedi felépítésű termékoldalakat is létrehozhatsz – technikai tudás nélkül.
Ez különösen azért hasznos, mert nincs két egyforma webshop: van ahol a képek, máshol a leírások, a paraméterek vagy éppen a kapcsolódó termékek a fontosabbak.
Ezen sabloncsaládok esetén a tartalom típusoknál, ahol szerkesztheted az elrendezést, találsz egy Szerkeszt gombot, amivel eljuthatsz az új felületre.
Nézzük melyek azok az oldalak, amiket egyszerűen egyedivé varázsolhatsz:
Start oldal
Ha a Start oldalt szeretnéd átvariálni, módosítani, az adott szekciónál kattints a Szerkeszt gombra, ezzel behívod a sablonszerkesztőt.
Itt több elemet fogsz látni egymás alatt, abban a sorrendben, ahogy előzetesen megterveztük. Bal oldalon látsz egy nem használt blokkok részt, ami első körben üres, hiszen alapból minden elérhető elem megjelenik a webshopodban. Ha nem szeretnéd valamelyik tartalom típust használni, egyszerűen húzd ki a nem használtak közé, a megmaradóknál pedig állítsd be az általad kívánt sorrendet. A Ment gombbal piszkozatként fogod menteni az elrendezést, ha pedig élesíteni szeretnéd, a bal felső sarokban található kapcsoló segítségével teheted meg.
Fontos!
Az elhelyezett szekciók közötti távolságokat az eredeti sorrend alapján állítottuk be ideálisra. Előfordulhat azonban, hogy az átrendezés következtében túl nagynak vagy túl kevésnek ítéled meg a távolságokat bizonyos elemek között. Ha ezt szeretnéd optimalizálni akkor a Beállítások / Kinézet, Arculat / Kinézet testreszabása menüben, az egyes elemeknél a Függőleges irányú belső eltartás beállítással tudod módosítani.
Termék lista oldal
Igény esetén a termékkártyákat is van lehetőséged átrendezni. A kártya felső részében mindig a termékfotó helyezkedik el, de igény esetén a kép fölé is rakhatsz elemeket. Külön szerkesztheted a kép alatti részt illetve a kártya alsó részét, ami mindig az aljához igazodik. Ahogy az alap elrendezésből látható, rakhatsz a kártyára értékelést, cikkszámot, paramétereket, raktár kijelzést, de ezeket akár el is hagyhatod, ha egyszerűbb megjelenést szeretnél.
Termék részletek oldal
Alapból itt is kétféle termékoldal elrendezés készült. A 2-es verzió hasonlóan a blokkok átrendezésére ad lehetőséget, kötött struktúra mellett. Azonban az 1-es verzió teljesen szabadon szerkeszthető, innentől tényleg a te kezedben van az irányítás, hogy a termékoldaladdal is maximalizáld a konverziót. Mindent úgy alakíthatsz, hogy a rendelkezésre álló tartalmaid, termékinformációid a lehető legjobb elrendezést kapják.
1-es oldaltípus / teljesen egyedi termék oldal:
A bal felső sarokban egy fontos elemet helyeztünk el, ez pedig a töréspont kiválasztása. Mivel minden választható sablonunk 100%-ban reszponzív, igazodik a különböző képernyőméretekhez. A sablonok 2 aktív töréspontot használnak, az alapértelmezett vonatkozik kisebb kijelzőkre, mobilokra, a másik 992px kijelző szélesség feletti tartományt jelöli, ami jellemzően az asztali monitorokat jelenti. A legördülő menüben azonban 8 töréspont található arra az esetre, ha ezek megjelenését külön-külön szeretnéd optimalizálni. Ha egy nem aktívat választasz ki, akkor a szerkesztéshez először aktiválnod kell.
Fontos!
Javasoljuk, hogy új töréspontokat csak akkor aktiválj, ha teljesen átlátod a szerkesztő valamint a reszponzivitás működését.
Alapértelmezetten az LG (large, azaz nagy) töréspont van kiválasztva, ami 992px felett látható. A jobb oldali részben vizualizáljuk a termékoldal struktúráját, benne konténerekkel és blokkokkal. Hogyan is működik ez? Képzelj el egy 12 részre osztott rácsszerkezetet. Egy konténer esetén ebben a 12-es kiosztásban gondolkozhatsz. Ahogy látod, alapból felül egy teljes szélességű konténer helyezkedik el, ami ezek alapján 12/12 szélességű, alatta pedig 2 db 6/12 kiosztású oszlopra bomlik az oldal. Utána pedig ismét egy teljes szélességű következik. Ezekbe helyeztük el a blokkokat, amiket a fent már megismert módszerrel rendezhetsz vagy helyezhetsz át másik konténerbe.
Ennél a típusnál a konténereket szabadon törölheted, létrehozhatsz újakat vagy megváltoztathatod a kiosztásukat. Ha kitörölsz egy konténert, akkor a benne található blokkok kikerülnek a nem használtak közé, ahonnan majd újra behúzhatod őket valamelyik új blokkba. A konténerek jobb felső sarkában látod a kiosztást, ha tehát úgy gondolod, hogy még nagyobb kijelző méreteken (pl. 1240px felett) 3 oszlopos verzióban gondolkodsz, akkor 3 db 4/12-es konténert kell elhelyezned. Értelemszerűen ezeknek nem kell egyformáknak sem lenniük, de akkor fognak egy sorba kerülni, ha kiosztás összege 12 lesz. Így váltakozva, dinamikusan alakíthatod ki a termékoldalt.
Felugró gyors nézet
A termék kártyákon elhelyezkedik egy gomb amivel felugró ablakban gyors nézetet lehet megjeleníteni a termék adatokról, anélkül hogy a termék adatlapra navigálna a látogató. Ezzel ezt tudod igény esetén testreszabni.