広告あり

メニューの部分的な背景色変更

メニューで特に見てもらいところの場所を、下の参考例のように部分的に色を変更していくのだ🎨

メニューの予約と電話の部分を各々異なる色に設定しています。
この例では2ヶ所変えています

WebのID確認

メニューはCocoonでHTMLのリストで構成されておる。

まずはWebサイトを開いたらブラウザの……Google Chromeであれば[ページのソースを表示]をクリックしてソースを確認するぞ。

変更したいメニューの部分のIDを確認するのじゃ👀

memu-item-IDで、今回変えたい求人情報・アクセスは80だったぞ。

スクリーンショットと異なるところにIDが記されていました。ややこしくて申し訳ございません。
矢印の上段はPC用、下段はモバイル用で、IDは共通です

スタイルCSSに転記

子テーマのstyle.cssに背景色の色指定の記述をするのだ🎨

矢印部分の数字は先ほど調べたやつじゃ。

テキストはcolorで変更できなかったので放置じゃ💦

IDを変えるだけで、全てのメニューの色を昔のベネトン並みに変えることが可能です。
メニューの文字色は上手く変えることが出来ませんでした

一応、これで終了じゃ。

気に食わないところが残っているが、まぁ良しとしたのだ💧

本当は文字色も変えたかったです。
求人情報・アクセスの部分の色が変わっていることが分かると思います
フッターメニューはヘッダーメニューから独立させていないと一緒に背景色が変わります。それが良い場合もあり、今回は採用いたしました。
 フッターメニューがヘッダーメニューと共通だと巻き添えに……
タイトルとURLをコピーしました