Quote from Alex Dev on April 20, 2026, 12:29

Good day!

Good news - you do not need any custom CSS or multiple shortcodes for this. HUSKY has a dedicated shortcode for exactly what you are describing: [woof_slideout]

Just place this single shortcode in your Elementor Shortcode widget:

[woof_slideout location=right text="Filter" width=320px height=500px speed=100 action=click]

This gives you:
- A clean text button ("Filter") sitting inline on the page
- A slideout drawer opening from the right when clicked
- All filters hidden inside the drawer, nothing shown inline

The reason your previous attempts did not work is that [woof_btn] + [woof] renders the filter twice on the page - once inline and once inside the drawer - which causes the conflict you experienced with CSS and the filters disappearing.

Remove both [woof] and [woof_btn] shortcodes completely and use only [woof_slideout] as shown above.

The basic slideout functionality is available in the free version. Advanced design options like overlay skins and custom styling are part of the pro version, but the core drawer behavior you described works on free.

Read next please:

• https://products-filter.com/slideout
• https://products-filter.com/performance-optimization-lazy-load-slideout-for-large-category-hierarchies

Let us know if you have any questions!

Quote from supportquestions on April 21, 2026, 04:42

Hi,

Thank you for the [woof_slideout] shortcode suggestion! The drawer itself is working, however this is not quite the result I'm looking for.

The current behaviour: the filter button/icon is appearing fixed to the top-right corner of the screen (floating), not inline on the page.

https://imgur.com/a/TFZW2MO (first 2 images are what i have right now)

What I need: the filter button should sit directly on the page itself, inline in the layout — specifically below the category navigation bar and above the product grid. Similar to how Aesop does it here: https://www.aesop.com/sg/range/hand-body/

On Aesop's page:
- Row 1: Category tabs (See all | Floral | Fresh | Woody etc.)
- Row 2: The word "Filter" sits inline as a plain text button on the left side of the page, with "Sort by" and product count on the right
- Clicking "Filter" opens a drawer from the right side
- No floating or fixed-position button anywhere

https://imgur.com/a/TFZW2MO (third image is how i want the filter to be)

Is there a way to make [woof_slideout] render the button inline in the page flow rather than fixed/floating on the screen? Or is there a different shortcode/approach that achieves this?

Thank you!

Quote from supportquestions on April 21, 2026, 07:43

Hi,

Thank you for your help so far, I've switched over to an off-canvas setup. However I've run into a new issue that I need help with.

Here is my full setup:
- WordPress + Elementor Pro + WooCommerce
- Product archive pages built via Elementor Theme Builder (applied globally to all WooCommerce category archives)
- A horizontal category navigation bar at the top linking to individual category pages (e.g. /product-category/chairs-all/, /product-category/sofa-all/, etc.)
- An Elementor Off-Canvas containing the [woof] shortcode as the filter drawer
- A Button widget that triggers the Off-Canvas to open

The problem:
When a user applies filters on any category page (e.g. /product-category/chairs-all/), the filters work correctly. However, when the page is refreshed after filtering, the user is redirected to the main WooCommerce shop page (/shop/) instead of staying on the current category page they were filtering on.

This happens across ALL category pages since the same Off-Canvas template is used globally.

What I need:
I need the filter to stay on whichever category page the user is currently on after applying filters and refreshing. For example:
- If a user is on /product-category/chairs-all/ and applies a filter, refreshing should keep them on /product-category/chairs-all/ with the filters still applied
- If a user is on /product-category/sofa-all/ and applies a filter, refreshing should keep them on /product-category/sofa-all/ with the filters still applied

The challenge is that since the Off-Canvas is a global Elementor template, I cannot hardcode a different redirect URL per category page inside the [woof] shortcode.

My questions:
1. Is there a way to make [woof] dynamically detect and stay on the current category page URL instead of redirecting to the shop page?
2. Is there a shortcode parameter or setting that tells Husky to use the current page URL as the redirect target?
3. Does this requires a premium feature?

Thank you!

Quote from Alex Dev on April 21, 2026, 12:34

Hello

This is actually expected behavior. Since you built your category archive pages using Elementor Theme Builder, WooCommerce's query context is not fully recognized by HUSKY — the taxonomy variable is not present in the page query the way it would be on a native WooCommerce category page. Because of this, HUSKY falls back to the default shop page as the redirect target, which is why you end up on /shop/ after filtering.

There is no built-in shortcode parameter to handle this dynamically, but here is a small trick you can add to your child theme's functions.php that specifically fixes the woof_current_page_link value for your case:

add_action('wp_footer', function() {
    echo '<script>
    jQuery(document).ready(function() {
        if (typeof woof_current_page_link !== "undefined") {
            woof_current_page_link = location.protocol + "//" + location.host + location.pathname;
        }
    });
    </script>';
}, 9999);

This runs after HUSKY sets its redirect target and overrides it with the actual current browser URL. Since this is just a JavaScript variable, you can also extend this snippet with your own logic if you need more specific behavior for different pages.

Please try this and let me know if it works for you.

Welcome!