バージョン選択

フォーラム

メニュー

オンライン状況

44 人のユーザが現在オンラインです。 (35 人のユーザが フォーラム を参照しています。)
登録ユーザ: 0
ゲスト: 44
もっと...

サイト内検索

質問 > フロント機能 > おすすめ商品の表示を変えたい

フロント機能

新規スレッドを追加する

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 スレッド
ecbg
投稿日時: 2009/3/11 17:01
対応状況: −−−
仙人
登録日: 2009/2/25
居住地: 東京
投稿: 387
おすすめ商品の表示を変えたい
TOPページに表示される「おすすめ商品」の2行2列表示を1行4列に変更したいのですが、方法が分かりません。

「index.css」の値をいろいろと変更してみたのですが、上手くいきませんでした。

どうかご教授下さい。


環境は以下の通りとなっております。

EC-CUBEバージョン 2.3.4
PHPバージョン PHP 5.2.3
DBバージョン MySQL 5.0.45
seasoft
投稿日時: 2009/3/11 17:19
対応状況: −−−
登録日: 2008/6/4
居住地:
投稿: 7365
Re: おすすめ商品の表示を変えたい
過去スレが参考になりそうですが。
http://xoops.ec-cube.net/modules/newbb/viewtopic.php?topic_id=2147&forum=10

外していたらゴメンなさい。


----------------
Seasoft
こちらでの投稿は、アイディア程度に留めさせていただいております。
個別案件の作業は有償で承っております。お気軽にご相談ください。

ecbg
投稿日時: 2009/3/11 19:34
対応状況: −−−
仙人
登録日: 2009/2/25
居住地: 東京
投稿: 387
Re: おすすめ商品の表示を変えたい
先ほどのサイト内のステップの数値を「2」から「1」に変更したりもしてみたのですが、2列でおすすめ商品が繰り返されるだけでした。

<!--{section name=cnt loop=$arrBestProducts step=2}-->

その他に、変更するポイント等ありましたらお教え下さい。
takoyaki
投稿日時: 2009/3/11 22:31
対応状況: −−−
一人前
登録日: 2008/1/26
居住地: 沖縄県
投稿: 111
Re: おすすめ商品の表示を変えたい
http://www.wiz.gr.jp/wordpress/31

が参考になればいいのですが。
tonton
投稿日時: 2009/3/11 23:33
対応状況: −−−
仙人
登録日: 2008/8/14
居住地:
投稿: 437
Re: おすすめ商品の表示を変えたい
/data/smarty/templates/default/bloc/best5.tplのソースを下記に変更で1行、5つ表示になるのではないかと思います。

よかったら試してみてください。


<!--▼おすすめ情報ここから-->
<!--{if count($arrBestProducts) > 0}-->
<div id="recomendarea">
<h2>
<img src="<!--{$TPL_DIR}-->img/top/osusume.jpg" width="400" height="29" alt="おすすめ情報" />
</h2>
<!--{section name=cnt loop=$arrBestProducts step=1 max=5}-->
<div class="recomendblock">
<div class="recomendleft">
<!--{if $arrBestProducts[cnt].main_list_image != ""}-->
<!--{assign var=image_path value="`$arrBestProducts[cnt].main_list_image`"}-->
<!--{else}-->
<!--{assign var=image_path value="`$smarty.const.NO_IMAGE_DIR`"}-->
<!--{/if}-->

<a href="<!--{$smarty.const.URL_DIR}-->products/detail.php?product_id=<!--{$arrBestProducts[cnt].product_id}-->">
<img src="<!--{$smarty.const.SITE_URL}-->resize_image.php?image=<!--{$image_path|sfRmDupSlash}-->&width=48&height=48" alt="<!--{$arrBestProducts[cnt].name|escape}-->" />
</a>

<h3>
<a href="<!--{$smarty.const.URL_DIR}-->products/detail.php?product_id=<!--{$arrBestProducts[cnt].product_id}-->"><!--{$arrBestProducts[cnt].name|escape}--></a>
</h3>

<!--{assign var=price01 value=`$arrBestProducts[cnt].price01_min`}-->
<!--{assign var=price02 value=`$arrBestProducts[cnt].price02_min`}-->

<p>価格<span class="mini">(税込)</span>:<span class="price">
<!--{if $price02 == ""}-->
<!--{$price01|sfPreTax:$arrInfo.tax:$arrInfo.tax_rule|number_format}-->
<!--{else}-->
<!--{$price02|sfPreTax:$arrInfo.tax:$arrInfo.tax_rule|number_format}-->
<!--{/if}-->円
</span>
</p>
<p class="mini"><!--{$arrBestProducts[cnt].comment|escape|nl2br}--></p>
</div>
</div>
<!--{/section}-->
</div>
<!--{/if}-->
<!--▲おすすめ情報ここまで-->
ecbg
投稿日時: 2009/3/12 14:26
対応状況: −−−
仙人
登録日: 2009/2/25
居住地: 東京
投稿: 387
Re: おすすめ商品の表示を変えたい
>seasoftさん
>takoyakiさん
>tontonさん

ありがとうございました!
takoyakiさんに教えて頂いたページを参考に、index.cssのwithやpaddingを微調整したところ綺麗に3列表示ができました。

これからSmarty関数をしっかり把握したいと思います。
tonton
投稿日時: 2009/3/12 15:43
対応状況: −−−
仙人
登録日: 2008/8/14
居住地:
投稿: 437
Re: おすすめ商品の表示を変えたい
>/data/smarty/templates/default/bloc/best5.tplのソースを下記に変更で1行、5つ表示になるのではないかと思います。

>よかったら試してみてください。

------
追記:
すみません;
5個で改行させる処理が抜けてましたので追記します。


<!--▼おすすめ情報ここから-->
<!--{if count($arrBestProducts) > 0}-->
<div id="recomendarea">
<h2>
<img src="<!--{$TPL_DIR}-->img/top/osusume.jpg" width="400" height="29" alt="おすすめ情報" />
</h2>
<!--{section name=cnt loop=$arrBestProducts step=1 max=5}-->
<div class="recomendblock">
<div class="recomendleft">
<!--{if $arrBestProducts[cnt].main_list_image != ""}-->
<!--{assign var=image_path value="`$arrBestProducts[cnt].main_list_image`"}-->
<!--{else}-->
<!--{assign var=image_path value="`$smarty.const.NO_IMAGE_DIR`"}-->
<!--{/if}-->

<a href="<!--{$smarty.const.URL_DIR}-->products/detail.php?product_id=<!--{$arrBestProducts[cnt].product_id}-->">
<img src="<!--{$smarty.const.SITE_URL}-->resize_image.php?image=<!--{$image_path|sfRmDupSlash}-->&width=48&height=48" alt="<!--{$arrBestProducts[cnt].name|escape}-->" />
</a>

<h3>
<a href="<!--{$smarty.const.URL_DIR}-->products/detail.php?product_id=<!--{$arrBestProducts[cnt].product_id}-->"><!--{$arrBestProducts[cnt].name|escape}--></a>
</h3>

<!--{assign var=price01 value=`$arrBestProducts[cnt].price01_min`}-->
<!--{assign var=price02 value=`$arrBestProducts[cnt].price02_min`}-->

<p>価格<span class="mini">(税込)</span>:<span class="price">
<!--{if $price02 == ""}-->
<!--{$price01|sfPreTax:$arrInfo.tax:$arrInfo.tax_rule|number_format}-->
<!--{else}-->
<!--{$price02|sfPreTax:$arrInfo.tax:$arrInfo.tax_rule|number_format}-->
<!--{/if}-->円
</span>
</p>
<p class="mini"><!--{$arrBestProducts[cnt].comment|escape|nl2br}--></p>
</div>
</div>
<!--{if $smarty.section.cnt.iteration % 5 == 0 and $smarty.section.cnt.last == false}--><br class="clear"><!--{else}--><!--{/if}-->
<!--{/section}-->
</div>
<!--{/if}-->
<!--▲おすすめ情報ここまで-->


-----------
このソースを忘れていました。↓
<!--{if $smarty.section.cnt.iteration % 5 == 0 and $smarty.section.cnt.last == false}--><!--ここに改行したい場所で表示させるhtml--><br class="clear"><!--{else}--><!--ここに改行させない間の商品表示用のソース--><!--{/if}-->

説明も付記しておきますね。

元のオススメソースから商品データを2個飛ばしとか3個飛ばしで表示させるstep=2などの処理を一旦削除し、max=で指定した数まで1行に商品をずらっと表示させます。
その後、上記ソースで、全体の商品数を%5と指定した数(=つまり改行したい数)で割って、割り切れるところまたは最後に改行するHTMLソースを入れるようにしています。

%5を%7にすれば7つで1行です。
<!--{if $smarty.section.cnt.iterationから<!--{/if}-->までを<!--{/section}-->の手前に置いて、改行位置に<br />などのタグを入れるということができます。<!--{section}-->内で使用します。

私の場合は、表示させたい1行の数が多くなると、step数を矛盾なく変えるつじつま合わせに毎回苦労したのと、ここのリストアップのソースを変えて<li>タグなどで1商品リストにすることもあるので、このようにしました。

左列と右列で背景色を交互にしたいといった場合は、step、同じ表示を繰り返して、折り返しのところだけhtmlタグを入れたい(または変えたい)ときは、iterationを使うといいかもしれません。


step数を変える場合とiterationを使った場合と、そのときによって使いたい方法が違うかもしれませんが、一案ということで。(^^)

思ったとおり実現できて良かったですね!!
ecbg
投稿日時: 2009/3/12 17:45
対応状況: 解決済
仙人
登録日: 2009/2/25
居住地: 東京
投稿: 387
Re: おすすめ商品の表示を変えたい
>tontonさん

ご丁寧に説明までつけて頂いて、本当にありがとうございます。
私もSmarty関数を把握して、自在にデザインできるようになりたいです。

また分からない時などご教授頂けましたら幸いです!
ecnobu
投稿日時: 2009/7/22 21:06
対応状況: −−−
半人前
登録日: 2009/6/4
居住地:
投稿: 23
Re: おすすめ商品の表示を変えたい
お世話になります。

私も、おすすめ商品の列数を4列にしたくて、こちらを拝見し、やってみたのですが、4列ではなく、4行(1行1商品)しか表示されません。
ちなみに、こちらのソースを全くコピーしてやってみたのですが、やはり5行(1行1商品)しか表示されません。

バージョンの違いで違ったりするものでしょうか?

-------
EC-CUBE 2.4.1
OS Linux
DB PostgreSQL 8.3.7
Web Apache/2.2.9
-------
ecbg
投稿日時: 2009/7/22 21:26
対応状況: −−−
仙人
登録日: 2009/2/25
居住地: 東京
投稿: 387
Re: おすすめ商品の表示を変えたい
参照先の方法は、もしかしたら見るブラウザによって上手く表示されないかもしれませんね。

できればテンプレートは完全に書き直したほうが早いと思います。

下記のサイトとか、フォーラムで書かれていた新入荷ブロックのテンプレートとか参考になるかもしれません。
http://www.eccube-school.jp/products/detail46.html

Smartyも結果的にhtmlを記述するだけなので<div>や<table>の知識があれば、自分で色々試してみるのも勉強になると思いますよ。
(1) 2 »
スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ


 



ログイン


EC-CUBE公式 Amazon Payプラグイン

統計情報

総メンバー数は88,288名です
総投稿数は109,688件です

投稿数ランキング

1
seasoft
7365
2
468
3217
3
AMUAMU
2712
4
nanasess
2303
5
umebius
2085
6
yuh
1818
7
h_tanaka
1610
8
red
1567
9
mcontact
1240
10
tsuji
958
11
fukap
907
12
shutta
835
13
tao_s
796
14 ramrun 789
15 karin 689
16 sumida 641
17
homan
633
18 DELIGHT 572
19
patapata
502
20
flealog
485


ネットショップの壺

EC-CUBEインテグレートパートナー

Copyright© EC-CUBE CO.,LTD. All Rights Reserved.