首页 > 解决方案 > 在 woocommerce 中创建重置过滤器按钮

问题描述

我正在使用一个对产品类别页面有 ajax 过滤器的主题,它工作得非常好。

唯一的事情是按钮希望显示,当有人选择过滤器时,不要重置它们,它会将访问者引导回商店页面。如何更改按钮的逻辑,它只会重置选定的过滤器?让用户停留在他们所在的页面上?因为现在按钮没有意义。

到目前为止。

HTML

<div class="nm-shop-results-bar  has-filters is-category">

    <a href="http://localhost/amaoni/" id="nm-shop-filters-reset" data-shop-url="http://localhost/amaoni/">
        <i class="nm-font nm-font-close2"></i>Filters active <span>(1)</span></a>
        <a href="http://localhost/amaoni/" id="nm-shop-search-taxonomy-reset" data-shop-url="http://localhost/amaoni/"
        <i class="nm-font nm-font-close2"></i>Showing <span>“Hundebetten”&lt;/span></a>
</div>

PHP

<?php
/**
 *  NM: Shop - Results bar/button
 */

defined( 'ABSPATH' ) || exit;

global $nm_theme_options;

$results_bar_class = '';
$results_bar_buttons = array();

// Filters
$filters_count = nm_get_active_filters_count();
if ( $filters_count ) {
    $results_bar_class = ' has-filters';
    $results_bar_buttons['filters'] = array(
        'id'    => 'nm-shop-filters-reset',
        'title' => sprintf( esc_html__( 'Filters active %s(%s)%s', 'nm-framework' ), '<span>', $filters_count, '</span>' )
    );
}

// Search
if ( ! empty( $_REQUEST['s'] ) ) { // Is search query set and not empty?
    $results_bar_class .= ' is-search';
    $results_bar_buttons['search_taxonomy'] = array(
        'id'    => 'nm-shop-search-taxonomy-reset',
        'title' => sprintf( esc_html__( 'Search results for %s&ldquo;%s&rdquo;%s', 'nm-framework' ), '<span>', esc_html( $_REQUEST['s'] ), '</span>' )
    );
}
// Taxonomy
else if ( is_product_taxonomy() ) {
    $results_bar_buttons['search_taxonomy'] = array(
        'id' => 'nm-shop-search-taxonomy-reset'
    );
    $current_term = $GLOBALS['wp_query']->get_queried_object();

    if ( is_product_category() ) {
        $results_bar_class .= ' is-category';
        $results_bar_buttons['search_taxonomy']['title'] = sprintf( esc_html__( 'Showing %s&ldquo;%s&rdquo;%s', 'nm-framework' ), '<span>', esc_html( $current_term->name ), '</span>' );
    } else {
        $results_bar_class .= ' is-tag';
        $results_bar_buttons['search_taxonomy']['title'] = sprintf( esc_html__( 'Products tagged %s&ldquo;%s&rdquo;%s', 'nm-framework' ), '<span>', esc_html( $current_term->name ), '</span>' );
    }
}

if ( ! empty( $results_bar_buttons ) ) :
?>

<div class="nm-shop-results-bar <?php echo esc_attr( $results_bar_class ); ?>">
    <?php 
        $shop_url = esc_url( get_permalink( wc_get_page_id( 'shop' ) ) );

        foreach ( $results_bar_buttons as $button ) {
            printf( '<a href="%s" id="%s" data-shop-url="%s"><i class="nm-font nm-font-close2"></i>%s</a>',
                $nm_theme_options['shop_filters_enable_ajax'] ? '#' : $shop_url,
                $button['id'],
                $shop_url,
                $button['title']
            );
        }
    ?>
</div>

<?php endif; ?>

我认为这是将用户引导到商店页面的代码部分,但我不知道如何更改它,因此它只是重置选定的过滤器。

<div class="nm-shop-results-bar <?php echo esc_attr( $results_bar_class ); ?>">
    <?php 
        $shop_url = esc_url( get_permalink( wc_get_page_id( 'shop' ) ) );

        foreach ( $results_bar_buttons as $button ) {
            printf( '<a href="%s" id="%s" data-shop-url="%s"><i class="nm-font nm-font-close2"></i>%s</a>',
                $nm_theme_options['shop_filters_enable_ajax'] ? '#' : $shop_url,
                $button['id'],
                $shop_url,
                $button['title']
            );
        }
    ?>
</div>

<?php endif; ?>

Javascript

        if (self.filtersEnableAjax) {
            /* Bind: Results bar - Filters reset link */
            self.$shopWrap.on('click', '#nm-shop-filters-reset', function(e) {
                e.preventDefault();
                var resetUrl = location.href.replace(location.search, ''); // Get current URL without query-strings
                self.shopGetPage(resetUrl);
            });

            /* Bind: Results bar - Search/taxonomy reset link */
            self.$shopWrap.on('click', '#nm-shop-search-taxonomy-reset', function(e) {
                e.preventDefault();

                var $resetButton = $(this);
                if ($resetButton.closest('.nm-shop-results-bar').hasClass('is-search')) {
                    // Search
                    var urlSearchParam = self.urlGetParameter('s'), // Check for the "s" parameter in the current page URL
                        // Search from external page: Get default/main shop URL (current URL may not be the default shop URL)
                        // Search from shop page: Get current URL without query-strings (current URL is a shop URL)
                        resetUrl = (urlSearchParam) ? $resetButton.data('shop-url') : location.href.replace(location.search, '');
                } else {
                    // Category or tag
                    var resetUrl = $resetButton.data('shop-url'); // Get default/main shop URL
                }

                self.shopGetPage(resetUrl);
            });
        }
    }

标签: phpwordpresswoocommerce

解决方案


推荐阅读