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
- Ga in de WordPress-beheeromgeving naar Pagina's → Nieuwe pagina.
- Geef de pagina een titel zoals "Voertuigen vergelijken".
- Voeg in de pagina-inhoud de shortcode
[as24ci_compare]toe. - Publiceer de pagina.
- 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 ophome_url('/compare-cars/').
De vergelijkingsfunctie gebruiken als bezoeker
- 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.
- 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.
- Herhaal dit voor andere voertuigen die u wilt vergelijken. De plugin handhaaft een configureerbaar maximum aantal voertuigen (standaard: 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.
- 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
| Instelling | Locatie | Beschrijving |
|---|---|---|
| Vergelijken inschakelen | Plugin-instellingen → Instellingen (of Setup Wizard) | Schakelt de volledige vergelijkingsfunctie in of uit |
| Maximaal aantal voertuigen | Plugin-instellingen → Vergelijken | Maximaal aantal voertuigen dat een bezoeker aan een vergelijking kan toevoegen (standaard 4, minimaal 2) |
| Vergelijkingspagina | Plugin-instellingen → Pagina's | Pagina-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-ID | Beschrijving |
|---|---|
conditionType | Staat (nieuw of gebruikt) |
bodyType | Carrosserievorm |
fuelType | Brandstoftype |
transmissionType | Transmissie |
driveType | Aandrijving |
bodyColorText | Exterieurkleur |
interiorColorText | Interieurkleur |
doors | Aantal deuren |
seats | Aantal zitplaatsen |
mileage | Kilometerstand (geformatteerd met km) |
cubicCapacity | Cilinderinhoud (cm³) |
range | Elektrische actieradius (km) |
firstRegistrationYear | Jaar eerste toelating |
firstRegistrationDate | Datum eerste toelating |
kiloWatts | Vermogen in kW |
horsePower | Vermogen in pk |
co2Emission | CO₂-emissie (g/km) |
price | Verkoopprijs |
listPrice | Catalogusprijs |
emissionStandard | Emissieklasse |
energyLabel | Energielabel |
batteryCapacity | Accucapaciteit (kWh) |
hadAccident | Schadehistorie (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_btnis 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
localStorageonder 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
idsen 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_vehiclesvan de plugin indien beschikbaar, met een terugval naar de ruwe API-payload (raw_dataJSON-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_btnis 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
localStorageniet 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 ophome_url('/compare-cars/').