Overslaan naar inhoud
Nederlands
  • Er zijn geen suggesties want het zoekveld is leeg.

Hoe stel je het blok Knoppen in binnen een detail pagina template in Datamotive?

Leer hoe je knoppen toevoegt aan een detail pagina template en per knop het type, de link of het formulier, het thema en het formaat instelt.

Met het blok Knoppen voeg je één of meerdere klikbare knoppen toe aan de detailpagina van een voertuig. Per knop kies je het type — een linkknop, een attribuutknop of een knop die een formulier opent — en stel je het uiterlijk in via thema en formaat.

Voorwaarde: het blok Knoppen wordt toegevoegd binnen een kolom van een kolommenblok. Heb je nog geen kolommenblok aangemaakt? Raadpleeg dan eerst de handleiding [Hoe stel je een kolommenblok in binnen Datamotive?]

Voorwaarde: het blok Knoppen wordt toegevoegd binnen een detail pagina template. Heb je nog geen detail pagina template aangemaakt? Raadpleeg dan eerst de handleiding [Hoe maak je een detail pagina template aan in Datamotive?]

Een knoppen blok toevoegen

Stap 1 – Open de detail pagina template
Navigeer in het linkermenu naar Voertuigen > Detail pagina templates en open de template waaraan je knoppen wilt toevoegen.

Stap 2 – Open de kolom
Open het kolommenblok en de kolom waaraan je het knoppen blok wilt toevoegen.

Stap 3 – Voeg het blok toe
Klik binnen de kolom op + Blok toevoegen en selecteer het bloktype Knoppen.

Stap 4 – Voeg een knop toe
Klik op + Knop toevoegen. Er verschijnt een knopblok. Herhaal deze stap voor elke extra knop die je wilt toevoegen.

Het type per knop instellen

Per toegevoegde knop kies je in het dropdown Type één van de drie beschikbare knoptypen.

Button (link)

Gebruik dit type voor een knop die de bezoeker doorstuur naar een URL.

Stap 5 – Vul de titel in
Vul in het veld Titel de knoptekst in die de bezoeker ziet.

Stap 6 – Vul de link in Vul in het href-veld (Link) de URL in waarnaar de bezoeker wordt doorgestuurd. Je kunt in de link de dynamische variabelen [:dynamic-slug] en gebruiken. Plaats deze variabelen tussen vaste tekst, bijvoorbeeld born/[:dynamic-slug]//200402.

Op de gerenderde detailpagina wordt [:dynamic-slug] vervangen door de slug van het getoonde voertuig en door het voertuignummer (vehicleNumber) van dat voertuig. Vaste tekst rondom de variabelen blijft ongewijzigd. Je kunt beide variabelen tegelijk gebruiken of slechts één van de twee.

Stap 7 – Stel de instellingen in
Stel onder Instellingen de volgende opties in:

  • Thema — het visuele uiterlijk van de knop (zie Thema-opties hieronder).
  • Formaat — de grootte van de knop: Small, Medium (standaard) of Large.
  • Open in — bepaalt of de link in het huidige tabblad of een nieuw tabblad wordt geopend. De standaardwaarde is Huidige tabblad (standaard).

Button (attributen)

Gebruik dit type voor een knop met een onclick-attribuut, bijvoorbeeld voor het aanroepen van een JavaScript-functie.

Stap 5 – Vul de titel in
Vul in het veld Titel de knoptekst in die de bezoeker ziet.

Stap 6 – Vul de onclick-waarde in
Vul in het veld onclick de JavaScript-actie in die wordt uitgevoerd wanneer de bezoeker op de knop klikt.

Stap 7 – Stel de instellingen in
Stel onder Instellingen de volgende opties in:

  • Thema — het visuele uiterlijk van de knop (zie Thema-opties hieronder).
  • Formaat — de grootte van de knop: Small, Medium (standaard) of Large.

Button (formulier)

Gebruik dit type voor een knop die een formulier opent wanneer de bezoeker erop klikt.

Voorwaarde: het formulier moet aangemaakt zijn in Datamotive. Raadpleeg de handleiding Hoe maak je een formulier aan in Datamotive?

Stap 5 – Vul de titel in
Vul in het veld Titel de knoptekst in die de bezoeker ziet.

Stap 6 – Selecteer het formulier
Kies in het dropdown Formulier het formulier dat wordt geopend wanneer de bezoeker op de knop klikt. Beschikbare opties zijn de formulieren die zijn aangemaakt in Datamotive, zoals Proefrit, Inruil, Financiering, Contact, Lease en Taxatie.

Stap 7 – Stel het thema in
Kies bij Thema het visuele uiterlijk van de knop (zie Thema-opties hieronder).


Thema-opties

De volgende thema-opties zijn beschikbaar voor alle knoptypen:

  • Primair
  • Primair omlijnd
  • Secundair
  • Secundair omlijnd
  • Tertiair
  • Tertiair omlijnd
  • Wit
  • Wit omlijnd
  • Donker
  • Donker omlijnd

Opslaan en publiceren

Stap 8 – Sla op en publiceer
Klik linksboven op Opslaan. Publiceer de pagina om de wijzigingen zichtbaar te maken op de live website.


Overzicht instellingen

Veld/optie Beschrijving Verplicht
Type – Button (link) Knop die de bezoeker doorstuurt naar een URL Ja
Type – Button (attributen) Knop met een onclick-attribuut voor JavaScript-acties Ja
Type – Button (formulier) Knop die een formulier opent Ja
Titel Knoptekst die de bezoeker ziet Nee
Link URL waarnaar de bezoeker wordt doorgestuurd (alleen Button (link)); de URL kan de dynamische variabelen [:dynamic-slug] en bevatten Nee
onclick JavaScript-actie bij klikken (alleen Button (attributen)) Nee
Formulier Het te openen formulier (alleen Button (formulier)) Ja
Thema Visueel uiterlijk van de knop, keuze uit tien opties Nee
Formaat Grootte van de knop: Small, Medium (standaard) of Large Nee
Open in Openen in huidig of nieuw tabblad (alleen Button (link)) Nee