No mobile drop-down Navigation

[Angela Sidler]

Hi Bill

In the mobile view of my page there is a normal navigation and not a mobile navigation. if i click on “angebot”, the submenu-view is not correct (see attachement).

can you please help me to get a responsive mobile-dropdown menu for the mobile view?

thanks in advance

best regards
puntina

Attachments:

1. 

   FullSizeRender-1.jpg
   

[Bill Robbins]

Hi Puntina,

Try looking at the second question in this topic: https://support.organizedthemes.com/forums/topic/drop-down-menu-items-in-one-line#post-33153

If that doesn’t do the trick for you, send over the URL to your site and I’ll take a look.

Take care,
Bill

[Angela Sidler]

This reply has been marked as private.

[Bill Robbins]

Good Morning Puntina,

Gotcha. The CSS above is intended to move the drop-down menus over a bit so they aren’t cut off on the right. If you’re wanting a separate menu system for mobile, we’ll want to use a plugin here. I would suggest trying the TinyNav plugin (https://wordpress.org/plugins/tinynav/). It replaces WordPress’ default menu system with a select one on smaller screens that’s easier to use.

Once you’ve installed and activated the plugin, there will be a new settings screen in the settings section of your WordPress dashboard. Here is what I would suggest adding there.

In the Custom ID/Class field, use .menu

In the screen size field, I would use 767 as the size where to apply this.

Next add this to your Custom CSS to add a bit of style to it:

#navigation .tinynav {
	border: 2px solid #000000;
	color: #000000;
	font-size: 16px;
	background: transparent;
	-webkit-appearance: none;
	border-radius: 0;
	padding: 5px;
	width: 90%;
	margin-top: 15px;
	margin-bottom: 15px;
	margin-left: 5%;
	margin-right: 5%;
}

See if that doesn’t get you where you’d like to go. If you have any questions, let me know.

Have a great week,
Bill

[Author]

Posts