NestHub

APP

Adding Filters

You can add filters in NestHub if you go to edit the plugin and add the following in the JSON filters section

Filter Options

• cityID
• stateID
• keywordSearch
• rentMin
• rentMax
• beds
• baths
• propertyTypeID
• petOptionID
• distanceFrom

Example:

{ "stateID" : "code goes here" }

A cool little trick that can help you figure out how to set the filters for APP is to do a property search with the parameters you need and then look at the URL. Each search parameter is separated by &. So for example, if you set the sort to Old - New, the URL changes to: https://vintagerealestate.nesthub.com/tampa-bay-homes-for-rent?keywordSearch=&rentMin=&rentMax=&beds=&baths=&propertyTypeID=&petOptionID=&sort=date

So then you can see that the filter would need to be set as { "sort" : "date" }

If you were to do a search with a sort by set as price ( low - high ), the url would change to https://vintagerealestate.nesthub.com/tampa-bay-homes-for-rent?keywordSearch=&rentMin=&rentMax=&beds=&baths=&propertyTypeID=&petOptionID=&sort=amount

Locating State & City IDs

Navigate to FRS > Settings > Country then go the the city or state you need and grab the code from the URL

Example: stateID={7E7F3452-33D7-4BCD-ADA1-D556A4B3BCDF}

Fixing Phone Number Formatting

Add the following JS

				
					$(window).load(function() {
						//Format Phone number
						function formatPhoneNumber(phoneNumberString) {
							var cleaned = ('' + phoneNumberString).replace(/\D/g, '')
							var match = cleaned.match(/^(1|)?(\d{3})(\d{3})(\d{4})$/)
							if (match) {
								var intlCode = (match[1] ? '+1 ' : '')
								return ['(', match[2], ') ', match[3], '-', match[4]].join('')
							}
							return null
						}

						$('.format-phone').each(function() {
							var phoneNumberString = $(this).text();
							var formattedPhone = formatPhoneNumber(phoneNumberString);
							$(this).text(formattedPhone);
						});
					})
				
			

Then wrap the phone numbers in a span with class="format-phone"

				
					<span class="format-phone"></span>
				
			

Availability Date

To get the Availability Date to display "Available Immediately" if the date is in the past

Details Template

Replace Freerentalsite Plugin Code at top of Details template with

			
			
			{% freerentalsite_plugin %}
			{% assign isAvailable = true %}
			{% assign dateNow = "now" | date  %}
			{% assign availableDate = property.availabilityDate | date %}
			{% assign available = availableDate | compareDate : dateNow %}
			{% if property.adStatusID != "1" %}
			{% assign isAvailable = false %}
			{% endif %}
			{% if isAvailable == false %}
			This Property Is Not Available
			{% else %}
			
			
			

Replace Availability Code with

			
			
			{% if property.availabilityDate != "" %}
			<dt>Date Available</dt>
			<dd>
			{% assign available = property.availabilityDate | compareDate : dateNow %}
			{% if available >= 1 %}
			{{ property.availabilityDate }}
			{% else %}
			Immediately
			{% endif %}
			</dd>
			
			
			

List Template

Replace Freerentalsite Plugin Code at top of List template with

			
			
			{% freerentalsite_plugin %}
			{% assign isAvailable = true %}
			{% assign dateNow = "now" | date  %}
			{% assign availableDate = property.availabilityDate | date %}
			{% assign available = availableDate | compareDate : dateNow %}
			
			
			

Replace Availability Code with

			
			
			{% assign available = property.availabilityDate | compareDate : dateNow %}
			{% if available >= 1 %}
			Available: {{ property.availabilityDate }}
			{% else %}
			Available: Immediately
			{% endif %}
			
			
			

Forms

Adding Recaptcha

Add the google Recaptcha script to either the resources or the bottom of the templates:

				
					<script defer src="https://www.google.com/recaptcha/api.js?onload=onIonRecaptchaLoad&render=explicit"></script>
				
			

Add the recaptcha tag to the form snippet. ( ie: recaptcha="1" )

				
					{% form name="contact" recaptcha="1" %}
				
			

Reload the page and the recaptcha should appear above the submit button. The form will not submit without the recaptcha completed.

Webform API Request

In Nesthub, go to the client's form. Scroll down to Form Actions and add Webhook Request (API)

Request Type: Post

Endpoint: URL provided by client to send the form data to (or Webhook URL provided by Zapier's Webhooks function)

Content Type: JSON

Body:

			
			
			{{ data | json }}
			
			
			

Example of how the JSON data looks on submit:

			
			{
			    "first-name": "John",
			    "last-name": "Doe",
			    "email": "john@email.com",
			    "phone": "555-555-5555",
			    "property-address": "123 Main Street",
			    "city": "Estero",
			    "state": "Florida",
			    "zip": "33928"
			}
		
		

Active Campaign Setup

Obtain the API Key and API URL from their active campaign account. That information is located in Settings -> Developer

In Nesthub, add a new Active Campaign Plugin. Put the API URL in the URL field and the API Key in the API Key Field, Click Save

Autoresponse Simple Email Template

Example:

Hello {{data.name}}, Thank you for contacting {Company Name Goes Here}. We have received your message and our team will follow up with you shortly.

{Company Name Goes Here}

Code

		
			
			<table style="width: 100%; border:solid 1px black; padding:0px; border-spacing: 0px;">
				<tbody>
					<tr>
						<td style="padding:20px;"><center><img src="https://www.propertymanagerwebsites.com/images/logo.png" style="width: 300px;" class="fr-fic fr-dib fr-fil" alt="Company Logo Replace"></center>
						</td>
					<tr>
						<td style="padding:20px;">Hello {{data.name}},
							<br>
							<br>Thank you for contacting {Company Name Goes Here}. We have received your message and our team will follow up with you shortly.<br/><br/>
					</td>
					</tr>
					<tr>
						<td style="width: 100.0000%; background-color:#0793b4; padding:5px 10px; text-align:center;"><span style="color: rgb(255, 255, 255);">{Company Name Goes Here}</span></td>
					</tr>
				</tbody>
			</table>