Adding Nav Descriptions

[TrevorMuseBytes]

I'm having a difficult time customizing the nav walker to allow descriptions if the item has a description. Any help? Thanks!

[holger1411]

How do you try to archive that?

[TrevorMuseBytes]

Not exactly sure I understand what you're saying, but, I'll tell you what I've done and it'll work - but it's a little back ass.

I have this on line 133 in the understrap nav walker file, in the font awesome area ( I know it wouldn't actually go here, but it's the only place I could get this to work )

if (strlen($item->description)>2) { $item_output .= '<span class="has-description">' . $item->description . '</span>'; }

The issue with this is, it places my description text first and then the nav link text and I'm not sure how to fix that - but as a work around, I give my description the text of the link on my menu manager, and make my link text reflect what I want my description to say. BUT - when a client tries to add a link with description, I'm afraid they are going to find this a little difficult.

[holger1411]

Hm, looks like the right place. Maybe its a CSS issue and/or its easier to change the position of your span element via CSS. Can you post the URL?

[TrevorMuseBytes]

Sure. I'm utilizing the description on the last link only for this particular project. It's not a CSS issue - I think the issue is how I'm only telling it to displaythe description in that function, but not calling out the link text? I'm not sure. I'll link to the originial bootstrap navwalker file I pulled it from - I was trying to see how they achieved it, but you might be able to make more sense of their logic than I can.

Here's my URL: http://mckeownnetwork.musebytes.com/ Here's the bootstrap nav walker project I pulled it from: https://github.com/twittem/wp-bootstrap-navwalker

[holger1411]

Hi! I try to reproduce itby simply adding your code into line 133 of the navwalker file of the UnderStrap Demo site (https://understrap.com/understrap) and add the sample description text "test":

Link at first, description below. Okay, it might need some styling and positioning...but it is where it should be.

Sure it is no styling problem? Can´t test it on your site because you use your custom workaround...

[TrevorMuseBytes]

Was the description part of the link element?

My work around wouldn't influence the positioning of the description. I at one point was able to get the description with in the li element, but it was outside of the link attribute - and for it to work correctly, or as most other themes would utilize it, the description must be part of the link attribute. You want to make sure, no matter if the cursor is on the description of the link - that it all links to it's respective page.

Do this, create a link with a description that doesn't have a drop down and let me know your outcome.

[holger1411]

Check out the last part of line 132: https://github.com/holger1411/understrap/blob/master/inc/bootstrap-wp-navwalker.php#L132 <span class="caret"></span></a>' : '</a>'; This : '</a>'; is what happends if there is no dropdown .... but before the link ends. : {ADD YOUR CODE HERE} '</a>';

[Thomas-A-Reinert]

Closing issue due to inactivity. Feel free to reopen.

[Eagerbob]

Two year old topic, trying to achieve the same: adding the description to the menu items

In the Bootstrap_walker I added

$item_output .= sprintf('<span class="description">%s</span>', esc_html($item->description));

just before $item_output .= $args->link_after;

so my code is now:

// if the item has children add these two attributes to the anchor tag if ( $args->has_children ) { $attributes .= ' class="dropdown-toggle" data-toggle="dropdown"'; } $item_output = $args->before; $item_output .= '<a'. $attributes .'>'; $item_output .= $args->link_before .apply_filters( 'the_title', $object->title, $object->ID ); $item_output .= sprintf('<span class="description">%s</span>', esc_html($item->description)); $item_output .= $args->link_after; // if the item has children add the caret just before closing the anchor tag if ( $args->has_children ) { $item_output .= '<b></b></a>'; } else { $item_output .= '</a>';

I added a description to the links in the dashboard, but I can't get them to output. In the sourcecode I get this:

<a title="shop" href="https://hvb2.local/shop/" class="dropdown-toggle" data-toggle="dropdown"> shop <span class="description"></span> <b></b> </a>

So the span.description gets printed but the description remains empty. What am I doing wrong?

Thanks