「ECCUBE」タグアーカイブ

EC-CUBE 2.11.x – 3.0系で商品詳細サブ画像を3列表示に

商品詳細サブ画像を3列表示

元々、EC CUBEの商品詳細ページは、サブ画像とかサブコメントは縦に一列に並ぶことになる。
ちょっと野暮ったいので、3列になるようにしてみた。
eccube-3retsu
こんな感じ。

 

phpファイルのカスタマイズ方法

products/detail.phpの部分。管理画面のデザイン管理から行くと、「商品詳細ページ」のページ詳細編集から。
 
「詳細」と「お客様の声」の間の部分。

—————————————————————

<!–▼サブコメントここから–>
<!–{section name=cnt loop=$smarty.const.PRODUCTSUB_MAX}–>
<!–{assign var=key value=”sub_title`$smarty.section.cnt.index+1`”}–>
<div class=”productsubarea”><!–{if $arrProduct[$key] != “”}–>
<h3><!–★サブタイトル★–><!–{$arrProduct[$key]|h}–></h3>
<!–{/if}–>
<!–{assign var=ckey value=”sub_comment`$smarty.section.cnt.index+1`”}–>
<!–▼サブ画像–>
<!–{assign var=key value=”sub_image`$smarty.section.cnt.index+1`”}–>
<!–{assign var=lkey value=”sub_large_image`$smarty.section.cnt.index+1`”}–>

<!–{if $arrProduct[$key]|strlen >= 1}–>

<!–{if $arrProduct[$ckey] != “”}–>
<div class=”productsubtext”><!–★サブテキスト★–><!–{$arrProduct[$ckey]|nl2br_html}–></div>
<!–{/if}–>
<div class=”productsubphotoimg”><!–{if $arrProduct[$lkey]|strlen >= 1}–>
<a class=”expansion” href=”&lt;!–{$smarty.const.IMAGE_SAVE_URLPATH}–&gt;&lt;!–{$arrProduct[$lkey]|h}–&gt;” target=”_blank”>
<!–{/if}–>
<img src=”&lt;!–{$arrFile[$key].filepath}–&gt;” alt=”&lt;!–{$arrProduct.name|h}–&gt;” width=”&lt;!–{$arrFile[$key].width}–&gt;” height=”&lt;!–{$arrFile[$key].height}–&gt;” /></a><!–{if $arrProduct[$lkey]|strlen >= 1}–>
<span class=”mini”>

<a class=”expansion” href=”&lt;!–{$smarty.const.IMAGE_SAVE_URLPATH}–&gt;&lt;!–{$arrProduct[$lkey]|h}–&gt;” target=”_blank”>
画像を拡大する</a>
</span>
<!–{/if}–></div>
<!–{else}–>
<p class=”subtext”><!–★サブテキスト★–><!–{$arrProduct[$ckey]|nl2br_html}–></p>
<!–{/if}–>
<!–▲サブ画像–>

</div>
<!–{ if $smarty.section.cnt.iteration is div by 3 }–>
<br clear=”all” />
<!–{/if}–>

<!–{/section}–>
<!–▲サブコメント–>

—————————————————————

簡単に言うと、詳細画面の画像を横に並べ、カウントが3になったら改行を入れるという処理をする。

CSSに以下の分を追加。お好みで適当に調節して。
—————————————–

div.productsubarea {
width:30%;
float:left;
height:290px;
margin-right:3%;
}

div.productsubphotoimg {

}

div.productsubtext {
height:3em;
}

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

単純にコピペすれば大丈夫なはず。

EC CUBE 商品送料で商品ごとに送料を入力できるようにするカスタマイズメモ

ECCUBEの商品送料、個別送料や基本送料をカスタマイズ

EC CUBEのバージョンは2.4.4。

最終目標は、管理画面で、商品個別の送料が入力できるようにする。

カスタマイズする箇所は4か所。

 

1.元々ある作りかけの商品送料の部分を有効にする

/data/Smarty/templates/default/admin/products/product.tpl

コメントになっている商品送料のコメントを外す(185行目)

<!– ここから商品送料 –>
<tr class=”fs12n”>
<td bgcolor=”#f2f1ec” width=”160″>商品送料</td>
<td bgcolor=”#ffffff” width=”557″>
<span class=”red12″><!–{$arrErr.deliv_fee}–></span>
<input type=”text” name=”deliv_fee”
value=”<!–{$arrForm.deliv_fee|escape}–>” size=”6″
class=”box6″ maxlength=”<!–{$smarty.const.PRICE_LEN}–>”
style=”<!–{if $arrErr.deliv_fee != “”}–>background-color: <!–{$smarty.const.ERR_COLOR}–><!–{/if}–>”/>円
<span class=”red10″> (半角数字で入力)</span></td>
</td>
</tr>
<!– ここまで商品送料 –>

 

2.アドミン画面に入力用のテキストボックス(フォーム)を作る

/data/Smarty/templates/default/admin/products/confirm.tpl

在庫数とポイント付与率の間に追加する。(129行目)

<tr>
<td bgcolor=”#f2f1ec” width=”160″ class=”fs12n”>在庫数</td>
<td bgcolor=”#ffffff” width=”557″ class=”fs12n”>
<!–{if $arrForm.stock_unlimited == 1}–>
無制限
<!–{else}–>
<!–{$arrForm.stock|escape}–>
個<!–{/if}–>
</td>
</tr>
<!–{/if}–>
<!– 商品送料の確認画面 –>
<tr>
<td bgcolor=”#f2f1ec” width=”160″ class=”fs12n”>商品送料</td>
<td bgcolor=”#ffffff” width=”557″ class=”fs12n”>
<!–{$arrForm.deliv_fee|escape}–>
円</td>
</tr>
<!– 商品送料の確認画面 –>
<tr>
<td bgcolor=”#f2f1ec” width=”160″ class=”fs12n”>ポイント付与率</td>
<td bgcolor=”#ffffff” width=”557″ class=”fs12n”>
<!–{$arrForm.point_rate|escape}–>
%</td>
</tr>

 

3.送料の計算の部分に、個別商品を追加する計算式を追加

/data/class_extends/helper_extends/SC_Helper_DB_Ex.php

送料計算式をカスタマイズ。

$objPage->tpl_total_deliv_fee に、カートに入った商品の、商品送料deliv_feeの合計が格納されている。

/httpdocs/data/class/helper/SC_Helper_DB.php
から、function sfTotalConfirmの部分(1467~1536行目)をすべて

SC_Helper_DB_Ex.php の
class SC_Helper_DB_Ex extends SC_Helper_DB {
}
?>
の間にコピーし、以下の部分(55行目(コピペの仕方により変動する))を変更。

// 商品ごとの送料が有効の場合
if (OPTION_PRODUCT_DELIV_FEE == 1) {
$arrData[‘deliv_fee’]+= $objPage->tpl_total_deliv_fee;
//$objCartSess->getAllProductsDelivFee();
}

 

コピペ後はこんな感じになるはず↓

 

class SC_Helper_DB_Ex extends SC_Helper_DB {
function sfTotalConfirm($arrData, &$objPage, &$objCartSess, $arrInfo, $objCustomer = “”) {
// 未定義変数を定義

—–中略—–

$arrData[‘add_point’] = 0;
}
return $arrData;
}
}
?>

 

4.パラメーターで個別送料を有効にしておく

管理画面の[システム設定]-[パラメータ設定]で「OPTION_PRODUCT_DELIV_FEE」を’1’にする。

これでおしまい。

合計送料X = 配送業者送料A + 商品送料合計n(今追加した分) で算出されるようになる。

配送業者送料A を地域別に設定。

大きいものa と小さいものb を購入された場合、n(a)に500、n(b)に0 を入れておけば、
X = A + n(a) + n(b) となるので、n(b)が0なので追加送料は発生しない。
一方大きいものを2つ購入された場合は、n(a)+n(a’) となり、送料は加算される。
また、小さいものを1つ購入された場合は、X = A + n(b) なので A がそのまま送料とになる。

ECCUBE スマホサイトのカスタマイズ。リンクの色を変えるには

ECCUBE 2.11.4-2.13系まで確認

ECCUBEのスマホサイトのカスタマイズ。元々完成度はかなり高いが、少しカスタマイズしてみた。

文字リンクの色。まず、
/ドメイン名/user_data/css/common.css
a:link
とかを変えても何もスマホサイトには影響しない。

ソースを辿ってみると、どうやら、

/ドメイン名/user_data/packages/sphone/css/jqm.css
の一番下。
.ui-link:link
の部分でスマホサイトのリンクの色を制御している。

うーむ。分かりにくい!