Nastavenia a šablóny
Konfigurácia widgetu je uložená na serveri a widget si ju vyzdvihne pri štarte. Zmena sa prejaví bez zásahu do kódu e-shopu a bez nasadzovania.
Režim zobrazenia
| režim | správanie |
|---|---|
dropdown | panel sa rozbalí pod vyhľadávacím poľom e-shopu; pole zostáva jediným inputom |
modal | výsledky sa otvoria cez celú obrazovku, panel má vlastné vyhľadávacie pole |
Na mobilných zariadeniach sa dropdown správa ako bottom sheet pripnutý k spodnej hrane obrazovky: vyhľadávacie pole zostáva na mieste a posúva sa iba obsah panelu.
Šablóny
Šablóna je vždy dvojica layout + téma, napríklad standard-soft.
Layout určuje funkcie panelu a jeho usporiadanie:
| layout | pre koho | čo obsahuje |
|---|---|---|
| Mini | úzke pole, obmedzený priestor | kompaktný zoznam produktov, kategórie ako pills |
| Standard | bežný e-shop | obrázok, názov a cena, prepínač list/grid, tlačidlo na zobrazenie ďalších výsledkov |
| Pro | plnohodnotná výsledková plocha | filtre (cena, kategórie, facety), radenie, stránkovanie, kód produktu na karte |
| Max | Standard aj Pro v jednom widgete | zákazník prepína medzi rýchlym a rozšíreným vyhľadávaním |
Téma definuje výhradne vzhľad — farby, typografiu a odsadenie. Univerzálne témy sú Soft (značková, s akcentom Metty) a Flat (plochá a striedma). Pre e-shop s vlastným dizajnom vieme pripraviť tému na mieru, ktorá prevezme jeho farby a typografiu.
Layout a téma sú nezávislé, takže Standard Soft a Standard Flat sa správajú rovnako a líšia sa iba vizuálne.
Max — rýchle aj rozšírené hľadanie
Max je jeden widget, ktorý pokrýva dropdown pod vyhľadávacím poľom aj kompletnú výsledkovú stránku:
- otvára sa v rýchlom (Standard) zobrazení so zoznamom produktov a kategórií,
- prepínač „Rozšírené hľadanie“ aktivuje Pro zobrazenie s filtrami, facetmi z katalógu, radením a stránkovaním,
- prepínač „Späť na rýchle hľadanie“ vráti pôvodné zobrazenie, pričom dotaz aj filtre zostávajú zachované.
E-shop tak nepotrebuje vlastnú výsledkovú stránku.
Počty výsledkov
Počet produktov, kategórií a návrhov, ktoré si widget vyžiada, určuje layout; nejde o nastavenie na úrovni e-shopu. Mini a Standard zobrazujú kompaktný výber, Pro pracuje so širokým výberom a stránkuje ho priamo v prehliadači.
V Pro zobrazení sú nastaviteľné tieto hodnoty:
| nastavenie | default | význam |
|---|---|---|
| stránkovanie | zapnuté | pri vypnutí sa zobrazí iba prvá strana |
| veľkosť strany | 15 | počet produktov na jednej strane |
| počet produktov na mobile | 5 | mobilné zobrazenie používa kratší zoznam |
Vzhľad
Nad rámec zvolenej témy je možné pre e-shop prepísať tieto hodnoty:
| nastavenie | rozsah |
|---|---|
| akcentová farba, jej silnejší a jemný odtieň | hex #rrggbb |
| farba plochy, textu a tlmeného textu | hex #rrggbb |
| font | názov rodiny; widget ho nesťahuje, musí byť dostupný na stránke alebo v systéme |
| veľkosť písma | 12–20 px |
| výška riadku | 1,0–2,0 |
| zaoblenie | 0–48 px |
| odsadenie panelu | 0–48 px |
| kód produktu na karte | zapnuté / vypnuté |
| stav skladu na karte | zapnuté / vypnuté |
Vo väčšine prípadov postačí prevziať akcentovú farbu a font z webu. Farba zvýraznenia zhody sa dopočíta z akcentovej farby tak, aby zostal zachovaný dostatočný kontrast.
Overenie zmeny pred nasadením
Pred nasadením vieme pripraviť náhľad: odkaz na preview.metty.eu, kde je widget s konkrétnou konfiguráciou umiestnený na screenshote vášho webu. Výsledok tak viete posúdiť bez akéhokoľvek zásahu do produkčného e-shopu.