welcart:商品一覧でSKUが複数ある商品はSKUごとの価格を表示する

2016/02/21

Works

welcart:商品一覧でSKUが複数ある商品はSKUごとの価格を表示する

Tag: Welcart

welcartの商品一覧で各SKUごとの価格を表示させたいと思います。

SKUの価格が同じならいいのですが、SKUごとに価格が違うとやっぱりそれぞれの価格を表示させたいですよね。

ここではSKUが複数登録されている場合、そのSKU全てを表示するようカスタムしていきます。

表示イメージ

こんな感じにします。

左が複数SKU、右が1つ。

商品データ

商品データはこんな感じで登録しています。

使用したテーマ

このカスタマイズで使用したテーマは「Welcart Basic」という無料のテーマです。結構いい感じ。

Welcart 専用親テーマ　Welcart Basic | Welcart Home ショッピングカート for WordPress

category.php

商品一覧なのでcategory.phpです。
デフォルトテーマの場合はitem-category.phpですかね。

<?php while (have_posts()) : the_post(); ?>
    <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

        <div class="itemimg"><a href="<?php the_permalink() ?>"><?php usces_the_itemImage(0, 300, 300); ?></a></div>
        <p><a href="<?php the_permalink() ?>"  rel="bookmark"><b><?php usces_the_itemName(); ?></b></a></p>

        <?php
            $skus = get_post_meta($post->ID,'_isku_');
            if( count( $skus ) > 1 ) : //SKUが2つ以上の場合
                usces_the_item();
                while ( usces_have_skus() ) : //SKUのループ
        ?>

        <dl>
            <dt><?php usces_the_itemSkuDisp(); ?></dt>
            <dd><span class="itemprice"><?php usces_the_itemPriceCr(); ?></span><?php usces_guid_tax(); ?></dd>
            <?php if(! usces_have_zaiko() ) : ?>
            <dd><span class="itemsoldout"><?php _e('Sold Out', 'usces' ); ?></span></dd>
            <?php endif; ?>
        </dl>

        <?php endwhile; //SKUのループ終了 ?>

        <?php else: //SKUが1つの場合 ?>

        <div class="itemprice"><?php usces_crform( usces_the_firstPrice('return'), true, false ); usces_guid_tax(); ?></div>
        <?php if(! usces_have_zaiko_anyone() ) : ?>
        <div class="itemsoldout"><?php _e('Sold Out', 'usces' ); ?></div>
        <?php endif; ?>

        <?php endif; ?>


    </article>
<?php endwhile; ?>

while (have_posts())の中身を書き換えていきます。

やり方はいろいろあるかと思いますが、welcartで用意された関数を使いながらやっていきます。

7行目から

追加するのはこの行からです。

SKUの数を調べて分岐

$skus = get_post_meta($post->ID,'_isku_');
if( count( $skus ) > 1 ) :

SKUの数を取る関数ってwelcartで用意されてたかもですが、調べるのもめんどくさかったのでget_past_meta()でとってます。

次のifでSKUが1かどうか調べます。

SKUが複数の場合

usces_the_item();
while ( usces_have_skus() ) :

SKUが複数の場合その数分SKUを取得してループさせます。

usces_the_item()を書かないと次のusces_have_skus()が使えませんのでご注意を。

SKUの表示

各SKUの表示を行います。

<dl>
<dt><?php usces_the_itemSkuDisp(); ?></dt>
<dd><span class="itemprice"><?php usces_the_itemPriceCr(); ?></span><?php usces_guid_tax(); ?></dd>
<?php if(! usces_have_zaiko() ) : ?>
<dd><span class="itemsoldout"><?php _e('Sold Out', 'usces' ); ?></span></dd>
<?php endif; ?>
</dl>

usces_the_itemSkuDisp()
SKUの表示名を表示します。
usces_the_itemPriceCr()
SKUの価格を表示します。
usces_guid_tax()
税の表示です。
usces_have_zaiko()
在庫を調べます。!usces_have_zaiko()で在庫がない売り切れ表示します。

今回はdlで書いてますがなんでもいいです。不格好なんでcssで調整してください。

26行目から

この行からはテーマそのままです。

一応説明しますと

<div class="itemprice"><?php usces_crform( usces_the_firstPrice('return'), true, false ); usces_guid_tax(); ?></div>
<?php if(! usces_have_zaiko_anyone() ) : ?>
<div class="itemsoldout"><?php _e('Sold Out', 'usces' ); ?></div>
<?php endif; ?>