Skip to content

footer_group

The footer_group macro is used to render a single group of footer links.

Definition

{% footer_group(footerGroup) %}

Input parameters

footerGroup

FooterGroup FooterGroup object representing the group to render.

Example

{% from "@macros/footer_group.twig" import footer_group %}

{% set group_id = 1 %}

{% set footerGroup = ObjectApi.getFooterGroup(group_id) %}

{{ footer_group(footerGroup) }}

Macro source code

{% macro footer_group(footerGroup) %}
    {% from "@macros/icon.twig" import icon %}

    {% set footerLinks %}
        <ul class="list footer-group__list">
            {% for footerLink in footerGroup.links %}
                <li class="list__item footer-group__item">
                    <a 
                        class="link link_secondary link_no-underline footer-group__link"
                        href="{{ footerLink.url }}"
                        title="{{ footerLink.title }}"
                        {% if footerLink.isPopup %}
                            target="_blank"
                            rel="noopener"
                        {% endif %}
                    >
                        {{ footerLink.title }}
                    </a>
                </li>
            {% endfor %}
        </ul>
    {% endset %}

    <div class="footer-group visible-xs-only">
        <h-accordion-group opened>
            <h-accordion-toggler class="accordion__toggler">
                <h3 class="overline footer-group__title">{{ footerGroup.name }}</h3>

                {{ icon('icon-chevron-down', {
                    size: 'l',
                    classNames: [
                        'accordion__toggler-icon',
                        'hidden-sm-only',
                        'hidden-md-only',
                        'hidden-lg-only',
                        'hidden-xl-only',
                        'hidden-xxl-only',
                        'hidden-xxxl-only'
                    ]
                }) }}
            </h-accordion-toggler>

            <h-accordion-content>
                {{ footerLinks }}
            </h-accordion-content>
        </h-accordion-group>
    </div>

    <div class="footer-group hidden-xs-only">
        <h3 class="overline footer-group__title">{{ footerGroup.name }}</h3> 
        {{ footerLinks }}
    </div>
{% endmacro %}

Webcomponents reference