nicemacro.twig

{# Define our macro #}
{% macro card(attributes) %}
    {% if attributes.url %}<a href="{{ attributes.url }}">{% endif %}
      <div class="card">
        {% if attributes.img %}<img src="{{ attributes.img }}">{% endif %}
        <h2>{{ attributes.title }}</h2>
        {{ attributes.content }}
      </div>
    {% if attributes.url %}</a>{% endif %}
{% endmacro %}

{# Import the macro, here we use _self but usually it'll be a separate file #}
{% import _self as ui %}

{# Output a detailed card #}
{{ ui.card(
  {
    title: 'Card Title',
    content: 'Hello World',
    img: 'img.jpg',
    url: 'index.html'
  }
) }}

{# Output a simpler card #}
{{ ui.card(
  {
    title: 'Card Title',
    content: 'Hello World'
  }
) }}