We provide you with one simple widget “Property Search” that you can insert into any widget area you like. This is a simple location/property type (Sale/Rent) search box. If needs be this can be customised by editing the wppf_layout_widgetsearch.php template (see Templates) but it will just work straight out of the box.
This plugin has fleixble short codes to allow you to drop specific wppf functionality onto any page within your site.
To add options simple include them in the shortcode as a name value pair e.g. [wppf_search branchid=”1″ type=”To Buy”]. See below for the full set of options available for each short code. Only add attributes to the shortcode if you want to pre-filter results. Any manually entered search criteria will override the attributes set in the shortcode.
[wppf_quicksearch] and [wppf_search]
[wppf_featured] and [wppf_slider]
[wppf_enquiry]
Show a detailed search with results pre-filtered for branch 221 hiding properties that are sold, sstc, let or let agreed.
[wppf_search wppf_branch=’221′ wppf_soldlet=’hide’]Display the latest 4 To Buy and Commercial properties in a page
[wppf_featured wppf_search=’To Buy,Commercial’ wppf_orderby=’latest’ wppf_records=’5′]Display the latest 5 properties in a slider
[wppf_slider wppf_orderby=’latest’ wppf_records=’5′]We have included numerous hooks and filters into the plugin which experience wordpress developers will be able to use to modify the behaviour of the plugin. We are working on publishing the full set of these but in the meantime here are a few useful examples
function my_default_view( $example ) {
return ‘grid’;
}
add_filter( ‘wppf_query_wppf_view’, ‘my_default_view’ );
function my_min_rent($rentlist) {
return array(100,150,200,250,300,350,400,450,500,600,700,800);
}
add_filter(‘wppf_filter_minrent’, ‘my_min_rent’);
function my_max_rent($rentlist) {
return array(600,700,800,1000,1500,2000);
}
add_filter(‘wppf_filter_maxrent’, ‘my_max_rent’);
function my_min_price($rentlist) {
return array(25000,50000,60000,70000,80000,90000,100000,110000,120000,125000);
}
add_filter(‘wppf_filter_minprice’, ‘my_min_price’);
function my_max_price($rentlist) {
return array(100000,110000,120000,125000,130000,140000,150000,160000,170000,175000,180000,190000,200000);
}
add_filter(‘wppf_filter_maxprice’, ‘my_max_price’);
This section is intended for developers and theme builders and explains how to customise the WP Property Feed layouts. There are 12 layout files that sit in the templates directory of the plugin and all of these can be copied into the root directory of your theme to override the plugin defaults. Simply make a copy of the templates you wish to override in your theme and the plugin will automatically use these instead, this is the only safe way to modify the layout templates. You can also override the plugin stylesheet by also making a copy in your theme but you will need to dequeue and then enqueue your versions in your theme functions.php as follows;
add_action('wp_enqueue_scripts', 'mytheme_enque', 101);
function mytheme_enque() {
wp_dequeue_style('wppf_properties');
wp_enqueue_style('wppf_properties' locate_template('wppf.css'));
}
The plugin stores properties as a custom post type (wppf_property) so the archive naming follows the standard wordpress structure. We include a standard top level archive file archive-wppf_property.php but you could also create specific taxonomy templates in addition. The branch, property_area and property_type tags are all defined to allow for additional archive pages to be created within your theme. This template defines the layout of the results page for the property search and you will note from version that it takes the layout property from the plugin settings to return various different layouts. You can simply discard these and use your own layout if you wish. The main thing to note is the inclusion of wppf_layout_results sub-template which displays the property results.
Just as we have the standard archive template we also include the standard single one single-wppf_property.php. This is the template that displays the property details. In our version this is simply a container for the sub-template wppf_layout_property
Template to display the property results with tabs for grid, list and map (not the nomap version excludes the map tab as this is indended for templates where the map is always present alongside the results). The template uses standard WordPress loop methodology so provided you are familiar with wordpress coding the code within should be clear. There is an explanation of the custom post type structure further down.
Map layout which is very basic. This includes a function to create the javascript map pins and a div map container. Care should be taken to include both and maintain the div id naming.
Template for the full width property slider used by the wppf_slider shortcode
Template for the featured properties shortcode wppf_featured.
Templates for the two search shortcodes wppf_search and wppf_quicksearch respectively
Template for the Property Search widget.
Template used in the single page to display the full property details. See the full details of the Custom Post Type for details on the properties available
Template used for the wppf_enquiry shortcode. This makes use of google reCaptcha and will email contents to the branch in question. The fields on the form are specifically named to match the Vebra enquiries api so cannot be altered.
The plugin pulls all the feed data into a single custom post type. This works just like any other custom post type with title, description, slug and featured image all available as normal. In addition to this there are a number of taxonomies and meta data attached that can be used in your templates;
We have designed the plugin to use standard wordpress styles and as such it should work seamlessly with most wordpress themes, so colours and font styles should cascade down through our plugin. Occasionally themes will use their own bespoke styling system in which case we allow you to override our plugins styles with your own.
In general the plugin is intended to work with general themes that do not already have property features already included as our plugin will provide all the property display and search functionality you require. However, we are now starting to build connectors that will join our plugin to popular property themes so that your back-office properties will automatically appear in the property theme.
In order to provide the connection between our plugin and a property feed you need to download and install a plugin addon (in the form of another plugin). You must have the WP Property Feed plugin installed and enabled and also the property theme installed and enabled in order for the connector to work. Once the connector is installed and activated you can just use all the features of the property theme as normal. All our connectors are provided free via the wordpress.org plugin repository.
To change the default radius ranges in the search filter we have provided a wordpress filter. You can add the following code snippet to your themes functions.php file to make use of this filter to change the radius values;
function my_radius_filter( $data ) {
return array(0.5,1,2,3,5,10);
}
add_filter('wppf_filter_radius', 'my_radius_filter');If you want to change the default sort order for the property display you can add the following code snippet to your WordPress Theme functions.php file
function my_default_sort( $example ) {
return ‘price-asc’; //can be price-asc, price-desc,latest
}
add_filter( ‘wppf_query_wppf_orderby’,’my_default_sort’);
In some cases you might be using our plugin along side other plugins or themes that already use the slug /property/ for another Custom Post Type. If that is the case you will see a clash and the display of either our properties of the existing custom post type may become garbled. To change the default slug for our plugin use the following code snippet and place it in you theme’s functions.php file.
add_filter(‘wppf_filter_slug’,’my_property_slug’);
function my_property_slug($current) {
return ‘wppf_property’;
}
Change ‘wppf_property’ to whatever
Once this has been added to your function.php we recommend that you log into wp-admin and visit Settings > Permalinks and click the update button on this page. This will refresh the WordPress permalink cache and make sure that the correct templates are then applied.
This guide will help you through using the Elementor integration we have setup to get the most out of the Elementor Theme Builder which is part of the Elementor Pro package.
Requires Elementor Pro Version 2.9.4 or greater
In WP Property Feed all properties are a special Custom Post Type called properties. To see the property listings you therefore just need to go the the archive page for properties /properties/ on your site (no need to create a page as WordPress already has all this functionality built in). Now that you are using Elementor Pro you may want to style the layout of this page, here’s how;
Step 1 : Create a new theme template for properties. In wp-admin select the Templates > Theme Builder menu option
Step 2: In the select the type of template you want choose “Archive” and give the template any name you like
Click the “Create Template” and you will be taken to a library of templates. Just press the X in the top right to close this library.
Step 3 (optional): Normally we have a search bar at the top of the property listing page and for this we have created an Elementor widget. If you scoll down the widget section until you find the WP Property feed section then drag the Quick Search widget onto your new archive page.
Once you have this on the page you can play with all the normal Elementor settings and styling options to make it look as you want. UPDATE: You can now use the Elementor From widget to create your own form just remember to set the “Actions After Submit” to “Property Seearch”.
Step 4: Add the Elementor “Archive Posts” widget to your page.
In the layout options for this widget we have created a “Property” skin to use for the display of property details and added specific options for showing the sort-order dropdown, sub-title display (displays the type of property rooms etc), show price, and badge display (For Sale, SSTC, etc). Again play with the settings to suit.
Step 5: Publish the template. When you press the publish button you will be thrown to the Publish Settings dialog where you will press “ADD CONDITION” and select “Include” and “Properties Archive” to make this template apply to the property archive page only.
You will now have an Elementor template setup for your search results. To see the template in action go to https://{yoursite.com}/property/
Next you will need a page to display the property details on a page, so that when you click through a property details you are using Elementor to style the results.
Step 7: Create a property details template
To do this again click on the wp-admin menu Templates > Theme Builder and then “Add Templete”. This time in the template box choose “Single” and the “Properties” post type and give the template a meaningful name.
Elementor Version 3 Update: The release of version 3 of Elementor has seen the above box modified to no longer include the “Select Post Type” option. Elementor will only now override pages that use the default page template so we have had to build in an override option in Settings > WP Property Feed > General to allow Elementor to override the base property template THIS OPTION MUST BE TICKED if you are using Version 3 or more.
Again close the library popup that appears so that you are in the Elementor designer.
Step 8: Using dynamic tags.
We have added a load of dynamic tabs to help you access the specific property details you will need to drop onto the template. As normal you will want to add the title and description as much of the property detail information is in those two settings. But you will also want to add specific property details which will be either text, media or galleries.
Text Tags: Text tags can be used in many places but the most common will be using the “Text Editor” widget. If you drag a widget onto the page and look on the content tab you will see the dynamic content tag icon.
Click the cylinder button and from the drop down select “Property Data”. Once selected you will then see a settings spanner next to Property Data which you can click on to select the specific property data you require.
You can get property data into many of the various Elementor widgets this way.
Link Tags: We have created a number of link tags for items that only appear as links in particular the Brochure PDF can be found here. Use with button widgets or any other widget that allows linking.
Gallery Tags: We have also created a number of gallery tags to display the various property images, floorplans and EPCs. If you drop a Galley Widget onto the page you will again see the dynamic tag icon with various WP Property Feed options for these. Try playing with these options
Maps: There is one special case for the Google Maps widget where you will want to add the address but the widget does not have the dynamic tags option. Fortunately it does allow you to select a “Post Custom Field” where you can enter the Custom Key “address_all” which will pull in the full location text to render the correct location.
UPDATE: We have found that the standard Elementor map widget is not very accurate at locating properties using the address_all option and we now recomment using the “Premium Addons for Elementor” plugin which provides a much better Google Maps widget. This widget allows you to use the longitude and latitude values we provide in the property data tags which is much more reliable. Make sure you set both the map center and also the map marker to these longitude / latitude values.
Setp 9: Publish the template. At the default option will be to Include Properties which will then apply this template to all properties. At this point you could just “Save & Close” and your template for properties will be ready. However you may choose to design different templates for different property_areas. Property Areas (probably not well named, sorry!) are the main search divisions – to-buy, to-rent, commercial and developments. You may want to show details of rental deposits and let types for rentals but not for sale properties so having 2 different templates will allow you to modify the layout depending on the area. You could also do the same for Branches if you are a multi-branch agency for instance.
Setting this condition above will limit the template to Rental properties only.
Step 10: Other widgets
You may also want to add some property widgets to other pages too. For this there are 3 main widgets. We have already explored the “Quick Search” widget in the archive template, but this can also be dropped into any Elementor page you wish. You may also want to “Feature” some properties on some pages in your site. To do this you can use either the “Posts” or “Portfolio” widgets both of which work in a similar way. As an example we will take the “Post” widget setup.
Add a “Posts” widget to your page and in the “Layout” section select “Properties” from the “Skin” option. This will add all the options you came across earlier in the “Archive Posts” widget, but this time you will want to select the specific properties you want to show in this widget. To do this click on the “Query” section of the widget and select “Properties” in the “Source” setting. To limit the properties returned to say “For Sale” properties you will click the “Include By” and “Term”, then in the “Term” box below enter “to-buy”.
You will also see an option to “Always show featured first”. Selecting this option will override the sort order options above it and display properties specifically marked as featured followed by the newest (if we don’t have enough featured properties to fill the grid). This is useful if you want to use the featured flag to highlight properties.
Other than that just play!
One of the features of Jupix is to have emails sent to clients with links to properties that match their search requirements. By default the email will link to www.yourdomain.com/more_details.php which or cause will not exist on your WordPress site. However our “out of the box” templates include code to capture the profileID sent in this link and redirect to the correct property on your site. The code is placed in the property archive page which is normally the /property/ page (unless you have overridden the default property slug), so asking Jupix to change the email link to www.yourdomain.com/property/ will allow your email links to work.