CssClass on MenuItem

Bradley Pursglove

Vote:

Hi,

I'm currently extending the navigation UI to include a new menu item, much like example 2 here: https://docs.developers.optimizely.com/content-cloud/v12.0.0-content-cloud/docs/adding-and-configuring-menu-items

I'm setting the CssClass property on MenuItem with the aim of having this new menu item styled differently to the others, however this property doesn't appear to have any effect, i.e. the class is not applied when I inspect element once loaded.

Is this the correct way to set a CSS class on a new menu item? Is this perhaps getting overwritten at some point further down the pipeline, before it's then rendered?

        public IEnumerable<MenuItem> GetMenuItems()
        {
            var menuItems = new List<MenuItem>
            {
                new UrlMenuItem("menuItemText", $"{MenuPaths.Global}/cms/menuItem", string.Empty)
                {
                    SortIndex = int.MaxValue,
                    CssClass = "menuItemClass",                 
                }
            };

            return menuItems;
        }

Any advice is much appreciated, thanks,

Bradley

#282780

Edited, Jun 30, 2022 9:24

Surjit Bharath

Vote:

Hey Bradley,

I tried giving CssClass a go and I couldn't get it working either. Inspecting the assembly its not exactly clear if the CssClass is even taken into account when its rendering to the output response.

I did also try the [MenuItem] attribute since I saw in the asssemblies there is a CssClass += attribute.CssClass so you might have more luck doing it that way as apose to implementing the [MenuProvider].

However I couldn't add to the menu using the [MenuItem] working. User error or a bug, not sure atm. My suggestion is to give the attribute a go and see if the CssClass works that way.

#282827

Jul 01, 2022 7:48