Bootstrap 5 Walker for Sage 10

Hey everyone, I put together a Walker that extends Soil and adds Bootstrap 5 css classes to the Soil Walker in a Sage 10 project. It seems to be working pretty well so far so I wanted to share it here incase it is of use to others.

It’s a pretty simple class, with just 3 methods. I was originally using a convoluted method of if/else statements and str_replace() to add the required classes and attributes to the anchor links but eventually came across a much simpler method by @QWp6t that filters nav_menu_link_attributes in order to add the required attributes. A slightly modified version seems to work great for this walker, and all credit to QWp6t for that nice method. See the credit link in the linkAttributes doc block for more info.

Everything is in the gist, but the short of it is:

  • Assumes you’re using Sage 10.
  • Assumes the Roots/Soil plugin is installed and activated.
  • Assumes Tailwind has been removed from the Sage project and Bootstrap 5 has been added.

To use, just add the walker class to the /app directory and call the walker as shown in header.blade.php.

FWIW, I’ve been out of work for the past 2.5 almost 3 years while recovering from an illness. I haven’t built any sites or written much code in that time so apologies if this is not helpful or too rough around the edges. I feel like I’ve forgotten a lot of the little bit I did know so I’m trying to get back into things by working on some of my personal sites. One of the first things I wanted to do was to get this walker together for Sage 10 and Bootstrap 5 and since it seems to be working I figured I’d share it here.

Note, the walker is limited to 1 level of dropdowns and will probably stay that way. Please feel free to suggest any improvements though, and I’ll do my best!

4 Likes

It’s nice to see you again @smutek! I’m sorry to hear about you being ill.

Thank you for sharing this! It looks good and is absolutely helpful.

2 Likes