Add element inside wordpress menu - wordpress

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.

Related

WordPress mobile menu items not showing on mobile view

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>

How to add styles to wordpress default menu

I just installed my theme to newly installed wordpress site. I didn't create any menu from appearence>menus, so by default wordpress showing "home" * "sample page" to the header as a default menu (I don't know the correct name, maybe callback menu?)
the problem is they are not getting any style from my stylesheet, I know if I create my custom menu, they ll get the styles from css. but I want this default wordpress menu to get the css as well. so the theme doesn't look odd when first install. how to do it?
The default styling of the WP menu looks like this:
<nav id="primary-navigation" class="site-navigation primary-navigation" role="navigation">
<div class="nav-menu">
<ul>
<li class="page_item page-item-2">
Sample Page
</li>
</ul>
</div>
</nav>
You should be able to style the elements of the menu on your page using the appropriate classes in your style.css file.
create a menu by name "primary" in apperance -> menus, and assign menus under it and u can refer
http://codex.wordpress.org/Function_Reference/wp_nav_menu
or else use this in header.php:
<?php wp_nav_menu( array( 'theme_location' => 'primary'))?>
First, creat new menu area in your theme.
For this, once (if you didn't set it) allow menus in your theme with this function:
add_theme_support( 'nav-menus' );
After this, add new menu your theme with this function:
register_nav_menu('primary', 'Our first menu');
And add your header.php lastly for print your custom menu:
if ( has_nav_menu( 'primary' ) ) { $menu = wp_nav_menu( array( 'container' => '', 'echo' => '0', 'theme_location' => 'primary' ) ); $menuOutput = preg_replace( array( '#^<ul[^>]*>#', '#</ul>$#' ), '', $menu ); echo $menuOutput; } else { }
This output is same as:
<li class="menu-item some-class">
<a>Sample page</a>
</li>
Use
And CSS it!
ul.your-class{}
ul.your-class li{list-style:square}
ul.your-class li a{ color:red }
Normally the default menu is called in the header.php with the function wp_nav_menu(). You can add CSS classes as arguments to wp_nav_menu(). If you are unaware of that the please refer to: http://codex.wordpress.org/Function_Reference/wp_nav_menu.

Menu navigation wordpress

I´m working on a wordpress site with 2 diffrent sections (landingpage that link to private or corporate). The sections have diffrent menu navigation buttons. Do I have to install 2 separate wp-installations or is there any better way to solve the navigation issue?
You don't have to install wordpress twice. To present some menu you can use
wp_nav_menu() function (see: http://codex.wordpress.org/Function_Reference/wp_nav_menu).
So in different files of your theme you can use:
<?php wp_nav_menu( array('menu' => 'menu1' )); ?>
and
<?php wp_nav_menu( array('menu' => 'menu2' )); ?>
Than, you have to create 2 menu1 and menu2 in the Appearance → Menus panel.

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 :)

add drop down in custom wordpress theme

I am creating my wordpress theme with sub pages and their sub pages also, for this i create my own theme. now I manage these child pages from admin panel to show header navigation menu dropdown . but its not working , they show him in a line ,not drop down .so how can i show in dropdown in my header part.
my menu code is
<div class="nav">
<?php wp_nav_menu(array('menu' => 'topmenu', 'walker' => new description_walker(), 'menu_class' => 'nav', 'container' => false)); ?>
</div>
Its show 4 menu.
but I have sub pages in only 2 menu.
so how can i show that?
you are declaring twice ".nav" as a class, the first time you do it in here:
<div class="nav">
the second time you declare it in:
'topmenu', 'walker' => new description_walker(), 'menu_class' => 'nav', 'container' => false)); ?>
so basically you are asigning the class .nav both in the div and in the menu ul, which may create issues depending on yoru css.
I use this plugin for Dropdown menus: http://shailan.com/wordpress/plugins/dropdown-menu/ - it works perfectly and it has some nice effects you can use too, like a sliding down animation

Resources