Developer notes
| Item | Value |
|---|---|
| Add-on id | kv_theme_kiosk |
| Theme | kv_kiosk (child of responsive), installed from var/themes_repository/kv_kiosk |
| Built with | Kavio theme kit 1.x (kv-files.json in the theme lists every file with its hash and the kit version) |
| CSS prefix | ks- (theme), kv- (kit) |
design/themes/kv_kiosk/css/kit/{fonts,base,features,addons}.less(kit layer),css/skin/skin.less(Kiosk),styles/data/{Tangerine,Kelly,Bubblegum,Ultramarine}.less(styles).- Block templates:
blocks/products/kv_stage.tpl(colour-picker hero),blocks/products/kv_swatch_cards.tpl(section with the stock grid list),blocks/products/kv_sizes.tpl(sizes to scale),blocks/products/kv_bundle.tpl(bundle builder),blocks/categories/kv_segbar.tpl(segmented category bar), plus the kit’sblocks/menu/kv_mega.tpl,blocks/static_templates/kv_icons.tplandblocks/wrappers/kv_gate.tpl. - Hook files in
templates/addons/kv_theme_kiosk/hooks/:products/product_multicolumns_list.post(swatches, size line, quick add on every grid card; partialpartials/kv_card_x.tpl),products/main_info_title.post(hidden colour/size data for the product page script),products/product_tabs.pre(“Why it works” band),categories/view_description.pre(product count kicker),index/footer.post(texts for the script). Core and add-on templates are not overridden. - Add-on:
Tygh/Addons/KvThemeKiosk/Theme/Kit.php(install, licence gate, admin notice, upgrade refresh, card data),Theme/Demo.php(demo content on activation),License/,Upgrade/Synchronizer.php,js/addons/kv_theme_kiosk/{kit,theme}.js.
Hooks and data
Section titled “Hooks and data”| Hook | Use |
|---|---|
before_dispatch (storefront) |
assigns $kv_theme while the add-on is enabled, the storefront runs kv_kiosk and the licence is active |
gather_additional_products_data_post |
ks: colour swatches (sw: name, colour, variant id, gallery position, list and detail image URLs), colour option id, required option defaults (req), size variants with absolute prices and display heights, size line |
get_product_data_post |
products.view only: ks_nums / ks_feats for the “Why it works” band |
dispatch_before_display, update_addon_status_post |
kit: admin notice, demo content, status |
Every data hook returns at once unless the storefront runs the licensed theme; the data depends on the catalogue only (one options query, two image queries and one feature query per product list, cached per request).
Script (theme.js)
Section titled “Script (theme.js)”- Swatches on cards and the hero swap the image (
data-ks-s/data-ks-b) and the well tint (--bc) in the browser; no request. The product page builds named swatches and a segmented size control from the hidden data and the stock option selects (the selects stay the source of truth; colours without price modifiers switch without the core option request, sizes use it) and moves the stock gallery to the colour’s image. - Quick add posts
checkout.addthrough$.ceAjax(the core adds the security hash) with the picked options. - The bundle builder enables or disables the hidden inputs of each slot; totals of every combination are printed by the template in the store’s price format.
- Kit components:
mbar({ float: true, items }),buyBar()(kept above the floating tab bar),swipeGallery()(re-applied after the core re-renders the gallery),filterSheet(),sizeChips()for the remaining small options.
Full page cache
Section titled “Full page cache”The theme prints nothing visitor-specific into cached markup. Cart counts come from the core cart block (kit.js), the active category pill and tab are set in the browser from the URL, the quick add and the bundle use the visitor’s own cart through standard AJAX requests.
Customising
Section titled “Customising”Use a child theme or the Theme editor’s custom CSS. Upgrades replace only theme files you have not changed. Design
tokens are LESS variables (@kv_*, @ks_*) set by each style file; @ks_hero_mode is flood, split or light.