色んなタイプのメニューを簡単作成[CSS Menu Maker]

公開日:  最終更新日:2021/12/14

無料でネットショップ開業 STORES.jpに登録してみた
ECサイトに限ったことではありませんが、ヘッダー、フッターやサイドナビにはメニューを表示していますよね。

マウスオーバーで色を変えたり、さらに細かい階層のメニューが表示されたり使い勝手の良いメニューを用意しておくことはECサイトでは非常に重要になってきます。

でも、HTMLやCSSの知識がないとかっこよくて、使い勝手の良いメニューは作れないと思います。

そこで本日は、HTML、CSSの知識がなくても簡単にメニュー作成が出来るサービスを紹介します。


CSS Menu Maker
色んなデザインのメニューが用意されており、自分好みのメニューを簡単に作成することが出来るジェネレーターになります。

61-1.png

ドロップダウンメニュー

61-2.png

フライアウトメニュー

61-3.png

縦型メニュー

61-4.png

水平メニュー

61-5.png

タブメニュー

61-6.png


様々なメニューのレイアウトがあるので、迷ってしまいますが、1つを選択すると
↓↓のような実際に動作を確認できる画面になります。
61-7.png
さらに、赤枠で囲っている「 Customize 」をクリックしてみてください。

メニューの設定画面

61-8.png
選択したデザインでメニューを設定していくことが出来ます。
メニューの項目を追加、メニューの表示名称、階層など細かく設定することが可能です。
61-11.png
設定したメニューのHTMLタグを確認
61-9.png
設定したメニューのCSSを確認
61-10.png
必要なタグ、CSSは上記画面からコピペしても良いですし、ファイル一式をダウンロードすることも可能です。


といった感じで簡単にメニュー作成に必要なHTML,CSSを生成することが出来ました。あとはコピペでサイトに組み込むことが出来ますね。

感覚的に画面上で操作をしていくだけで、クオリティの高いメニューを作成出来るのはありがたいですね。CSS Menu Makerぜひ、活用してみてください。




Your Message

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

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

スポンサードリンク
PAGE TOP ↑