WordPress mobile menu items not showing on mobile view - wordpress

My client's WordPress website I created and selected a menu for mobile.
It's good on desktop but menu items are not showing on mobile.
Here is website link http://biz236.inmotionhosting.com/~ifbbpr5/

In your <div class="mobile-menu"> no items is generated.You should call your menu to that div in your header.php.
<div class="mobile-menu-area">
<div class="mobile-menu">
<?php echo wp_nav_menu( array('menu' => $atts["your-menu-name"] , 'container' => '', 'items_wrap' => '<ul id="your-ul-id" class="your-ul-class">%3$s</ul>' ));
?>
</div>
</div>

Related

Add element inside wordpress menu

php
<nav class="site-nav">
<?php
wp_nav_menu( array(
'theme_location' => 'primary',
'container' => false,
'menu_class' => 'nav-menu'
) );
?>
</nav> <!-- .site-nav -->
How can i add some of element inside the menu like layout below
<ul class="nav-menu">
<li>link_1</li>
<li>link_1</li>
...
<div class="new-element"> <!-- new element -->
<span>something</span>
<span>more</span>
</div> <!-- new element end -->
</ul>
Thanks.
Is very easy (not need enter code in your theme files). You only need go to WordPress Admin site in: Appearance --> Menus ---> Select the Menu and Add the new elements of Posts, Categories, Pages, etc...
View Image:
Just do that in the Backend.
https://codex.wordpress.org/Function_Reference/wp_nav_menu states:
Displays a navigation menu created in the Appearance → Menus panel.

Trouble with menus in Wordpress

I'm struggling to finish my first Word Press Theme and I've stumbled upon baffling problem: one of my menus - in this case a footer menu - is not visible.
This the actual code I have:
</div><!--#main-->
<footer>
<div class="bottom">
<nav><?php wp_nav_menu( array( 'sort_column' => 'menu_order', 'container_class' => 'footer-menu', 'theme_location' => 'footer-menu', 'menu' => 'Footer Menu' ) ); ?>
</nav><!--.bottom nav-->
<div class="info">whatever ©2015</div>
</div><!--.bottom-->
<?php wp_footer(); ?>
</footer>
</body>
</html>
And this is what Chrome's view-source is showing in appropriate place:
<div class="bottom">
<nav> </nav><!--.bottom nav-->
<div class="info">EEAC ©2015</div>
</div><!--.bottom-->
Meanwhile, I am 100% positive I got right names in the Dashboard.
Other menus I've got are working. There are 3 more of them, all made using very similliar code. No problem there. Just this one.
CSS is also very similliar, no ground breaking changes, so that's not the problem I think.
Have You got any idea what might be causing the problem here?
EDIT: It does however show up on the single.php and page.php. Only place it's not included is main page so far.
Try removing:
'sort_column' => 'menu_order'

switch menu to be displayed with menu toggle wordpress

I have two separate menus that are displayed when my page is shown full screen but when displaying on phones and smaller screens I would like to use just one menu that holds links to pages from both of the original menus.
To do this I have created a third menu that holds links to all the pages and would like this third menu to display when the wordpress menu toggle action fires.
However I am at a loss as to how to get the third menu to display in place of the main navigation menu which seems to come up by default.
The code in my header so far is simply as follows: (this doesn't show the second menu code as that is shown elsewhere on the page)
<nav id="site-navigation" class="navigation main-navigation" role="navigation">
<a class="screen-reader-text skip-link" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentythirteen' ); ?>"><?php _e( 'Skip to content', 'twentythirteen' ); ?></a>
<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
<h3 class="menu-toggle"><?php _e( 'Menu', 'twentythirteen' ); ?></h3>
</nav>
At the moment this correctly displays the main navigation menu as I want it to in full screen and then also displays this same menu again with the menu toggle function as smaller sizes. However I want the third menu to show up instead at the smaller sizes and I have tried all sorts of variations between the h3 tags to try to make the menu I want show up but can't crack it!
I can actually get the menu I want to display by doing the following but the menu I don't want is also displayed!
<h3 class="menu-toggle"><?php _e( 'Menu', 'twentythirteen' ); ?><?php wp_nav_menu( array( 'theme_location' => 'small-screen-nav-menu', 'menu_class' => 'nav-menu' ) ); ?></h3>
I have been in to functions.php as well as navigation.js but can't seem to find where the menu to use is being defined and therefore can't find where to change it - any help would be massively appreciated!!
Thanks in advance
use media queries to show or hide things:
#media only screen and (min-width: 480px) and (max-width: 767px) {
#site-navigation{display:none;}
h3.menu-toggle{display:block;}
}
Else you need to learn more about how wp_nav_menu() works read this

Attach a specific menu to a specific page

In my Wordpress website:
I have two pages, one is in Deutsch and one is in English.
I have two menus, same deal.
I would like to display the english menu when browsing the page in English and display the deutsch menu when browsing the page in Deutsch.
I cannot use any multilingual pluging unfortunately.
Is there any way to achieve this with a basic wordpress installation?
Why can't you use a multi-language plugin?
Assuming you're right about the idea of not being able to use such a plugin, two solutions come to mind:
Use custom fields and conditional logic to display one menu or another
Use page templates to display different menus
You can override the layout of a page by creating a file called page-{slug}.php or page-{id}.php, in which {slug} and {id} should be substituted for the slug or id of the page you wish to make a template for. In this page template you could copy the original layout, but alter the wp_nav_menu command to select a different menu.
There are a few other ways to do it, but those two seem like sensible options to me.
Try this one:
Put this code in header.php while calling navigation menu:
<?php if (is_front_page()) { ?>
<div id='frontPageBanner'>
<?php wp_nav_menu( array( 'container_class' => 'menu-header-1', 'theme_location' => 'primary' ) ); ?>
</div>
<?php } elseif (is_archive()) { ?>
<div id='archiveBanner'>
<?php wp_nav_menu( array( 'container_class' => 'menu-header-2', 'theme_location' => 'primary' ) ); ?>
</div>
<?php } elseif ( is_page($pageID)) { ?>
<div id='pageIdBanner'>
<?php wp_nav_menu( array( 'container_class' => 'menu-header-1', 'theme_location' => 'primary' ) ); ?>
</div>
<?php } ?>
Thanks.

wp menu displays in the wrong location after adding a new menu

I have done this million times before and I have no clue what is going on now. I've had one navigation menu, client asked me to add another one and the whole thing collapsed. After I added second navigation, added some pages to it and assigned it to the right location, the first menu appears in the location of the second one, and in the location of the first again it is the first menu.
Here is my register nav code in functions.php:
register_nav_menus( array(
'primary' => __( 'Top navigacija', 'wpfme' ),
'above' => __( 'Above header', 'wpfme' ),
) );
Here is the placement of both in the header.php file:
<div class="left" id="kkk_top">
<p><?php bloginfo('name'); ?> <?php wp_nav_menu( array('menu' => 'Above header' )); ?>
</p>
</div><!-- #kkk-top -->
<div id="main_navigation">
<?php wp_nav_menu( array('menu' => 'Top navigacija' )); ?>
</div><!-- #main_navigation -->
I should also add that menu that now appears in the Above header location is wrapped in the div with the dynamic id it had when there was no second navigation, and menu that now appears in the Top navigacija location is wrapped in a div with a new dynamic id.
I just deleted the second menu and created it again, placed it in the new theme location and now it s all cool... when in doubt always reboot :)

Resources