以下の処理が商品数分ループされる。
- <li <?php wc_product_class(); ?>>
- woocommerce_before_shop_loop_item（フック）
- woocommerce_before_shop_loop_item_title（フック）
- woocommerce_shop_loop_item_title（フック）
- woocommerce_after_shop_loop_item_title（フック）
- woocommerce_after_shop_loop_item（フック）
- </li>
各詳細のご説明
Contents
1: <li <?php wc_product_class(); ?>>
リストタグとwc_product_class（関数）が表示される。
wc_product_class
function wc_product_class( $class = ”, $product_id = null ) {
echo ‘class=”‘ . esc_attr( join( ‘ ‘, wc_get_product_class( $class, $product_id ) ) ) . ‘”‘;
}
商品のクラス名を取得します。wc_product_class()はget_post_class()のクローンなので、WordPress投稿記事のクラス名を取得する内容と同じ仕組みです。
●出力例
<li class=”post-68 product type-product status-publish product_cat-backnumber first instock downloadable shipping-taxable purchasable product-type-simple”>
2: woocommerce_before_shop_loop_item（フック）
このフックには以下の関数が登録されています。
woocommerce_template_loop_product_link_open
商品ページへのリンク開始タグが出力されます。
woocommerce_template_loop_product_link_open
function woocommerce_template_loop_product_link_open() {
global $product;
$link = apply_filters( ‘woocommerce_loop_product_link’, get_the_permalink(), $product );
echo ‘<a href=”‘ . esc_url( $link ) . ‘” class=”woocommerce-LoopProduct-link woocommerce-loop-product__link”>’;
}
●出力例
<a href=”｛商品リンクURL｝” class=”woocommerce-LoopProduct-link woocommerce-loop-product__link”>
3:woocommerce_before_shop_loop_item_title（フック）
このフックには以下の関数が登録されています。
woocommerce_show_product_loop_sale_flash
セール商品の時のタグが出力されます。
woocommerce_template_loop_product_thumbnail
サムネイルの情報を取得します。
woocommerce_show_product_loop_sale_flash
function woocommerce_show_product_loop_sale_flash() {
wc_get_template( ‘loop/sale-flash.php’ );
}
この関数は単純に’loop/sale-flash.php’ のテンプレートを呼び出すファイルです。’sale-flash.php’には セール時のデザインがカスタマイズできる”apply_filters”のフックが用意されているだけです。デフォルトの出力は以下です。
<span class=”onsale”>SALE!</span>
woocommerce_template_loop_product_thumbnail
function woocommerce_template_loop_product_thumbnail() {
echo woocommerce_get_product_thumbnail();.
}
woocommerce_get_product_thumbnail
function woocommerce_get_product_thumbnail( $size = ‘woocommerce_thumbnail’, $deprecated1 = 0, $deprecated2 = 0 ) {
global $product;
$image_size = apply_filters( ‘single_product_archive_thumbnail_size’, $size );
return $product ? $product->get_image( $image_size ) : ”;
}
get_image
public function get_image( $size = ‘woocommerce_thumbnail’, $attr = array(), $placeholder = true ) {
if ( has_post_thumbnail( $this->get_id() ) ) {
$image = get_the_post_thumbnail( $this->get_id(), $size, $attr );
} elseif ( ( $parent_id = wp_get_post_parent_id( $this->get_id() ) ) && has_post_thumbnail( $parent_id ) ) {
// @phpcs:ignore Squiz.PHP.DisallowMultipleAssignments.Found
$image = get_the_post_thumbnail( $parent_id, $size, $attr );
} elseif ( $placeholder ) {
$image = wc_placeholder_img( $size );
} else {
$image = ”;
}
return apply_filters( ‘woocommerce_product_get_image’, $image, $this, $size, $attr, $placeholder,$image);
}
get_imageはWC_Productクラスのメソッド。格納場所は以下↓
woocommerce/includes/abstracts/abstract-wc-product.php
4:woocommerce_shop_loop_item_title（フック）
このフックには以下の関数が登録されています。
woocommerce_template_loop_product_title（関数）
商品名の表示タグを出力します。
woocommerce_template_loop_product_title
function woocommerce_template_loop_product_title() {
echo ‘<h2 class=”woocommerce-loop-product__title”>’ . get_the_title() . ‘</h2>’;
}
5:woocommerce_after_shop_loop_item_title（フック）
├woocommerce_template_loop_rating（関数）
└woocommerce_template_loop_price（関数）
woocommerce_template_loop_rating
function woocommerce_template_loop_rating() {
wc_get_template( ‘loop/rating.php’ );
}
woocommerce_template_loop_price
function woocommerce_template_loop_price() {
wc_get_template( ‘loop/price.php’ );
}
6:woocommerce_after_shop_loop_item（フック）
├woocommerce_template_loop_product_link_close（関数）
└woocommerce_template_loop_add_to_cart（関数）
woocommerce_template_loop_product_link_close
function woocommerce_template_loop_product_link_close() {
echo ‘</a>’;
}
woocommerce_template_loop_add_to_cart
function woocommerce_template_loop_add_to_cart( $args = array() ) {
global $product;
if ( $product ) {
$defaults = array(
‘quantity’ => 1,
‘class’ => implode( ‘ ‘, array_filter( array(
‘button’,
‘product_type_’ . $product->get_type(),
$product->is_purchasable() && $product->is_in_stock() ? ‘add_to_cart_button’ : ”,
$product->supports( ‘ajax_add_to_cart’ ) ? ‘ajax_add_to_cart’ : ”,
) ) ),
‘attributes’ => array(
‘data-product_id’ => $product->get_id(),
‘data-product_sku’ => $product->get_sku(),
‘aria-label’ => $product->add_to_cart_description(),
‘rel’ => ‘nofollow’,
),
);
$args = apply_filters( ‘woocommerce_loop_add_to_cart_args’, wp_parse_args( $args, $defaults ), $product );
if ( isset( $args[‘attributes’][‘aria-label’] ) ) {
$args[‘attributes’][‘aria-label’] = strip_tags( $args[‘attributes’][‘aria-label’] );
}
wc_get_template( ‘loop/add-to-cart.php’, $args );
}
}
7:</li>