Aggregate Offers Widget (Demo & Doku)

Das Widget ermöglicht es für frei einzugeben Filter Values aggregierte „ab Preise“ anzuzeigen. Eingeben kann man die folgenden Parameter:

  • makes_models?: string[];
  • customer_groups?: string[];
  • vehicle_types?: string[];
  • delivery_time_lte?: number;
  • delivery_time_gte?: number;
  • vehicle_conditions?: string[];
  • transmissions?: string[];
  • fuel?: string[];

Demo des Widgets

Hinweise zum Widget. Es wird nativ als JS Widget eingebunden. Damit wird die Farbe der Links und Schriftart von der Seite geerbt wo es eingebunden ist. 

Das Widget

Das Widget wird mit folgendem Code eingebunden:

<script src="https://widgets.mivodo.com/widgets/aggregate-offers/widget.js"></script>
<div class="mvd_aggregate_widget" data-title="Audi & Mercedes Diesel" data-filter-string="makes_models=mercedes-benz,audi&fuel=diesel" data-search-url="https://widgets-doc.mivodo.com/such-widget/" data-partner-id="1" data-brand-color="27a209"></div>

Dabei wird das Widget in alle Divs mit der class mvd_aggregate_widget gesetzt. Es werden jeweils die data-attributes des divs ausgelesen, um das Widget zu rendern. Wenn dieses div nicht vorhanden ist, wird das Widget nicht ausgegeben.

Das Widget passt sich an das HTML der aktuellen Seite an, womit es Schriftart, Farben usw. übernimmt. Sollte es hier zu Problemen führen, können wir weitere Styles zum überschreiben des Aussehens definieren.

Sollte es zu Darstellungsproblemen kommen, weil bestimmte Styles von uns vor definiert werden sollen im widget, kontaktiere uns.

Konfiguration der Data-Attributes

  • data-title: Der Titel des Widgets, der oben im Widget angezeigt wird.
  • data-filter-string: Eine Zeichenkette, die die Filterparameter enthält. Die verfügbaren Filterparameter sind:
    • makes_models: Marken und Modelle des Fahrzeugs (z.B. audi,mercedes-benz).
    • customer_groups: Kundengruppen.
    • vehicle_types: Typen von Fahrzeugen.
    • delivery_time_lte: Maximale Lieferzeit in Tagen.
    • delivery_time_gte: Minimale Lieferzeit in Tagen.
    • vehicle_conditions: Zustand des Fahrzeugs.
    • transmissions: Getriebearten.
    • fuel: Kraftstoffarten (z.B. diesel).
  • data-search-url: URL auf die das Widget verweist für die Suchergebnisse
  • data-partner-id: Identifikationsnummer des Partners.
  • data-brand-color: Hexcode der Akzentfarbe eurer Marke !ohne! # zB 27a209

Die Filter Parameter lassen sich aus der URL auslesen, wenn man das pure Widget unter https://widgets.mivodo.com/widget-suche/ benutzt.