質問 > フロント機能 > 商品ステータスの位置を名前の横にしたい |
フロント機能
スレッド表示 | 新しいものから | 前のトピック | 次のトピック | 下へ |
投稿者 | スレッド |
---|---|
anpan |
投稿日時: 2013/3/11 16:21
対応状況: −−−
|
半人前 登録日: 2013/2/26 居住地: 投稿: 12 |
商品ステータスの位置を名前の横にしたい はじめまして。
eccubeの存在を知ってからphpなどの勉強を始めたweb作成初心者です。 環境はxamppです。 システム情報 EC-CUBEバージョン 2.12.3 PHPバージョン PHP 5.3.5 DBバージョン MySQL 5.5.8 商品一覧ページを表示したときにリストの商品名のツラが合うようにしたいのです。 つまり、「オススメ」とか「NEW」などの商品ステータスが商品名の後にくるようにしたいのですが(下の段ではなく同じ行にということです)、どうすればできますか? /data/Smarty/templates/default/products/list.tpl と /html/user_data/packages/default/css/contents.css をいじってみるものの結果が出ていません。 宜しくお願いいたします。 |
dimaggio |
投稿日時: 2013/3/11 16:39
対応状況: −−−
|
一人前 登録日: 2011/3/30 居住地: Tokyo 投稿: 120 |
Re: 商品ステータスの位置を名前の横にしたい /data/Smarty/templates/default/products/list.tplの
156行目〜166行目を、172行目の<!--★価格★-->の前に移動させても、並び順は変わらない感じですかね。
|
anpan |
投稿日時: 2013/3/11 17:01
対応状況: −−−
|
半人前 登録日: 2013/2/26 居住地: 投稿: 12 |
Re: 商品ステータスの位置を名前の横にしたい dimaggio様、ありがとうございます。
list.tplの今みているものがすでに書き込み等してありオリジナルでないので確認ですが、 <!--▼商品ステータス-->から<!--▲商品ステータス-->を<!--★価格★-->の前に、ということでしょうか。 もしそうでしたら、残念ながら 【商品名】 【商品ステータス】 【価格】 となってしまい、イメージしている 【商品名】【商品ステータス】 【価格】 とは表示されておりません。 ありがとうございました。 |
kato-sc |
投稿日時: 2013/3/11 18:50
対応状況: −−−
|
一人前 登録日: 2013/1/15 居住地: 投稿: 87 |
Re: 商品ステータスの位置を名前の横にしたい dimaggio様が仰っているtplの変更とあわせ、CSSの変更が必要です。
対象のCSSファイルは/html/user_data/packeges/default/css/contents.cssとなります。 次の場所を、以下の様に変更して見て下さい。 (行番は参考程度でお願いします) ・262行目 /* 商品名 */ div.listrightbloc h3 { font-weight: bold; font-size: 120%; float:left; margin:0 20px 0 0; } ・284行目 /* 価格 */ div.listrightbloc .pricebox { margin: 0 0 10px 0; clear:left; } 「div.listrightbloc h3」のmargin:0 20px 0 0;を調整する事で、商品名とアイコンのスペースを調整する事ができます。 ※商品名が長くなった場合カラム落ちして表示が崩れる可能性がある事をご理解下さい。 |
dimaggio |
投稿日時: 2013/3/11 19:37
対応状況: −−−
|
一人前 登録日: 2011/3/30 居住地: Tokyo 投稿: 120 |
Re: 商品ステータスの位置を名前の横にしたい 言葉足らずですみません。
kato-sc様がご指摘のように、<ul class="status_icon clearfix">商品ステータス</ul>と<h3><a>商品名</a></h3>の順序は.tplで変更し、<h3>タグによる改行などはCSSで調整する必要があります。
|
anpan |
投稿日時: 2013/3/12 4:35
対応状況: 解決済
|
半人前 登録日: 2013/2/26 居住地: 投稿: 12 |
Re: 商品ステータスの位置を名前の横にしたい kato-sc様、ありがとうございます。
ご指摘いただいた箇所を変更したところ、イメージ通りに表示されました。 floatの使い方が適切でなかったことも原因でした。 あわせてcssも勉強します。 ありがとうございました。 |
anpan |
投稿日時: 2013/3/12 4:49
対応状況: 解決済
|
半人前 登録日: 2013/2/26 居住地: 投稿: 12 |
Re: 商品ステータスの位置を名前の横にしたい dimaggio様、ありがとうございます。
同じ行にのせるだけだからと.tplの商品名と商品ステータスのところだけをいじって表示できるのではと思い込んでいたのが間違いの元でした。 あわせてcssの使い方も勉強します。 ありがとうございました。 |
スレッド表示 | 新しいものから | 前のトピック | 次のトピック | トップ |