EC-CUBE4 – 商品詳細ページの規格価格表示

EC-CUBE4の商品詳細ページで、設定された規格を選んだ際に価格が自動で切り替わります。
その表示内容をカスタマイズした際の覚書です。
ちょっとJSいじれるレベルの方向けです。

該当JSファイルは

/html/template/mytpl/assets/js/eccube.js です。

でも直接いじるのは後々面倒なことになるかと思い、該当部分をcustomize.jsにコピペして修正しました。
通常、規格が設定してあると「¥〇〇〜△△」と表示され、規格を選ぶと「¥〇〇」に自動で切り替わります。
問題点は、ページ管理で商品詳細ページをカスタマイズしているため、自動で切り替わる内容が合わなくなっていました。

具体的には

  • 「¥」を「円」表示にしていたのに、自動で切り替わるのは「¥」表示。
  • 税別価格と税込価格を表示していたのに、税別価格だけ税込価格に切り替わってしまう。
    例:「〇〇〜△△円(税込 ◎◎〜▲▲円)」→「¥▲▲(税込 ◎◎〜▲▲円)」

では実際にどこを直したかです。
見ればわかると思いますので解説は割愛します。

 

コンテンツ管理 – JavaScript管理


/html/template/mytpl/assets/js/eccube.js から 該当箇所をコピペします。

以下の赤文字部分が修正した箇所です。参考まで。
※今回は通常価格を使用していません。

 

/**
* 規格の選択状態に応じて, フィールドを設定する.
*/
var price02_origin = [];
var price02taxinc_origin = []; /*上部を参考に消費税込みのオリジナルを定義*/
eccube.checkStock = function($form, product_id, classcat_id1, classcat_id2) {

……… 省略 ………

// 在庫(品切れ)

……… 省略 ………

// 通常価格

……… 省略 ………

// 販売価格
var $price02 = $form.parent().find(‘.price02-default’).first();
var $price02taxinc = $form.parent().find(‘.price_taxinclude’).first(); /*切り替え前に表示されていた内容を取得*/
if (typeof price02_origin[product_id] === ‘undefined’) {
// 初期値を保持しておく
price02_origin[product_id] = $price02.text();
price02taxinc_origin[product_id] = $price02taxinc.text();
}
$price02.text(price02_origin[product_id]);
$price02taxinc.text(price02taxinc_origin[product_id]);

// 商品規格

……… 省略 ………

// 在庫(品切れ)

……… 省略 ………

// 通常価格

……… 省略 ………

 

// 販売価格
var $price02 = $form.parent().find(‘.price02-default’).first();
var $price02taxinc = $form.parent().find(‘.price_taxinclude’).first(); /*切り替え前に表示されていた内容を取得*/
if (typeof price02_origin[product_id] === ‘undefined’) {
// 初期値を保持しておく
price02_origin[product_id] = $price02.text();
price02taxinc_origin[product_id] = $price02taxinc.text();
}
if (classcat2 && typeof classcat2.price02_inc_tax !== ‘undefined’ && String(classcat2.price02_inc_tax).length >= 1) {
$price02.text(classcat2.price02 + ‘円’);
$price02taxinc.text(‘(税込 ‘ + classcat2.price02_inc_tax + ‘円)’);
} else {
$price02.text(price02_origin[product_id]);
$price02taxinc.text(price02taxinc_origin[product_id]);
}

// ポイント

……… 省略 ………

// 商品規格

……… 省略 ………

}

以上です。

当サイトでは何の保証もいたしませんので、十分にテストされてから本番環境に実装してください。
何か不備を発見の際はご教示いただければ幸いです。

Follow me!

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA