2021/03/16

ノーコード「STUDIO」 → ハンバーガーメニューの作り方

Nocodeの「STUDIO」の使い方に関しての、操作マニュアルです。

少しずつ、整理しながらマニュアルとして作っていきますので、良かったらご参考下さい。

ハンバーガーメニューとは？

Webサイトでメニューを展開する際に使用する「＝」並び線のアイコンのことであり、クリックに応じてメニューを表示・非表示するような役割があります。

押したら、下記のようなメニュー画面が出る感じです↓

オススメ動画は下記の３選です。

こちらは、英語版ですが日本語字幕で説明しています。
動画時間も３分くらいなので、最低限の説明でシンプル。サクっとわかりやすく説明しています。

モバイル、タブレット、PC版で作るとどうなるか？など、１から作成しながら説明しています。
テキストやサイズ、細かな部分も解説しながらメニューを作っていきます。丁寧に作りたい方は、こちらの動画がオススメです。

こちらは、上記のレストランサイトを作ったご本人（はるかなさん）が解説している動画です。

ご本人が作ったサイト・動画であり、とてもわかりやすく解説しています。私もこちらの動画を参考にして、模写しました。

こちらも丁寧に細かな部分を説明しながら解説しています。また、ハンバーガーメニューだけでなく、レストランサイト全般を参考に聞きたい方は、こちらの動画をオススメします。

機器によって表示を分けたい時は、モバイル画面のみ、「MENU」を消す設定が必要になります。

下記の記事にまとめていますので、ご参考下さい。