WooCommerce 「商品名と価格のみ」シンプルな商品カテゴリー一覧を出力するショートコード

ショートコード

[products_by_category_slug product_cat="カテゴリースラッグ" orderby="ID"]

このショートコードを設置すると、WooCommerce 商品カテゴリーから、商品名と価格の一覧を取得する。現状、テーブルタグで囲っている。

orderby のオプションについてはこちらを参照

ブロックエディター でのショートコード配置の例

出力結果

このように出力される。

コード

functions.phpに追記するコードはこちら。(自己責任でよろしくお願いします。)

/* woocommerce タイトルと価格のみ 取得 */
/*  [products_by_category_slug product_cat="category-slug" orderby="rand"] */
add_shortcode( 'products_by_category_slug', 'products_by_category_slug' );

function products_by_category_slug( $atts, $content = null ) {
extract( shortcode_atts( array(
'product_cat' => '巻物',
'orderby'=> 'rand',
), $atts));
ob_start();
?>
<table class="wc_products">
<?php
$args = array( 'post_type' => 'product', 'posts_per_page' => -1, 'product_cat' =>$product_cat, 'orderby' => $orderby);
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); global $product; 
?>

<tr>
   <td class="wc_product_name">
    <a href="<?php htmlspecialchars(the_permalink( $post )); ?>"><?php htmlspecialchars(the_title()); ?></a>
   </td>
   <td class="price">
    ¥<?php echo htmlspecialchars(number_format($product->regular_price)); ?> 
    </td>
 </tr>
<?php endwhile; ?>
</table>
<?php wp_reset_query(); 
return ob_get_clean();
?>
<?php
}
/* end */

謝辞

参考になった記事はこちら、感謝です。

商品名だけを取り出すサンプルコード、ただし、このサンプルコードそのままだと、エラーが発生した。しかし、このサンプルコードを元に、今回のコードを作れたので大感謝です。

✓ あわせて読みたい
Shortcode to display product titles only

価格の表示するためのサンプルコード。シンプルに取得できて感動。

3桁ごとにカンマを入れるPHP関数。

✓ あわせて読みたい
PHP: number_format – Manual

PHP標準の出力バッファリング機能、これ知りませんでした。便利。

プラグインにしたい

スマートフォンの狭い画面で、WooCommerceに登録している商品リストを、写真なしで取得したかった。探したが、良いプラグインを見つけることができなかった。(探しきれていない可能性が高いが)

そこで、ショートコードで自作した。

公式プラグインに登録したい。