私はHTMLをWordPressに変換することを学び、次のようにクラスに変換したいと思います。
<div class="mainmenu pull-left">
<ul class="nav navbar-nav collapse navbar-collapse">
<li><a href="index.html" class="active">Home</a></li>
<li class="dropdown"><a href="#">Shop<i class="fa fa-angle-down"></i></a>
<ul role="menu" class="sub-menu">
<li><a href="shop.html">Products</a></li>
<li><a href="product-details.html">Product Details</a></li>
<li><a href="checkout.html">Checkout</a></li>
<li><a href="cart.html">Cart</a></li>
<li><a href="login.html">Login</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Blog<i class="fa fa-angle-down"></i></a>
<ul role="menu" class="sub-menu">
<li><a href="blog.html">Blog List</a></li>
<li><a href="blog-single.html">Blog Single</a></li>
</ul>
</li>
<li><a href="404.html">404</a></li>
<li><a href="contact-us.html">Contact</a></li>
</ul>
</div>
これは私がやったこと:
if ( ! function_exists( 'mytheme_setup' ) ) :
function wpflex_setup() {
register_nav_menus( array(
'primary' => 'Primary Menu'
) );
}
endif;
wp_nav_menu( array(
'theme_location' => 'top-menu',
'container' => '',
'menu_class' => 'mainmenu pull-left',
) );
ul
のクラスを追加する方法?
あなたはすでに正しいやり方をしました。 wp_nav_menu のドキュメントを見れば、menu_classがULのクラスにとって正しいオプションであることがわかります。
wp_nav_menu( array(
'theme_location' => 'top-menu',
'container' => '',
'menu_class'=> 'mainmenu pull-left *add-your-class-here*'
) );
items_wrap
パラメータを追加し、クラスattrを追加または編集する必要があるだけです。
wp_nav_menu( array(
'theme_location' => 'top-menu',
'container' => false,
'items_wrap' => '<ul class="nav your_custom_class">%3$s</ul>',
));
<?php
wp_nav_menu( array('menu' => 'Main Menu' ,
'menu_class' => 'nav navbar-nav',
'container' => ''));
?>
これがあなたの固定コードです。私はそれがulにクラスを追加することをテストしました
wp_nav_menu( array(
'theme_location' => 'top-menu',
'container' => 'ul',
'menu_class' => 'mainmenu pull-left',
) );
Wordpressはアクティブなメニューとは異なるデフォルトのページメニューを作成します - それらはあなたが作成しバックエンドで割り当てるものです。ページメニューでULにクラスを追加する直接的な方法はありませんが、他の方法もあります。あなたのfunctions.phpにこれを追加してみてください
function add_id_and_classes_to_page_menu( $ulclass ) {
return preg_replace( '/<ul>/', '<ul id="main-menu" class="nav navbar-nav collapse navbar-collapse">', $ulclass, 1 );
}
add_filter( 'wp_page_menu', 'add_id_and_classes_to_page_menu' );
これは既存のIDとクラスを置き換えることになるので、上記の例でそれらを再度追加しました。完成のためにid = "main-menu"も追加しました。