FIlterable Properties Grid lets you showcase your properties in an animated and sortable layout.
Just install and activate this addon and use the following shortcode to use it.
[rem_filterable_grid]
It will display your properties something like this
All Available Attributes
Following attributes are available for the shortcode [rem_filterable_grid]
Attribute | Default Value | Description |
---|---|---|
filter_by | property_type | Here you can provide the field name, the available values of that field will become top buttons |
price_filter | disable | Enable or Disable price filtering here. You can use enable or disable |
display_all | yes | Do you want to display All button? Provide yes or no |
display_all_label | ALL | Provide the label here for All button |
order | ASC | ASC or DESC |
orderby | date | How you want to order properties |
columns | 3 | Provide a number of columns for each row here |
style | 3 | Property listing style |
total | -1 | The number of total properties to display |
meta | Please read using meta attribute | |
active | Provide key here for default active | |
price_range_class | col-md-3 | Columns class for price range wrapper |
buttons_wrap_class | col-md-9 | Columns class for filter buttons wrapper |
animation | fade translateZ(-100px) | Animation for property boxes |
duration | 700 | Animation duration in milliseconds for property boxes |
min_price | The minimum price for the slider that can be selected | |
min_price_a | Minimum active price for the slider | |
max_price | The maximum price for the slider that can be selected | |
max_price_a | Maximum active price for the slider | |
btn_bg_color | The background color of the filtering buttons | |
btn_text_color | Text color for the filtering buttons | |
btn_bg_active_color | Background color for the filtering buttons for active state | |
btn_text_active_color | Text color for the filtering buttons for active state | |
slider_bg_color | Price slider background color | |
slider_handle_color | Price slider handles color | |
slider_badge_bg_color | Price slider background color for the badge | |
slider_badge_text_color | Price slider text color for the badge |
Below are some examples for the quick start
Centering the top buttons
[rem_filterable_grid buttons_wrap_class="col-sm-12"]
Enable the Price Range Slider
[rem_filterable_grid price_range_class="col-sm-12" buttons_wrap_class="col-sm-12" price_filter="enable"]