Welcart の商品一覧を金額順に並べ替える方法

Welcart の商品一覧の表示は基本的には商品登録日の新しい順で表示が行われますが、「商品を金額順に並べ替えられるようにしたい」「在庫がある商品のみの表示の切り替えができるようにしたい」といった場合があります。

こちらの実現方法ですが、WordPress のカスタマイズを行う必要があり、やや専門的な知識が必要となります。ご自身での対応が難しい場合、修正対応も承っておりますのでお問い合わせフォームからお気軽にお問い合わせください。

カスタマイズの基本や使い方についてはまずはこちらの記事をご参考ください。

WordPress に用意されているフックを利用するとテーマやプラグインに新たな機能を追加したり表示内容を変更したりカスタマイズを行うことができます。この記事ではフックの基本や使い方を解説しています。

hirogeru-blogs.com

Welcart の商品一覧を金額順に並べ替えるカスタマイズ方法

データベースから商品の一覧情報を取得してくるクエリの発行時に、並べ替えの指定や絞り込みの指定を行えるようにすれば良いのですが、直接 Welcart の金額や在庫状態といった商品情報を取得してくることはデータの保存形式上できないようですので、一度商品情報をカスタムフィールドに登録し、そのカスタムフィールドの情報を使い並べ替えや絞り込みを行うという方法で対応が可能となります。

手順としては以下の通りとなります。

カスタムフィールドに必要な商品情報を保存する。
カスタムフィールドの値を使い、商品の並べ替えや絞り込みを行う。

カスタムフィールドに商品情報を保存する方法

save_postフックを使いカスタムフィールドに該当の値を保存するようにします。save_postフックはその名の通り、保存するたびに呼び出されますのでその都度、カスタムフィールドの値を更新しデータの整合性を保ちます。

以下は、投稿の保存時にカスタムフィールドpriceに商品の金額、zaiko_statusに商品の在庫状態(数値)を保存するサンプルコードです。(保存される商品の金額、在庫状態は 1 つ目の SKU の値となります。) テーマ内の functions.php に記載すると反映されます。

// 商品情報が保存されるたびにカスタムフィールドを更新
function set_custom_field( $post_id, $post ) {
   $product = wel_get_product( $post_id );
   $itemcode = $product['itemCode'];
   if( $itemcode ) {
      $skus = wel_get_skus( $post_id, 'code' );
      $sku = array_keys($skus);

      $zaiko_status = usces_get_itemZaiko( 'id', $post_id, $sku[0] );
      $price = usces_the_firstPrice( 'return', $post );

      update_post_meta( $post_id, 'price', $price );
      update_post_meta( $post_id, 'zaiko_status', $zaiko_status);
   }
}
add_action( 'save_post', 'set_custom_field', 99, 2 );

こちらのコードでは商品コード($itemcode)を取得し、その投稿が商品情報かそうでないかを判定しています。商品コードを取得する際にget_post_meta()を使っているサンプルコードもありますが、2022年7月にリリースされた Welcart 2.7 以降ではデータの保存形式が変更となったためget_post_meta()で商品コードを取得することはできなく正常に動きませんのでお気をつけください。

こちらのようなコードは正常には動かなくなります。
$itemcode = get_post_meta( $post_id, '_itemCode', true )

該当箇所はこのような修正を行なってください。

$product = wel_get_product( $post_id );
 $itemcode = $product['itemCode'];

最初の設定時等に全ての商品について一度にカスタムフィールドに商品情報の値を保存したい場合は、current_screenフックを使い、商品一覧画面の「最新の情報に更新」ボタンをクリックすることで全ての投稿に対しカスタムフィールドに値を設定することができます。

// 「最新の情報に更新」クリックですべての商品のカスタムフィールドを更新
function usces_add_actions_to_admin_current_screen( $current_screen ){
   if( isset($_GET['page']) && 'usces_itemedit' == $_GET['page'] && isset($_REQUEST['refresh']) ){
      $get_posts = get_posts( array( 'post_type' => 'post', 'numberposts' => -1 ) );
      if( $get_posts ): foreach ( $get_posts as $post ) :
         set_custom_field( $post->ID, $post );
      endforeach; endif;
   }
}
add_action( 'current_screen', 'usces_add_actions_to_admin_current_screen' );

こちらのコードを functions.php に追記し、商品一覧画面の「最新の情報に更新」をクリックすることで全ての投稿に対して set_custom_field()が呼び出されカスタムフィールドの値が更新されます。

テーマから利用する方法

Welcart Basic テーマを利用されている場合はこちらの記事もご参考ください。

Welcart Basic テーマのトップページの商品一覧を金額順に並び替える方法

pre_get_posts を使ったカスタマイズでトップページの商品一覧を金額順に並び替えることができます。

hirogeru-blogs.com

テンプレートファイルでのクエリ発行時にカスタムフィールドを指定して表示の並び替えや絞り込みを行います。サンプル例を挙げます。

値段の高い(低い)順に並び替える

商品金額 (price) 順に並び替える場合の指定方法例となります。meta_key, meta_value_num を使用します。orderby の meta_value_num には値段の高い順(降順)の場合は DESC 、低い順(昇順)の場合は ASC を指定します。

$args = array(
   'post_type' => 'post',
   'post_status' => 'publish',
   'category_name' => 'item',
   'meta_key' => 'price',
   'orderby' => array('meta_value_num' => 'DESC')
);
$the_query = new WP_Query($args);

在庫状態が在庫ありの商品に絞り込む

在庫状態が在庫あり(zaiko_status = 0) の商品に絞り込む場合の引数指定方法例となります。meta_query を使用します。上記の並び替えと併用することもできます。

$args = array(
   'post_type' => 'post',
   'post_status' => 'publish',
   'category_name' => 'item',
   'meta_key' => 'price',
   'orderby' => array('meta_value_num' => 'DESC'),
   'meta_query' => array( 'key' => 'zaiko_status',
                          'value' => 0,
                          'compare' => '='
                   )
);
$the_query = new WP_Query($args);