WCEX SKU Select をご利用になる前に以下の内容をお読みください。
ご利用環境
対応するバージョンは次の通りです。
WCEX SKU Select | Welcart | PHP |
1.4.5~1.4.0 | 2.11、2.10、2.9 | 8.1 |
2.8 | 8.0 | |
2.7 | 7.4 | |
1.3.2~1.3.0 | 2.6 | |
1.2.2~1.2.1 | 2.3.4 | |
2.1.5 | 7.3,7.2 | |
1.2.0 | 2.0.0 | |
1.1.9~1.1.5 | 1.9.32 | |
1.9.19 | ||
1.1.4~1.1.0 | 1.9.14 | |
1.9.6 | 7.0 |
制限事項と注意
ダウンロードコンテンツ商品について
ダウンロードコンテンツ商品は複数SKUに対応していないため、WCEX SKU Select の機能を利用できません。
CSVアップロードによる商品データ更新について
WCEX SKU Select に関するデータ(SKUセレクトの使用、表示形式、選択項目、SKU Paternkey)はCSVアップロードでは登録・編集ができません。 CSVアップロードによる商品データの更新を行う際にSKUコードの変更やSKUの数の増減を行いますと、 既に登録されている WCEX SKU Select に関するデータと整合性がとれなくなりますので、行わないようご注意ください。SKUコードが 0:0 という文字列になっていますと、CSVをエクセルで開いた時に、エクセルの自動変換機能が働いて 0:00 のように文字列が変えられてしまいます。このように書き換わってしまいますと、CSVをアップロードした際に、正しくSKUセレクトが動作しなくなってしまいます。
WCEX SKU Select 1.1 から、SKUコードの初期値は code0:0 のように、エクセルで変換されないような文字列に変更しました。特に旧バージョン(WCEX SKU Select 1.0)からアップグレードされた方は、SKUコードが 0:0 になっていますので、CSVで編集する場合は十分ご注意ください。
WCEX SKU Select 1.1 では、SKUコードを自由に変更できます。管理画面の方から生成されたSKUコードを変更してご利用ください。
SKUの登録について(v1.4.3~)
商品コードなどが確定されていないと WCEX SKU Select 用のSKUを作成することができません。新たな商品を登録する場合は、まず [下書き保存] もしくは [公開] を押して商品を確定させてください。
Welcart 専用公式テーマの場合
弊社で販売している公式テーマに関しては、テーマに専用のテンプレート「wc_sku_select.php」が同梱されています。
各テーマでテンプレートにアップデートがあった場合は、各テーマの最新版をダウンロードしてファイル内の以下のテンプレートファイルをご利用中のテーマ内にコピーしてください。
SKU Select 専用 商品詳細ページ(物販) | wc_templates/wc_sku_select.php |
---|---|
SKU Select 専用 商品詳細ページ(サービス) ※DL Sellerを導入している場合必要になります。 | wc_templates/wc_sku_select_service.php |
CSS | wcex_sku_select.css |
オリジナルテーマで利用する場合
SKUセレクト機能を使用する商品の商品詳細ページは WCEX SKU Select に内蔵されている「wc_sku_select.php」が読み込まれ、表示されます。
内蔵されている「wc_sku_select.php」は Welcart Basic テーマに合わせたものですので、オリジナルのテーマをご利用の場合は下記を参照してください。
ご利用中のテーマにおいて「wc_item_single.php」を設置していない場合、下記の作業は必要ありません。ただし、若干のスタイル修正は必要になるかもしれませんので、適宜修正してください。
1. テーマに SKU Select 専用のテンプレートファイルを作成
ご利用のテーマにある「wc_item_single.php」をコピーして、コピーしたファイルを「wc_sku_select.php」とリネームしてください。
「wc_sku_select.php」の設置場所は以下のとおりになります。
/wp-content/themes/[ご利用のテーマ]/wc_templates/wc_sku_select.php |
2. 単一SKUと複数SKUの表示を統一
ここから WCEX SKU Select を動作させるために「wc_sku_select.php」のマークアップを修正します。
単一SKUと複数SKUで商品詳細ページの表示を分けているようなテーマの場合、統一する必要があります。
2.1. 下記の灰色の部分を全て削除します。
<?php if(usces_sku_num() === 1) : usces_have_skus(); ?>
~ 中略 ~
<?php elseif(usces_sku_num() > 1) : usces_have_skus(); ?>
~ 中略 ~
<?php endif; ?>
2.2. 「usces_the_item()」の下に「usces_have_skus()」を追記します。
<?php usces_the_item(); ?>
<?php usces_have_skus(); ?>
2.3. 「id=”skuform”」の付与
form タグの直下にある div タグに「id=”skuform”」を付与します。
<form action="<?php echo USCES_CART_URL; ?>" method="post">
<?php usces_the_itemGpExp(); ?>
<div id="skuform" class="skuform" align="right">
~ 中略 ~
</div>
</form>
2.4. プルダウン・ラジオボタン形式のSKU表示
SKUをプルダウンやラジオボタンを表示するための関数「wcex_sku_select_form()」を記述します。
この関数は必ず「id=”skuform”」を付与したタグの中に記述してください。
<form action="<?php echo USCES_CART_URL; ?>" method="post">
<?php usces_the_itemGpExp(); ?>
<div id="skuform" class="skuform" align="right">
<?php wcex_sku_select_form(); ?>
~ 中略 ~
</div>
</form>
2.5. 業務パック割引の修正 ※1.1.0からの追加機能
WCEX SKU Select 専用の業務パック割引のタグに変更する必要があります。
<?php usces_the_itemGpExp(); ?>
↓
<?php wcex_sku_select_the_itemGpExp(); ?>
2.6. 価格部分の修正
通常価格を括るタグに「class=”ss_cprice”」、販売価格を括るタグに「class=”ss_price”」をそれぞれ付与してください。
商品詳細ページにて、プルダウン・ラジオボタンの値を変更した時に価格を切り替えるために必要なクラス名になります。
<div class="field">
<?php if( usces_the_itemCprice('return') > 0 ) : ?>
<div class="field_name"><?php _e('List price', 'usces'); ?><?php usces_guid_tax(); ?></div>
<div class="field_cprice"><span class="ss_cprice"><?php usces_the_itemCpriceCr(); ?></span></div>
<?php endif; ?>
<div class="field_name"><?php _e('selling price', 'usces'); ?><?php usces_guid_tax(); ?></div>
<div class="field_price"><span class="ss_price"><?php usces_the_itemPriceCr(); ?></span></div>
</div>
2.7. 在庫状態の修正
在庫状態は「usces_the_itemZaikoStatus()」という関数と、「usces_get_itemZaiko(‘name’)」という関数で出力している箇所があるので、それぞれに「class=”ss_stockstatus”」を割り当てます。
「ss_stockstatus」クラスは在庫状態を切り替え得るために必要なクラスです。
<div class="field"><?php _e('stock status', 'usces'); ?> : <span class="ss_stockstatus"><?php usces_the_itemZaikoStatus(); ?></span></div>
↓
<div class="zaiko_status"><span class="ss_stockstatus"><?php echo apply_filters('usces_filters_single_sku_zaiko_message', esc_html(usces_get_itemZaiko( 'name' ))); ?></span></div>
2.8. 単位の修正 ※1.4.5からの追加機能
単位を括るタグに「class=”unit”」を付与してください。
商品詳細ページにて、プルダウン・ラジオボタンの値を変更した時に単位を切り替えるために必要なクラス名になります。
<?php usces_the_itemSkuUnit(); ?>
↓
<span class="unit"><?php usces_the_itemSkuUnit(); ?></span>
2.9. カートボタンの修正
「usces_have_zaiko()」関数を使って在庫がある場合はカートを表示、在庫がない場合はカートボタンを表示させず売り切れ表示している記述箇所を修正します。
SKUセレクト商品の場合は、在庫有り・無しの切り替えを JavaScript で切り替えることになるので、灰色の部分の条件分岐を削除します。
そして、在庫がない場合に表示する要素を囲っているタグには「class=”itemsoldout”」を付与し、在庫有りの場合に表示する要素を囲っているタグには「class=”c-box”」を付与します。
<?php if( !usces_have_zaiko() ) : ?>
<div class="zaiko_status itemsoldout"><span class="ss_stockstatus"><?php echo apply_filters('usces_filters_single_sku_zaiko_message', esc_html(usces_get_itemZaiko( 'name' ))); ?></span></div>
<?php else : ?>
<div style="margin-top:10px" class="c-box"><?php _e('Quantity', 'usces'); ?><?php usces_the_itemQuant(); ?><?php usces_the_itemSkuUnit(); ?><?php usces_the_itemSkuButton(__('Add to Shopping Cart', 'usces'), 0); ?></div>
<div class="error_message"><?php usces_singleitem_error_message($post->ID, usces_the_itemSku('return')); ?></div>
<?php endif; ?>
2.10. loading 画像の設置
「id=”skuform”」を付与したタグの中に記述すると、価格などを切り替えている際に loading 画像が表示されます。
「wcex_sku_select_form()」タグのすぐ後ろなどがわかりやすいかと思います。
<form action="<?php echo USCES_CART_URL; ?>" method="post">
<?php usces_the_itemGpExp(); ?>
<div id="skuform" class="skuform" align="right">
<?php wcex_sku_select_form(); ?>
<div class="wcss_loading"></div>
~ 中略 ~
</div>
</form>
WCEX Auto Delivery を利用していた場合
WCEX Auto Delivery をご利用の場合で、「wcad_filter_item_single_regular」というフックを使って定期購入表示をオリジナルのマークアップに変更されている場合は以下の修正も必要です。
1. SKU Select 用のカスタマイズを追加
これまで定期購入の箇所を表示していた「wcad_filter_item_single_regular」を利用してカスタマイズしていた関数をそのままコピーし、フィルターフック名と関数名を修正してください。
※「wcad_filter_item_single_regular」フックを使ってカスタマイズしている箇所は残しておく
カスタマイズファイル(function.php等)に追記
add_action( 'wcex_sku_select_filter_single_item_autodelivery', 'my_sku_select_autodelivery' );
function my_sku_select_autodelivery(){
~ 中略 ~
}
2. 単一SKUと複数SKUの表示を統一
単一SKUと複数SKUで表示を分けている場合は統一します。
2.1. 下記の灰色の部分を全て削除します。
my_sku_select_autodelivery()内
if( usces_sku_num() === 1 ) :
if( usces_have_zaiko() ) :
~ 中略 ~
endif;
elseif( usces_sku_num() > 1 ) :
if( usces_have_zaiko_anyone( $post->ID ) ) :
usces_the_item();
~ 中略 ~
endif;
endif;
2.2.上記の「if( usces_have_zaiko() ) : 」を変更します。
my_sku_select_autodelivery()内
if( usces_have_zaiko_anyone( $post->ID ) ) :
usces_the_item();
endif;
2.3. 「id=”skuform_regular”」の付与
form タグの直下にある div タグに「id=”skuform_regular”」を付与します。
my_sku_select_autodelivery()内
<form action="<?php echo USCES_CART_URL; ?>" method="post">
<?php usces_the_itemGpExp(); ?>
<div id="skuform_regular" class="skuform" align="right">
~ 中略 ~
</div>
</form>
2.4. プルダウン・ラジオボタン形式のSKU表示
SKUセレクトのプルダウンや・ラジオボタンを表示するための関数「wcex_auto_delivery_sku_select_form()」を記述します。
この関数は必ず「id=”skuform_regular”」を付与したタグの中に記述してください。
my_sku_select_autodelivery()内
<form action="<?php echo USCES_CART_URL; ?>" method="post">
<?php usces_the_itemGpExp(); ?>
<div id="skuform" class="skuform" align="right">
<?php wcex_auto_delivery_sku_select_form(); ?>
~ 中略 ~
</div>
2.5. 業務パック割引の修正 ※1.1.0からの追加機能
SKUセレクト専用の業務パック割引のタグを追加する必要があります。商品オプションの下などに配置してください。
my_sku_select_autodelivery()内
<?php wcex_sku_select_the_itemGpExp( '', true ); ?>
2.6. 価格部分の修正
定期購入の販売価格を括るタグに「class=”ss_price_regular”」を付与してください。
商品詳細ページにて、プルダウン・ラジオボタンの値を変更した時に価格を切り替えるために必要なクラス名になります。
my_sku_select_autodelivery()内
<div class="field">
<div class="field_name"><?php _e('regular purchase price', 'autodelivery'); ?><?php usces_guid_tax(); ?></div>
<div class="field_price"><span class="ss_price_regular"><?php wcad_the_itemPriceCr(); ?></span></div>
</div>
2.7. 在庫状態の修正
在庫状態を括るタグに「class=”ss_stockstatus_regular”」を付与してください。
商品詳細ページにて、プルダウン・ラジオボタンの値を変更した時に在庫状態を切り替えるために必要なクラス名になります。
my_sku_select_autodelivery()内
<span class="ss_stockstatus_regular"><?php echo apply_filters('usces_filters_single_sku_zaiko_message', esc_html(usces_get_itemZaiko( 'name' ))); ?></span>
2.8. 単位の修正 ※1.4.5からの追加機能
単位を括るタグに「class=”unit_regular”」を付与してください。通常販売の単位に付与する class とは異なるので注意してください。
商品詳細ページにて、プルダウン・ラジオボタンの値を変更した時に単位を切り替えるために必要なクラス名になります。
my_sku_select_autodelivery()内
<span class="unit_regular"><?php usces_the_itemSkuUnit(); ?></span>
2.9. カートボタンの修正
在庫がない場合に表示する要素を囲っているタグには「class=”itemsoldout”」を付与し、在庫有りの場合に表示する要素を囲っているタグには「class=”c-box”」を付与します。
my_sku_select_autodelivery()内
<div class="zaiko_status itemsoldout"><span class="ss_stockstatus_regular"><?php echo apply_filters('usces_filters_single_sku_zaiko_message', esc_html(usces_get_itemZaiko( 'name' ))); ?></span></div>
<div style="margin-top:10px" class="c-box"><?php _e('Quantity', 'usces'); ?><?php wcad_the_itemQuant(); ?><?php usces_the_itemSkuUnit(); ?><?php wcad_the_itemSkuButton(__('Apply for a regular purchase', 'autodelivery'), 0); ?></div>
<div class="error_message"><?php usces_singleitem_error_message($post->ID, usces_the_itemSku('return')); ?></div>
2.10. loading画像の設置
「id=”skuform”」を付与したタグの中に記述すると、価格などを切り替えている際に loading 画像が表示されます。
「wcex_sku_select_form()」タグのすぐ後ろなどがわかりやすいかと思います。
my_sku_select_autodelivery()内
<form action="<?php echo USCES_CART_URL; ?>" method="post">
<?php usces_the_itemGpExp(); ?>
<div id="skuform" class="skuform" align="right">
<?php wcex_sku_select_form(); ?>
<div class="wcss_loading"></div>
~ 中略 ~
</div>
</form>
ライセンス
このプラグインのライセンスは GPL となっております。
営利・非営利問わずご利用いただけますが、このパッケージ自体をそのまま再販することはできません。 また、正規に購入していただいた方のみがアップデートを行うことができます。詳しくは「拡張プラグイン・テーマのご利用条件」をご覧ください。
著作権
著作権は、株式会社Welcartに帰属します。
免責
このプログラムを利用して起こったいかなる損害も補償は致しかねます。ご利用に際しましては使い方、注意事項をよくご確認ください。またカスタマイズを行う場合は、脆弱性を十分に考慮して行なわれますようご注意ください。
お問い合わせ
このプラグインについてのご不明な点は、「開発フォーラム-拡張プラグイン」にてご質問ください。
ご希望の機能が付いているかお確かめの上、十分に納得されてからご購入くださいますようお願いいたします。
この商品のサポートについては、「サポートポリシー」をご覧ください。
※30日間のサポート期間中は、ご購入いただいたプラグインの不具合報告、操作方法についてのお問い合わせのみ対象となります。
※以降のメールサポートは有償となりますのでご了承ください。