Basic Navbar
Navbar is a sticky container for secondary page navigation.
Important Notes:
The title can be turned into a link by passing link attributes.
Demo
Twig
// Set up the navbar items
{% set navbar_items %}
{% include '@bolt-components-navbar/navbar-li.twig' with {
link: {
content: 'Section 1',
attributes: {
href: '#section-1'
}
}
} only %}
{% include '@bolt-components-navbar/navbar-li.twig' with {
link: {
content: 'Section 2',
attributes: {
href: '#section-2'
}
}
} only %}
...
{% endset %}
{% set navbar_list %}
{% include '@bolt-components-navbar/navbar-ul.twig' with {
content: navbar_items,
} only %}
{% endset %}
// Pass the navbar items to the navbar template
{% include '@bolt-components-navbar/navbar.twig' with {
title: {
content: 'This is the navbar title',
icon: {
name: 'marketing-gray'
},
link: {
attributes: {
href: 'https://pega.com'
},
},
},
links: navbar_list
} only %}