Get started with Hugobricks today!
Experience the future of web development with Hugo and stackable content bricks. Build lightning-fast static sites with ease and flexibility.
open Mon-Fri from 9-5
The webshop brick is a centred intro above a grid of product cards. The cart lives in the visitor’s browser (in localStorage), so the shop runs on a static site and the checkout mails the order. You can see it in action on the webshop page.
To use this brick you only need the products shortcode:
{{< products >}}
Anything else you write in the section — typically a heading and a short line of text — becomes the centred intro above the grid. The grid lists every product in content/<lang>/products/, ordered by weight — a new product appears by existing. A single product page is the product brick, rendered from the product’s front matter.
You can force the use of this block by writing:
---.webshop
The rest of the shop is settled in data/<lang>/webshop.yaml: the currency, the page links, the shipping options, the custom values (gift wrapping, engraving), the form handler the order is posted to (form_handler) and the Usecue POS account (pos_id) that takes the payment. show_cart_icon puts the cart in the banner and loads the javascript.
The cart, checkout and payment pages each have a brick of their own, picked by what the cart, checkout and usecue-payment shortcodes render.
Experience the future of web development with Hugo and stackable content bricks. Build lightning-fast static sites with ease and flexibility.