Versions Compared

Old Version 4

changes.mady.by.user Dean.A (Unlicensed)

Saved on

compared with

New Version 5

changes.mady.by.user Dean.A (Unlicensed)

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Getting Started

...

  • Access script provided to the <head> section of your website.

  • Refer to your platform’s documentation on how to insert custom code snippets into the <head> section

...

Expand
titlewidgets configuration script
Code Block
languagejs
<script src="https://static.realtyfeed.com/index.js"></script>
<script>
window.rfWidgets = window.rfWidgets || {};
window.rfWidgets.config = {
  apiKey: "YOUR_API_KEY",
  clientID: "YOUR_CLIENT_ID",
  walkScoreKey: "WALKSCORE_API_KEY",
  locationKey: "GOOGLE_API_KEY",
  mapKey: "GOOGLE_API_KEY",
  listingsPage: "/listings",
  propertyDetailsPage: "/listing",
  comparePage: "/compare",
  "featured-listings-1": {
    widgetType: "FeaturedListings",
    filters: {
      sortBy: { label: "Latest", value: "OriginalEntryTimestamp desc" },
      city: "",
      propertyType: {
        Residential: [],
        Commercial: [],
      },
      priceRange: [],
      listOfficeName: "",
      subDivision: "",
    },
    carousel: {
      enabled: true,
      infinite: true,
      dots: true,
      arrows: true,
      autoplay: true,
      autoplaySpeed: 3000,
    },
    total: 8,
    propertyCard: {
      sqftType: "livingArea",
      share: true,
      compare: true,
      save: true,
      beds: true,
      baths: true,
      sqft: true,
      listOfficeName: true,
      subDivision: true,
    },
    styles: {
      primaryColor: "358, 69.4%, 55.2%",
    },
  },
  "searchbar-1": {
    widgetType: "SearchBar",
    styles: {
      height: "48px",
    },
  },
  "listings-1": {
    widgetType: "Listings",
    total: 12,
    mapZoom: 10,
    mapCenter: {
      lat: 40.7128,
      lng: -74.006,
    },
    propertyCard: {
      sqftType: "livingArea",
      share: true,
      compare: true,
      save: true,
      beds: true,
      baths: true,
      sqft: true,
    },
    filters: {
      city: "",
      status: {
        enabled: true,
      },
      listingsType: {
        enabled: true,
        listingsTypeValue: "For Sale",
        listingsTypeEditable: true
        },
      propertyType: {
        enabled: true,
        propertyTypeEditable: true,
        propertyTypeValues: {
          Residential: [],
          Commercial: [],
        },
      },
      priceRange: {
        enabled: true,
        priceRangeValue: [],
      },
      sizeRange: {
        type: ["livingArea", "buildingArea"],
        enabled: true,
      },
      bedBath: {
        enabled: true,
      },
      listOfficeName: "",
      subDivision: "",
    },
    styles: {
      defaultView: "",
      primaryColor: "358, 69.4%, 55.2%",
    },
  },
  "property-details-1": {
    widgetType: "PropertyDetails",
    mortgageSection: true,
    contactSection: true,
    agentSection: true,
    walkScore: true,
    greatSchools: true,
    details: {
      schools: true,
      beds: true,
      baths: true,
      livingArea: true,
      lotArea: true,
      buildingArea: true,
      garage: true,
      mlsArea: true,
      subDivision: true,
      driveIn: true,
      truckLevel: true,
      clearHeight: true,
    },
    overview: ["beds", "baths", "garage", "livingArea", "lotArea"],
    propertyCard: {
      sqftType: "livingArea",
      share: false,
      compare: false,
      save: false,
      beds: true,
      baths: true,
      sqft: true,
    },
    styles: {
      primaryColor: "358, 69.4%, 55.2%",
    },
  },
  "compare-1": {
    widgetType: "Compare",
    styles: {
      primaryColor: "358, 69.4%, 55.2%",
    },
  },
  "saved-listings-1": {
    widgetType: "SavedListings",
    propertyCard: {
      sqftType: "livingArea",
      share: true,
      compare: true,
      save: true,
      beds: true,
      baths: true,
      sqft: true,
    },
    styles: {
      primaryColor: "358, 69.4%, 55.2%",
    },
  },
};
</script>

...

  • Each widget in the script is identified by a unique key (e.g., featured-listings-1, searchbar-1). These keys are crucial for correctly loading the widget configurations on your site.

Do Not Just Change the Widget Key:

  • Altering the key without making corresponding changes in the widget html element will prevent the widget configuration from loading.

...

text

A sequence of characters used to represent words or strings. Must be inside quotation marks, like "example text"

boolean

A data type with only two possible values: true or false. This type is used for enabling or disabling a feature

number

A numerical value that can represent whole numbers or decimals

3-1. FeaturedListings ("featured-listings-1")

  • widgetType “FeaturedListings” . represent widget type

  • filters

    • sortBy

      • label :  "Latest"

      • value : "OriginalEntryTimestamp desc" . sorts the listings by the latest entries. Do not change this setting unless you are familiar with RESO standards

    • city : “text” . default search value for the city .

  • propertyType 

    • Residential: [ ] . values can be [ "House","Apartment","Semi-Detached","Townhouse","Condo","Multi family","Manufactured","Co-op","Land","Ranch/Farm","Other" ]

    • Commercial: [ ] . values can be [ "Retail","Multi Family","Office","Industrial","Hospitality","Mixed Use","Business","WareHouse","Land","Other" ]

  • priceRange : [“text”,”text”] . empty by default; you can specify a price range to filter listings.

  • listOfficeName : “text” . filter by the name of the listing office (empty by default - Case sensitive ).

  • subDivision :“text” . filter by the name of the sub division (empty by default).

  • carousel:

    • enabled : boolean . enable or disable the carousel feature

    • infinite : boolean, enabling infinite scrolling in the carousel

    • dots: boolean, showing navigation dots

    • arrows: boolean, showing navigation arrows

    • autoplay:boolean enable or disable the autoplay

    • autoplaySpeed: number .default to 3000 

  • total: number . total parameter determines the total number of listing cards to display. If the carousel feature is enabled, the maximum number of cards visible at any given time will be 4 at the maximum width. However, the total number of listings shown will still depend on the value set for total.

  • propertyCard:

    • sqftType: ”text” . can be any value of "livingArea" | "buildingArea" | "lotArea",

    • share: boolean . enable or disable share button

    • compare: boolean . enable or disable compare button

    • save: boolean . enable or disable save listings button

    • beds: boolean . enable or disable bed value

    • baths: boolean . enable or disable bath value

    • sqft: boolean . enable or disable size value

    • listOfficeName: boolean . enable or disable list office value

    • subDivision: boolean . enable or disable sub division value

  • styles:

    • primaryColor:  "358 , 69.4% , 55.2%" . (HSL format).

3-2. SearchBar("searchbar-1")

  • widgetType: “SearchBar” . represent widget type

  • styles:

    • height:  "48px" . Height of search bar input.

3-3. Listings("listings-1")

  • widgetType: “Listings”

  • total: number . total listings cards to show

  • mapZoom : number . map default zoom on page load . default value is 10

  • mapCenter: map default center on page load

    •  lat : number . coordinates of map default center 

    •  lng : number . coordinates of map default center 

  • propertyCard:

    • sqftType:”text” . can be any value of "livingArea" | "buildingArea" | "lotArea",

    • share: boolean . enable or disable share button

    • compare: boolean . enable or disable compare button

    • save: boolean . enable or disable save listings button

    • beds: boolean . enable or disable bed value

    • baths: boolean . enable or disable bath value

    • sqft: boolean . enable or disable size value

  • filters:

    • city: “text”. default search value for the city. If left empty, listings can be from any city

    • listingsType:

      • enabled : boolean . enabled or disable listings type filter

      • listingsTypeValue : “text” . listings type default value on page load . value can be "For Any" or "For Sale" or "For Rent" . default value is “For Any”

      • listingsTypeEditable : boolean . set if listings type filter be editable by user or not . default value is true

    • propertyType: 

      • enabled: boolean . enable or disable property type filter

      • propertyTypeEditable: boolean . set if property type filter be editable by user or not

      • propertyTypeValues: 

        • Residential: [ ] . values can be [ "House","Apartment","Semi-Detached","Townhouse","Condo","Multi family","Manufactured","Co-op","Land","Ranch/Farm","Other" ]

        • Commercial: [ ] . values can be [ "Retail","Multi Family","Office","Industrial","Hospitality","Mixed Use","Business","WareHouse","Land","Other" ]

    • priceRange: 

      • enabled : boolean . enable or disable

      • priceRangeValue : [“text”,”text”] . empty by default; you can specify a price range to filter listings.

    • sizeRange: 

      • enabled: boolean . enable or disable

      • type: [”text”] . can be any value of ["livingArea","buildingArea","lotArea"] . note that this can have multiple value to show

    • bedBath:

      • enabled: boolean . enable or disable

    • listOfficeName: “text” . filter by the name of the listing office (empty by default - Case sensitive ).

    • subDivision:“text” . filter by the name of the sub division (empty by default).

  • styles:

    • defaultView:“text” . set default view on page load. can be any value of "map" | "grid" | "list" . if no value is provided shows map mode by default

    • primaryColor:  "358 , 69.4% , 55.2%" . (HSL format).

3-4. PropertyDetails("property-details-1")

  • widgetType: “PropertyDetails”

  • mortgageSection: boolean . enable or disable mortgage calculator section

  • contactSection: boolean . enable or disable contact us section

  • agentSection: boolean . enable or disable agent card section

  • walkScore: boolean . enable or disable walk score section

  • greatSchools: boolean . enable or disable great schools section

  • details: 

    • schools: boolean . enable or disable schools details

    • beds: boolean . enable or disable beds details

    • baths: boolean . enable or disable baths details

    • livingArea: boolean. enable or disable living area details

    • lotArea: boolean . enable or disable lot area details

    • buildingArea: boolean . enable or disable building area details

    • mlsArea: boolean . enable or disable mls area details

    • subDivision: boolean . enable or disable sub division details

    • driveIn: boolean . enable or disable drive in details

    • truckLevel: boolean . enable or disable truckLevel details

    • clearHeight: boolean . enable or disable clear height details

  • overview: [”text”,”text”,…] . overview section of property details page .  can be any value of ["beds", "baths", "garage", "livingArea", "lotArea", "buildingArea", "driveIn", "truckLevel", "clearHeight"]

  • propertyCard:

    • sqftType: ”text” . can be any value of "livingArea" | "buildingArea" | "lotArea",

    • share: boolean . enable or disable share button

    • compare: boolean . enable or disable compare button

    • save: boolean . enable or disable save listings button

    • beds: boolean . enable or disable bed value

    • baths: boolean . enable or disable bath value

    • sqft: boolean . enable or disable size value

  • styles:

    • primaryColor:  "358 , 69.4% , 55.2%" . (HSL format).

3-5. Compare("compare-1")

  • widgetType “Compare”

  • styles:

    • primaryColor:  "358 , 69.4% , 55.2%" . (HSL format)

3-6. SavedListings("saved-listings-1")

  • widgetType: “SavedListings”

  • styles:

    • primaryColor:  "358, 69.4%, 55.2%" . (HSL format).

  • propertyCard:

    • sqftType:”text” . can be any value of "livingArea" | "buildingArea" | "lotArea",

    • share: boolean . enable or disable share button

    • compare: boolean . enable or disable compare button

    • save: boolean . enable or disable save listings button

    • beds: boolean . enable or disable bed value

    • baths: boolean . enable or disable bath value

    • sqft: boolean . enable or disable size value

...