Szekér HTML Sablonok
A bevásárlókosárnak egyértelmű kapcsolatban kell tartania az egyes termékeket a darabszámukkal, árukkal és törlési gombjaikkal, miközben a rendelés végösszegét is jól láthatóvá teszi. Ezek a HTML-sablonok újrafelhasználható kódszerkezetet adnak ehhez a tranzakciós elrendezéshez.
További HTML Sablonok a(z) Eladás kategóriából
Other Eladás HTML Sablonok
Kész kosár HTML-sablonok e-kereskedelmi projektekhez
A kosár HTML-sablon komplett kosároldalt biztosít webáruházához, jól strukturált és azonnal szerkeszthető forráskódban. Minden termék külön sorban kap helyet darabszám-módosítóval és eltávolítási hivatkozással. A rendelési összesítő és a fizetés gomb szintén készen áll. Ezek a sablonok kiválóan használhatók kisebb webshopokhoz, kattintható ügyfélprototípusokhoz vagy nagyobb áruházak front-end felületeihez.
Ismétlődő tételek és különálló összegzés
Amikor egy sablon a teljes kosároldalt lefedi, a kód általában az alábbi részekre tagozódik:
- Egyetlen egyszer megírt, majd minden terméknél megismételt tételsor, amelyben jut hely a képnek, a névnek és az olyan opcióknak, mint a méret.
- Különálló rendelési összesítő, ahol a részösszeg és a végösszeg sorai közvetlenül a fizetés gomb felett helyezkednek el.
- Sorok kuponkódokhoz, szállításhoz vagy adókhoz, amelyeket egyes sablonok eleve tartalmaznak, mások pedig lehetőséget hagynak a manuális beillesztésre.
- Üres kosár állapot rövid üzenettel és a vásárlás folytatására mutató hivatkozással.
A Nicepage segítségével készülő projektekhez az E-kereskedelem HTML-ben útmutató bemutatja, hogyan exportálható egy webáruház HTML formátumban úgy, hogy a termékeket a Közzététel és exportálás ablakon keresztül fűzzük hozzá.
A hibátlan bemutatókon túl
A bemutató kosarak általában csupán két rövid terméknevet és egy áttekinthető végösszeget vonultatnak fel, ezért a valósághűbb helyzetek mutatják meg igazán a kosár HTML-sablonok felépítését:
- A hosszú terméknévvel és két kiválasztott tulajdonsággal rendelkező árunak dedikált helyre van szüksége a tételsoron belül.
- Az akciós termékeknél elengedhetetlen, hogy az eredeti és a kedvezményes ár is esztétikusan elférjen a tételen belül.
- Mobilon a vízszintes sor függőleges elrendezéssé alakul át, így a kód elemeinek sorrendje határozza meg, mit olvas el a vásárló először.
- Kulcsfontosságú részlet az összesítő elhelyezése. Ha a terméklista belsejébe van beágyazva, a kezdeti nézetben jól mutathat, amíg egy negyedik hozzáadott termék váratlanul a végösszegek alá nem kerül.
A prototípustól a működő webáruházig
Mivel a tételsor és az összesítő teljesen függetlenek egymástól, a sablon élő áruházhoz igazítása nagyrészt másolásból és cseréből áll. A fejlesztő könnyedén beillesztheti a valódi termékeket, átállíthatja a pénznemet vagy ajándéküzenet-mezőt adhat hozzá anélkül, hogy a struktúra többi részét módosítaná.
A tervező először mintaadatokkal feltöltött kosarat mutathat az ügyfélnek. Később a fejlesztő összeköti a gombokat a fizetési rendszerrel, és feltölti a fájlokat a tárhelyre. A gyűjteményben található akciós és kuponsávok szintén beemelhetők a projektbe az időszakos kampányokhoz.
Azok a kosár HTML-sablonok teszik ezt gördülékennyé, amelyek tisztán ismétlik a termékblokkot, és elkülönítve tartják az összegzést. Kódszerkezetük mobiltelefonon is logikus olvasási sorrendet követ, így a mockup és az éles indulás között semmit sem szükséges alapjaitól újraépíteni.