Header Store Selector Widget Documentation

The Header Store Selector Widget lets your customers choose a preferred store location, allowing your WooCommerce site to dynamically change pricing, stock, and availability based on their selection. It is designed to work with Agile Store Locator + WooCommerce integration, and supports both guest users and logged-in customers.

Step 1: Enable Inventory and Store Selector #

To get started, you’ll need to enable the Inventory Module and the Store Selector Widget.

1. Navigate to: Agile Store Locator > WooCommerce > Inventory tab
2. Enable the Inventory Module toggle.
3. Under Store Selector Widget Type, choose Header Widget.
4. Click Save Settings.

This enables per-store pricing, stock handling, and the store selector frontend component.

Step 2: Add the Shortcode #

Add the following shortcode to your site header (or wherever you want the selector to appear):

[asl_wc_selector]

By default, this renders a sidebar offcanvas selector powered by Bootstrap 5’s offcanvas system (custom-prefixed aslcanvas).

Optional: Show as Popup #

You can render the selector as a modal-style popup instead of offcanvas using the popup attribute:

[asl_wc_selector popup="1"]

This adds a asl-selector-popup class, allowing you to style and position it differently.

Controlling Widget Visibility #

By default, the selector widget is not shown on the cart or checkout pages. This behavior can be customized using a WordPress filter:

add_filter('asl_wc_skip_render_store_selector', function($default) {
    // Always show the selector (even on checkout/cart)
    return false;
});

This allows advanced users to programmatically control when the widget renders.

Customizing Radius and Result Count #

You can control how many nearby stores are shown and within what radius by using filters in your theme’s functions.php file:

Store Radius (in miles or km)

add_filter('asl_wc_store_radius', function($radius) {
    return 100; // Set custom radius (default is 500)
});

Limit Number of Store Results

add_filter('asl_wc_store_result_limit', function($limit) {
    return 5; // Show max 5 nearby stores instead of default 10
});

These filters give developers control over the search behavior without modifying core plugin code.