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
    
• 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) #

1. A user clicks “Add to Compare” (or a similar label) on any listing.
   
2. That listing is added to a temporary compare list (up to the defined limit).
   
3. Users can view the comparison page, where each selected listing is arranged side by side, with comparison rows for each attribute.
   
4. 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.

Setting Up and Using Compare Listings #

The Compare Listings extension (version 2.2) lets visitors select multiple listings and view them side by side in a comparison table, showing price, reviews, category, and other listing details. This guide covers turning the feature on, setting up the required comparison page, and how visitors use it.

Prerequisites #

Compare Listings needs a dedicated WordPress page to display the comparison table. You’ll create this page and connect it during setup below.

Step 1 – Turn on and configure Compare Listings #

Path: WP Admin → Directorist → Directorist Settings → Extension Settings → Compare Listings

1. Make sure Enable Compare Listings is switched On. This is on by default.
2. Set Title, the heading shown at the top of the floating selection tray (defaults to “Compare Listings”).
3. Set Limit, the maximum number of listings a visitor can select at once (defaults to 5).
4. Under Display Compare Button, check the pages where the compare icon should appear: All Listings, Single Listing, Author Profile, User Dashboard, and Related Post. All five are checked by default.
5. Leave Compare Listings Page for now, you’ll set it after creating the page in Step 2.
6. Click Save.

Step 2 – Create the comparison page #

A page will created by default when you’ll install and activate the extension. However, it is wise to do a double check. If there is no page, you have to create it manually by following the process.

1. Go to WP Admin → Pages → Add New.
2. Give the page a title, for example “Compare Listings.”
3. Add the shortcode [directorist_listing_compare] to the page content.
4. Publish the page.
5. Go back to Directorist Listings → Directorist Settings → Extension Settings → Compare Listings.
6. Set Compare Listings Page to the page you just created.
7. Click Save.

The comparison table will only work correctly on the page that contains this shortcode, so make sure the two match.

Step 3 – How visitors compare listings #

Once configured, a compare icon appears on listing cards and pages, based on what you checked in Display Compare Button.

1. A visitor clicks the compare icon on any listing they want to compare. The icon changes to indicate the listing has been added.
2. A floating tray appears in the corner of the screen, showing the Title you set, a running count, and a thumbnail for each selected listing. Visitors can remove a listing from the tray by clicking its trash icon.

3. If a visitor tries to select more listings than the Limit allows, a message tells them they can’t add any more.

4. Clicking the Compare button in the tray opens the comparison page in a new tab, showing the full comparison table for the selected listings.

What the comparison table shows #

For each selected listing, the table displays:

• Listing Type (only shown if Multi Directory is enabled on your site)
• Price
• Reviews (as a star rating)
• Category
• Any other custom fields configured for that listing’s directory type, shown as additional rows

If a listing doesn’t have a value for a given row, that cell shows an “unavailable” mark instead of being left blank.

Visitors can also remove a listing directly from the comparison table using the trash icon on that listing’s column.

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