How to Display Real Estate Listings

Follow the directions below to create a Real Estate Listings page similar to the Real Estate Listings demo or create it from the Real Estate Listings form template.

Create the form

Create a form using the Real Estate listings template or create your own from scratch.

Create the listings page

1. In your Wordpress admin, go to Pages → Add New and create your listings page.
2. Create a View by going to Formidable → Views → Add New.
3. Select Grid as the View type.
4. Select your Real Estate listings form from the Use Entries from Form drop-down.
5. Give the new view a title and a description for reference, if you would like.
6. Scroll down to the Advanced Settings. Set your Detail Page Slug to listing. Set the parameter value to key.
7. Add your content into the Listing Page Content box by clicking the Listing Page tab. This section will be repeated for each listing. You can see how it will be displayed on the Real Estate Listings demo.

   <a href="[detaillink]">[if photo-url][if photo-upload equals=""]<img src="[photo-url]" alt="[mlsid]" />[/if photo-upload][/if photo-url]
   [if photo-upload]<img src="[photo-upload size=large]" alt="[mlsid]" />[/if photo-upload]</a>
   <h3><a href="[detaillink]">$[list-price thousands_sep=","]</a></h3>
   <strong>[address] [city], [state]</strong>
   [bedrooms] bd / [bathrooms] ba [if sqft-living]/ [sqft-living] sq ft[/if sqft-living]

8. In the Grid Style Settings, drag the Number of grid columns to 3 columns. Also set the Padding to 0.
   
9. Add your content into the Detail Page Content by clicking the Detail Page tab. This is the box for the detailed listing page. See the demo for an example.

   [if photo-url][if photo-upload equals=""]<img src="[photo-url]" alt="[mlsid]" />[/if photo-upload][/if photo-url]
   [if photo-upload]<img src="[photo-upload size=medium]" alt="[mlsid]" />[/if photo-upload]
   <h3>[address] — $[list-price thousands_sep=","]</h3>
   [city], [state] [zip] [editlink label="Edit" page_id="53495"]
   
   [bedrooms] beds | [bathrooms] baths [if sqft-total]| [sqft-total] sq ft[/if sqft-total]
   
   <strong>MLS #:</strong> [mlsid] 
   [if type]<strong>Type:</strong> [type]
   [/if type]<strong>Year Built:</strong> [year]
   <strong>Status:</strong> [property-status]
   <hr/>
   <p>[description clickable=1]</p>
   <hr/>
   <h3>Features</h3>
   <ul>
   [if sqft-living]<li><strong>Living Square Feet:</strong> [sqft-living]</li>[/if sqft-living]
   [if gen-features]<li><strong>General Features:</strong> [gen-features]</li>[/if gen-features]
   [if interior]<li><strong>Interior Features:</strong> [interior]</li>[/if interior]
   [if rooms]<li><strong>Rooms:</strong> [rooms]</li>[/if rooms]
   [if ac]<li><strong>Air Conditioning:</strong> [ac]</li>[/if ac]
   [if heat]<li><strong>Heat:</strong> [heat]</li>[/if heat]
   [if lot-features]<li><strong>Lot Features:</strong> [lot-features]</li>[/if lot-features]
   [if community-features]<li><strong>Community Features</strong> [community-features]</li>[/if community-features]
   </ul>
   
   <a href="/demos/real-estate-listings/">← All Listings</a>

10. Save your view by clicking the Update button.
11. Insert the view on the page you created using [display-frm-data id=x filter=1]. Read more about publishing a view.

Create the Featured listings widget

1. Follow steps 2 - 4 above.
2. Select Grid for the View Type if you would like to show all featured listings. Set the View limit to 1 if you would like to randomly display a single featured listing.
3. Add content into the Listing Page Content as needed.
4. In the Advanced Settings at the bottom of the view, set the Order to Random.
5. Add a filter in the Filter Entries section. Select your featured check box from the dropdown, is not equal to, and leave the last box blank. This is saying if the featured field is blank, then don't show it in the list.
6. Save your view.
7. Copy the shortcode for your view, i.e. [display-frm-data id=x filter=1].
8. Go to Appearance → Widgets.
9. Drag a Text widget into your sidebar.
10. Insert your view shortcode in the text widget, so it will look like this:

    [display-frm-data id=x]

11. Save your widget

If you want to see an example of this in action, click here.