Wishlist Plugin Technical Guide

Modified on Wed, 30 Jul at 1:17 PM

Wishlist Plugin

A responsive widget that displays saved properties in a customizable format. Allows users to view and manage their saved properties.

Features

Display saved properties in row or grid format
Customisable branding and styling
Property image gallery with configurable image count
Responsive design for all devices

Installation

1. Include the Script

<script src="./dist/0.0.1/wishlist.iife.js" 
        data-container-id="wishlist-container"
        data-tenant-config='{
          "apiUrl": "https://azores-dev5.iprostage.com", 
          "display": "rows",  
          "brand": {
            "primary": "#000000", 
            "secondary": "#0066cc"
          }, 
          "title": "Saved Properties 1", 
          "imageCount": 3
        }'>
</script>

2. Add the Container

<div id="wishlist-container"></div>

Configuration

Container Attributes

Attribute	Type	Description	Default
id	String	ID of the container element	Required

Script Attributes

Attribute	Type	Description	Default
data-container-id	String	ID of the target container div	Required
data-tenant-config	JSON String	API endpoint and display options	Required

Tenant Config Options

{
  "apiUrl": "https://azores-dev5.iprostage.com",
  "display": "rows",
  "brand": {
    "primary": "#000000",
    "secondary": "#0066cc"
  },
  "title": "Saved Properties 1",
  "imageCount": 3
}

Example

<div class="container">
  <div id="wishlist-container"></div>
</div>

<script src="./dist/0.0.1/wishlist.iife.js" 
        data-container-id="wishlist-container"
        data-tenant-config='{
          "apiUrl": "https://azores-dev5.iprostage.com", 
          "display": "rows",  
          "brand": {
            "primary": "#000000", 
            "secondary": "#0066cc"
          }, 
          "title": "Saved Properties 1", 
          "imageCount": 3
        }'>
</script>