The FacetWP Range List Addon is an extension for FacetWP that allows you to add a range-based filter to your site. This is particularly useful when you want users to filter content based on a range of values, such as prices, dates, or numerical values (e.g., filter products within a specific price range or search for posts within a certain date range).

Features of the FacetWP Range List Addon:

• Range-based filtering: This addon enables you to create range-based filters, such as price ranges, date ranges, or any other numerical or date-related data.
• Visual slider: The Range List Facet usually includes a slider that allows users to drag and select a range visually. This makes it easy for users to filter data dynamically.
• Customizable Range: You can define the minimum and maximum range for your filter, as well as set the step intervals (e.g., price increments of $10 or date ranges in years).
• Compatible with other facets: The Range List filter works alongside other FacetWP filters, allowing for advanced filtering combinations (e.g., users can filter by categories and price ranges simultaneously).

How to Set Up the FacetWP Range List Addon:

1. Install FacetWP and Range List Addon:
   • Ensure you have FacetWP installed and activated on your WordPress site.
   • Install the Range List Addon. If you don't have it yet, it can be purchased from the FacetWP website (it's a premium addon).
   • After installation, activate the addon.
2. Create a New Range Facet:
   • Go to FacetWP > Facets in your WordPress dashboard.
   • Click Add New to create a new facet.
   • In the Facet Type dropdown, select Range (this will enable the Range List functionality).
   • Choose the field that you want to filter by. This could be a custom field, such as price, date, or any other numerical field associated with your content.
3. Configure Range Settings:
   • Min/Max values: Set the minimum and maximum values for the range. For example, if you're using the price range, you might set 0 as the minimum and 1000 as the maximum price.
   • Step: Define the step interval, such as $10 or $50, depending on how granular you want the range to be.
   • Slider Styling: You can adjust the visual style of the range slider through CSS or FacetWP settings to match your site’s design.
4. Add the Facet to Your Elementor Page:
   • Once you've created the Range facet, you need to display it on your page.
   • Use the FacetWP Shortcode (e.g., [facetwp facet="range_price"]) to add the Range List facet to your Elementor page.
     • Drag an HTML Widget or Text Editor Widget into your Elementor layout and paste the shortcode.
   • Alternatively, if you're using Elementor Pro, you can use the FacetWP widget (available in the FacetWP integration) to add it directly to your page.
5. Display Filtered Content:
   • After setting up the Range List facet, you can use a FacetWP template to display filtered content. For example, you might use the Posts Widget in Elementor to show filtered posts, products, or other content based on the selected range.
6. Customize Styling:
   • Customize the appearance of the range list (e.g., slider color, size, labels) using Elementor's design tools or custom CSS.
   • You can also adjust the range slider appearance using custom styles in your theme or through FacetWP's settings.

Example Use Cases for the Range List Addon:

1. E-commerce Sites: If you run an online store, the Range List filter can be used for price ranges. For example, users could filter products between $10 and $100 using a sliding scale.
2. Real Estate Websites: You can use the Range List filter to let users filter properties by price, square footage, or year built.
3. Event Sites: Filter events based on their date range. This is particularly useful for users searching for events happening within a certain time frame.
4. Job Listings: Filter job posts based on salary ranges, experience level, or years of experience.

Conclusion:

The FacetWP Range List Addon is a powerful tool for creating intuitive, range-based filters for your WordPress site. Whether you're building an online store, a real estate listing, or any other content-heavy site, the Range List facet enhances the user experience by providing an easy-to-use slider for filtering data within a specific range. When paired with Elementor, it allows for easy integration into visually appealing page designs.