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

2020年3月4日

ショートコード

[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 */