Korfu sablon beállítási útmutató

Az útmutató segítségével végigvezetjük a Korfu sablon beállításain, ezzel optimalizálva a sablon megjelenésén.

Miért fontos az útmutató?

A sablon váltása egyszerű, hiszen csupán egy gombra kell kattintania. A kattintást követően viszont komplex folyamatok indulnak el a háttérben. Az összetett feladat során rendszerint az alapértelmezett értékek kerülnek helyreállításra, ezzel felülírva az egyedileg fejlesztett beállításokat.

Amennyiben a Korfu sablonra szeretne váltani, akkor feltétlenül olvassa el az alábbiakat mielőtt belekezd a folyamatokba.

 

1. Kategória menü/Szöveges menüpontok a fejlécben

Érdemes maximum 6 fő kategóriát és 2 szöveges menüpontot beállítani annak érdekében, hogy minden nézeten elférjenek egymás mellett a menüpontok.

1.kepjo.PNG

A felső szöveges menüpontok beállítása: Tartalom > Szöveges menüpontok > [Adott szöveges menüpont] szerkesztése > Fejlécben megjelenik opció

 

2. Egyedi lenyíló kategória beállítása

A Korfu sablon bemutató oldalán a “Gluténmentes” menüpontban egy egyedi lenyíló kategória elrendezést használtunk, amely nem csak látványos, de átlátható formába is ölti az alkategóriákat.

image7.png

A beállításához navigáljunk a kategóriánkhoz, majd a lenyíló tartalom menüpontban állítsuk be a képen látható módon a beállításokat.

2.kep.PNG

Ezt követően már csupán a szöveges tartalomban kell átváltanunk a forráskód nézetre és beilleszteni ezt a kódot. 

Miután személyre szabtuk manuálisan a kódot, mentsük el a beállításokat, amelyet követően már büszkélkedhetünk is az egyedi lenyíló kategóriánkkal.

 

3. Kicker Image modul

A sablonnak ez a része teljes szélességű, ezért érdemes akkora képeket használni, amelyek biztosan kitöltik a képernyőt.

Amennyiben Full HD-ra tervezzük a dizájnt, az alábbi számokkal kalkulálhatunk:

2 darab esetén 960px széles

3 darab esetén 640px széles

4 darab esetén 480px széles

5 darab esetén 384px széles

A fenti példában az 1920 pixel szélességű designt (Full HD) osztottuk el a darabszámmal.  Nagyobb felbontás esetén is el kell osztanunk a szélességet a darabszámmal.

Tipp: Érdemes sötétebb képekkel dolgozni, hogy a megjelenés egyezzen a bemutató boltban látottakkal.

Kicker image PSD letöltéséhez kattintson ide.

 

 

4. Hírek modul a kezdőlap pozícióban

A hírek modul a Kicker Image beállításhoz hasonlóan működik. Itt is érdemes beállítani az adminon, hogy hányat szeretnénk egy sorban megjeleníteni.

Amennyiben Full HD-ra tervezzük a dizájnt, az alábbi számokkal kalkulálhatunk:

2 darab esetén 960px széles

3 darab esetén 640px széles

4 darab esetén 480px széles

5 darab esetén 384px széles

Annak érdekében, hogy a képek minősége ne romoljon, a Beállítások > Webshop beállítások > Általános beállítások > Képek fül > Szöveges tartalom > Bevezető kép mérete résznél érdemes lesz a képek száma alapján átírni az értékeket.

A hírek modulban megjelenő tartalmak számát a  Megjelenés > Modulok  > Hírek szerkesztése > Maximálisan megjelenítendő tartalmak száma opciónál tudjuk szabályozni.

3.kep.PNG

 

6. Egy vagy két oszlopos kezdőlap lent pozíció beállítása

A Korfu sablonban a lábléc felé haladva is látványos megoldásokkal találkozhatunk. Ilyen tipikusan a kezdőlap lent pozícióban látható egy vagy két oszlopos elrendezésű tartalmi és feliratkozó modulok.

image1.png

A példán látható elrendezés két oszlopos, egy oszlopos esetén értelemszerűen középre lesz igazítva a választott modul.

Az alábbi képen látható módon állítsuk be mindent, hogy optimálisan jelenjenek meg a modulok.

4.kepjo.PNG

Ahhoz, hogy a bemutató bolt megjelenését reprodukáljuk, érdemes először a Hírek 2 modult választani 1-es, majd a Hírlevél feliratkozás modult 2-es sorrenddel beállítani.

A Hírek 2 modul a következő beállításokkal lesz optimális:

5.kep.PNG

Nem ajánljuk több modul megjelenítését, mivel az lassítani fogja a betöltődést és a megjelenés szempontjából sem lesz optimális.

Beállítási lehetőség: Beállítás > Megjelenés > Téma testreszabás > Sablon beállítások

 

7. Lábléc Kicker Image

A láblécben megjelenő Kicker Image modul alapbeállításként nem jelenik meg a sablon kiválasztását követően.

A Kicker Image modulhoz hasonlóan működik, ahogy a beállítása is azonos.

image6.png

Érdemes beállítani az adminon, hogy hányat szeretnénk egy sorban megjeleníteni.

Amennyiben Full HD-ra tervezzük a dizájnt, az alábbi számokkal kalkulálhatunk:

2 darab esetén 960px széles

3 darab esetén 640px széles

4 darab esetén 480px széles

5 darab esetén 384px széles

A következő linkre kattintva letöltheti a Kicker Image-t .psd formátumban, amelyet már csupán csak személyre kell szabnia: Lábléc kicker image PSB letöltése

Beállítási lehetőség: Megjelenés > Modulok > Lábléc Kicker Image

 

8. Közösségi linkek láblécben

Modernizáltuk a közösségi ikonok elrendezését a láblécben. Javasoljuk, hogy ikont és URL-t töltsenek fel ebbe a részbe.

Beállítási lehetőség: Megjelenés > Modulok > Közösségi linkek a láblécben

 

9. Egyszerűsített mobil termékkártya

A beállítás a mobilos felhasználói élményt növeli.

Amennyiben Igen-re van állítva, mobilon a termékkártyákon csak a termékkép, terméknevek első két sora, ár és akció gombok jelennek meg, attól függetlenül, hogy a modul termékkártya szerkesztőben mit állítottunk be.

Beállítási lehetőség: Megjelenés > Téma testreszabása > Sablon beállítások

 

10. Alkategória képek megjelenítése

A további kategóriák középső pozícióból átkerülnek a bal hasábba a kategória oldalon. Így hamarabb láthat a felhasználó terméket már az adott kategóriában.

Amennyiben Igen-re állítjuk ezt a lehetőséget, meg fog jelenni a kategóriához feltöltött kép is. Érdemes ikon feltöltésében gondolkodni, mivel a javasolt képméret ebben az esetben 30x30 pixel méretű.

Beállítási lehetőség:  Megjelenés > Téma testreszabása > Sablon beállítások

 

11. Akció visszaszámláló

Annak érdekében, hogy a teszt boltban látható módon jelenjen meg a visszaszámláló modul két helyen át kell írni a nyelvi értékeket az adminban.

A  Tartalom > Szövegek szerkesztése menüpontnál keressünk rá a következőre:

“%D:%H:%M:%S”

majd cseréljük a következőre:

<span class="custom-countdown-style"><span class="value">%D</span><span class="value">%H</span><span class="value">%M</span><span class="value">%S</span><span class="label">Nap</span><span class="label">Óra</span><span class="label">Perc</span><span class="label">MP</span></span>

 

További adatok szerkesztéséhez:

boltnev.hu/admin/index.php?route=language/language/editLanguage&lang=hungarian&read=product/productsaletime.php

Általános szavak szerkesztéséhez:

boltnev.hu/admin/index.php?route=language/language/editLanguage&lang=hungarian&read=product/productsaletime.php

 

További dokumentációk sablonváltáshoz: https://support.shoprenter.hu/hc/hu/articles/360019570194-ShopRenter-sablon-v%C3%A1lt%C3%A1shoz-%C3%BAtmutat%C3%B3

 

Van még kérdésed? Kérdés beküldése