Master helper functions, data wrappers, and content manipulation in Quickbutik themes
{{#function}}content{{/function}}
syntax to process and transform dataWrapper | Purpose | Usage |
---|---|---|
{{#img}} | Image manipulation and optimization | {{#img}}{{product.firstimage}}_400x400{{/img}} |
{{#lang}} | Text translation via Control Panel | {{#lang}}My text here{{/lang}} |
{{#assets}} | Link to correct path for specific file | {{#assets}}css/style.css{{/assets}} |
{{#breadcrumbs}} | Output breadcrumbs/category structure | {{#breadcrumbs}} {{url}} {{title}} {{^last}} {{/last}} {{/breadcrumbs}} |
{{#asset_flags}} | Return flag icon for language | {{#asset_flags}}{{id}}{{/asset_flags}} |
{{#img}}
)Size Format | Description | Use Case |
---|---|---|
_100x100 | Square thumbnail | Product grid thumbnails |
_300x200 | Landscape card | Product cards, lists |
_400x400 | Medium square | Product detail thumbnails |
_800x600 | Large landscape | Product detail main image |
_1200x800 | Extra large | Lightbox, zoom functionality |
{{#lang}}
){{#assets}}
){{#breadcrumbs}}
){{#breadcrumbs}}
loop:
Property | Type | Description |
---|---|---|
url | String | Link URL for the breadcrumb item |
title | String | Display text for the breadcrumb item |
last | Boolean | True if this is the last (current) breadcrumb item |
{{#asset_flags}}
){{#img}}
wrapper with appropriate dimensions for optimal performance{{#lang}}
for proper multi-language support{{#assets}}
for all theme files to ensure correct paths across environments