En udtrækbar kurv er nem at bygge og nem at få lidt forkert. Den typiske fejl er ikke, at den går i stykker, men at den glider: panelet viser tre varer, mens badget i headeren viser to, fordi to forskellige stykker kode hver for sig har afgjort, hvad kurven indeholder.
Én sandhedskilde, vist én gang
WooCommerce har allerede en mekanisme til det. Dens fragmentsystem lader et plugin erklære, at en given selektor på siden skal erstattes med frisk genereret HTML, hver gang kurven ændres. Vi registrerede skuffens indhold som et sådant fragment, så panelets indhold produceres af præcis én funktion.
At lægge noget i kurven fra et produktgrid, ændre et antal i skuffen, fjerne den sidste vare: alle tre ender i den samme visning. Der er ingen anden skabelon at holde i takt, og det er den egentlige grund til, at skuffer glider ud af sync.
Ændring af antal uden at forlade siden
En ændring af antal sendes til et lille endpoint, der kontrollerer en nonce, bekræfter, at kurvlinjen findes, anvender ændringen og genberegner totalerne. Et antal på nul fjerner linjen i stedet for at give en fejl, fordi det er, hvad en kunde mener, når de klikker på minus én gang til.
Svaret indeholder de genererede fragmenter og det nye antal varer samlet, så skuffen og badget i headeren opdateres fra ét svar i stedet for at kappes med hinanden.
De tjek, der ikke er valgfri
Endpointet kan nås af besøgende, der ikke er logget ind, da de fleste kunder er gæster. Det gør nonce-tjekket og valideringen af kurvnøglen til det eneste, der står mellem en fremmed og en andens sessionsdata. Begge kører, før noget ændres, og endpointet svarer på et fejlet tjek med en kort fejl frem for en hjælpsom forklaring.
Det vigtigste
- Generer kurvens markup ét sted, og lad fragmentsystemet levere den overalt.
- En skuffe, der er uenig med badget i headeren, er to visninger, ikke én fejl.
- Behandl antal nul som fjernelse; det er, hvad kunden mente.
- Endpoints, som gæster har adgang til, kræver stadig nonce- og ejerskabstjek, før de ændrer noget.
Læs også: automatisk valg af fri fragt ved en kurvgrænse, og ændring af en produktvariant, efter ordren er afgivet.
Støder du på en lignende begrænsning i din egen WooCommerce- eller WordPress-butik? Lad os tale — ArtinTech Solution bygger netop den slags skræddersyede værktøjer til webshops.