Getting Started with the Custom Buttons extension

The Custom Buttons extension allows you to add custom buttons to your listings that can link to a file, external website, link on your own site or even an HTML element on the current page. You can also alter the existing listing buttons like Floor Plan, External Link, Mini Web and Energy Certificate.

For example let say you wanted to add a button that links to another page on your site called Due Diligence where that link or download needs to be consistent for the property listing type or all your listings, use this extension to achieve this.

To access the extension settings goto your WordPress Dashboard > Easy Property Listings > Extensions > Custom Buttons.

Main settings

Select the number of buttons you want to add and press save. This will then display a setting tab for each button.

Number of Buttons: Select the number of buttons you want to enable and press save changes. This will then display a setting tab for each custom button allowing you to configure specific options for that button.

Output Location: Select the output location(s) where your want your custom buttons to be displayed.

  • Display your custom buttons with existing buttons on your listings. 
  • Output buttons only into epl_custom_buttons hook. Add this hook to your template file. 
  • Before the text content on your listings. 
  • After the text content on your listings. 
  • Custom hook allowing you to specify any hook name.

Custom hook name: Enter in the custom hook name using words and underscores. Spaces not allowed. eg epl_property_address

Output hook priority: Priority to display your buttons on the selected hooks. Lower number = high priority & will display buttons earlier than other callbacks on hook.

Lightbox Style: Select the Popout Lightbox theme style.

Listing Buttons

Additional Options: Control the default listing buttons by enabling additional options tabs below. This will then display a setting tab for each button allowing you to configure specific options for that button.

Individual Button Settings

Configure the specific button option on the settings tab for that button.

Label: Displayed button label.

Link, File or ID: Add a full URL link to another website or your own, or upload a file using the Add File button or use a html ID for an element on your listings page, e.g #epl-box1.

Link behaviour: Open new browser tab or Use current browser tab.

Order: The order in relation to other buttons. The default order is 10.

Display on: Select the listing types that you want this button to display.

Listing Query Options

These settings will allow you to set a button to display on a specific listing type and/or if your listing matches criteria that you specify. For instance you can use this to display a button on a listing in a certain state. Or perhaps its a "House" and you want specific information displayed on your house listings that might differ from your "Unit" listings. See the codex for available custom fields that you can use.

Type: Select the listing types that you want this button to display.

Custom Field Name: Custom meta field key, single word, no spaces. Underscores and dashes allowed. E.g property_category.

Value: Enter the custom field meta value, eg House.

Lightbox

The Lightbox feature will open the link in a Popout Lightbox on the current page. If Lightbox and Smooth Scroll are both enabled, only the LightBox will take effect.

Lightbox: Enable or disable this feature.

Mode: These options need to be correctly set based on the type of link you are using:

  • Inline ( Select it when using content on the same page. )
  • iframe ( Use it for external web pages and links. )
  • Photo ( Used for image links. )

Width: Use px or % example 80% or 500px.

Height: Use px or % example 80% or 500px.

Breakpoint: Lightbox will only activate on screens larger than the value entered above in pixels.

Smooth Scroll

The Smooth scroll feature will allow a smooth transition from button to a specific location on your listings page. Handy for instance if you want a "Map" button where the map is displayed further down the page. When you set the map html ID and the user clicks the Map button, the page will smooth scroll to the map.

Smooth Scroll: Enable to disable this feature.

Speed: Scroll speed in milliseconds.

Offset: Scroll offset in pixels example 100.

Visit a listing to see your new button

The buttons will output based on your selected option. By default they are displayed with the existing buttons on your template using the <?php do_action( 'epl_buttons_single_property' ); ?> action, but you can separate your custom buttons from the others from the main settings and display them wherever you want them displayed.

The Custom Buttons will also assume the styling of your other buttons or whatever styling your theme applies to them. 

Related Articles