What Is the Details Bar?
The Details Bar displays key property information directly on listing thumbnails—specifically:
- Bedrooms
- Bathrooms
- Building Size
This helps visitors quickly scan listings and compare features without clicking through to each one.
How to Enable the Details Bar in Elementor
- Open your listing page in Elementor.
- Click on the “Organic Real Estate Integration” widget to edit it.
- In the Content tab, locate the section labeled Details Bar.
- Toggle it on to show the bar on each listing thumbnail.
Style Settings for the Details Bar
In the Style tab of Elementor, you’ll find customization options to perfectly match your site’s look and feel.
- Padding
Controls the space inside the details bar. Increase or decrease to add breathing room around the icons and text. - Background Type
Choose a solid color, gradient, or image as the background of the bar. - Details Typography
Adjust the font family, size, weight, and spacing of the text (e.g., “3 Beds, 2 Baths”). - Details Text Colour
Set the colour of the text in the bar. - Beds Icon Colour
Customize the color of the bed icon representing bedrooms. - Baths Icon Colour
Customize the colour of the bathtub icon representing bathrooms. - Building Size Icon Colour
Customize the colour of the icon used for square footage.
Final Notes
The Details Bar is a simple but effective way to highlight essential property features. With Elementor’s visual controls, it’s easy to activate and style—no coding required.
Let your listings speak at a glance!
