ナビゲーションメニューの作成
クラリティのナビゲーションメニューは、デフォルトですべてのページが表示されるため、乱雑になっています。 メニュー表示フラグメントのデフォルト設定では、サイトのページ階層が表示されます。 「キャリア」、「サインイン」、「検索」をデフォルトのメニュー表示から除外したため、これらのページが表示されないことを覚えておいてください。
ヘッダーナビゲーションメニューをシンプルにするため、クラリティはナビゲーションメニューに表示する項目を3つだけにしたい:Shop(ページ)、Blog(ページ)、More(追加ページリンクのサブメニュー)です。
さらに、ナビゲーションメニューはフッターに動的な項目を追加できる。 クラリティのフッターには以下のメニューがあります:ショップ、クラリティ、リソースです。
ショップメニューは コマース・アーキテクト で設定されているため、今のところ空白です。
最初にナビゲーション・メニューを作る:
-
サイトメニュー()を開き、 Site Builder → ナビゲーションメニュー に進みます。
-
追加()をクリックします。
-
名前に Clarity Navigation と入力し、 Save をクリックします。
-
→ New****Page をクリックする。
-
Select PagesセレクタでClarity階層を展開し、 Shop をクリックし、 Blog をクリックします。
-
「選択」をクリックする。
主要なページは整った。 次に、残りのページへのリンクがある「More」というサブメニューが必要です。
-
追加 → サブメニュー をクリックする。
-
More という名前を入力し、 Add をクリックする。
-
Moreアイテムの Actions メニュー()を開きます。
-
子供の追加 → ページ をクリックする。
-
サブメニューに「会社概要」と「お問い合わせ」を追加する。
メニューはすぐに使える。
-
表示したいページは所定の位置にある。 ナビゲーション・メニューが意図的に更新されない限り、新しいページがメニューに追加されないようにするには、 設定()をクリックします。
ページ作成時に新しいページをメニューに追加する設定を無効にし、 Save をクリックします。
現在のナビゲーションを示すメニュー表示フラグメントがマスターページに追加される。 新しいナビゲーションメニューを使用するように設定します:
-
サイトメニュー()を開き、 デザイン → ページテンプレート をクリックします。
-
テキスト Clarity MP をクリックすると、ページエディターに移動します。
-
現在のナビゲーションが表示されているページ上のエリアをクリックします。 メニュー表示オプションの設定が右サイドバーに表示されます。
-
Source フィールドをクリックし、 Clarity Navigation メニューを選択します。
-
このレベルを選択してください。
階層構造の場合、ニーズに合えば、ウィジェットに表示する別のレベルを選択できる。 More_をクリックし、サブメニューが表示されていることを確認する。
Navigation Menusアプリケーションで定義されたこれらのサイトメニューに加えて、Contextual Menusをクリックすると、追加のダイナミックメニューオプションを見ることができます。 メニュー表示を設定する を参照してください。
この練習の前に、Clarityはメニュー表示フラグメントのページ階層メニューから3つのページを隠していました:採用情報」、「サインイン」、「検索」です。 そのメニューはもう使われていないが、それらのページは新しいヘッダーナビゲーションメニューに明確に追加されたわけではないので、ナビゲーションの外に残り続けている。
ヘッダーナビゲーションに加えて、Clarityにはフッター用のメニューが必要です: Shop 、 Clarity 、 Resources です。
-
ヘッダーメニューの作成に使用したのと同じ基本的な手順に従って、 Clarity メニューを作成し、 About Us と Careers ページを追加します。
-
クラリティのメニューに外部URLを追加します:
Name: Retail Customer Portal URL: http://clarityb2b.com:8080
完了すると、クラリティのメニューにページとURLが表示されます:
-
Resources "メニューを作成し、"Blog "と "Search "ページを追加する。
ショップメニューには、商品カテゴリーへのリンクが表示されます。 コマースアーキテクト で作成されるので、今は空白のままにしておいてください。
メニューができたので、フッターに追加する。
-
サイトメニュー()を開き、 → ページテンプレート をクリックして、クラリティMPマスターページを開きます。
-
ページエディターで、フッターの最初の3つのグリッド列、SHOP、CLARITY、RESOURCES見出しの下にメニュー表示ウィジェットを見つけてください。
-
各メニュー表示ウィジェットの設定を開き、表示する適切なメニューを選択します。
現在、クラリティのヘッダーとフッターは、リストを表示するためにナビゲーションメニューを使用しています。 コマースアーキテクト コースでは、SHOP メニューが入力されます。
次へクラリティのデザインチームは、新しいフラグメントとコンポジションで、ホームページ の リデザインを依頼しました。