Skip to content
This repository has been archived by the owner on Apr 28, 2022. It is now read-only.

Adding ShelterZoom Rent Now widget to a website

Jump to bottom
NKoot edited this page Jun 21, 2018 · 4 revisions

Welcome to the API wiki!

There are three ways to integrate the widget to your website.

  1. First: if properties are already added to ShelterZoom database, add the following to the property page:

  • Button <div> with correlating 'propertyId' <div class="SHZRentButton" propertyId="$propertyID"></div>

  • Widget <div> with your SourceSystemID <div id="SHZContainer" data-source="$sourceSystemID"></div>. This <div> need to be added somewhere at the end of the page (footer, etc.) because the widget intended view is in the right bottom corner of the page

  • Add a bundle code: <script src="https://widget.shelterzoom.com/assets/main.bundle.js" charset="UTF-8" async="true" defer="true"></script>

  1. Second:​ This is recommended if properties cannot be added to ShelterZoom database. Add the following to the property page (property will be automatically created in DB from button attributes)
  • Button <div> with correlating 'propertyId' 
    <div class="SHZRentButton"
    propertyId="$propertyID" // mandatory
    propertyAddress="$propertyAddress" // mandatory
    propertyPhoto="$propertyPhoto"
    agentName="$AgentName"
    agentPhone="$agentPhone"
    agentEmail="$agentEmail"></div>

  • Widget <div> with your SourceSystemID <div id="SHZContainer" data-source="$sourceSystemID"></div> This <div> need to be added somewhere at the end of the page (footer, etc.)

  • Add a bundle code: <script src="https://widget.shelterzoom.com/assets/main.bundle.js" charset="UTF-8" async="true" defer="true"></script>

  1. Third:​ Recommended if: a) properties cannot be added to ShelterZoom database, and b) RENT button cannot be added to property page. Add a button with the following attributes to any page of website (e.g.Home page). After clicking on the button, a pop-up window will open with an empty rent form. A new property will be created in DB after filling the form.
  • Button <div> without 'propertyId'. Your SourceSystemID must be added to window.open link
     <div class="SHZRentButton" 
     style="display: inline-block; background-color: transparent; margin: 10px; width: 120px; height: 120px; border-radius: 60px; box-shadow: 0 1px 10px 0px rgba(0,0,0,0.2); cursor: pointer; vertical-align: middle; text-align: center;">
       <a onclick="window.open('http://shelterzoom.com/widgetpage/?ssid=$sourceSystemID','targetWindow',`toolbar=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=420,height=560`); return false;" href="#">
         <img src="https://shelterzoom.firebaseapp.com/btn_rent.png" alt="Rent now" style="width: 100%; height: auto;" />
       </a>
      </div>
Clone this wiki locally