Make Nav item into placeholder Geometric theme

RapidWeaver Classic Themes
1

I have an site built in Elixir’s Geometric theme but have recently noticed something I previously missed regarding the sub menu items on mobile devices.

The theme is designed so that on desktops the sub nav menu appears not as a drop down but as a row of items underneath the top level menu. On mobiles, logically enough, it is a dropdown.

The problem on mobiles is that sub menu items are not immediately visible. Clicking on the top level nav item takes you to that page but does not show you the sub-menu items unless you go back to the menu. It is a scenario where you really need the top level nav to be a placeholder - if only in mobile view.

I have used Marathia’s no-link stack to achieve elsewhere this but it is designed for drop down menus, not menu and has no effect here.

Any ideas? You can see the site here; https://communitycounsellortraining.co.uk I have added a + sign to nav items with a drop down.

2

That looks like it’s either a “feature” of a" bug" in the theme.

The CSS that’s built into the theme is setting display to none for both the primary menu (gets replaced with the hamburger) and the secondary menu (no replacement).

@media only screen and (max-width: 768px)
nav#main_navigation, nav#secondary_navigation {
    display: none;
}

You could try adding this custom CSS:

@media only screen and (max-width: 768px) {
  nav#secondary_navigation {
    display: block;
  }
}

You may need to add important to the display line

    display: block!important;
1 Like
3

Many thanks for this @teefers - interestingly the custom css now displays the sub menu on mobile in the same way as the desktop. So Google will send alerts saying clickable elements too close together! If the top level links can’t be changed to a placeholder think I will keep the overview pages but add some menu buttons with visibility on mobile only.

4

If it was my site I would add some CSS to space the items better on mobile. Maybe use some Flexbox and make theme more like a button.

I’m not at my office right now, but will be later. If you’re interested I would be happy to put something together later today.

5

Thanks for your kind offer Doug. At present they space differently on different devices so my feeling is to try some on-page buttons (mobile only) which will replace the text links. I’ll mess around with this approach first.

6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.