The “Sorting Filter Widget” can be used with any of our Post widgets to help users sort the content on the page. With the help of this widget users can effortlessly filter and arrange your content with just a few clicks, simplifying the process of finding the most pertinent information. A lot of customization options are available to create exactly the look you want for your Elementor page.
Let’s look at each of the options in the “Sorting Filter Widget” below.
In order to use this widget firstly you need to install any of our post widget from our widget library.
Install Sorting Filter Widget for Elementor #
This widget requires Unlimited Elements Pro version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Sorting Filter”
- Hover over the widget in the search results and click install
- Add your “Sorting Filter” widget to any Elementor Page
General Settings #
Show Order By Label
Show or hide the order by label.
Order By Label Text
Type text to show as order by label.
Show Order Direction Label
Show or hide the order direction label.
Order Direction Label Text
Type text to show as order direction label.
Custom Indicator Icon
Show/Hide the custom indicator icon.
Indicator Icon
Choose an icon to display as indicator icon.
Ascending Text
Type text for ascending order.
Descending Text
Type text for descending order.
Filter Settings #
Filter Type
Select the filter type.
- Auto
- Regular
- For WooCommerce
Default Selected
Set the default selected.
- Auto
- Option Number
Default Selected Dir
Set the default selected direction.
- Auto
- Default
- Asc
- Desc
Fields Settings #
Default Settings
Field Type - Set the field type.
- Default
- Meta Field
- Post ID
- Date
- Title
- Price (WooCommerce)
- Sale Price (WooCommerce)
- Number of Sales (WooCommerce)
- Rating (WooCommerce)
- Slug
- Author
- Last Modified
- Number of Comments
- Random
- Unsorted
- Menu Order
- Parent Post
Sorting Filter Widget Styling #
Every aspect of the widget’s design can be controlled through different styling options. Choose colors that complement the style of your website. You can modify the text, icons, fonts, and layout to make the widget look and work the way you want.
Layout Styling #
In this section, set the layout, alignment, and gap.
Label Styling #
You can set label type, gap, typography, color, and margin.
Select Styling #
Set the typography, padding, text alignment, margin, background, color, border, and text shadow for select element.
Select (Order By) Styling #
Here, you can set the width for order by selector.
Select (Order Direction) Styling #
You can set width for order direction selector.
Indicator Styling #
Set the indicator size, color, and horizontal distance.
Option List Styling #
You can style the option background, text color, and typography.
Usage Examples #
Here are some live use cases for the Sorting Filter Widget.
