navigation menus in mobile, best practice

Hi Dee,

One thing I've experienced with is in use when the navigation is in the sidebar.

When it's down to mobile size, the script will move the menu below the header.

I'm not sure if this is the best way to handle it, but it seems to be working fine in that use.

Let me know if you're interested in the code, and if so, which nav is going where?

I managed to moved it ok, but now I want to get rid of the word "Menu" and just leave the hotdog. I can't find the word. Where/How an I remove it?

So, I'd still like to know where I can remove the word "MENU." I can't find it. But I'm wondering if it would work to turn the menu "button" on it's side the way the Gifts button is on the right. Could I leave the hotdog oriented correctly, but turn the word 90 degrees clockwise? How? Would users like or hate that, do you think? Ugh, mobiles.

You can remove "Menu" with a filter:

add_filter('generate_mobile_menu_label','generate_remove_menu_label');
function generate_remove_menu_label()
{
      return '';
}

Not too sure what you mean by your second post - any examples?

Thanks!

Oooooooo, filters! A whole new world! :) Exciting, but I don't know how to use this. Is there no simple CSS way to just hide the word? If not, where do I put this filter?

Never mind about the other.

Thank you.

Unfortunatley there's no CSS to hide the word - but the filter can be added quite easily using this plugin: https://wordpress.org/plugins/code-snippets/

Hmmmmm, when I add that to code snippets, it breaks the site displaying an unending column of full width colored bars that are, I think, the menu background.

I just want a hotdog symbol without the word "menu". Sigh.

Hmm, I tested that code and it worked perfectly for me.

Try this instead:

Install this plugin: https://wordpress.org/plugins/pluginception/

Once installed and activated, go to "Plugins > Create new plugin".

Name the plugin whatever you like - it will be your own plugin for custom functions.

Once created, it should take you to an editor - at the bottom of the file, paste the code provided above.

Save your plugin, and it should work perfectly.

Something must be wrong with the filter code, Tom. At least in combination with the CSS I'm using.
This is what it does with both pluginception and snippets http://goodwriting.guru/

I finally found the issue.

There's a line in navigation.php that reads

<h3 class="menu-toggle"><?php _e( 'Menu', 'generate' ); ?></h3>

I know that just about the worst practice in the world would be to edit that file and remove that Menu, but that's what I need to do. How do I do that properly?

Ah! This is totally my fault - the filter I was trying to tap into for you is in the latest version that hasn't been released yet.

If you'd like, email me at support@generatepress.com with temp admin login details, and I'll set it up for you first thing in the morning.

Sorry!

Unfortunatley there’s no CSS to hide the word
Any chance in adding a css class for us Tom? :)

Tom,

Well, thank goodness, I could not figure out how the heck a filter worked on a function that didn't seem to exist. I was totally prepared to believe in the Tom magic, but... :)

It's ok, I've removed the word in navigation.php to make the client happy and, when the new version comes out, I'll come back here and get the filter to fix it properly. That's right, isn't it? That will work?

A new addon for toggling mobile features would be an awesome addition to GeneratePress.

@Pete - added ;)

@Dee - that will work, then once the new version is out, you'll be able to use CSS to hide it.

.menu-toggle .mobile-menu {
      display: none;
}

You can add that now, and it will hide it as soon as you update.

The filter is still awesome, but mainly if you want to change the wording to something else.