Overview #
The Compare Listings extension allows your users to select multiple listings and view them side by side in a comparison table — helping them decide more easily without bouncing between pages.
Why Use the Compare Listings Extension? #
Switching between multiple detail pages can be cumbersome and time-consuming. With this extension:
- Users can compare 2–5 listings in a single view
- Essential listing attributes (e.g. price, rating, category) appear side by side
- You can include custom fields in comparisons, giving flexibility for your directory’s unique attributes
- The “Compare” button can appear in many strategic locations
- It’s fully responsive and supports translations
For example, in a real estate directory, someone can pick several apartments, compare their features (square footage, amenities, price, etc.), and choose the best option — all in one glance.
Key Features #
- Compare up to 5 listings in one table
- Compare built-in attributes like price, rating, category
- Support for custom fields (so you choose which attributes users compare)
- Flexible display of “Compare” buttons on:
- All Listings pages
- Single Listing pages
- Related Listings
- User dashboard / author profile
- All Listings pages
- Option to exclude the compare button on specific pages
- Set a limit (2–5) on how many listings a user can compare
- Fully responsive layout
- Translatable (compatible with localization)
How It Works (User Flow) #
- A user clicks “Add to Compare” (or a similar label) on any listing.
- That listing is added to a temporary compare list (up to the defined limit).
- Users can view the comparison page, where each selected listing is arranged side by side, with comparison rows for each attribute.
- Users may remove listings, or proceed to inspect more closely or act (contact, purchase, etc.).
Because custom fields are supported, you can include exactly those attributes you want your users to compare — e.g. “Bedrooms,” “Warranty,” “Amenities,” etc.
Setup & Configuration #
You can manage Compare Listings settings under Directory Listings → Settings → Extensions → Compare Listings.
Typical configurable options include:
| Setting | Purpose |
| Title | The heading for the comparison page (e.g. “Compare Listings”) |
| Limit | Maximum number of listings a user may compare (between 2 and 5) |
| Button Locations | Choose where “Compare” buttons appear (All Listings, Single Listing, Author Profile, etc.) |
| Exclude Pages | Provide a list of pages where the compare button should not appear |
| Save Changes | Always save after adjusting settings |
You’ll also need to add the Compare button into your listing layouts:
All Listings page: Under Directory Builder → All Listing Layout, insert the Compare Listing Button at your desired position.
Single Listing page: Under Directory Builder → Single Page Layout → Listing Header, insert the compare button in the appropriate spot.
Note: Once users click “Compare,” a sidebar or section will show their selected listings. They can remove items with a trash icon or click “Compare” to view the full comparison.
(Images illustrating these steps help guide users visually.)
Example Workflow with Images #
- Adding listings — Users click the compare button on listings they like.
- Sidebar list — Selected listings appear in a sidebar or floating area.
- Remove option — A trash icon lets users remove any listing from the list.
- Compare view — On clicking “Compare,” the listings open side by side in a dedicated comparison table.
Considerations & Best Practices #
- Use clear labels (e.g. “Add to Compare,” “Remove,” “Compare Now”) to avoid confusion
- Avoid including too many fields — choose only the most meaningful attributes
- Keep the comparison limit manageable (5 is a good standard)
- Place the compare button consistently across views (grid, list, single)
- Always check mobile / responsive views to make sure the table remains legible
- Test excluding pages to avoid clutter in places where compare doesn’t make sense
