WordPress STINGER8 メニュー 文字が入りきらない修正


STINGER8 のメニューのドロップダウン、文字が多いと幅に入りきらない。早速修正。

<?php get_template_part( ‘st-header-menu’ ); //カスタムヘッダーメニュー ?>

st-header-menu.php 内を確認

	if ( has_nav_menu( 'primary-menu' ) ) : //メニューセットあり ?>
		<div id="st-menubox">
			<div id="st-menuwide">
				<?php wp_nav_menu( $design_set_menu ); ?>
			</div>
		</div>

ここか、ではwp_nav_menuを確認。これは標準の関数だったか

//メニューセットあり 書いてあるから、単純にこの<div id=”st-menubox”>内を
カスタマイズか。ならば目がメニューを作るか。

まずは普通にテーマをいれつつ、メニューセットの出力を確認
子テーマもいれっつ、テスト用の固定ページを作り、続けてメニューセット作る。

st-header-menu.php 内 wp_nav_menu()を利用してるので、ここをがっつり余計なものを削除

// クラスを削除して、表示中メニューに 'current' クラスを付与する
	
add_filter( 'nav_menu_css_class', 'remove_to_currentClass', 10, 2 );
function remove_to_currentClass( $classes, $item ) {
    $classes = array();
    if( $item -> current == true ) {
        $classes[] = 'current';
    }
    return $classes;
}
 
// ID を削除する 
add_filter('nav_menu_item_id', 'removeId', 10);
function removeId( $id ){ 
    return $id = array(); 
}

	wp_nav_menu(
    array(
        'container' => false ,
        'items_wrap' => '<ul>%3$s</ul>')
    );

@See https://memocarilog.info/wordpress/6514

出力結果は

<ul>
	<li class="current"><a href="【リンク(´・ω・) 】">テキスト</a></li>
	<li><a href="【リンク(´・ω・) 】">テキスト</a></li>
	<li><a href="【リンク(´・ω・) 】">テキスト</a>
		<ul class="sub-menu">
			<li><a href="【リンク(´・ω・) 】">テキスト</a></li>
			<li><a href="【リンク(´・ω・) 】">テキスト</a></li>
			<li><a href="【リンク(´・ω・) 】">テキスト</a></li>
		</ul>
	</li>
</ul>

 

次は目指すメニューを探す。これいいね。
Overlay Effect Menu with jQuery
https://tympanus.net/codrops/2010/11/25/overlay-effect-menu/

だが、li中に<div>だと面倒。なにかプラグインを探す。

 

 

投稿者 kato

これはテスト画像ですよ。テストです。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA