View All Components

Component: Custom Links

Features:

  1. attractive style

Notes:

  1. derive file name field--paragraph--custom-links-repeater.html.twig using /admin/config/development/settings

Watch Short Video

Links

paragraph--custom-links.html.twig

 

{% set url = content.field_custom_links.0['#url'] %}
{% set title = content.field_custom_links.0['#title'] %}

{% block paragraph %}
{% block content %}
<li class="nav-item"><a href="{{ url }}" class="nav-link">{{ title }}</a><li>
{% endblock %}
{% endblock paragraph %}

field--paragraph--custom-links-repeater.html.twig

 

<h2>Links</h2>
<ul class="nav nav-list flex-column mb-5">
{% for item in items %}
{{ item.content }}
{% endfor %}
</ul>