[Resolved] Navigation – lightweight social icons

[BarnaB]

Hi Tom,

So here is the question of the day 🙂 Found this tutorial and it works great, but how can i make sure the search icon is the last item in the row ? 🙂

Thank you

https://wpress.zone
Tutorials and tips for GeneratePress and Elementor

[Tom]

Hi there,

You would have to hide the default search item:

.main-navigation .search-item {
    display: none;
}

Then add your own custom link in the menu with these settings:

Navigation Label/Link Text: <i class="fa fa-fw fa-search" aria-hidden="true"></i><span class="screen-reader-text">Search</span>

Custom Classes: search-item menu-item-float-right custom-search-item

Then add this CSS:

.main-navigation .search-item.custom-search-item {
    display: block;
}

Then you can order it however you like 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[BarnaB]

awesome ! Thank you 🙂

https://wpress.zone
Tutorials and tips for GeneratePress and Elementor

[Tom]

You’re welcome 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts