Slik fungerer WooCommerce

Modul 1: Før du begynner · Lesetid: 10 minutter

Læringsmål: Etter denne leksjonen kan du forklare hvordan WooCommerce fungerer i WordPress, og hvor produkter, bestillinger, handlekurven og de planlagte oppgavene ligger.

Nøkkelbegreper: produkttype, innleggstypen product, bestillinger (HPOS), butikksider, økt og handlekurv, Store API, REST API, Action Scheduler, transaksjonelle e-poster, utvidelser

En utvidelse som gjør nettstedet ditt til en butikk

I WordPress-kurset (leksjon 1.2 og 1.3) så du hvordan en side blir til: webserveren gir forespørselen til PHP, PHP laster WordPress, utvidelsene og temaet, henter data fra databasen og lager HTML av det. WooCommerce kobler seg inn i denne prosessen som en stor utvidelse. Den tar med seg fire ting:

1. Data: produkter, bestillinger, kunder, avgiftssatser, fraktsoner.
2. Sider: butikken, handlekurven, kassen og Min konto.
3. Prosesser: én handlekurv per besøkende, betalinger via en betalingsleverandør, e-poster, oppdatering av lager, planlagte oppgaver.
4. Innganger for programmer: Store API og REST API.

Vet du hvor disse delene ligger, finner du en feil mye raskere senere. Derfor ser vi nå på dem én etter én.

Produkter: en egen innleggstype

WordPress har innleggstyper: sider og innlegg er to av dem (WordPress-kurset, leksjon 4.2). WooCommerce legger til innleggstypen product. Et produkt ligger altså, akkurat som en side, i tabellen med innlegg, med de ekstra opplysningene (pris, SKU, lager, vekt) som metadata. Kategorier og stikkord for produkter er egne taksonomier, adskilt fra dem i bloggen din.

Hvert produkt har en produkttype. I kjernen er det enkelt, gruppert, eksternt (en lenke til en annen butikk) og variabelt. I tillegg kan du krysse av for virtuelt (ingenting å sende) og nedlastbart (en fil etter betaling). Et variabelt produkt har varianter, for eksempel en tekanne i tre farger; hver variant er en egen enhet med egen pris og eget lager. Modul 3 går nærmere inn på dette.

Bestillinger: egne tabeller (HPOS)

Tidligere lagret WooCommerce også bestillinger som innlegg. I travle butikker ble det tregt, fordi bestillinger og blogginnlegg delte den samme store tabellen. Derfor kom HPOS (High-Performance Order Storage): bestillinger i egne tabeller, som wc_orders, wc_order_addresses og wc_orders_meta (med tabellprefikset til nettstedet ditt foran). Siden WooCommerce 8.2 (oktober 2023) er HPOS slått på i hver ny installasjon. En eldre butikk blir værende på den gamle lagringen til du selv bytter under WooCommerce > Innstillinger > Avansert > Funksjoner.

Hvorfor trenger du å vite dette? Av tre grunner:

• Sikkerhetskopier: bestillingene ligger ikke i filene dine, men i databasen. En sikkerhetskopi uten database er verdiløs for en nettbutikk (leksjon 6.2).
• Utvidelser: en eldre utvidelse som fortsatt leser bestillinger som innlegg, fungerer ikke ordentlig med HPOS. WooCommerce varsler ved utvidelsen hvis den ikke er kompatibel.
• Gjenoppretting: gjenoppretter du en sikkerhetskopi fra i går, forsvinner dagens bestillinger. Det er mye verre for en nettbutikk enn for en blogg (leksjon 6.2).

Handlekurven: forskjellig for hver besøkende

En vanlig side er lik for alle besøkende. Det er ikke handlekurven. Så snart en besøkende legger noe i handlekurven, starter WooCommerce en økt: en informasjonskapsel (wp_woocommerce_session_ etterfulgt av en kode) i nettleseren og en rad i en økttabell i databasen. Slik vet butikken ved neste forespørsel hvilken handlekurv som hører til denne besøkende.

To følger du vil møte igjen senere:

• Handlekurv, kasse og Min konto må aldri havne i en sidehurtigbuffer, ellers ser én besøkende handlekurven til en annen. WooCommerce sender selv med hodelinjer på disse sidene som forbyr hurtigbufring (leksjon 6.4).
• En nettbutikk som starter en økt for hver besøkende, også uten handlekurv, gjør sidehurtigbufferen for hele nettstedet ubrukelig. Det er en vanlig feil i temaer og utvidelser.

Butikksidene og blokkene

Ved installasjonen lager WooCommerce fire sider: Butikk, Handlekurv, Kasse og Min konto. Siden versjon 8.3 (november 2023) bruker nye installasjoner blokker for handlekurv og kasse; eldre butikker bruker ofte fortsatt kortkoder. Begge fungerer. Forskjellen er viktig for utvidelser: en utvidelse som legger til noe i kassen, må støtte varianten du bruker. Leksjon 2.2 viser hvordan du sjekker det.

To innganger for programmer: Store API og REST API

WooCommerce har to programmerbare innganger, og forskjellen er viktig for sikkerheten:

At Store API er offentlig, er ingen lekkasje: det er nøyaktig det hver besøkende ser i butikken, bare i en form som programmer kan lese. Prøv med din egen nettbutikk: åpne https://shop.example.com/wp-json/wc/store/v1/products i nettleseren (med din egen adresse), så ser du produktene dine som JSON. REST API skal derimot være stengt uten nøkkel. Leksjon 2.4 kontrollerer begge.

Bak kulissene: Action Scheduler og e-poster

Mye av arbeidet i en nettbutikk skjer ikke mens kunden venter, men senere. WooCommerce bruker Action Scheduler til dette: en kø av planlagte oppgaver, som å kansellere en ubetalt bestilling etter den innstilte tiden, sende webhooks eller oppdatere rapporter. Du ser køen under WooCommerce > Status > Planlagte handlinger. Disse oppgavene kjører på WP-Cron, som bare går når det er besøkende. I en rolig nettbutikk kan arbeid da bli liggende; leksjon 7.3 viser hvordan en ekte cron løser det.

I tillegg sender WooCommerce transaksjonelle e-poster: en e-post til deg ved en ny bestilling, og e-poster til kunden ved mottak, forsendelse, tilbakebetaling eller en ny konto. Kommer de ikke frem, tror kunden at noe er galt. Leksjon 6.1 ordner leveringsevnen.

I praksis: slik ser det ut i WooCommerce

I WordPress-administrasjonen til Theehuis Example dukker det etter installasjonen opp tre nye menyer: WooCommerce (bestillinger, kunder, innstillinger, status), Produkter og Analyse (i nyere versjoner noen ganger under WooCommerce). Under WooCommerce > Status finner du servermiljøet, databasetabellene, de planlagte handlingene og loggene. Den skjermen kommer du til å trenge ofte. Stegene er like hos alle leverandører, fordi de ligger i selve WordPress.

Oppsummering

• WooCommerce tar med seg data, sider, prosesser og to programmerbare innganger.
• Produkter er en egen innleggstype; bestillinger ligger i nye butikker i egne tabeller (HPOS, standard siden 8.2).
• Handlekurven fungerer med én økt per besøkende; derfor må handlekurv, kasse og Min konto ikke hurtigbufres.
• Store API er offentlig og viser det hver besøkende ser; REST API skal være stengt uten nøkkel.
• Planlagte oppgaver går via Action Scheduler og WP-Cron; e-poster er en del av bestillingsprosessen.

Quiz

Oppgave

Oppgave A1.2: Kjører dette nettstedet på WooCommerce? Skriv inn et domene, velg ja eller nei, og skriv ned hvilket bevis du så (for eksempel "generator" eller "wc/store/v1"). Programmet henter forsiden, leser REST-indeksen (/wp-json/, bare listen med navnerom) og ber om /wp-json/wc/store/v1/products?per_page=1. Det kjenner igjen WooCommerce på en meta generator med WooCommerce, navnerommet wc/store/v1 i REST-indeksen, et fungerende Store API, filer fra /wp-content/plugins/woocommerce/ eller body-klassen woocommerce. Grønn: valget ditt stemmer, og beviset ditt finnes i hodelinjene, HTML-en, REST-indeksen eller svaret fra Store API; da ser du også antall produkter og valutaen. Oransje: valget ditt stemmer, men vi finner ikke beviset ditt igjen. Rød: valget ditt stemmer ikke. Prøv først på din egen nettbutikk og deretter på en nettbutikk du kjenner. Ingenting legges i en handlekurv, og ingenting sendes.

Les mer

Der stegene står i et kontrollpanel, gjelder de for WebOké; hos andre leverandører fungerer det på lignende måte.

• Gratis WordPress-kurs 1.2: Under panseret: webserver, PHP og database
• Gratis WordPress-kurs 1.3: Filer, wp-config og databasen
• Gratis WordPress-kurs 4.2: Sider, innlegg, kategorier og stikkord
• High-Performance Order Storage (developer.woocommerce.com, engelsk): https://developer.woocommerce.com/docs/features/orders/high-performance-order-storage/
• Store API (developer.woocommerce.com, engelsk): https://developer.woocommerce.com/docs/apis/store-api/
• Action Scheduler (engelsk): https://actionscheduler.org/