グローバルナビの更新
-
WordPress初心者です。
“WordPressの教科書2″を使ってサイトを制作しております。
P.65のグローバルナビゲーションについての質問です。
“wp_nav_menu”を使ってグローバルナビゲーションを実装しました。
“wp_nav_menu”にslugのクラス属性を追加しています。
一度クラス登録したナビゲーションの画像データを新しいものに変更したいのですが、どのようにすれば出来ますでしょうか。
保存先フォルダ内のナビゲーションの画像を更新しても、サイトには反映されませんでした。コードを下記します。
<header.php>add_filter('nav_menu_css_class', 'apt_slug_nav', 10, 2); wp_nav_menu(array( 'container' => 'div', 'container_id' => 'global_nav', 'theme_location' => 'place_pc_global', 'depth' => 3, )); remove_filter('nav_menu_css_class', 'apt_slug_nav');
<functions.php>
// wp_nav_menuにslugのクラス属性を追加する。 function apt_slug_nav($css, $item) { if ($item->object == 'page') { $page = get_post($item->object_id); $css[] = 'menu-item-slug-' . esc_attr($page->post_name); } return $css; }
初歩的な質問かもしれませんが、お答えいただけると幸いです。
よろしくお願いいたします。
-
こんにちは
現在のバージョンのWordPressでは、そういった難しいコードを書かなくても大丈夫です
外観 / メニュー を開いて、画面右上のScreen Optionsを開きます
Show advanced menu properties(日本語になっていると思いますが)
のcss classesにチェックを入れると、メニューのそれぞれに、CSS Classを入力するフィールドが表示されるので、そこに半角英数で、わかりやすいクラス名を入力しますあとは、CSSで、背景画像を指定してやればいいです。
ご回答いただきありがとうございます。
早速ご回答を参考に変更させていただきました。
クラス名を指定後、スタイルシートに下記のように追記したのですが、変更が適応されないままです。.toppage { background-image: url("../images/nav/menu01.png") }
他にしなければならないことなどはありますか。
知識が乏しくてすみません。.toppage { background-image: url("../images/nav/menu01.png") }
“WordPressの教科書2″を持っていないので、確認させていただきますが
imagesディレクトリは、wp-content/themes/images/ になんですか?
imagesディレクトリは、wp-content/themes/(theme name)/images/ じゃありませんか?
であれば、
.toppage { background-image: url("images/nav/menu01.png") }
- トピック「グローバルナビの更新」には新たに返信することはできません。