Diviのメニューをセクションの背景の上に表示させる方法
こんにちは、ナオミです！
今日はこんな感じのメニューが背景画像の上にくるデザインをDiviで作って見たいと思います。
早速始めます。
Diviのメニューをセクションの背景の上に表示させる方法を動画でご覧になりたい方はこちらからどうぞ！
Diviの固定ナビゲーションバーを無効にする
まずはWordPressのダッシュボードからDiviのオプションに行きまして、固定ナビゲーションバーを無効にします。
こうすることによって、メニューがスクロールと共についてくるのを防げます。
Diviのテーマカスタマイザー
次にメニューのカスタマイズです。
Diviのテーマカスタマイザーを開きます。
そして、『ヘッダーとナビ』→『第一メニューバー』に行きます。
メニューの背景色を透明にする
セクションに背景画像をセットする
ここまでのステップがちゃんと出来ていれば、このように表示されます。
好きな背景画像をセットします。
フォントの色を変えたり大きくして見やすくしましょう。
これで完成です。
セクションを使いこなせ！
セクションは１からページを作る際に一番最初に設定する要素であり、Diviでページのデザインする時の基礎になります。セクションを使いこなすことで、行やモジュールをより際立たせることができます。
本記事の他にもセクションについて記事を書いていますので、ぜひご覧ください。
Diviのことをもっと深く知りたい方は、Diviの使い方完全ガイドをご覧ください。
コードを書かないウェブ制作を目指すコミュニティ『TOFUラボ』
Diviの最新情報を知りたいなら、ノーコードでWEBサイト制作を支援するサロン『TOFUラボ』に参加しませんか？
私が運営してるノーコードでWEBサイト制作を支援するのコミュニティです。
最新情報だけではなく技術的な質問も飛び交っています。
また、デザインやSEOなどWEBサイト制作に関する様々な勉強会も開催されています。
『TOFUラボ』の紹介はこちらです
興味があれば、是非参加してくださいね。
入会してから７日間は無料で合わないなと思えばいつでもキャンセル可能です。
