Conditional icons in CSS List Menu

Pam Reid asked on October 7, 2019 20:59

We have a site with a menu that was created using the CSS list menu part. We'd like to display a custom icon (lock) next to menu items that require authentication. I realize this would be much easier if the menu was constructed using a repeater or hierarchical viewer, but before we go the route of trying to re-engineer it, I'm wondering if anything can be done in the current list menu structure.

I was thinking we might be able to use a macro to set the CSS prefixes based on whether authentication is required. I can get the macro to recognize the single value for the current page using CurrentPageInfo.RequiresAuthentication, but is there a way to get that value for each menu item as it's iterating?

Any other suggestions?

Thanks, Pam

Recent Answers

David te Kloese answered on October 8, 2019 09:41

Hi,

This would require code change on the Web Part (create your own css list menu) or use a different one.

You could use the Design settings on the page: Image Text

But these won't resolve macro's so would require manual input, but those DO get rendered on the CSS list menu output by default.

Image Text

but those won't get updated automatically..

1 votesVote for this answer Mark as a Correct answer

Pam Reid answered on October 8, 2019 15:56

Hi David,

Thanks very much for the reply. We had talked at one point about possibly using the classes on the navigation tab, but are aiming for an automatic solution that doesn't require staff to manually update those.

If I did clone the css list web part to make a custom one, where is the code that actually generates the code for the menu? I'm looking at the code under CMSWebParts > Navigation > cmslistmenu.ascx.cs, and it only seems to be setting up the properties and not outputting anything. This feels like a dumb question, but we're usually focused mainly on creating our own custom user controls and web parts, so I'm not terribly familiar with trying to clone from and modify existing ones.

0 votesVote for this answer Mark as a Correct answer

David te Kloese answered on October 9, 2019 10:09

From code in theory you could hook onto the menuelem events and loop through the items in its DataSource.

But if you have a changing result with non-technical people managing it I would strongly recommend to use another Web Part.

There is quite some documentation on how to set up menu's:

I'd say use a Universal Viewer with a Hierarchical Transformation. This gives you enough flexibility but still enough control over the output with the use of default Kentico functions.

0 votesVote for this answer Mark as a Correct answer

Pam Reid answered on October 9, 2019 17:46

Hi David,

Yes, I think we've had to concede that converting to a hierarchical viewer is the way to go. We have two menus to convert, and I already did one as a proof of concept - it was thankfully not too time consuming to make the switch.

Thanks for all your help!

-Pam

0 votesVote for this answer Mark as a Correct answer