Estoy tratando de agregar un menú desplegable de 'productos por página' a mi tema secundario de escaparate de WooCommerce sin usar un complemento. Estoy agregando el siguiente código a mi fuente 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 ); } }Cuando hago esto, aparece el cuadro desplegable, pero cualquier opción que elija me lleva de vuelta a la página principal de mi tema.
¿Alguien puede ayudarme?
Puede agregar los siguientes códigos en el archivo functions.php . Referencia:
El primer paso es mostrar un cuadro de selección en la página de archivo de la tienda. Con algo de php básico podemos hacer eco de un cuadro de selección a través del gancho woocommerce_before_shop_loop .
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>'; }Se ha agregado algo de jQuery en línea, por lo que cada vez que se cambia el cuadro de selección, la variable "productos por página" se envía al navegador .
La función filter_input() obtiene la variable externa que en este caso es el número de productos para mostrar y la desinfecta .
Ahora que todo está en su lugar, podemos ejecutar el enlace pre_get_posts con la cantidad de productos por página a través del método "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 ); } }Este es el método más simple para agregar un menú desplegable de "productos por página" para su tienda WooCommerce , alternativamente podría usar un método ajax.
Estoy usando el siguiente código tomado de aquí-
// 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 );