EC CUEB(2.11.4)にレビュー一覧ブロック作成

EC CUBE

EC CUBE

前回、レビュー一覧を作成したので

ブロックでトップページに表示できるようにしました。

スポンサードリンク

1.html/frontparts/bloc/review.php を新規作成

// {{{ requires
require_once realpath(dirname(__FILE__)) . '/../../require.php';
require_once CLASS_EX_REALDIR . 'page_extends/frontparts/bloc/LC_Page_FrontParts_Bloc_Review_Ex.php';

// }}}
// {{{ generate page

$objPage = new LC_Page_FrontParts_BLoc_Review_Ex();
$objPage->blocItems = $params['items'];
register_shutdown_function(array($objPage, "destroy"));
$objPage->init();
$objPage->process();
?>

2.data/class_extends/page_extends/frontparts/bloc/LC_Page_FrontParts_Bloc_Review_Ex.php を新規作成

// {{{ requires
require_once CLASS_REALDIR . 'pages/frontparts/bloc/LC_Page_FrontParts_Bloc_Review.php';

/**
 * Review のページクラス(拡張).
 *
 * LC_Page_FrontParts_Bloc_Review をカスタマイズする場合はこのクラスを編集する.
 *
 * @package Page
 */
class LC_Page_FrontParts_Bloc_Review_Ex extends LC_Page_FrontParts_Bloc_Review {

// }}}
 // {{{ functions

/**
 * Page を初期化する.
 *
 * @return void
 */
 function init() {
 parent::init();
 }

/**
 * Page のプロセス.
 *
 * @return void
 */
 function process() {
 parent::process();
 }

/**
 * デストラクタ.
 *
 * @return void
 */
 function destroy() {
 parent::destroy();
 }
}

3.data/class/pages/frontparts/bloc/LC_Page_FrontParts_Bloc_Review.php を新規作成

// {{{ requires
require_once CLASS_REALDIR . 'pages/frontparts/bloc/LC_Page_FrontParts_Bloc.php';

/**
 * Review のページクラス.
 *
 * @package Page
 */
class LC_Page_FrontParts_Bloc_Review extends LC_Page_FrontParts_Bloc {

// }}}
 // {{{ functions

/**
 * Page を初期化する.
 *
 * @return void
 */
 function init() {
 parent::init();
 $masterData = new SC_DB_MasterData_Ex();
 $this->arrRECOMMEND = $masterData->getMasterData("mtb_recommend");
 }

/**
 * Page のプロセス.
 *
 * @return void
 */
 function process() {
 $this->action();
 $this->sendResponse();
 }

/**
 * Page のアクション.
 *
 * @return void
 */
 function action() {
 //レビュー情報の取得
 $this->arrReview = $this->lfGetReviewData();
 }
 /**
 * デストラクタ.
 *
 * @return void
 */
 function destroy() {
 parent::destroy();
 }

/**
 * レビュー検索.
 *
 * @return array $arrReview 検索結果配列
 */
 function lfGetReviewData() {
 $objQuery =& SC_Query_Ex::getSingletonInstance();
 //商品ごとのレビュー情報を取得する
 $col = "r.create_date, r.reviewer_url, r.reviewer_name, r.recommend_level, r.title, r.comment, p.name, p.main_list_image";
 $from = " dtb_review AS r, dtb_products AS p";
 $where = " r.product_id = p.product_id AND r.del_flg = 0 AND r.status = 1 ORDER BY r.create_date DESC LIMIT 0,5";
 $arrReview = $objQuery->select($col, $from, $where);
 return $arrReview;
 }
}

今回はトップページに全件も表示する必要がないので

LIMITを使い5件のみの表示にしました。

4.data/Smarty/templates/default/frontparts/bloc/review.tpl を新規作成

<div id="review_voice_area">
<pre><h2><img src="<!--{$TPL_URLPATH}-->img/title/tit_product_voice.jpg" alt="この商品に対するお客様の声" /></h2></pre>
<div id="voice_box">
 <!--{if count($arrReview) > 0}-->
 <!--{section name=cnt loop=$arrReview}-->
 <div class="review_border clearfix">
 <div class="item_image">
 <img src="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrReview[cnt].main_list_image|h}-->" alt="<!--{$arrReview[cnt].name}-->" />
 </div>
 <div class="voice_box">
 <p class="item_name"><!--{$arrReview[cnt].name|h}--></p>
 <p>
 <span class="recommend_level">
 <!--{strip}-->
 <!--{assign var=level value=$arrReview[cnt].recommend_level}--><!--{$arrRECOMMEND[$level]|h}-->
 <!--{math equation="x-y" x=5 y=$level assign=sa}-->
 <!--{section name=i loop=$sa}-->
 ☆
 <!--{/section}-->
 <!--{/strip}-->
 </span>
 :<span class="coment_title"><!--{$arrReview[cnt].title|h}--></span>
 </p>
 <p><span class="coment_men">投稿者:<!--{if $arrReview[cnt].reviewer_url}--><a href="<!--{$arrReview[cnt].reviewer_url}-->" target="_blank"><!--{$arrReview[cnt].reviewer_name|h}--></a><!--{else}--><!--{$arrReview[cnt].reviewer_name|h}--><!--{/if}--></span><span class="coment_date">(<!--{$arrReview[cnt].create_date|sfDispDBDate:false}-->)</span></p>
 <p class="voice_comment"><!--{$arrReview[cnt].comment|h|nl2br}--></p>
 </div>
 </div>
 <!--{/section}-->
 <!--{/if}-->
 </div>
</div>

5.cssファイルを作成 review.css

.item_image {
 width: 180px;
 text-align: center;
 float: left;
}

.voice_box {
 width: 390px;
 float: left;
}

.coment_title {
 color: #40220f;
 font-size: 16px;
 font-weight: bold;
}

.coment_men {
 font-size: 12px;
 color: #666;
}

.coment_date {
 font-size: 10px;
 color: #666;
}

.voice_comment {
 font-size: 14px;
}

6.データベースに新規ブロックを登録します。

dtb_bloc テーブル内のデータを入れます。

device_type_id    10(←PCは10)

bloc_id            12(←ブロックidで開いている番号)
bloc_name    レビュー
tpl_path         review.tpl
filename         review
create_date      now()
update_date    now()
php_path          frontparts/bloc/review.php
deletable_flg    0(管理画面で削除できないようにするため。削除可能にするなら1)

7.管理画面のページレイアウトでブロックを表示させたいところに追加する。

以上です。

CSSは今回も幅600pxで考えていますので、

環境によって調整してください。

今回も下記のサイトを参考にさせて頂きました。

[EC-CUBE 2.11.4] レビュー一覧ブロック作成

EC-CUBE公式完全ガイド[ver 2.12/2.11対応] ECサイト構築・カスタマイズ・運用のすべて

新品価格
¥3,218から
(2015/1/27 23:12時点)

スポンサードリンク

コメントを残す

サブコンテンツ

このページの先頭へ