Projekt Landing-Pages
Wie man ein eigenes Template für Projekt Landing-Pages erstellt
Ein Template für eine Projekt Landing-Page ist eine einfache HTML-Datei, dessen Inhalt man nimmt und in Propstack eingibt.
Damit die Templates dynamisch sind, d.h. je nach Projekt andere Daten anzeigen, muss eine Template-Engine benutzt werden. Propstack nutzt dafür Liquid von Shopify.
Im Template hat man Zugriff auf folgende Daten (in JSON-Format dargestellt):
{
"project": {
"id": "123",
"name": "Templiner Park",
"street": "Musterstraße",
"houseNumber": "12",
"zipCode": "12345",
"city": "Berlin",
"country": "DEU",
"lat": 50.7010491,
"lng": 12.6461906,
"logoUrl": null,
"broker": {
"id": "4010",
"name": "Lars Heckmann",
"email": "heckmann@muster-immobilien.de",
"phone": "030 123 456 89",
"avatarUrl": "https://propstack.s3.eu-central-1.amazonaws.com/photos/..."
},
"title": "",
"courtage": "3,57% inkl. Mwst.",
"courtageNote": "Die Courtage beträgt für beide Parteien (Eigentümer und Käufer) jeweils die gleiche Höhe auf den beurkundeten Kaufpreis inkl. der gesetzlichen Umsatzsteuer",
"subHeadline": "...",
"tagline": "...",
"descriptionNote": "Phosfluorescently incentivize orthogonal ROI with highly efficient e-business.\n\nMonotonectally formulate equity invested mindshare...",
"furnishingNote": "",
"locationNote": "Authoritatively generate customer directed interfaces before visionary solutions.\n\nDramatically procrastinate parallel supply chains...",
"longDescriptionNote": "",
"longFurnishingNote": "",
"longLocationNote": "",
"constructionYear": 2018,
"showUnitsOnLandingPage": true,
"enableLinkingToUnitsLp": true,
"properties": [
{
"objectType": "LIVING",
"rsType": "APARTMENT",
"unitId": "WE 01",
"categoryLabel": "Etagenwohnung",
"floor": "1",
"floorLabel": "1. OG",
"numberOfFloors": 5,
"numberOfRooms": 3.0,
"numberOfParkingSpaces": 1,
"numberOfBedRooms": 2,
"livingSpace": 104.98,
"propertySpaceValue": 104.98,
"usableFloorSpace": null,
"minDivisible": null,
"plotArea": null,
"rentSubsidy": 320,
"rented": false,
"baseRent": null,
"price": 549000.0,
"pricePerSqm": 5229.57,
"titleImageUrl": "https://...",
"floorplans": [
{
"url": "...",
"title": "Grundriss.pdf"
}
],
"propertyStatus": {
"name": "Verkauft",
"nonpublic": true
},
"lp_url": "https://crm.propstack.de/..."
}
],
"images": [
{
"photoUrl": "https://propstack.s3.eu-central-1.amazonaws.com/photos/...",
"title": "Visualisierung Projekt"
},
{
"photoUrl": "https://propstack.s3.eu-central-1.amazonaws.com/photos/...",
"title": "Wohnzimmer Beispielwohnung"
}
],
"documents": [
{
"title": "Energieausweis",
"url": "...",
"isExposee": false
},
{
"title": "Exposé.pdf",
"url": "...",
"isExposee": true
}
],
"links": [
{
"url": "...",
"title": "360° Rundgang Beispielwohnung",
"isEmbedable": true
},
{
"url": "...",
"title": "Mit welchem Budget können Sie rechnen?",
"isEmbedable": false
}
],
"shop": {
"logoUrl": "...",
"imprintNote": null,
"termsNote": null,
"privacyNote": null,
"homepage": "http://muster-immobilien.de",
"name": "Muster Immobilien GmbH"
}
},
"broker": {
"id": "4010",
"name": "Lars Heckmann",
"email": "heckmann@muster-immobilien.de",
"phone": "030 123 456 89",
"avatarUrl": "https://propstack.s3.eu-central-1.amazonaws.com/photos/..."
},
"locale": "de",
"t": {
"navi": {
"description": "Objektdaten",
"documents": "Dokumente",
"units": "Einheiten",
"images": "Bilder",
"location": "Lage"
},
"units": "Einheiten",
"size": "Größe",
"rented": "Vermietet",
"rooms": "Zimmer",
"description": "Beschreibung",
"furnishing": "Ausstattung",
"images": "Bilder",
"documents": "Dokumente",
"links": "Links",
"constructionYear": "Baujahr",
"unit": "Einheit",
"floor": "Etage",
"price": "Preis",
"status": "Status",
"floorplan": "Grundriss",
"location": "Lage",
"allUnits": "Alle Einheiten anzeigen",
"available": "Verfügbar",
"sold": "Verkauft",
"contactForm": {
"title": "Gerne beraten wir Sie persönlich",
"salutation": "Anrede",
"salutationMr": "Herr",
"salutationMs": "Frau",
"firstName": "Vorname",
"lastName": "Nachname",
"email": "E-Mail",
"company": "Firma",
"phone": "Telefon",
"body": "Nachricht",
"send": "Abschicken",
"success": {
"title": "Vielen Dank",
"desc": "Wir freuen uns über Ihr Interesse.\nIhr Anliegen werden wir so schnell wie möglich bearbeiten.",
"back": "Zurück"
}
}
}
}
Wenn man nun z.B. im Template den Titel des Projektes anzeigen möchte, gibt man folgendes an: {{ project.title }}
Ansprechpartner: Für den Absender der E-Mail nutzt man {{ broker.* }}
und für den Projekt-Betreuer {{ project.broker.* }}
.
Ein Beispiel HTML-Template findest du hier:
Last updated