How to customize navbar

[Carolyn Sullivan]

Hello,

I'd like to add an additional tab to this section:

When I inspect it with browser tools, I see that it's labelled as ds-navbar-section, so I took a look at the code in /opt/dspace-frontend-7/src/app/navbar.component.html and /opt/dspace-frontend-7/src/app/navbar-section/navbar-section.component.html .  These just seem to define the structure for these sections though (wrappers?)... Where and how do I ask it for a fourth tab?

[DSpace Community]

Hi Carolyn,

As this question has become a "frequently asked question" regarding updating themes, I've added an example of adding a new link to the navigation bar in our docs at https://wiki.lyrasis.org/display/DSDOC7x/User+Interface+Customization#UserInterfaceCustomization-CustomizeNavigationLinksinHeader 

This is just a basic example which shows how to use simple HTML to add a new link to that navigation bar.

Tim

[Carolyn Sullivan]

Thank you so much Tim for adding this documentation!

A follow-up question:  I'd like to have an extra drop-down link in the navbar.  Bootstrap allows a dropdown on click (https://getbootstrap.com/docs/4.0/components/dropdowns/), but it's necessary to add 'popper.min.js before Bootstrap’s JavaScript or use bootstrap.bundle.min.js / bootstrap.bundle.js' to enable this functionality. I'd prefer to have the dropdown on hover, but that requires Jquery, I think.  Where do I place the popper.min.js file?  Someone asked a similar question a couple years ago: https://stackoverflow.com/questions/68798201/where-to-put-custom-css-and-javascript-in-dspace-7-0

Thank you so much for your time and assistance,

Carolyn.