Documentatie · Frontend-handleiding

Vergelijken

Dit document behandelt de voertuigvergelijkingsfunctie van de ADP Car Market Hub WordPress Plugin: hoe bezoekers voertuigen selecteren om te vergelijken, hoe de vergelijkingspagina werkt en welke beperkingen van toepassing zijn.

Wanneer u dit document moet gebruiken

Lees dit document als u de vergelijkingsfunctie voor de eerste keer instelt, een bezoeker helpt begrijpen hoe deze te gebruiken, of onverwacht gedrag in de vergelijkingsweergave wilt oplossen.

Overzicht

Met de vergelijkingsfunctie kunnen bezoekers maximaal een configureerbaar aantal voertuigen selecteren uit het archief of van individuele voertuigdetailpagina's, en deze vervolgens naast elkaar bekijken op een speciale vergelijkingspagina. De selectie wordt opgeslagen in de localStorage van de browser en vereist geen account of login.

De vergelijkingspagina is een tabel over de volledige pagina met één kolom per voertuig. Elke rij toont de thumbnail, de titel en de geconfigureerde specificatievelden van het voertuig. Voertuigen worden weergegeven in de volgorde waarin ze zijn geselecteerd.

Vereisten of randvoorwaarden

  • De vergelijkingsfunctie moet zijn ingeschakeld in de plugin-instellingen (deze is standaard ingeschakeld).
  • Er moet een vergelijkingspagina zijn geconfigureerd en toegankelijk zijn. De plugin kan tijdens de activering een standaard vergelijkingspagina maken; u kunt er ook handmatig een maken en deze toewijzen in de plugin-instellingen.
  • De vergelijkingspagina moet de shortcode [as24ci_compare] bevatten, of de plugin moet zijn geconfigureerd om de pagina te gebruiken via de optie as24cipagecompare_id zodat deze de vergelijkings-URL kan herleiden.

Stapsgewijze instructies

De vergelijkingspagina instellen

  1. Ga in de WordPress-beheeromgeving naar Pagina's → Nieuwe pagina.
  2. Geef de pagina een titel zoals "Voertuigen vergelijken".
  3. Voeg in de pagina-inhoud de shortcode [as24ci_compare] toe.
  4. Publiceer de pagina.
  5. Noteer de pagina-ID in de plugin-instellingen. De plugin gebruikt de opgeslagen vergelijkingspagina-ID (as24ci_page_compare_id) om vergelijkingslinks op de hele site te bouwen. Als deze optie niet is ingesteld, valt de plugin terug op home_url('/compare-cars/').

De vergelijkingsfunctie gebruiken als bezoeker

  1. Zoek een voertuigkaart op het voertuigarchief. Wanneer de vergelijkingsfunctie is ingeschakeld en de vergelijkingsknop actief is in de Layout Manager, verschijnt er een vergelijkingspictogramknop op de overlay van de kaart.
  2. Klik op de vergelijkingsknop om het voertuig toe te voegen aan de vergelijkingsselectie. De knop verandert van status om aan te geven dat het voertuig is geselecteerd.
  3. Herhaal dit voor andere voertuigen die u wilt vergelijken. De plugin handhaaft een configureerbaar maximum aantal voertuigen (standaard: 4).
  4. Wanneer u de gewenste voertuigen heeft geselecteerd, klikt u op de vergelijkingslink of -knop die verschijnt (het label luidt "Vergelijken"). Dit navigeert naar de vergelijkingspagina.
  5. De vergelijkingspagina laadt met de geselecteerde voertuigen naast elkaar weergegeven in een tabel.

Dezelfde vergelijkingsknop verschijnt in de sticky zwevende balk op detailpagina's van individuele voertuigen, zodat bezoekers een voertuig aan de vergelijkingsselectie kunnen toevoegen terwijl ze de volledige details bekijken.

De vergelijkingspagina rechtstreeks openen

De vergelijkingspagina leest voertuig-ID's uit de GET-parameter ids, wat een door komma's gescheiden lijst van voertuig-post-ID's is:

https://yoursite.com/compare-cars/?ids=123,456,789

De JavaScript-vergelijkingstoggle bouwt deze URL automatisch wanneer de bezoeker op de link "Vergelijken" klikt.

Configuratierreferentie

Vergelijkingsinstellingen

InstellingLocatieBeschrijving
Vergelijken inschakelenPlugin-instellingen → Instellingen (of Setup Wizard)Schakelt de volledige vergelijkingsfunctie in of uit
Maximaal aantal voertuigenPlugin-instellingen → VergelijkenMaximaal aantal voertuigen dat een bezoeker aan een vergelijking kan toevoegen (standaard 4, minimaal 2)
VergelijkingspaginaPlugin-instellingen → Pagina'sPagina-ID van de vergelijkingspagina. Wordt gebruikt om vergelijkings-URL's op de hele site te bouwen.

Velden van de vergelijkingstabel

De velden die in de vergelijkingstabel worden weergegeven, worden geconfigureerd in de zone Layout Manager → Vergelijken. Elk ingeschakeld veld verschijnt als een rij in de tabel voor elk geselecteerd voertuig. De beschikbare velden en hun standaardlabels omvatten:

Veld-IDBeschrijving
conditionTypeStaat (nieuw of gebruikt)
bodyTypeCarrosserievorm
fuelTypeBrandstoftype
transmissionTypeTransmissie
driveTypeAandrijving
bodyColorTextExterieurkleur
interiorColorTextInterieurkleur
doorsAantal deuren
seatsAantal zitplaatsen
mileageKilometerstand (geformatteerd met km)
cubicCapacityCilinderinhoud (cm³)
rangeElektrische actieradius (km)
firstRegistrationYearJaar eerste toelating
firstRegistrationDateDatum eerste toelating
kiloWattsVermogen in kW
horsePowerVermogen in pk
co2EmissionCO₂-emissie (g/km)
priceVerkoopprijs
listPriceCatalogusprijs
emissionStandardEmissieklasse
energyLabelEnergielabel
batteryCapacityAccucapaciteit (kWh)
hadAccidentSchadehistorie (Ja/Nee)

Afhankelijk van de geïmporteerde voertuiggegevens kunnen er aanvullende velden beschikbaar zijn. Controleer de actuele lijst in de Layout Manager van uw plugin.

Eenheden worden automatisch toegepast op numerieke waarden:

  • Prijs: geformatteerd met valuta
  • Kilometerstand, actieradius, garantie-kilometerstand, trekgewicht, rijklaar gewicht, totaal gewicht: km of kg indien van toepassing
  • CO₂: g/km
  • Cilinderinhoud: cm³
  • Paardenkracht: pk
  • Verbruik: l/100 km
  • Accucapaciteit: kWh
  • Stroomverbruik: kWh/100 km
  • Sellaadvermogen: kW
  • Garantieduur: maanden
  • Booleaanse velden (hadAccident, inspected): weergegeven als Ja of Nee

Velden zonder waarde voor een voertuig tonen een liggend streepje (—).

Vergelijkingsknop op archiefkaart

De vergelijkingsknop verschijnt op voertuigarchiefkaarten wanneer:

  • De vergelijkingsfunctie is ingeschakeld in de plugin-instellingen (FEATURE_COMPARE).
  • Het element compare_btn is ingeschakeld in de zone Layout Manager → Archiefkaarten.

De knop toont een vergelijkingspictogram en schakelt de geselecteerde status om wanneer erop wordt geklikt.

Operationele opmerkingen

  • Voertuigselecties worden opgeslagen in localStorage onder een sleutel die wordt beheerd door het vergelijkings-JavaScript. Selecties blijven behouden tijdens het navigeren door pagina's binnen dezelfde browsersessie en overleven het herladen van pagina's.
  • Het wissen van browsergegevens (cookies, lokale opslag) zal de vergelijkingsselectie resetten.
  • De vergelijkingspagina leest de GET-parameter ids en laadt maximaal 4 voertuigen (hardgecodeerd maximum in de template). Alleen gepubliceerde voertuigen van het juiste post-type worden geladen; niet-gepubliceerde of verwijderde voertuigen worden stilletjes uitgesloten.
  • Het configureerbare maximum (COMPARE_MAX_VEHICLES) regelt de JavaScript-handhaving van de limiet tijdens de selectie. De server-side template past zijn eigen harde limiet van 4 toe. Als het configureerbare maximum hoger is dan 4, zal de server nog steeds maximaal 4 kolommen weergeven.
  • Voertuiggegevens in de vergelijkingstabel worden gelezen uit de aangepaste tabel {prefix}as24_vehicles van de plugin indien beschikbaar, met een terugval naar de ruwe API-payload (raw_data JSON-kolom) en vervolgens naar WordPress post-meta voor legacy-voertuigen.
  • De vergelijkingspagina kan zowel als een zelfstandige WordPress-pagina (via de shortcode [as24ci_compare]) als een template-gestuurde pagina worden gebruikt. Beide leveren dezelfde output op.
  • Het vergelijkings-JavaScript-bestand wordt alleen in de wachtrij geplaatst op voertuigarchiefpagina's, individuele voertuigpagina's en pagina's die de shortcode [as24ci_archive] of [as24ci_compare] bevatten.

Probleemoplossing

De vergelijkingsknop verschijnt niet op voertuigkaarten.

  • Controleer of de vergelijkingsfunctie is ingeschakeld in de plugin-instellingen.
  • Controleer de zone Layout Manager → Archiefkaarten en bevestig dat compare_btn is ingeschakeld.

Klikken op de vergelijkingsknop toont "U kunt maximaal X voertuigen vergelijken."

  • De bezoeker heeft het geconfigureerde maximum bereikt. Deze moet een voertuig uit de selectie verwijderen voordat er een ander kan worden toegevoegd.

De vergelijkingspagina toont "Geen voertuigen geselecteerd voor vergelijking."

  • De bezoeker is naar de vergelijkingspagina genavigeerd zonder voertuigen in de localStorage-selectie.
  • Dit kan ook gebeuren als de browser localStorage niet ondersteunt of als deze is gewist.

De vergelijkingspagina toont minder voertuigen dan verwacht.

  • Alleen gepubliceerde voertuigen worden geladen. Als een voertuig is verwijderd of de publicatie ervan is ongedaan gemaakt nadat het aan de vergelijkingsselectie is toegevoegd, wordt het uitgesloten van de output.
  • De template dwingt een maximum van 4 voertuigen af, ongeacht de configureerbare instelling.

Vergelijkingslinks verwijzen naar de verkeerde pagina.

  • Controleer of de vergelijkingspagina-ID correct is ingesteld in de plugin-instellingen (as24ci_page_compare_id). Als deze optie ontbreekt of naar een verwijderde pagina verwijst, valt de vergelijkings-URL terug op home_url('/compare-cars/').

Gerelateerde documenten