EC-CUBE3.0 新着情報ブロックのカスタマイズ方法

Pocket

EC-CUBE3.0のデフォルトテンプレートに用意されている新着情報ブロックのカスタマイズ方法を紹介します。

E-CUBE3.0のデフォルトではすべての情報が出力されたり、一般的なulタグを使ったリスト表示ができなかったりと、やや使いづらい印象。

でも、カスタマイズ方法は簡単なので作成するサイトに合わせて自由に作り変えることができます。カスタマイズの方法は以下から。

新着情報ブロックのカスタマイズ方法

新着情報ブロックで使えるデータをチェックする方法

twigテンプレート内でdump()を使うとページにデータの配列を表示させることができます。

{% dump(NewsList) %}

EC-CUBE3.0の新着情報カスタマイズ-01

新着情報ブロックのデータ一覧

新着情報ブロック内で使用されているデータは以下のとおり。

  • News.date: 新着情報の日付
  • News.title: 新着情報のタイトル
  • News.comment: 新着情報の本文
  • News.url: 新着情報のURL
  • News.link_method: 別ウィンドウで開くにチェックが入ってたら、1

それぞれの値を表示するには、twigテンプレートのforループ内で以下のように記述します。dateはやや特殊な書き方が必要ですが、デフォルトのをそのままコピーすればOKです。

{{ News.title }}

EC-CUBE3.0の新着情報をulタグで表示する方法

デフォルトでdlタグになっている新着情報をulタグで表示することもできます。値の表示は上記のようにカッコで囲むだけなので、あとはHTMLコードを書き換えるだけで簡単にカスタマイズできます。

for文の内側にulタグを入れるとulタグごと繰り返し表示されるので注意。

<ul>
  {% for News in NewsList %}
    <li>
      <span class="date">{{ News.date|date("Y/m/d") }}</span>
      <span class="news_title">{{ News.title }}</span>
      <p>
        {{ News.comment|raw|nl2br}}
      </p>
      <a href="{{ News.url }}" {% if News.link_method == '1' %}target="_blank"{% endif %}>
        詳しくはこちら
      </a>
    </li>
  {% endfor %}
</ul>

新着情報の表示数を変更する方法

新着情報は管理画面で登録したもの全てが表示されます。新着情報の表示数を変更するには、クラスファイルを修正し、データの取得数を指定する必要があります。

変更するのは以下のファイル

src/Eccube/Controller/Block/NewsController.php

このファイル内でデータの取得条件を設定しているfindBy()の中身を変更します。

// 変更前
->findBy(
    array(),
    array('rank' => 'DESC')
);

// 変更後
->findBy(
    array(),
    array('rank' => 'DESC’),  // , を忘れずに
    5  // 表示したい数をここに記述
);

ここで取得数を制限することで、新着情報をいくつ登録しても表示されるのは指定した値(ここでは5つ)になります。

EC-CUBE3.0の新着情報ブロックのカスタマイズは以上です。