Einrichtungsanleitung

Website-Integrationen

So bringen Sie Ihre RentMerchant-Inserate, einen Button „Miete zahlen“, ein Bewohner-Menü und QR-Codes auf Ihre bestehende Website. Die meisten Vermieter sind in etwa zehn Minuten fertig.

1. Bevor Sie beginnen

2. Ihren Code finden

  1. Melden Sie sich unter app.rentmerchant.com an.
  2. Öffnen Sie Einstellungen und dann den Tab Integrationen.
  3. Klicken Sie auf eine Option, um sie zu öffnen, und nutzen Sie dann deren Button Code kopieren. Ihr Code enthält bereits Ihren eigenen Kontonamen, fügen Sie ihn also genau so ein, wie er kopiert wurde.

In den Beispielen auf dieser Seite steht your-name für den Namen Ihres Kontos. Kopieren Sie Ihren echten Code immer von der Seite Integrationen, statt diese abzutippen.

3. Mietinserate hinzufügen

Das Widget zeigt die Wohnungen, die Sie inserieren. Nichts ist inseriert, bis Sie es einschalten, eine Wohnung nach der anderen.

  1. Öffnen Sie Inserate (unter Vermietung). Dort finden Sie alle Ihre Wohneinheiten. Eine Immobilie ohne Wohneinheiten zeigt eine Schaltfläche Inserat erstellen.
  2. Klicken Sie bei einer Wohnung auf Bearbeiten und geben Sie Schlafzimmer, Badezimmer, Quadratfuß, Monatsmiete, Kaution, das Verfügbarkeitsdatum (leer lassen für „sofort verfügbar“), Haustiere und eine Beschreibung ein.
  3. Laden Sie bis zu 12 Fotos hoch. Das erste Foto ist das Titelbild; verwenden Sie die Pfeile zum Umsortieren. Standortdaten werden automatisch aus jedem Foto entfernt.
  4. Kreuzen Sie Diese Wohnung öffentlich inserieren an und klicken Sie auf Inserat speichern.

Wenn eine Wohnung vermietet ist, klicken Sie auf der Seite Inserate auf Inserat entfernen. Sie verschwindet innerhalb von fünf Minuten von Ihrer Website, ohne dass Code geändert werden muss.

Jedes Inserat erhält außerdem eine eigene Seite mit Fotogalerie und einem Button Für diese Wohnung bewerben. Das Bewerbungsformular öffnet sich mit dieser Wohnung bereits ausgewählt, und Mietbewerbungen landen in Ihrem Tab Mietbewerbungen.

4. Inserate-Widget

Zeigt Ihre inserierten Wohnungen als Karten mit Foto, Miete, Schlafzimmern, Badezimmern und Verfügbarkeit. Besucher klicken auf eine Karte, um die Inseratsseite zu öffnen.

Option A: Widget-Code (empfohlen)

Passt sich der Breite Ihrer Seite an und wächst mit Ihren Inseraten. Fügen Sie es dort ein, wo die Inserate erscheinen sollen:

<div data-rentmerchant-listings="your-name"></div>
<script src="https://app.rentmerchant.com/embed/v1/listings.js" async></script>

Option B: iframe

Für Baukästen, die keine Skripte erlauben. Es ist ein Feld mit fester Höhe, das scrollt:

<iframe src="https://app.rentmerchant.com/embed/listings/your-name" title="Available rentals"
        loading="lazy" style="width:100%;height:900px;border:0"></iframe>

Wenn Ihr Baukasten daneben ein Skript erlaubt, verwenden Sie stattdessen die Version mit automatischer Größenanpassung von der Seite Integrationen. Sie fügt eine Zeile hinzu, die das Feld genau so hoch macht wie Ihre Inserate.

5. Schwebender Bewohner-Button

Fügt in der unteren Ecke jeder Seite einen Button Bewohner hinzu. Er öffnet ein kleines Menü: Bewohner-Login, Miete zahlen, Reparaturanfrage senden, Jetzt bewerben und Verfügbare Mietobjekte (jeweils nur, wenn es für Ihr Konto zutrifft). Fügen Sie ihn einmal in den Bereich Ihres Baukastens ein, der Code auf jeder Seite einfügt (meist Website-weiter Code, Footer-Code oder Code Injection genannt):

<script src="https://app.rentmerchant.com/embed/v1/resident-button.js" data-rentmerchant-site="your-name" async></script>

Wenn Ihr Baukasten keinen Bereich für Website-weiten Code hat, fügen Sie den Code auf jeder Seite ein, auf der der Button erscheinen soll.

6. Buttons und Links

Buttons: im Bereich Buttons unter Integrationen: Wählen Sie die gewünschten Buttons aus, wählen Sie eine Farbe, prüfen Sie die Vorschau und kopieren Sie den Code. Die Buttons sind einfach gestaltete Links und funktionieren daher in jedem Baukasten, der HTML akzeptiert, auch in E-Mail-Newslettern.

Links (jeder Tarif): Kopieren Sie einen beliebigen Link in das Navigationsmenü, die Fußzeile, ein Social-Media-Profil oder Ihre E-Mail-Signatur. In den meisten Baukästen: Menü-Editor öffnen, einen Eintrag Link hinzufügen und die Adresse einfügen.

7. QR-Codes

Klicken Sie im Bereich QR-Codes unter dem gewünschten Code auf PNG herunterladen. Drucken Sie ihn auf ein Schild „Zu vermieten“ (verwenden Sie Verfügbare Mietobjekte oder Jetzt bewerben), einen Aushang im Waschraum (Miete zahlen oder Reparaturen) oder Ihre Einzugsunterlagen. Drucken Sie ihn mindestens 2,5 cm (1 Zoll) breit und scannen Sie ihn mit Ihrem eigenen Handy, bevor Sie einen ganzen Stapel drucken.

8. Schritt für Schritt für Ihren Website-Baukasten

Baukästen ändern ihre Menüs von Zeit zu Zeit. Wenn eine Bezeichnung unten nicht genau übereinstimmt, suchen Sie nach dem Element HTML, Embed oder Code.

Wix

  1. Inserate oder Buttons: Klicken Sie im Editor auf Add Elements (+), dann Embed Code, dann Embed HTML. Wählen Sie Code, fügen Sie den Code ein und klicken Sie auf Aktualisieren. Ziehen Sie das Feld auf die gewünschte Größe.
  2. Bewohner-Schaltfläche: Gehen Sie in den Einstellungen Ihrer Website zu Custom Code (unter Erweitert), klicken Sie auf Add Custom Code, fügen Sie den Code ein und wählen Sie Alle Seiten und Body, Ende. Wix bietet benutzerdefinierten Code nur für Websites mit verbundener Domain und kostenpflichtigem Tarif an.
  3. Veröffentlichen Sie Ihre Website.

Squarespace

  1. Inserate oder Buttons: Bearbeiten Sie die Seite, klicken Sie auf eine Einfügestelle, wählen Sie Code, fügen Sie den Code ein und achten Sie darauf, dass Display Source ausgeschaltet ist.
  2. Bewohner-Schaltfläche: Öffnen Sie Einstellungen, dann Developer Tools (oder Erweitert), dann Code Injection, und fügen Sie den Code in Fußzeile ein.
  3. Skripte in Code-Blöcken und Code Injection erfordern einen Squarespace-Tarif mit benutzerdefiniertem Code. Wenn der Widget-Code nicht ausgeführt wird, verwenden Sie stattdessen die iframe-Option.

WordPress

  1. Inserate oder Buttons: Bearbeiten Sie die Seite, klicken Sie auf +, fügen Sie einen Block Custom HTML hinzu, fügen Sie den Code ein und aktualisieren Sie die Seite.
  2. Bewohner-Schaltfläche: Nutzen Sie die Fußzeilen-Code-Einstellung Ihres Themes, falls vorhanden, oder ein Plugin für Header- und Footer-Code (zum Beispiel WPCode), und fügen Sie den Code in die Fußzeile ein.
  3. Auf WordPress.com (dem gehosteten Dienst) funktionieren Skripte nur in Tarifen, die Plugins und eigenen Code erlauben. In anderen Tarifen verwenden Sie die iframe-Option und die Buttons.

GoDaddy Websites + Marketing

  1. Bearbeiten Sie Ihre Website, klicken Sie auf Add Section, suchen Sie nach HTML und fügen Sie es hinzu.
  2. Fügen Sie Ihren Code in das Feld für benutzerdefinierten Code des Abschnitts ein und klicken Sie auf Fertig. Die iframe-Option ist hier am zuverlässigsten.
  3. Für den Bewohner-Button suchen Sie in den Einstellungen Ihrer Website nach Website-weitem Code. Wenn Ihr Tarif das nicht bietet, fügen Sie stattdessen die Buttons in Ihre Seiten ein.

Weebly (Square Online classic)

  1. Inserate oder Buttons: Ziehen Sie ein Element Embed Code auf die Seite, klicken Sie darauf, wählen Sie Edit Custom HTML und fügen Sie den Code ein.
  2. Bewohner-Schaltfläche: Einstellungen, dann SEO, dann in Footer Code einfügen.

Webflow

  1. Inserate oder Buttons: Ziehen Sie ein Element Code Embed auf die Seite und fügen Sie den Code ein.
  2. Bewohner-Schaltfläche: Website-Einstellungen, dann Benutzerdefinierter Code, und in Footer-Code einfügen. Veröffentlichen.
  3. Webflow erfordert für benutzerdefinierten Code einen kostenpflichtigen Website-Tarif.

Eine individuelle oder selbst gebaute Website

Fügen Sie den Widget-Code dort ein, wo die Inserate erscheinen sollen, und die Bewohner-Schaltfläche direkt vor dem schließenden </body>-Tag. Oder verwenden Sie die JSON-Feeds, um Ihr eigenes Design zu erstellen.

9. Optionsübersicht

MerkmalFunktioniert mitWas es leistet
data-limit="3"Inserate-WidgetNur die ersten Wohnungen anzeigen (früheste Verfügbarkeit zuerst).
data-accent="#0f766e"Inserate-Widget, Bewohner-ButtonIhre eigene Farbe als sechsstelliger Hex-Code. Standard ist RentMerchant-Indigo.
data-position="left"Bewohner-SchaltflächeDie Schaltfläche in der unteren linken Ecke statt rechts platzieren.
data-label="Tenants"Bewohner-SchaltflächeÄndern Sie den Text des Buttons (bis zu 24 Zeichen).
?accent=0f766eIframe-AdresseIhre Farbe für die iframe-Version, angehängt an das Ende ihrer Adresse.

Beispiel: ein Widget, das drei Wohnungen in Petrol anzeigt:

<div data-rentmerchant-listings="your-name" data-limit="3" data-accent="#0f766e"></div>
<script src="https://app.rentmerchant.com/embed/v1/listings.js" async></script>

10. Für Webentwickler: JSON-Feeds

Zwei öffentliche, schreibgeschützte Feeds liefern dieselben Daten wie die Widgets. Es ist kein Schlüssel nötig, Cross-Origin-Anfragen sind erlaubt, und Antworten werden fünf Minuten zwischengespeichert.

GET https://app.rentmerchant.com/r/your-name/listings.json
GET https://app.rentmerchant.com/r/your-name/links.json

Jeder Eintrag in listings enthält:

{
  "id": 476,
  "title": "Capitol Flats · Unit 102",
  "city": "Columbus, OH",
  "rent": "$1,950/mo",          "rent_amount": 1950,
  "deposit": "$1,950",
  "facts": ["2 bed", "1 bath", "880 sq ft"],
  "bedrooms": 2, "bathrooms": 1, "square_feet": 880,
  "available": "Available now", "available_on": null,
  "pets": "Cats OK",
  "description": "Bright corner two bedroom...",
  "photos": [{ "url": "...", "thumb": "...", "w": 2000, "h": 1500 }],
  "url": "https://app.rentmerchant.com/r/your-name/listings/476",
  "apply_url": "https://app.rentmerchant.com/apply/...?unit=476"
}

Zeigen Sie Text genau wie geliefert an und verlinken Sie auf url und apply_url, statt ein eigenes Bewerbungsformular zu bauen. Die vollständige Straßenadresse steht nur auf der Inseratsseite, nicht im Feed. links.json liefert Ihren Namen, Ihre Akzentfarbe und die Bewohner-Links (key, label, url).

11. Fehlerbehebung

Der Widget-Bereich ist leer.
Ihr Website-Baukasten entfernt möglicherweise Skripte; verwenden Sie die iframe-Option. Prüfen Sie außerdem, ob Ihr Konto Pro nutzt und Ihre E-Mail-Adresse bestätigt ist und ob der Code vollständig eingefügt wurde.
Dort steht, dass keine Wohnungen verfügbar sind.
Öffnen Sie Inserate in Ihrem Konto und stellen Sie sicher, dass mindestens eine Wohnung als inseriert markiert ist. Änderungen erscheinen innerhalb von fünf Minuten.
Im Editor sieht es gut aus, aber nicht auf meiner Live-Website.
Die meisten Baukästen führen Skripte nur auf der veröffentlichten Website aus, nicht in der Editor-Vorschau. Veröffentlichen Sie und prüfen Sie dann die Live-Adresse.
Der iframe ist abgeschnitten oder hat eine Bildlaufleiste.
Verwenden Sie die Version mit automatischer Größenanpassung oder erhöhen Sie den Wert height im iframe-Code.
Die Bewohner-Schaltfläche wird nicht angezeigt.
Er muss in einem Bereich für Website-weiten Code oder auf der Seite selbst stehen und erscheint nur auf der veröffentlichten Website. Wenn Ihr Konto keine Links anzuzeigen hat, bleibt er ausgeblendet.
Etwas anderes?
Öffnen Sie Support in Ihrem Konto und nennen Sie uns Ihre Website-Adresse und Ihren Website-Baukasten. Wir sehen uns das an.

12. Sicherheit und Datenschutz

Bereit, Ihre Website zu verbinden?

Melden Sie sich an und öffnen Sie Integrationen, oder sehen Sie sich zuerst das Inserate-Widget in Aktion an.