每页下拉列表添加产品



我正在尝试在不使用插件的情况下向我的WooCommerce Storefront Child主题添加'产品'下拉列表。我将以下代码添加到我的functions.php源

add_action( 'woocommerce_before_shop_loop', 'ps_selectbox', 25 );
function ps_selectbox() {
    $per_page = filter_input(INPUT_GET, 'perpage', FILTER_SANITIZE_NUMBER_INT);     
    echo '<div class="woocommerce-perpage">';
    echo '<span>Per Page: </span>';
    echo '<select onchange="if (this.value) window.location.href=this.value">';   
    $orderby_options = array(
        '8' => '8',
        '16' => '16',
        '32' => '32',
        '64' => '64'
    );
foreach( $orderby_options as $value => $label ) {
    echo "<option ".selected( $per_page, $value )." value='?perpage=$value'>$label</option>";
}
echo '</select>';
echo '</div>';
}

add_action( 'pre_get_posts', 'ps_pre_get_products_query' );
function ps_pre_get_products_query( $query ) {
    $per_page = filter_input(INPUT_GET, 'perpage', FILTER_SANITIZE_NUMBER_INT);
    if( $query->is_main_query() && !is_admin() && is_post_type_archive( 'product' ) ) {
        $query->set( 'posts_per_page', $per_page );
    }
}

当我这样做时,下拉框显示,但是我选择的任何选项都可以将我带回主题的首页。

任何人可以帮我吗?

您可以将以下代码添加到 function.php 文件中。参考:

第一步是在商店档案页面上显示一个选择框。使用一些基本的PHP,我们可以通过 woocommerce_before_shop_loop hook

通过 woocommerce_before_shop_shop_shop_before echo呼应一个选择框。
add_action( 'woocommerce_before_shop_loop', 'ps_selectbox', 25 );
function ps_selectbox() {
    $per_page = filter_input(INPUT_GET, 'perpage', FILTER_SANITIZE_NUMBER_INT);     
    echo '<div class="woocommerce-perpage">';
    echo '<span>Per Page: </span>';
    echo '<select onchange="if (this.value) window.location.href=this.value">';   
    $orderby_options = array(
        '8' => '8',
        '16' => '16',
        '32' => '32',
        '64' => '64'
    );
    foreach( $orderby_options as $value => $label ) {
        echo "<option ".selected( $per_page, $value )." value='?perpage=$value'>$label</option>";
    }
    echo '</select>';
    echo '</div>';
}

已经添加了一些 inline jQuery,因此每次更改选择框时,"每个页面产品" Varibale都会发送到浏览器

filter_input()函数获取外部变量,在这种情况下,它是要显示和消毒的产品数 it。

现在,一切都已经到位,我们可以通过" get"方法

add_action( 'pre_get_posts', 'ps_pre_get_products_query' );
function ps_pre_get_products_query( $query ) {
   $per_page = filter_input(INPUT_GET, 'perpage', FILTER_SANITIZE_NUMBER_INT);
   if( $query->is_main_query() && !is_admin() && is_post_type_archive( 'product' ) ){
        $query->set( 'posts_per_page', $per_page );
    }
}

这是为您的WooCommerce Store添加"每页产品"下拉列表的最简单方法,您可以使用Ajax方法进行替代。

我正在使用以下代码 -

http://designloud.com/how-to-add-products-per-page-dropdown-to-woocommerce/?showmodaldialog=1#comment-1554

// Lets create the function to house our form
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_ordering', 30 );
function woocommerce_catalog_page_ordering() {
?>
<?php echo '<span class="itemsorder">Items Per Page:' ?>
    <form action="" method="POST" name="results" class="woocommerce-ordering">
    <select name="woocommerce-sort-by-columns" id="woocommerce-sort-by-columns" class="sortby" onchange="this.form.submit()">
<?php
//Get products on page reload
if  (isset($_POST['woocommerce-sort-by-columns']) && (($_COOKIE['shop_pageResults'] <> $_POST['woocommerce-sort-by-columns']))) {
        $numberOfProductsPerPage = $_POST['woocommerce-sort-by-columns'];
          } else {
        $numberOfProductsPerPage = $_COOKIE['shop_pageResults'];
          }
//  This is where you can change the amounts per page that the user will use  feel free to change the numbers and text as you want, in my case we had 4 products per row so I chose to have multiples of four for the user to select.
            $shopCatalog_orderby = apply_filters('woocommerce_sortby_page', array(
            //Add as many of these as you like, -1 shows all products per page
              //  ''       => __('Results per page', 'woocommerce'),
                '20'        => __('20', 'woocommerce'),
                '-1'        => __('All', 'woocommerce'),
            ));
        foreach ( $shopCatalog_orderby as $sort_id => $sort_name )
            echo '<option value="' . $sort_id . '" ' . selected( $numberOfProductsPerPage, $sort_id, true ) . ' >' . $sort_name . '</option>';
?>
</select>
</form>
<?php echo ' </span>' ?>
<?php
}
// now we set our cookie if we need to
function dl_sort_by_page($count) {
  if (isset($_COOKIE['shop_pageResults'])) { // if normal page load with cookie
     $count = $_COOKIE['shop_pageResults'];
  }
  if (isset($_POST['woocommerce-sort-by-columns'])) { //if form submitted
    setcookie('shop_pageResults', $_POST['woocommerce-sort-by-columns'], time()+1209600, '/', 'www.your-domain-goes-here.com', false); //this will fail if any part of page has been output- hope this works!
    $count = $_POST['woocommerce-sort-by-columns'];
  }
  // else normal page load and no cookie
  return $count;
}
add_filter('loop_shop_per_page','dl_sort_by_page');
add_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_page_ordering', 20 );

最新更新