Blog, Website & Page Publishing

GWilson73
Participant

Menu child item not displaying in 2nd column

Hi,

On the main menu for this site: https://amicus.com.au the 1st column of the menu has child items that appear on hover.

I wanted to add a child item to one of the links in column 2 (Solutions) but it won't display.

I can see that the items in column 1 are classed differently, but I can't see how to make the same apply to column 2. 

Any ideas would be greatly appreciated.

Thanks

Gary

0 Upvotes
4 Replies 4
Mike_Eastwood
Key Advisor | Gold Partner
Key Advisor | Gold Partner

Menu child item not displaying in 2nd column

Hi @GWilson73 

 

You can select the menu item then "Add Child Item Below".

 

Go to Settings (cog top right) > Website (left menu, down the bottom) > Navigation (sub menu).

 

Click on the menu item you want to add to and click "Add Child Item Below".

 

Here's some more information on Child Menus.

 

Have fun

Mike

 

Here to learn more about HubSpot and share my HubSpot Knowledge. I'm the founder of Webalite a HubSpot Partner Agency based in Wellington, New Zealand and the founder of Portal-iQ the world's first automated HubSpot Portal Audit that helps you work smarter with HubSpot.

 

0 Upvotes
GWilson73
Participant

Menu child item not displaying in 2nd column

Thanks for your response but this menu and header is set up as a module, unfortunately. It doesn't use the standard navigation settings. 

GWilson73_0-1695699085504.png

Above is the module global.
Here is the HTML which may or may not help:

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<div class="navbar">
<div class="navbar__container">
<div class="navbar__row">
<div class="navbar__col navbar__col_logo">
<a href="/" class="navbar__logoLink">{% if module.logo.src %}<img class="navbar__logo" src="{{ module.logo.src }}"
alt="{{ module.logo.alt }}">{% endif %}</a>
</div>
<nav class="navbar__col navbar__col_menu">
<ul class="navbar__menu">
{% for item in module.nav_items %}
<li class="navbar__menuItem">
<a class="navbar__menuLink{% if item.type == 'dropdown' %} navbar__menuLink_dropdown{% endif %}"
{% if item.type == 'dropdown' %}
href="javascript&colon;void(0);"
{% else %}
{% set href = item.link.url.href %}
{% if item.link.url.type is equalto "EMAIL_ADDRESS" %}
{% set href = "mailto:" + href %}
{% endif %}
href="{{ href }}"
{% if item.link.open_in_new_tab %}target="_blank"{% endif %}
{% if item.link.no_follow %}rel="nofollow"{% endif %}
{% endif %}
>{{ item.text }}</a>
{% if item.type == 'dropdown' %}
<ul class="navbar__menuDropdown">
{% for item2 in item.dropdown_items %}
<li class="navbar__menuDropdownItem {% if item2.type_copy == 'dropdown' %} has-child{% endif %}">
{% set href = item2.link.url.href %}
<a class="navbar__menuLink {% if item2.type_copy == 'dropdown' %} submenu-2{% endif %}"
href="{{ href }}"
{% if item2.link.open_in_new_tab %}target="_blank"{% endif %}>
{% if item2.icon.src %}
<img src="{{ item2.icon.src }}" alt="{{ item2.icon.alt }}" class="navbar__menuDropdownIcon">
{% endif %}
{{ item2.text }}
</a>
<a href="javascript&colon;void(0);" class="dropdown-box"><i class="fa fa-angle-down" aria-hidden="true"></i></a>
{% if item2.type_copy == 'dropdown' %}
<ul class="submenu-dropdown-2">
{% for item3 in item2.dropdown_items_copy %}
<li class="navbar__menuDropdownItem">
{% set href = item3.link.url.href %}
{% if item3.link.url.type is equalto "EMAIL_ADDRESS" %}
{% set href = "mailto:" + href %}
{% endif %}
<a href="{{ href }}"
class="navbar__menuDropdownLink"
{% if item3.link.open_in_new_tab %}target="_blank"{% endif %}
{% if item3.link.no_follow %}rel="nofollow"{% endif %}
>
{{ item3.text }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %}

{% for item in module.cta_items %}
<li class="navbar__menuItem navbar__menuItem_mobile">
{% set href = item.link.url.href %}
{% if item.link.url.type is equalto "EMAIL_ADDRESS" %}
{% set href = "mailto:" + href %}
{% endif %}
<a href="{{ href }}"
class="navbar__cta"
{% if item.link.open_in_new_tab %}target="_blank"{% endif %}
{% if item.link.no_follow %}rel="nofollow"{% endif %}
>
{% if item.icon.src %}
<img src="{{ item.icon.src }}"
alt="{{ item.icon.alt }}"
class="navbar__ctaIcon">
{% endif %}
{{ item.text }}
</a>
</li>
{% endfor %}
</ul>
</nav>
<div class="navbar__col navbar__col_cta">
<div class="navbar__ctas">
{% for item in module.cta_items %}
{% set href = item.link.url.href %}
{% if item.link.url.type is equalto "EMAIL_ADDRESS" %}
{% set href = "mailto:" + href %}
{% endif %}
<a href="{{ href }}"
class="navbar__cta"
{% if item.link.open_in_new_tab %}target="_blank"{% endif %}
{% if item.link.no_follow %}rel="nofollow"{% endif %}
>
{% if item.icon.src %}
<img src="{{ item.icon.src }}"
alt="{{ item.icon.alt }}"
class="navbar__ctaIcon">
{% endif %}
{{ item.text }}
</a>
{% endfor %}
</div>
</div>
<div class="navbar__hamburger"></div>
</div>
</div>
</div>

 

0 Upvotes
Mike_Eastwood
Key Advisor | Gold Partner
Key Advisor | Gold Partner

Menu child item not displaying in 2nd column

Oh, thanks for the clarification @GWilson73 

 

If you purchased a theme I would contact the developer.

 

Depending on how comfortable you are with code you could add a new menu module, but it's likely the CSS will be set to the the format of your current menu (which may differ to your new module).

 

Or, you could edit the module code based on the HubL Menu Tags (even more geeky). If you are going to fiddle with the code I would Clone your Module first so you don't accidentally break the original.

 

Have fun

Mike

 

p.s. Get in touch if this is outside your comfort zone.

 

Here to learn more about HubSpot and share my HubSpot Knowledge. I'm the founder of Webalite a HubSpot Partner Agency based in Wellington, New Zealand and the founder of Portal-iQ the world's first automated HubSpot Portal Audit that helps you work smarter with HubSpot.

 

GWilson73
Participant

Menu child item not displaying in 2nd column

Thanks Mike, I have been staring at the HTML and the menu tags, to see what is different between the 1st 3 that appear under Spaces and the rest of them, but apart from being identified as having a child, in the div class, I can't see anything else. This would make sense if you could add a child to another one and it would display, but it doesn't ha! If, for example I add a new item as a child to Hospitality in the 1st column it doesn't show up, but there is nothing I can see that determines what differentiates the first 3 items in that column (part from having child items - but as I said above, adding child items elsewhere has no bearig).

So frustrating. I would reach out to the original developer but they have gone awol, so I am figuring these little things out as I go now. I have CSS / coding experience but it is basic so it is when these gremlins appear that I start to have issues.

Thanks for your help thus far though, much appreciated. 

0 Upvotes