CMS Development

Jlawal
Top Contributor

Menu not displaying all items

SOLVE

Hello 🙂

 

I'm having an issue with a menu. There are two different templates in use. The menu isn't displaying all of the options. Below is an image of the menu in settings:

 

settings menu.PNG

 

 

And below are images of how it displays on the different pages.

 

On the article pages:

login page.PNG

 

On the homepage:

mess forms.PNG

 

Any help/advice would be greatly appreciated! 🙂

 

Best,

Jamila

0 Upvotes
2 Accepted solutions
Stephanie-OG
Solution
Key Advisor

Menu not displaying all items

SOLVE

Hi there!

 

That's strange, the menu items don't appear in the HTML either, so they're not hidden. 

 

Have you made sure that you're working on the same menu that appears in the header and that you've published the changes to the menu? Simple, but it wouldn't be the first time something like that happens to me 🙂 

 


Stephanie O'Gay GarciaHubSpot Design / Development

Website | Contact

 

If this helped, please mark it as the solution to your question, thanks!

View solution in original post

Stephanie-OG
Solution
Key Advisor

Menu not displaying all items

SOLVE

I see, I was opening the links in Chrome and they look fine there but have the additional spacing in Firefox since the "Messenger Parent's Evenings" is taking up two lines.

 

In your stylesheet (the "Support_Site_Sub_Nav.css" file in your Design Manager), you'll find this code: 

 

.hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a {
    display: block;
    white-space: nowrap;
}

Firefox is ignoring the "nowrap" so you can add an "!important" to it and it should work:

 

.hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a {
    display: block;
    white-space: nowrap !important;
}

 

nowrap.png

 


Stephanie O'Gay GarciaHubSpot Design / Development

Website | Contact

 

If this helped, please mark it as the solution to your question, thanks!

View solution in original post

6 Replies 6
Stephanie-OG
Solution
Key Advisor

Menu not displaying all items

SOLVE

Hi there!

 

That's strange, the menu items don't appear in the HTML either, so they're not hidden. 

 

Have you made sure that you're working on the same menu that appears in the header and that you've published the changes to the menu? Simple, but it wouldn't be the first time something like that happens to me 🙂 

 


Stephanie O'Gay GarciaHubSpot Design / Development

Website | Contact

 

If this helped, please mark it as the solution to your question, thanks!

Jlawal
Top Contributor

Menu not displaying all items

SOLVE

Wow @Stephanie-OG sorry! I hadn't noticed they were saved as drafts! Dohh!

 

Thank you, they are appearing now, but on they appear differently on each page. Do you know why this may be happening?

 

 

Article:

delete1.PNG

 

 

Article:

delete2.PNG

 

Homepage:

Delete3.PNG

0 Upvotes
Stephanie-OG
Key Advisor

Menu not displaying all items

SOLVE

It happens! 

 

I checked all three pages and they look the same to me: 

 

Screenshot 2018-10-16 10.43.13.pngScreenshot 2018-10-16 10.43.16.pngScreenshot 2018-10-16 10.43.20.png

 

Sometimes updates take a few minutes to propagate after you've published them so that could be it. 

 


Stephanie O'Gay GarciaHubSpot Design / Development

Website | Contact

 

If this helped, please mark it as the solution to your question, thanks!

Jlawal
Top Contributor

Menu not displaying all items

SOLVE

Hi @Stephanie-OG

 

It is displaying nicely on all pages except these article ones:

 

One:

delete1.PNG

 

 

Two:

delete2.PNG

 

 

 

0 Upvotes
Stephanie-OG
Solution
Key Advisor

Menu not displaying all items

SOLVE

I see, I was opening the links in Chrome and they look fine there but have the additional spacing in Firefox since the "Messenger Parent's Evenings" is taking up two lines.

 

In your stylesheet (the "Support_Site_Sub_Nav.css" file in your Design Manager), you'll find this code: 

 

.hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a {
    display: block;
    white-space: nowrap;
}

Firefox is ignoring the "nowrap" so you can add an "!important" to it and it should work:

 

.hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a {
    display: block;
    white-space: nowrap !important;
}

 

nowrap.png

 


Stephanie O'Gay GarciaHubSpot Design / Development

Website | Contact

 

If this helped, please mark it as the solution to your question, thanks!

Jlawal
Top Contributor

Menu not displaying all items

SOLVE

That has worked lovely thank you again @Stephanie-OG Robot wink

 

 

0 Upvotes