I m a bit new to WP
i want to use semantic UI Menu in wp_menu() of WordPress… how to achieve that.. Please guide.
this much i have achieved but how to change the li into or to remove the LI and than give class to so semantic ui menu can takes its shape
this is my output i want to remove the < DIV id=’menu-tem-8′ > and than give class = “item” to corresponding
<div class="ui secondary menu">
<div id='menu-item-8' class="menu-item menu-item-type-post_type menu-item-object-page">
<a href="http://localhost/wordpress/lbs/">Home</a>
</div>
</li>
<div id='menu-item-11' class="menu-item menu-item-type-post_type menu-item-object-page current-page-ancestor current-menu-ancestor current-menu-parent current-page-parent current_page_parent current_page_ancestor menu-item-has-children">
<a href="http://localhost/wordpress/lbs/company/">Company</a>
</div>
</li>
<div id='menu-item-27' class="menu-item menu-item-type-post_type menu-item-object-page">
<a href="http://localhost/wordpress/lbs/services/">Services</a>
</div>
</li>
<div id='menu-item-26' class="menu-item menu-item-type-post_type menu-item-object-page">
<a href="http://localhost/wordpress/lbs/portfolio/">Portfolio</a>
</div>
</li>
<div id='menu-item-46' class="menu-item menu-item-type-post_type menu-item-object-page">
<a href="http://localhost/wordpress/lbs/shop/">Shop</a>
</div>
</li>
</div>
</div>
============================================================
Leo and James King: Thanx for your reply….
This is in function.php
// navigation walker
class Description_Walker extends Walker_Nav_Menu
{
function start_el(&$output, $item, $depth, $args)
{
$classes = empty($item->classes) ? array () : (array) $item->classes;
$class_names = join(' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item ) );
!empty ( $class_names ) and $class_names = ' class="'. esc_attr( $class_names ) . '"';
$output .= "<div id='menu-item-$item->ID' $class_names>";
$attributes = '';
!empty( $item->attr_title ) and $attributes .= ' title="' . esc_attr( $item->attr_title ) .'"';
!empty( $item->target ) and $attributes .= ' target="' . esc_attr( $item->target ) .'"';
!empty( $item->xfn ) and $attributes .= ' rel="' . esc_attr( $item->xfn ) .'"';
!empty( $item->url ) and $attributes .= ' href="' . esc_attr( $item->url ) .'"';
$title = apply_filters( 'the_title', $item->title, $item->ID );
$item_output = $args->before
. "<a $attributes>"
. $args->link_before
. $title
. '</a></div>'
. $args->link_after
. $args->after;
$output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
}
}
this is in Header.php
wp_nav_menu(
array (
'menu' => 'top-menu',
'container' => 'div', // parent container
'container_class' => 'ui secondary menu', //parent container ID
'depth' => 1,
'menu_class' =>item,
'items_wrap' => '%3$s', // removes ul
'walker' => new Description_Walker // custom walker to replace li with div
)
);
?>
Leo and James King: Thanx for your reply….
actually what i want to achieved is this
This is the patter which is used by semantic UI for horizontal menu
I have achieved this much
by using code
But i want to add
to
Please guide..
thankx