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 %}

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

                {{ 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>
                <ul class="list footer-group__list">
                    {% for footerLink in footerGroup.links %}
                        <li class="list__item footer-group__item">
                            <a 
                                class="link link_secondary footer-group__link"
                                href="{{ footerLink.url }}"
                                title="{{ footerLink.title }}"
                                {% if footerLink.isPopup %}
                                    target="_blank"
                                    rel="noopener"
                                {% endif %}
                            >
                                {{ footerLink.title }}
                            </a>
                        </li>
                    {% endfor %}
                </ul>
            </h-accordion-content>
        </h-accordion-group>
    </div>
{% endmacro %}

Webcomponents reference