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

概要

woocommerce_after_shop_loopは、WooCommerceのショップループの後にフックを追加するためのアクションです。このアクションは、商品一覧（ショップページ）の表示が終了した後に任意のコードを実行したい場合に使用します。具体的には、以下のような機能を実装する際によく使われます。

ショップページにカスタムメッセージを追加する
商品リストの後にウィジェットや特別なコンテンツを表示する
フィルター機能や並べ替え機能のUIを追加する
おすすめ商品やバナーを表示する
SEO向けのマークアップを追加する
カスタムスクリプトやスタイルシートを読み込む

構文

do_action( 'woocommerce_after_shop_loop' );

パラメータ

このアクションには特別なパラメータはありません。

戻り値

戻り値は特にありません。使用されるコードによって結果が変わります。

使用可能なバージョン

WooCommerce: 2.0.0以上
WordPress: 3.5以上

サンプルコード

サンプルコード 1

add_action( 'woocommerce_after_shop_loop', 'add_custom_message_after_shop_loop' );
function add_custom_message_after_shop_loop() {
    echo '<div class="custom-message">新しい商品が入荷しました！</div>';
}

このコードは、ショップループの後に「新しい商品が入荷しました！」というメッセージを表示します。

サンプルコード 2

add_action( 'woocommerce_after_shop_loop', 'display_special_banner' );
function display_special_banner() {
    echo '<div class="special-offer-banner">今週の特別オファーをチェック！</div>';
}

このコードは、ショップページに特別オファーのバナーを表示します。

サンプルコード 3

add_action( 'woocommerce_after_shop_loop', 'add_custom_widget_area' );
function add_custom_widget_area() {
    if ( is_shop() ) {
        dynamic_sidebar( 'custom-sidebar' );
    }
}

このコードは、ショップページの後にカスタムウィジェットエリアを表示します。

サンプルコード 4

add_action( 'woocommerce_after_shop_loop', 'enqueue_custom_scripts' );
function enqueue_custom_scripts() {
    echo '<script>console.log("ショップループの後にカスタムスクリプトが読み込まれました");</script>';
}

このコードは、ショップループの後にカスタムJavaScriptコードをコンソールに出力します。

サンプルコード 5

add_action( 'woocommerce_after_shop_loop', 'add_product_filter' );
function add_product_filter() {
    echo '<form action="" method="get">
            <select name="filter">
                <option value="">フィルターを選択</option>
                <option value="price">価格</option>
                <option value="category">カテゴリー</option>
            </select>
            <input type="submit" value="適用">
          </form>';
}

このコードは、ショップページの後に商品フィルターのフォームを追加します。

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

アクション	使用例
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

概要

構文