レベル4モジュールで出力している情報を変更する

モジュールID

目標


トップページに表示されている「製品情報」のコンテンツを「スタッフ紹介」に置き換えましょう。


解説使用テーマbeginner2018

Before

After

目次

  1. 事前準備
  2. モジュールIDについて
  3. トップページ「製品情報」のコンテンツを「スタッフ紹介」に変更する
  4. モジュールの表示設定を変更する

事前準備


ハンズオンの事前準備として、スタッフ紹介カテゴリー内に「スタッフ1」から「スタッフ10」までのエントリーを作成します。


まずエントリーの編集の [複製] ボタンより、「スタッフ1」のエントリーを10枚分複製しましょう。



次に複製したエントリーのステータスを全て「公開」とし、それぞれ区別ができるようにタイトルとファイル名を編集します。


ステータス公開
エントリータイトルスタッフ+番号(例:スタッフ2)
ファイル名staff+番号(例:staff2)

以上で事前準備は完了です。



モジュールIDについて


レベル2「ナビゲーションを編集する」では、ブラウザ上で更新ができる「モジュール」というパーツについて学びました。今回のハンズオンではその「モジュール」にさらにクローズアップし、これらを管理する仕組みやブラウザ上でできる出力情報の制御の方法について理解を深めていきます。


まずはトップページ「製品情報」をマウスオーバーし、[モジュール] ボタンをクリックします。



タブを [条件設定] に切り替えると、使用しているモジュールやモジュールIDについての表記が確認できます。



モジュールID
それぞれのモジュールを区別する任意の英数字をモジュールIDといいます。それぞれのモジュールはこのモジュールIDを名付けることによって作動し、またこれによってブラウザ上から「何件表示するか」「何を表示するか」などのモジュールに関する設定ができるようになります。

例えばテーマ「beginner2018」では、トップページと一覧ページの2箇所で「エントリーサマリーモジュール」が使われています。これらのモジュールにそれぞれ異なるモジュールID(トップページでは top_summary 、一覧ページでは summary_index )を付けることで、同じモジュールでも出力情報などの設定を区別することができます。




またモジュールID名は1つのモジュールにつきテンプレートとブラウザ上で合わせて設定しているため、モジュールID名を変更する際には、必ずテンプレートと設定画面の双方で作業が必要になります。


トップページ「製品情報」のコンテンツを「スタッフ紹介」に変更する


ここからは、実際にモジュールの設定を操作してトップページに出力するコンテンツを「スタッフ紹介」に変更していきます。出力情報の変更は、モジュールの [条件設定] タブ内、「引数」にて行います。


引数変更前

初期設定では「カテゴリーID」の項目で「製品情報」が指定されています。そのため現状のエントリーサマリーモジュールには「製品情報」エントリーの情報が出力されるようになっています。それでは、この設定を以下の手順で「スタッフ紹介」へ変更しましょう。


  1. 製品情報ラベル左側の [ID参照] ボタンをクリックする
  2. 表示されるリスト内で [スタッフ紹介] を選択する
  3. ラベル内にある [×] ボタンをクリックして製品情報ラベルを消去する

引数変更後

これでコンテンツの変更は完了です。他にも引数の設定からは、エントリーIDやタグなど様々な条件でモジュールに出力するエントリーを絞り込むことができます。また各項目にチェックを打ってURLコンテキストを優先することで、出力したい条件を細かく指定することもできます。


URLコンテキスト
a-blog cmsでは、表示しているページの位置や状態を示すURL上のパスを「URLコンテキスト」といいます。個々のモジュールは、このURLコンテキストの情報を元に表示するコンテンツを判断しています。URLコンテキストの記述方法は多岐にわたるので、詳しくはURLコンテキスト | ドキュメント | a-blog cms developerをご覧ください。

これでコンテンツの変更は完了です。またテーマ「beginner2018」では [カスタム設定] タブからモジュールの見出しが変更できるので、「製品情報」を「スタッフ紹介」に書き換えたのちに設定を保存しましょう。


カスタム設定変更後

以上でトップページの「製品情報」を「スタッフ紹介」に変更できました。



モジュールの表示設定を変更する


現状のトップページでは、スタッフ紹介のエントリーがランダムで6件表示されています。これらをエントリーの作成日順に10件表示する設定に変更しましょう。


表示に関する設定は、[表示設定] タブ内で行います。


表示設定

表示順作成日(昇順)
表示件数10

[表示設定] タブ内では、その他にもサマリーやタグなどの出力情報の制御ができます。またイメージ・ページャー・フィールド・表示内容について、あらゆるケースに最適な条件を指定することも可能です。


表示設定

以上の作業で、トップページにエントリーが10件表示されました。



以上でレベル4は終了です
次のチュートリアルへ進みましょう