web-dev-qa-db-ja.com

AJAXを使用してget_template_partする方法？

私は現在、Woocommerceのarchive-product.phpテンプレートファイル（ショップページまたは製品カテゴリページなど）を閲覧しています。投稿（または商品）をクリックすると、同じページのタイトルにGETクエリが追加され、投稿リストではなくスライダーにページが変更されます。 GETクエリを更新して追加する代わりに、AJAXを使用してページのコンテンツを変更する必要があります。テンプレート部分を含めてみましたが、投稿が見つからないと言っています。

私は私がwp-load.phpまたは他の方法をロードする必要があるかもしれないことを読み続けます。これを行うための最も効率的な方法は何ですか？ get_template_part（）が特定のURLで何を返すかを私に返す方法を学びたいです。 （私は後で同じような方法でsingle-product.phpを取得する必要があります）。

これがAJAX用の私のサーバーサイドスクリプトです。

// AJAX function to show slider on product archive
function cienna_show_slider_callback() {
  define('WP_USE_THEMES', false);
  require_once($_SERVER['DOCUMENT_ROOT'].'/wp/wp-load.php');
  get_template_part( 'woocommerce/archive', 'product' );
  wp_die();
}
add_action( 'wp_ajax_cienna_show_slider', 'cienna_show_slider_callback' );
add_action( 'wp_ajax_nopriv_cienna_show_slider', 'cienna_show_slider_callback' );

これは私のAJAXのための私のクライアントサイドスクリプトです（私は誰かを混乱させないために私は余分なGET変数を含めていません。

// JavaScript to be fired on the product archive page
$('ul.products li.product a').on('click', function(event) { // AJAX get content of page
  event.preventDefault();
  $.get( ajax_object.ajax_url, { action: "cienna_show_slider" }, function( data ) {
    console.log(data);
  })
});

万が一誰かが頼んだ場合、これはアーカイブ製品テンプレートです：

<?php get_template_part('templates/page', 'header');

    /**
    * woocommerce_before_main_content hook
    *
    * @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)
    * @hooked woocommerce_breadcrumb - 20
    */
    do_action('woocommerce_before_main_content');

    do_action( 'woocommerce_archive_description' );

    if ( have_posts() ) {

        /**
         * woocommerce_before_shop_loop hook
         *
         * @hooked woocommerce_result_count - 20
         * @hooked woocommerce_catalog_ordering - 30
         */
        do_action( 'woocommerce_before_shop_loop' );

        woocommerce_product_loop_start();

        woocommerce_product_subcategories();

        while ( have_posts() ) {

            the_post();

            get_template_part( 'woocommerce/content', 'product' );

        }

        woocommerce_product_loop_end();

        /**
         * woocommerce_after_shop_loop hook
         *
         * @hooked woocommerce_pagination - 10
         */
        do_action( 'woocommerce_after_shop_loop' );

    } elseif ( ! woocommerce_product_subcategories( array( 'before' => woocommerce_product_loop_start( false ), 'after' => woocommerce_product_loop_end( false ) ) ) ) {

    wc_get_template( 'loop/no-products-found.php' );

    }

  /**
   * woocommerce_after_main_content hook
   *
   * @hooked woocommerce_output_content_wrapper_end - 10 (outputs closing divs for the content)
   */
  do_action('woocommerce_after_main_content');

?>

UPDATE： それで、私はAJAX呼び出しを$ .ajaxから$ .getに更新し、wp-loadを含めたので、それはうまく動作します。

loopajaxtemplateswoocommerceget-template-part
1
yaharga

あなたのコールバック関数は次のようになります。

function cienna_show_slider_callback() {
    global $post, $product, $woocommerce; // just in case if your template file need this
    ob_start();
?>

<?php woocommerce_get_template( 'archive-product.php'); ?>

<?php
    $output = ob_get_contents();
    ob_end_clean();
    echo $output;
    die();
}
2
Mohammed