2012年2月29日カテゴリー:未分類

EC-CUBE:売れ筋ランキングをスマートフォンで表示する

ここでのカスタマイズはMySQL限定となります。
サーバーにより負担をかけず、PostgreSQLにも対応した↓こちらの方がベターかと思います。
EC-CUBE:売れ筋ランキング スマートフォン表示(MySQL・PostgreSQL両対応)

(1)ランキング用のページを新規作成する。
すべてのファイルは、「index」をもとに作成。
html/sphone_ranking.php
data/class_extends/page_extends/LC_Page_Sphone_ranking_Ex.php
data/class/pages/LC_Page_Sphone_ranking.php
data/Smarty/templates/sphone/sphone_ranking.tpl

 データベースにページを登録
テーブル:dtb_pagelayout
device_type_id:2
page_id:30
page_name:ランキングページ
url:sphone_ranking.php
filename:sphone_ranking
header_chk:1
footer_chk:1
edit_flg:2
author:NULL
description:NULL
keyword:NULL
update_url:NULL
create_date:作成日
update_date:作成日

(2)ブロックを作成する(PC用のranking.tplが作成済みであることが前提。拡張classファイル等を利用するため。)
 ■data/Smarty/templates/sphone/frontparts/bloc/ranking.tpl(recommend.tplをもとに作成)
 データベースにブロックを登録
テーブル:dtb_bloc
device_type_id:2
bloc_id:9
bloc_name:ランキング
tpl_path:ranking.tpl
filename:ranking
create_date:作成日
update_date:作成日
php_path:frontparts/bloc/ranking.php
deletable_flg:0

(3)管理画面「デザイン管理>スマートフォン>レイアウト設定」でランキングページを選択し、ブロックを配置する。
「ランキング」ブロックと「おすすめ商品」ブロックを入れて、あとはTOPページと同じ配置。

(4)ランキングページへのリンクを作成
■data/Smarty/templates/sphone/frontparts/bloc/recommend.tpl(最下部に追加)
(ランキングページを開くためには、「おすすめ商品」ブロックを配置しておかなければならない)
——————————————————-

  • (5)CSSに追加

    ■html/user_data/packages/sphone/css/bloc.css

    ——————————————————-

    /*———————————————–

    ランキング

    ———————————————– */

    #recommend_area .rank {

    background-color:#C00;

    padding:1px;

    margin-bottom:5px;

    color:#FFF;

    font-weight:bold;

    text-align:center;

    }

    #recommend_area table td {

    text-align:left;

    vertical-align:top;

    }

    #recommend_area table td.right {

    padding-left:5px;

    }

    ——————————————————-