Support » Plugin: WooCommerce » custom product filter widget

  • Resolved gavsiu


    The default product filter widgets are a bit lacking, specifically I want options for On Sale, In Stock Only, and Featured.

    I’ve been trying to create my own widget, but have hit a stumbling block early on. I tried to base it off the existing filters (Active Filter Widget and Rating Filter Widget), but I am having issue with the URLs.

    The problem I have is showing the link with the query_args. I’ve created an option for In stock and when clicked, my url changes to /shop/?availability_filter=in_stock, which is good.

    I can hover over the rating filters and the query_args combine to /shop/?availability_filter=in_stock&rating_filter=3, which is also what I want.

    However, when I hover over attribute terms, the links turn to /shop/?filter_color=black. This seems to happen to URLs in all filter widgets including the active filters widget except the Rating Widget.

    The code below is what I have so far and I’m not really done, but I’m kinda stuck on this hurdle for now.

    	 * Widget rating filter class.
    	class WC_Widget_Status_Filter extends WC_Widget {
    		 * Constructor.
    		public function __construct() {
    			$this->widget_cssclass    = 'woocommerce widget_status_filter';
    			$this->widget_description = __( 'Display a list of additional options to filter products in your store.', 'woocommerce' );
    			$this->widget_id          = 'woocommerce_status_filter';
    			$this->widget_name        = __( 'Filter Products by Status', 'woocommerce' );
    			$this->settings           = array(
    				'title' => array(
    					'type'  => 'text',
    					'std'   => __( 'Show', 'woocommerce' ),
    					'label' => __( 'Title', 'woocommerce' ),
    		 * Output widget.
    		 * @see WP_Widget
    		 * @param array $args     Arguments.
    		 * @param array $instance Widget instance.
    		public function widget( $args, $instance ) {
    			if ( ! is_shop() && ! is_product_taxonomy() ) {
    			$availability_filter = isset( $_GET['availability_filter'] ) ? wc_clean( wp_unslash( $_GET['availability_filter'] ) ) : array(); // WPCS: input var ok, CSRF ok.
    			$this->widget_start( $args, $instance );
    			echo '<ul>';
    			$class       = $availability_filter ? 'wc-availability-in-stock chosen' : 'wc-availability-in-stock';
    			$link        = apply_filters( 'woocommerce_availability_filter_link', ! $availability_filter ? add_query_arg( 'availability_filter', 'in_stock' ) : remove_query_arg( 'availability_filter' ) );
    			$rating_html = 'In stock';
    			$count_html  = ''; ////////// ADD COUNT LATER
    			printf( '<li class="%s"><a href="%s">%s</a> %s</li>', esc_attr( $class ), esc_url( $link ), $rating_html, $count_html ); // WPCS: XSS ok.
    			echo '</ul>';
    			$this->widget_end( $args );
    	} // end class WC_Widget_Status_Filter extends WC_Widget
    • This topic was modified 2 years, 12 months ago by gavsiu.
Viewing 1 replies (of 1 total)
  • Plugin Support Hannah S. a11n


    Automattic Happiness Engineer

    As no-one has responded to you on this, I’m going to mark this as resolved to help keep the forums healthy. If you have any further questions, you can start a new thread.

    If you’d like to pursue this further, then I highly recommend contacting one of the services on our customizations page:

Viewing 1 replies (of 1 total)
  • The topic ‘custom product filter widget’ is closed to new replies.