プラグインWooCommerceのwoocommerce_product_loop_endアクションの使用方法・解説

概要

woocommerce_product_loop_endアクションは、WooCommerceでの商品ループの最後に実行されるフックです。このアクションは、商品リストの表示が終了した後にカスタム機能を追加する際に非常に便利です。主に以下のような機能を実装する際に利用されます。

  1. 商品リストの後にカスタムメッセージを追加する。
  2. 商材のフィルタリングやソートオプションを表示する。
  3. SNS共有ボタンを追加する。
  4. ページネーションやナビゲーションリンクを表示する。
  5. 特別オファーやプロモーション情報を掲載する。
  6. 商品リストのスタイルを変更するためのラッパーを追加する。

構文

do_action( 'woocommerce_product_loop_end' );

パラメータ

このアクションには引数はありません。

戻り値

このアクション自体は値を返すことはありません。

対応するバージョン

  • WooCommerceバージョン: 3.0以降
  • WordPressバージョン: 4.0以降

この関数のアクションでの使用可能性

アクション 使用例
mu_plugin_loaded
registered_post_type
plugins_loaded
wp_roles_init
setup_theme
after_setup_theme
set_current_user
init
register_sidebar
wp_loaded
send_headers
parse_query
pre_get_posts
wp
template_redirect
get_header
wp_head

サンプルコード

サンプル1: カスタムメッセージの追加

add_action( 'woocommerce_product_loop_end', 'custom_message_after_product_loop' );
function custom_message_after_product_loop() {
    echo '<div class="custom-message">ご覧いただきありがとうございます!</div>';
}

このコードは商品ループの最後に「ご覧いただきありがとうございます!」というメッセージを表示します。

サンプル2: SNS共有ボタンの追加

add_action( 'woocommerce_product_loop_end', 'add_social_share_buttons' );
function add_social_share_buttons() {
    echo '<div class="social-share">
            <a href="#">Facebook</a>
            <a href="#">Twitter</a>
          </div>';
}

このコードは商品のリストが終了した後にSNS共有ボタンを追加します。

サンプル3: ページネーション

add_action( 'woocommerce_product_loop_end', 'add_pagination' );
function add_pagination() {
    // ページネーションの表示
    the_posts_pagination();
}

このコードは、商品ループが終了した後にページネーションを表示します。

サンプル4: スタイルを変更するラッパーを追加

add_action( 'woocommerce_product_loop_end', 'add_custom_wrapper' );
function add_custom_wrapper() {
    echo '<div class="custom-wrapper">';
    // ここに商品ループのマークアップ
    echo '</div>';
}

このコードは、商品リストの後にカスタムのラッパーDIVを追加します。

サンプル5: 特別オファーの表示

add_action( 'woocommerce_product_loop_end', 'display_special_offer' );
function display_special_offer() {
    echo '<div class="special-offer">今だけ15%OFFの特別オファー中!</div>';
}

このコードは、商品ループの最後に特別オファーのメッセージを表示します。

この関数について質問する


上の計算式の答えを入力してください