Mit „Meine Apps“ passen Sie das Erscheinungsbild Ihrer Covomo Vergleichsrechner an Ihre individuellen Anforderungen an (Branding/Customization). Eine eigene App ermöglicht es Ihnen,
das Branding Ihres Unternehmens nahtlos in den Vergleichsrechner zu integrieren,
die Einbindung über definierte Domains sicher zu gestalten und
verschiedene Vergleichstools zentral zu verwalten.
Sie erstellen eine Anwendung („App“), die Sie später per iFrame in Ihre Webseite einbinden.
Hinweis: Als Makler können Sie bis zu einer App dauerhaft kostenfrei nutzen. Wenn Sie mehrere Apps konfigurieren möchten oder weitere Einstellungsmöglichkeiten benötigen, schauen Sie bitte in den entsprechenden Hilfeartikel.
1. Zugang zur Funktion
Melden Sie sich im Covomo Vertriebsportal an.
Navigieren Sie im linken Menü zu Rechner & Tools → Meine Apps.
Im Registerreiter Aktiv sehen Sie Ihre aktuell verwendeten Apps, unter Archiviert alle inaktiven.
2. Eine Neue App anlegen
Klicken Sie auf + App hinzufügen.
Füllen Sie im Formular die folgenden Angaben aus.
Bestätigen Sie mit Fortfahren, um Ihre App zu speichern.
3. Angaben zu Ihrer App
Feld | Beschreibung |
---|---|
Name der App | Erforderlich: Eindeutiger, frei wählbarer Name für Ihre App – dient der internen Verwaltung. Wird später in der Übersicht angezeigt. |
Verfügbare Vergleichsrechner | Optional: Liste der Vergleichsrechner, die Sie mit dieser App anbieten möchten. Lassen Sie dieses Feld leer, wenn Sie Ihre Konfiguration für alle Vergleichsrechner nutzen möchten. |
Zulässige Domains | Erforderlich: Tragen Sie hier eine oder mehrere durch Komma getrennte Domains, auf denen Ihre App per iFrame eingebunden werden darf. Geben Sie jeweils die vollständige URL (https://www.ihre-seite.de) ein. Sogenannte Platzhalter oder Wildcards sind nicht erlaubt. |
Vertrauenswürdige Domains | Optional: Domains, von denen aus Inhalte (z. B. Bilder oder PDF-Dokumente) in Ihre App geladen werden dürfen. Platzhalter – sogenannte Wildcards (*.beispiel.com) sind hier erlaubt. Trennen Sie mehrere Domains mit Komma. |
4. Angaben zu Design & Branding (Folgeseite)
Nachdem Sie die Basis-Angaben bestätigt haben, legen Sie hier das visuelle Erscheinungsbild fest:
Einstellung | Beschreibung |
Signalfarbe | Farbe für Buttons und wichtige Aktions-Elemente (HEX -Code). |
Primäre/Sekundäre Farbe | Farbtöne für Ihr Haupt- und Nebendesign (z. B. Header, Akzentleisten). |
Hintergrundfarbe | Hintergrundfarbe des Rechners (HEX -Code). |
Textfarbe | Standardfarbe für Fließtext in der App. |
Linkfarbe | Farbe für Hyperlinks und klickbare Textelemente. |
Hintergrund Farbe Seitenkopf/Fuß | Spezifische Hintergrundfarben für Header- und Footer-Bereich der App. |
Hinweis: Sie sehen direkt eine Vorschau Ihrer Farbwahl. Änderungen wirken sich umgehend auf die Demo-Darstellung aus.
5. Kontaktinformationen (Folgeseite)
In diesem Abschnitt können Sie Angaben zu einem Ansprechpartner oder Ihrem Unternehmen machen. definieren Sie die Beratungsdaten, die im Rechner angezeigt werden:
Einstellung | Beschreibung |
Ansprechpartner | Name der Person für die Beratung |
Profilbild (URL) | Link zu einem Bild des Ansprechpartners (erlaubt sind PNG , JPG , GIF ) |
Postanschrift | Adresse des Ansprechpartners |
Telefonnummer | Telefonnummer und Durchwahl des Ansprechpartners |
E-Mail-Adresse | E-Mail des Ansprechpartners für Anfragen direkt aus der App |
Webseite | Webseite des Ansprechpartners |
Tipp: Falls Sie Unternehmensdaten bereits zentral gepflegt haben, können Sie die Schalter „Aus Unternehmen übernehmen“ nutzen, um Felder automatisch zu befüllen.
6. Experteneinstellungen (Folgeseite)
In den Experteneinstellungen können Sie festlegen, ob der individuell gestaltete Kopf- und Fußbereich Ihrer App angezeigt wird:
Einstellung | Beschreibung |
---|---|
Seitenkopf anzeigen | Aktivieren Sie diese Option, um den von Ihnen definierten Header anzuzeigen. Deaktivieren Sie sie, falls Sie den Standard-Kopfbereich verwenden möchten. |
Seitenfuß anzeigen | Aktivieren Sie diese Option, um den von Ihnen definierten Footer anzuzeigen. Deaktivieren Sie sie, falls Sie den Standard-Fußbereich verwenden möchten. |
7. Nach der Erstellung Ihrer App
Nach dem erfolgreichen Erstellen und Speichern Ihrer App taucht diese auf der Seite „Meine Apps“ im Registerreiter „Aktiv“ auf.
Zu Ihrer App stehen Ihnen folgende Aktionen zur Verfügung:
Bearbeiten: Öffnet die Detailansicht Ihrer App, um die Konfiguration (Branding, Domains, Kontaktinformationen) anzupassen.
Löschen: Verschiebt die App in den Reiter Archiviert, sodass sie nicht mehr aktiv geladen wird.
Link kopieren: Kopiert den Direktlink zu Ihrer App in die Zwischenablage. So können Sie Kollegen oder Kunden direkt auf Ihre App verweisen oder darauf verlinken.
Einbetten: Generiert den JavaScript-/iFrame-Code für die nahtlose Integration Ihrer App in Ihre Webseite.
9. Link kopieren – Schritt-für-Schritt
Um einen spezifischen Direktlink für Ihre App und einen ausgewählten Vergleichsrechner zu erhalten, gehen Sie wie folgt vor:
Klicken Sie in der Übersicht auf Link kopieren neben der gewünschten App.
Im Dialog „Wählen Sie einen Vergleichsrechner“ klicken Sie auf die Auswahlliste und wählen den gewünschten Rechner aus.
Bestätigen Sie mit Weiter – der fertige Link wird in Ihre Zwischenablage kopiert.
Beispiel: Sie können den kopierten Link direkt in E-Mails, Präsentationen oder Ihre Makler-Website einfügen, sodass Interessenten sofort zur angepassten Vergleichs-Ansicht gelangen.
10. iFrame und QR-Code erzeugen – Schritt-für-Schritt
Nach Auswahl Ihres Vergleichsrechners im Dialog stehen Ihnen zwei Integrationsformen zur Verfügung:
iFrame-Integration
Klicken Sie in der Übersicht auf Einbetten.
Wählen Sie im Dropdown den gewünschten Vergleichsrechner aus.
Kopieren Sie den angezeigten
<iframe>
-Code.Fügen Sie den Code in Ihre HTML-Seite an der Stelle ein, an der der Rechner erscheinen soll.
<div id="covomo-iframe-widget" data-embed-type="iframe" data-branding="IHR_BRANDING_CODE"> </div> <script src="https://cdn.covomo.de/integrations/widget/covomoiFrameWidget.js"></script>
QR-Code
Im gleichen Dialog finden Sie einen automatisch generierten QR-Code.
Speichern Sie das Bild per Rechtsklick oder Download-Button.
Drucken Sie den QR-Code auf Prospekten, Visitenkarten oder Merkblättern.
Beim Einscannen gelangen Kunden direkt zur angepassten Vergleichsansicht.
Denkanstöße für den Einsatz beim Kunden:
Platzieren Sie den iFrame auf Ihrer Makler-Website unter “Online-Vergleich”.
Versenden Sie in Newslettern einen Link mit direkt vorausgewähltem Rechner.
Hängen Sie den QR-Code an Angebotsmappen oder Werbematerialien an, um unterwegs Zugriff zu ermöglichen.
Nutzen Sie verschiedene QR-Codes für unterschiedliche Produkte (z. B. Versicherungskennzeichen oder Tierkranken).
10. iFrame und QR-Code erzeugen – Schritt-für-Schritt
Unsere Standard-Lösung umfasst eine App mit den oben vorgestellten Einstellungsmöglichkeiten. Möchten Sie mehr als eine App nutzen oder zusätzliche Anpassungen vornehmen lassen, sind wir gerne für Sie da.
Schreiben Sie uns einfach eine E-Mail an vertrieb@covomo.de, und wir besprechen gemeinsam Ihre Wünsche.
Viel Erfolg beim Branding Ihrer Vergleichsrechner!