Menu Close

Get Support From ShopWired Close

All Systems Operational

Subscribe To Updates
Prefer To Live Chat? Chat directly with ShopWired support Quickest response time

Prefer To Phone?

Call us on 0330 111 2024 (free from landlines and mobiles)

Available 9.30am to 5.30pm Monday to Friday

Send A Message
Response within 24 hours

Menu Close



HTML macros are used to create a shorthand way of rendering HTML content. They help keep your code clean and tidy and easy to maintain.

HTML macros are defined in the html.twig view.

For example,

{{ html.input('quantity[' ~ ~ ']', item.quantity) }}


<input type="text" name="quantity[52577]" value="1">

On the checkout/basket page when used to allow the user to change the quantity of an item they have in their basket.

The macro is defined in html.twig as follows:

{% macro input(name, value, class, placeholder, type, extra) %}
    <input type="{{ type|default('text') }}"{% if name %} name="{{ name }}"{% endif %}{% if value %} value="{{ value }}"{% endif %}{% if class %} class="{{ class }}"{% endif %}{% if placeholder %} placeholder="{{ placeholder }}"{% endif %}{% if extra %} {{ extra|raw }}{% endif %}>
{% endmacro %}

You can read more about macros here.

Theme macros

Theme macros are contained in the theme.twig view.

Like HTML macros, they create a shorthand way to include platform theme elements on another view.

For example, instead of using the full code to render a link list, i.e.

{% if global.theme.settings.list_footer.title %}
        {{ link_list.title }}
{% endif %}
<ul class="{{ class }}">
    {% for link in global.theme.settings.list_footer.links %}
            <a href="{{ link.url }}">
                {{ link.title }}
    {% endfor %}

a macro is defined in theme.twig that allows you to use the expression below instead.

{{ theme.link_list('footer') }}