【EC-CUBE】PCサイトで追加した新着商品ブロックを携帯サイトでも追加する
以前に、追加した大変便利なブロック機能。「新着商品をブロックで表示する」（http://www.bton.net46.net/?p=493）
これは実装時には基本PCサイトでのみ動作していたのだけど、携帯でも同じように使用したい。
ということで、ちょこっと改変して、携帯でも使うことにする。
そこで、私は、http://www.bton.net46.net/?p=735で商品登録に携帯用のコメントを追加したので、モバイルサイトでは、PC用の普通の説明文ではなく、携帯用の説明文を表示させることにする。（そうすると絵文字も自由に使えるからね！）
さて、新着商品の表示だけど、トップページで、左に小さな写真、右に商品名、携帯用説明文（最初の60字）を表示させて、写真と商品名には詳細ページへのリンクをつける、ということにしたい。
その１）ブロックのPHPを作成する。
以前に作成した、/html/frontparts/bloc/new.phpをコピーして、/html/mobile/frontparts/bloc/new.phpとして保存。
コピーしたファイルを開き、最後から2行目、3行目の、
$objPage->init();
$objPage->process();
を
$objPage->mobileInit();
$objPage->mobileProcess();
に変更して保存。
その２）ブロック作成。
/data/Smarty/templates/default/mobile/frontparts/bloc/にnew.tplを作成し、下記ソースを参考に表示用のテンプレートブロックを作成する。
<!–{if count($arrFlagProducts) > 0}–>
<div style=”background-color:#3cf; color:#fff; font-size:small; padding:1px; text-align:center;”>新着商品</div>
<div style=”font-size:x-small; background-color:#cff;”>
<!–{section name=cnt loop=$arrFlagProducts step=1 max=6}–>
<!–{if $arrFlagProducts[cnt].main_list_image != “”}–>
<!–{assign var=image_path value=”`$arrFlagProducts[cnt].main_list_image`”}–>
<!–{else}–>
<!–{assign var=image_path value=”`$smarty.const.NO_IMAGE_DIR`”}–>
<!–{/if}–>
<div style=”clear:both;”><a href=”<!–{$smarty.const.MOBILE_DETAIL_P_HTML}–><!–{$arrFlagProducts[cnt].product_id}–>”><img src=”<!–{$smarty.const.SITE_URL}–>resize_image.php?image=<!–{$image_path|sfRmDupSlash}–>&width=60&height=60″ alt=”<!–{$arrFlagProducts[cnt].name|escape}–>” style=”float:left;margin-top:3px; margin-right:3px; margin-bottom:8px; margin-left:3px;” align=”left” border=”0″ /></a>
<span style=”<!–color:#f36;–>”>[emoji:148] <a href=”<!–{$smarty.const.MOBILE_DETAIL_P_HTML}–><!–{$arrFlagProducts[cnt].product_id}–>”><strong><!–{$arrFlagProducts[cnt].name|escape}–></strong></a></span><br /><br />
[emoji:76]<span style=”color:#666;”><!–{if !$arrProduct.comment7}–><!–{$arrFlagProducts[cnt].main_list_comment|mb_strimwidth:0:60:”…”|escape|nl2br}–><!–{else}–><!–{$arrFlagProducts[cnt].comment7|mb_strimwidth:0:60:”…”|escape|nl2br}–><!–{/if}–></span><br clear=”all” /></div>
<!–{/section}–>
</div>
ポイント。
リサイズイメージで、商品画像を60×60pxに変換している。
SECTIONのループで、max=6と指定しているので、新着商品は6個表示される。
imgタグのSTYLE属性で画像を左にfloatさせている。ドコモXHTMLでは、floatの解除は、brタグではできないので、divタグのスタイル属性でstyle=”clear:both;”とするんであるが、古い携帯の場合、これでクリアされないかもしれないので、念のため、保険代わりに<br clear=”all” />も追加しておく。
最後のほうで、携帯用のコメント（comment7）があれば、それを表示し、携帯コメントが登録されていなければ、PC用のコメントを表示する、としている。また、コメントはいずれも全角30字とし、それ以上長いものは、省略させている。
こんなとこ。
変数名が前回保存したPC用のソースで指定したものと一致しているか確認すること。（変数名が違うと表示されない）
その３）データベースから抽出されるデータにcommnet7を追加しておく。
/data/class/db/dbfactory/SC_DB_DBFactory_MYSQL.php
のL368あたりから（ver.2.3.3の場合）vw_products_allclassというのがあるので、この中の comment3,の下あたりにcomment7,を1行追加。
ついでなので、その20行ほど下の、
T0.comment3,の下にも、
T0.comment7,を1行追加しておいた。