EC-CUBE 新着情報ブロックの使い方とカスタマイズ方法

Pocket

EC-CUBE新着情報ブロックの使い方とカスタマイズ方法
EC-CUBEの新着情報は管理画面から投稿できるコンテンツ。ブロックになっているので、サイドに配置したり、メインエリアに配置して自由にレイアウトを変更できます。

デフォルトでは日付とタイトルとコメントが表示されていますが、お知らせページを作って本文をそちらで表示するといった使い方も可能。

このページではEC-CUBEの新着情報ブロックの使い方とカスタマイズ方法を紹介します。

EC-CUBE新着情報ブロックの使い方

新着情報クラスとブロックのファイル構成

EC-CUBEの新着情報ブロックのカスタマイズに必要なファイルは以下の場所にあります。

  • data->class->pages->frontparts->bloc->LC…News.php
  • data->class_extends->pages_extends->frontparts->bloc->LC…News.php
  • html->frontparts->bloc->news.php
  • data->Smarty->templates->template_name->frontparts->bloc->news.tpl
  • html->user_data->packages->template_name->css->bloc.css

新着情報ブロックの見た目をカスタマイズ

EC-CUBEの新着情報のスタイルをカスタマイズするには、bloc.cssを編集します。デフォルトでは112行目あたりからおすすめ商品のスタイルが設定されています。
bloc-news-css
新着情報は日付ごとにリスト表示するのが一般的。高さを固定してスクロールバーを表示しているECサイトもよく見ます。

新着情報ブロックで使えるデータ一覧

EC-CUBEの新着情報クラスでは現在のページのカテゴリとカテゴリツリーを取得できます。

  • $arrNews : 新着情報一覧
  • $newsCount : 新着情報の件数

$arrNewsには新着情報配列が格納されています。中身のデータはdtb_newsテーブルの通り。
bloc-news-data
$newsCountには新着情報の件数が入っています。

データの出力方法

新着情報の方は普通の配列なのでforeachやsection関数で繰り返し処理をすることで取得できます。デフォルトでは本文も表示するようになっていますが、非表示にしてタイトルのみにすることも可能。

// $arrNewsのループ開始
<!--{section name=data loop=$arrNews}-->

  // date_array変数を作って、そこに$arrNewsの日付を格納
  <!--{assign var="date_array" value="-"|explode:$arrNews[data].cast_news_date}-->

  // ここに処理の中身
  
  //日付の取得
  <!--{$date_array[0]}-->年<!--{$date_array[1]}-->月<!--{$date_array[2]}-->日
 
  // URLの取得
  <!--{$arrNews[data].news_url}-->

  // タイトルの取得
  <!--{$arrNews[data].news_title|h|nl2br}-->
  
  // 本文の取得
  <!--{$arrNews[data].news_comment|h|nl2br}-->


<!--{/section}-->