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
...
Code Block | ||
---|---|---|
| ||
<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: "",
ownerName: "",
},
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 Any",
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: |
number | A numerical value that can represent whole numbers or decimals |
3-1. FeaturedListings ("featured-listings-1")
widgetType
“FeaturedListings” . represent widget typefilters
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).ownerName
: “text” . filter by name of owner (empty by default - Case sensitive ).
carousel
:enabled
: boolean . enable or disable the carousel featureinfinite
: boolean, enabling infinite scrolling in the carouseldots
: boolean, showing navigation dotsarrows
: boolean, showing navigation arrowsautoplay
:boolean enable or disable the autoplayautoplaySpeed
: 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 buttoncompare
: boolean . enable or disable compare buttonsave
: boolean . enable or disable save listings buttonbeds
: boolean . enable or disable bed valuebaths
: boolean . enable or disable bath valuesqft
: boolean . enable or disable size valuelistOfficeName
: boolean . enable or disable list office valuesubDivision
: 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 typestyles
:height
: "48px" . Height of search bar input.
3-3. Listings("listings-1")
widgetType
: “Listings”total
: number . total listings cards to showmapZoom
: number . map default zoom on page load . default value is 10mapCenter
: map default center on page loadlat
: number . coordinates of map default centerlng
: number . coordinates of map default center
propertyCard
:sqftType
:”text” . can be any value of"livingArea"
|"buildingArea"
|"lotArea"
,share
: boolean . enable or disable share buttoncompare
: boolean . enable or disable compare buttonsave
: boolean . enable or disable save listings buttonbeds
: boolean . enable or disable bed valuebaths
: boolean . enable or disable bath valuesqft
: boolean . enable or disable size value
filters
:city
: “text”. default search value for the city. If left empty, listings can be from any citylistingsType
:enabled
: boolean . enabled or disable listings type filterlistingsTypeValue
: “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 filterpropertyTypeEditable
: boolean . set if property type filter be editable by user or notpropertyTypeValues
: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 disablepriceRangeValue
: [“text”,”text”] . empty by default; you can specify a price range to filter listings.
sizeRange
:enabled
: boolean . enable or disabletype
: [”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 defaultprimaryColor
: "358 69.4% 55.2%" . (HSL format).
3-4. PropertyDetails("property-details-1")
widgetType
: “PropertyDetails”mortgageSection
: boolean . enable or disable mortgage calculator sectioncontactSection
: boolean . enable or disable contact us sectionagentSection
: boolean . enable or disable agent card sectionwalkScore
: boolean . enable or disable walk score sectiongreatSchools
: boolean . enable or disable great schools sectiondetails
:schools
: boolean . enable or disable schools detailsbeds
: boolean . enable or disable beds detailsbaths
: boolean . enable or disable baths detailslivingArea
: boolean. enable or disable living area detailslotArea
: boolean . enable or disable lot area detailsbuildingArea
: boolean . enable or disable building area detailsmlsArea
: boolean . enable or disable mls area detailssubDivision
: boolean . enable or disable sub division detailsdriveIn
: boolean . enable or disable drive in detailstruckLevel
: boolean . enable or disable truckLevel detailsclearHeight
: 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 buttoncompare
: boolean . enable or disable compare buttonsave
: boolean . enable or disable save listings buttonbeds
: boolean . enable or disable bed valuebaths
: boolean . enable or disable bath valuesqft
: 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 buttoncompare
: boolean . enable or disable compare buttonsave
: boolean . enable or disable save listings buttonbeds
: boolean . enable or disable bed valuebaths
: boolean . enable or disable bath valuesqft
: boolean . enable or disable size value
...