Vozík HTML Šablony

Hotové HTML šablony košíku pro e-commerce projekty

HTML šablona košíku poskytuje hotovou stránku nákupního košíku pro internetový obchod, vytvořenou ve strukturovaném kódu připraveném k otevření a úpravám. Každý produkt se nachází ve vlastním řádku s volbou počtu kusů a odkazem pro odstranění. Souhrn objednávky a tlačítko přechodu k pokladně jsou rovněž připraveny. Tyto šablony se používají pro menší obchody, klikatelné prototypy pro klienty nebo jako front-end rozsáhlejších e-shopů.

Opakující se položky a oddělený souhrn

Pokud šablona pokrývá celý nákupní košík, její struktura kódu se obvykle dělí na tyto části:

1. Blok položky vytvořený jednou a opakovaný pro každý produkt, s prostorem pro obrázek, název i varianty, jako je velikost.
2. Souhrn objednávky v samostatné sekci, kde jsou řádky mezisoučtu a celkové částky umístěny nad tlačítkem pokladny.
3. Řádky pro slevový kód, dopravu či daň, které jsou v některých šablonách přímo zahrnuty a v jiných ponechány k doplnění dle potřeby.
4. Zobrazení prázdného košíku s krátkým sdělením a odkazem zpět do obchodu.

U projektů vytvořených v Nicepage vysvětluje návod E-Commerce v HTML, jak lze e-shop exportovat jako HTML stránky včetně produktů přidaných prostřednictvím dialogového okna Publikovat a exportovat.

Za hranicemi uhlazených ukázek

Ukázkové košíky obvykle obsahují pouze dva produkty s krátkým názvem a úhledný součet; skutečnou kvalitu HTML šablony košíku proto prověří složitější situace z praxe:

1. Produkt s dlouhým názvem a dvěma volbami potřebuje v bloku položky vyhrazené místo pro každý z těchto detailů.
2. Zlevněný produkt vyžaduje uvnitř své sekce prostor pro zobrazení původní i akční ceny.
3. Na mobilním telefonu se řádek poskládá svisle a pořadí prvků v kódu určuje, jaké informace nakupující uvidí jako první.
4. Zásadním detailem je umístění souhrnu. Pokud je vložen přímo uvnitř seznamu položek, vypadá dobře jen do chvíle, než se čtvrtý přidaný produkt ocitne až pod celkovými částkami.

Od prototypu k fungujícímu obchodu

Vzhledem k tomu, že blok položky i souhrn fungují nezávisle, spočívá úprava šablony pro živý obchod převážně v kopírování a nahrazování. Vývojář může vložit reálné produkty, změnit měnu nebo přidat pole pro vzkaz k dárku bez zásahu do zbytku rozvržení.

Designér může klientovi nejprve ukázat košík naplněný ukázkovými položkami. Později vývojář propojí tlačítka s platební bránou a nahraje soubory na hosting. Prodejní a kupónové sekce z této kolekce lze navíc snadno začlenit do stejného projektu pro sezónní kampaně.

HTML šablony košíku, které tento přechod usnadňují, čistě replikují blok položky a drží souhrn oddělený. Jejich kód se na telefonu navíc čte ve smysluplném pořadí, takže mezi fází mockupu a spuštěním projektu není třeba nic stavět znovu.