ブログ

ブログ

2018.12.03

メニューの作成・編集方法

最終更新日:2019.12.09

WEBサイトでユーザーを各ページへ誘導するメニュー。
ヘッダーやフッター、サイドなどレイアウトする位置によって項目を変えることでそのサイトの見やすさや使い勝手が向上します。
Rabbity-CMSは、[メニューリスト]機能を使用することでメニューを簡単に作成・編集することができます。
本記事ではメニューに関する機能について解説していきます。

メニューを簡単に作成・編集できるRabbity-CMSの[メニューリスト]機能

[メニューリスト]機能では、「メインメニュー」や「フッターメニュー」といったメニューグループを作成し、グループごとにメニュー項目を設定します。
メニュー項目はボタンクリックで簡単に追加できるだけでなく、同階層や子階層などメニュー項目を階層分けすることも簡単です。[メニューリスト]機能を活用すれば誰でも簡単にメニューを作成・編集することができます。
それでは機能について解説していきます。

メニューリストの表示方法とダイアログの解説

1.コントロールパネルの[作成]→[コンテンツ管理]→[メニューリスト]をクリックします。

コントロールパネルの[作成]→[コンテンツ管理]→[メニューリスト]をクリックする

2.[メニューリストダイアログ]が開きます。

メニューリストダイアログ
項目名 説明
①メニューグループ表示領域
メニューグループ 登録されているメニューグループの一覧です。
一覧の中から編集したいメニューグループを選択します。
[+グループを新規作成]ボタン クリックすることで新規のメニューグループを作成することができます。
※新規のメニューグループは1サイト9個まで作成することができます。
②メニュー項目表示領域
[設定]ボタン
設定ボタン
選択しているメニューグループの設定画面を開きます。
[削除]ボタン(上部)
削除ボタン
選択しているメニューグループを削除します。
メニュー名

選択しているメニューグループのメニュー項目がツリー状に表示されます。

階層の展開
メニュー項目に子階層があるとメニュー名に左側に[+]ボタン([+]ボタン)が表示されます。[+]ボタンをクリックすると子階層が展開されます。
展開状態を元に戻す場合は、[-]ボタン([-]ボタン)をクリックします。

公開ステータス メニュー項目の公開状態は表示されます。
メニュー項目を非公開にする場合は[編集]ボタンから設定画面を開き、設定を変更してください。
[追加]ボタン
追加ボタン
クリックしたメニューと同じ階層にメニュー項目を追加することができます。
[下の階層に追加]ボタン
下の階層に追加ボタン
クリックしたメニューの一つ下の階層(子階層)にメニュー項目を追加することができます。
[編集]ボタン
編集ボタン
クリックすると選択したメニュー項目の設定を編集することができます。
[削除]ボタン(メニュー項目)
削除ボタン
クリックすると選択したメニュー項目を削除することができます。
[保存]ボタン
※メニュー項目追加時出現
保存ボタン
追加するメニュー項目の設定を保存します。
[キャンセル]ボタン
※メニュー項目追加時出現
キャンセルボタン
メニュー項目の追加をキャンセルします。

ショートカットメニューからのメニューリストの表示方法

サイトに配置されたメニュー上で右クリックして表示されるショートカットメニューから、[メニュー]→[メニューリスト]を選択することでもメニューリストを表示することができます。

ショートカットメニューから、[メニュー]→[メニューリスト]を選択する

メニューグループの作成方法

1.[メニューリストダイアログ]の[+グループを新規作成]ボタンをクリックします。

[ グループを新規作成]ボタンをクリックする

2.[メニューグループ設定ダイアログ]が開きます。

メニューグループ設定ダイアログ
項目名 説明
ID(必須) メニューグループのIDを設定できます。
IDはリストから選択する形式ですが、自動的に付与されるので操作を行わなくても問題ありません。
※新規のメニューグループは1サイト9個まで作成することができます。
メニューグループ名
(必須)
任意のメニューグループ名を設定できます(日本語名も可)。
メニューパーツ(必須)

サブメニューの有無を設定します。
[ブロックレイアウト]で配置できるパーツの数を選択してください。
「全てのパーツに下のメニューを出力する」にチェックを入れると各パーツにその階層より下の階層のメニューが表示されます。ただし、2つ以上のパーツを選択している場合、階層の展開が「常に展開する」にチェックが入っていても、最後のパーツ以外は全て「選択された場合のみ展開する」と同じ状態で表示されます。
※トップページ上のメインメニューにはサブメニューが表示されない場合があります。

選択肢:

  • 1つ
  • 2つ(1階層目+それ以降)
  • 3つ(1階層目+2階層目+それ以降)
階層の展開

下の階層を常に展開(表示)するか、選択された場合にのみ展開(表示)するのかを選択してください。

選択肢:

  • 選択された場合のみ展開する
  • 常に展開する

3.必要事項を入力し、[OK]ボタンをクリックすると新たなメニューグループが作成されます。

必要事項を入力し、[OK]ボタンをクリックする
新たなメニューグループが作成される

メニューグループの設定編集と削除

メニューグループの編集

[メニューリストダイアログ]で設定を編集したいメニューグループを選択し、ダイアログ右上の[設定]ボタン(設定ボタン)をクリックするとメニューグループ設定画面が開くので編集することができます。

ダイアログ右上の[設定]ボタン(画像)をクリックする

また、サイトに配置されたメニュー上で右クリックして表示されるショートカットメニューの[メニュー]→[メニューグループ設定]からも編集が可能です。

ショートカットメニューの[メニュー]→[メニューグループ設定]からも編集が可能

メニューグループの削除

[メニューリストダイアログ]で削除したいメニューグループを選択し、ダイアログ右上の[削除]ボタン()をクリックするとメニューグループを削除することができます。

ダイアログ右上の[削除]ボタン(画像)をクリックする

メニューグループ内へのメニュー項目の追加方法

1.[メニューリストダイアログ]でメニューグループを選択します。

メニューグループを選択

2.メニュー項目を追加するボタンをクリックします。

※画像は[追加]ボタンからの場合になります。

メニュー項目を追加するボタンをクリック

メニュー項目を追加するボタンは、3種類存在します。

項目名 説明
[追加]ボタン
追加ボタン
クリックしたメニューと同じ階層にメニュー項目を追加することができます。
[下の階層に追加]ボタン
下の階層に追加ボタン
クリックしたメニューの一つ下の階層にメニュー項目を追加することができます。
[メニュー追加]ボタン
追加ボタン
新規メニューグループを作成し、項目がひとつもない場合に表示されます。

3.各種設定項目を設定します。

各種設定項目を設定する
項目名 説明
メニュー名 表示するメニューの名称です。
リンク先

リンク先の種類と追加情報を設定します。

  • サイト内リンク
    同サイト内のページにリンクを設定できます。
    右側のコンテンツからリンク先のページを選択します。
    アンカーを指定する場合は「#」の後にアンカー名を入力してください。

サイト内リンク

  • ファイル
    PDFなどファイルデータにリンクを設定します。
    右側の[参照]ボタン(画像)をクリックしてサーバーブラウザからファイルを選択します。

ファイル

  • URL入力
    任意のURLにリンクを設定します。右側の入力欄にURLを直接入力してください。

URL入力

  • リンクなし
    リンクを設定しません。

4.設定が完了したら[保存]ボタンをクリックして設定を保存します。

設定が完了したら[保存]ボタンをクリックして設定を保存する

5.リストに新規のメニュー項目が追加されます。

リストに新規のメニュー項目が追加される

6.[閉じる]ボタンを押すとダイアログが閉じ、WEBサイト内の該当するメニューが更新されます。

※メニューを表示させるためには、[ブロックレイアウト]機能でメニューを配置しておく必要があります。

メニュー項目の編集と削除

メニュー項目の編集

[メニューリストダイアログ]の編集したいメニュー項目の右横にある[編集]ボタン(編集ボタン)をクリックすると選択したメニュー項目の設定画面が表示されるので、細かい設定も編集することができます。
メニュー項目の詳細設定方法については「メニュー項目の詳細設定方法」をご覧ください。

メニュー項目の右横にある[編集]ボタンをクリックする

メニュー項目の削除

[メニューリストダイアログ]の削除したいメニュー項目の右横にある[削除]ボタン(削除ボタン)をクリックすると選択したメニュー項目を削除することができます。
※削除するメニュー項目に子階層がある場合は、子階層も同時に削除されます。

メニュー項目の右横にある[削除]ボタンをクリックする

メニュー項目の順序の並び替え

各メニューはメニューリストの項目順で表示されます。
項目の順序を変更したい場合は、該当するメニュー項目をドラッグすることで、そのメニューの行を移動することができます。

Q&A行をクリックする
NEWS行の下へドラッグする
メニュー項目の並び替え完了

Web制作・ホームページ制作に
関するお問い合わせ

Web制作のお見積り、ご相談等をご検討の方はお問い合わせフォームをご活用ください。

お問い合わせする

Rabbity-CMS
体験版のお申し込み

Rabbity-CMSの体験版をご利用したい方は申し込みフォームをご活用ください。

体験版を申し込む

Rabbity-CMSに
関するお問い合わせ

体験版の延長、CMSに関するご質問はこちらのフォームをご活用ください。

お問い合わせする

お電話でのお問い合わせ

TEL:048-421-8571
営業時間 9:00-17:00(土日祝除く)

※セールス目的でのお問い合わせはご遠慮ください。