SEO Playbook · Element

Produktkort: Kildekontrollerede handelsblokke

Opbyg produktkort fra en troværdig SKU-kilde, så billeder, navne, priser, tilgængelighed og CTA'er forbliver korrekte for købere, søgemaskiner og AI-agenter.

12 min read

Et produktkort omdanner en produktomtale til en komplet, handlingsorienteret handelsenhed: et produktbillede, officielt navn, aktuel pris og et call to action (CTA), altså linket eller knappen, der fremmer købsrejsen. Dens vigtigste regel er usynlig for læseren: forfatteren placerer kortet via stock keeping unit (SKU), katalogidentifikatoren for et salgbart produkt eller variant, mens produktkilden leverer værdierne.

Produktbillede fra katalog

SKU TRAIL-BOOT-042

North Ridge Waterproof Hiking Boot

USD 149,00 · På lager

Se produkt

Eksemplet viser relationen, ikke et forfattet tilbud. I produktion kommer alle synlige værdier efter SKU’en fra den godkendte produktkilde. En katalogopdatering ændrer hvert kort, der refererer til den pågældende SKU, uden at bede forfattere om at finde og redigere gamle artikler.

Hvorfor dette element er vigtigt

Læsere, der vurderer produkter, skal hurtigt besvare fire spørgsmål: Hvad er det? Hvordan ser det ud? Hvad koster det? Hvad kan jeg gøre nu? Et produktnavn begravet i brødtekst tvinger dem til at rekonstruere disse svar på tværs af en side. Et afgrænset kort reducerer den anstrengelse og holder samtidig den kommercielle afbrydelse proportional med anbefalingen.

Kortet skaber også tillid gennem konsistens. Når en artikel siger “USD 149”, men produktsiden siger “USD 169”, er uoverensstemmelsen ikke en lille redaktionel fejl; den får læseren til at betvivle anbefalingen, kampagnen og betalingsprocessen. Et kildekontrolleret kort forhindrer artiklen i at blive en uafhængig prisdatabase. Det kan også afspejle lagerstatus, variantidentitet og destinationsændringer, efterhånden som kataloget ændres.

Maskinudtrækbarhed betyder, at en crawler, shoppingagent, feed eller indholdsmigreringsværktøj kan bevare, hvilket billede, navn, pris, tilgængelighedsstatus og handling der hører til hvilket produkt. Nærhed alene er svag. Hvis tre billeder sidder over tre priser i visuelt justerede kolonner, kan en maskine stadig associere dem forkert. Ét kort bør udstille en enkelt produktentitet nøglet til SKU, med dets fakta inden for én semantisk container og dets destination utvetydigt forbundet.

Elementet er ikke blot et stylet affiliatelink. Skrivereglerne for elementer har forrang: vælg komponenten ud fra dens formål. Når en blok præsenterer ét købbart produkt med identitet, pris og handling, brug da et produktkort, selvom en designer kunne efterligne det med et billede, en overskrift og en knap. En typet komponent giver kildebinding, validering, tilgængelighedsadfærd og strukturerede datakroge, som løs markup ikke kan garantere.

Hvornår skal det bruges

Brug et produktkort, når læseren har nok kontekst til at vurdere et specifikt produkt, og en direkte produkthandling er nyttig. Typiske tilfælde inkluderer en anbefalet vare i en købsguide, produkter i en kategoriintroduktion, et tilbehør på en produktside eller hver shortlistet mulighed efter sammenligningskriterier er blevet forklaret.

Produktet skal kunne identificeres med én gyldig SKU i den godkendte kilde. Hvis navnet refererer til en familie med flere uafhængigt prissatte varianter, skal artiklens anbefaling opløses til en specifik variant, eller der skal bruges en produktfamiliebehandling, hvis CTA beder læseren om at vælge en variant. Den billigste variant må ikke stille vises som prisen for enhver konfiguration.

Nærmissere er lette at få øje på, når formålet er eksplicit:

  • En sætning, der nævner et produkt som eksempel, behøver ikke et kort, medmindre pris og handling hjælper læseren i det øjeblik.
  • En samling planer med forskellige faktureringsvilkår kræver en pristabel, ikke en række produktkort.
  • En rangeret liste har stadig brug for redaktionel begrundelse omkring hvert element. Kort kan ikke erstatte udvælgelseskriterier, dokumentation, afvejninger eller forklaringen af, hvem hvert produkt passer til.
  • En kampagne med berettigelse, udløbsdato og kuponbetingelser kræver en dedikeret tilbudsbehandling. Kortet kan vise den kildekontrollerede aktive pris, men må ikke indeholde en miniaturebetingelsesside.
  • En sammenligning af specifikationer hører til i en sammenlignings- eller specifikationstabel. At gentage fulde kort i hver sammenligningscelle skaber visuel støj og svækker relationer.
  • En tjeneste uden en SKU og katalogpost er ikke et produktkort blot fordi den har en pris og knap.

Tilføj ikke et kort blot for at tjene penge på en informativ omtale. Hvis læseren ikke er stødt på et behov, kriterium eller en anbefaling, der forklarer, hvorfor produktet hører til, vil kortet føles som en afbrydelse, og en maskine vil modtage en entitet uden nyttig kontekst.

Hvor skal det placeres

Placering findes for at forbinde produktet med den begrundelse, der udvalgte det. Placer kortet umiddelbart efter det afsnit, underoverskrift eller dom, der identificerer produktet og forklarer dets pasform. Læseren bør møde begrundelsen før handlingen, ikke en salgskontrol før dokumentationen.

Når et afsnit indeholder både produkter og ikke-produktløsninger, kommer produkter før hjemmemidler, gør-det-selv-metoder og andre alternativer. Denne rækkefølge holder handelsvarer i én forudsigelig gruppe, giver deres katalogdata en ren grænse og forhindrer, at en husmetode ser ud som endnu en SKU. Introducer kriterierne, vis det relevante produktkort eller de relevante produktkort, og åbn derefter et tydeligt mærket alternativafsnit.

Præcise placeringsregler:

KontekstPlaceringBegrundelse
Enkelt anbefalingEfter dommen og én sætnings forklaring af pasformLæseren forstår, hvorfor handlingen er til stede.
Rangeret produktlisteEfter hvert produkts overskrift og koncise dokumentation, før detaljerede forbeholdIdentitet og handling forbliver knyttet til anbefalingen uden at erstatte analyse.
KategoriintroduktionEfter kategorikriterierne eller filterforklaringenKortet understøtter et defineret valg i stedet for at blive en uforklaret liste.
ProduktdetaljesideEfter værdiforslaget og afgørende variantkontekstPrimærproduktet er etableret, før pris og handling efterspørges.
Produkter plus hjemmemidlerAlle kvalificerede produktkort først; midler og alternativer bagefter under en ny overskriftKatalogentiteter forbliver adskilte fra ikke-produkthandlinger.

Placer ikke et kort før sidens direkte svar, inde i et afsnit, mellem en påstand og dens dokumentation eller inde i en nummereret instruktion. Placer det ikke ved siden af en modstridende pris, en anden CTA for samme destination, en nedtællingstimer, en udtalelse, der ser ud til at anbefale netop den SKU uden dokumentation, eller en hjemmemiddelboks. Undgå tilstødende duplikatkort for samme SKU; henvis i stedet senere referencer tilbage til den kanoniske placering.

Anatomi

Anatomi består af fire krævede synlige områder og én kilde-nøgle:

  1. Produktbillede: det primære katalogbillede for den refererede SKU, med kildeadministreret alternativ tekst, der identificerer produktet og relevant synlig variant.
  2. Produktnavn: det officielle kundevendte navn, linket eller parret med den kanoniske produktdestination.
  3. Pris: det aktuelle beløb og ISO-valutakode, eller en sandfærdig kildestatus som f.eks. “Pris ikke tilgængelig.” En udsalgspris bevarer sin forhold til den almindelige pris.
  4. CTA: en specifik handling som f.eks. “Se North Ridge-støvle” eller “Læg North Ridge-støvle i kurv,” valgt blandt de tilladte handlinger for det pågældende produkt og den pågældende kanal.
  5. SKU: den stabile opslagsnøgle. Den kan forblive visuelt nedtonet eller skjult for shoppere, men den skal findes i komponentdata og -diagnostik.

Tilgængelighed er betinget visuelt, men krævet i kildedata. Vis “Udsolgt,” “Forudbestil” eller en anden meningsfuld status, når det ændrer, hvad CTA’en kan gøre. Badges, vurderinger, forsendelsesnoter og varianter er valgfrie udvidelser; ingen må fortrænge de fire krævede områder eller være forfattet som uverificerbare påstande.

Designeksempler

Hver variant bruger den samme kildekontrakt. Varianter ændrer layout og vægtning, aldrig ejerskab af produktfakta.

Standard lodret kort: standarden for et til fire produkter. Det fungerer i artikelkolonner og stabler forudsigeligt på smalle skærme.

Kompakt vandret kort: brug i lange lister, hvor billedgenkendelse betyder noget, men lodret plads er begrænset. CTA’en følger prisen i læserækkefølge, selv når CSS placerer den i kanten.

Fremhævet anbefaling: brug én gang, når redaktionel begrundelse har identificeret en tydelig pasform. “Bedst til våde stier” er forfattet kontekst uden for det kildekontrollerede produktnavn; “bedst samlet set” kræver angivne kriterier og dokumentation.

Utilgængelig tilstand: bevar identitet, når midlertidig utilgængelighed er nyttig for læseren, men erstat købshandlingen med det kildegodkendte næste skridt. Et udgået produkt bør normalt erstattes redaktionelt i stedet for at blive promoveret som et tomt kort.

Parametre

Grænsefladen giver bevidst forfattere lidt kontrol. Begrænsning af forfattede input forhindrer tekst i at tilsidesætte kataloget. “Kilde” nedenfor identificerer, hvor gengiveren henter hver værdi.

Produktkort-grænsefladeparametre
NavnTypeKrævetMin/maksStandardKilde
skuAlmindelig strengJa1 nøjagtig katalogidentifikator; 1–64 tegnIngenAttribut leveret af forfatter
placementEnum: standard, compact, featuredNejÉn værdistandardAttribut leveret af forfatter
context-labelAlmindelig strengNej2–6 ord; 50 tegnFraværendeFørste overskrift i brødtekst; kun redaktionel kontekst
nameAlmindelig strengJa1 katalogværdi; displaybegrænsning sat af designsystemIngenProduktkilde via SKU
imageAsset-postJa1 primært billedeIngenProduktkilde via SKU
image-altAlmindelig strengJa5–25 ordIngenProduktkildes billedmetadata
priceDecimal eller eksplicit utilgængelig tilstandJa0 eller større; én aktuel værdiIngenProduktkilde via SKU
currencyISO 4217-kodeKrævet for monetær prisPræcis 3 bogstaverMarkedsvalutaProduktkilde og aktivt marked
availabilityStyret enumJaÉn kildestatusIngenLager- eller produktkilde via SKU
urlAbsolut eller rodrelativ URLJa1 kanonisk destinationIngenProduktkilde via SKU og marked
cta-labelAlmindelig strengJa2–6 ordSe produktKildegodkendt handling kortlagt fra tilgængelighed

Brødteksten er tom bortset fra en valgfri første overskrift, der bliver redaktionel kontekst, som f.eks. “Bedst til våde stier.” Den må aldrig indeholde et andet navn, håndskrevet pris, erstatningsbillede-URL, tilgængelighedspåstand eller destination. Hvis kildeoptegnelsen er ufuldstændig, ret kilden eller bloker publicering.

Produktkort-syntaks og kodeeksempler

Alle tre formater bærer den samme forfattede instruktion: placer produktet identificeret ved denne SKU her. De serialiserer ikke produktets aktuelle værdier ind i artiklen.

Portabel Markdown-direktiv

:::product-card{sku="TRAIL-BOOT-042" placement=featured}
### Bedst til våde stier
:::

Hugo shortcode

{{< product-card sku="TRAIL-BOOT-042" placement="featured" >}}
Bedst til våde stier
{{< /product-card >}}

Hugo-notationen dokumenterer den påtænkte adapterkontrakt. Den skal opløse SKU’en gennem sitets godkendte produktdatalag i stedet for at acceptere produktværdier som shortcode-parametre.

WordPress

[product_card sku="TRAIL-BOOT-042" placement="featured"]
Bedst til våde stier
[/product_card]

En WordPress-implementering bør bruge en dynamisk server-gengivet blok eller registreret shortcode understøttet af den samme produktkilde. Lagring af en statisk kopi af produktnavnet og prisen i indlæggets indhold bryder kontrakten.

Gode og dårlige eksempler

God: placering bærer anbefalingen; kilden bærer tilbuddet

For stejle, våde ruter bør du prioritere en vandtæt membran, en ydersål designet til mudder og sikker hælfastholdelse. North Ridge-modellen opfylder disse angivne kriterier uden at være den letteste mulighed.

:::product-card{sku="TRAIL-BOOT-042" placement=featured}

Dette virker, fordi brødteksten forklarer pasform og afvejning før produkthandlingen. Direktivet identificerer én SKU, så gengiveren kan hente et aktuelt billede, officielt navn, markedspris, tilgængelighed og URL som én produktentitet.

Dårlig: kommercielle værdier kopieres ind i artiklen

Bedste vandtætte støvle — North Ridge, kun $129!
Billede: /uploads/north-ridge-final-v2.jpg
Køb nu

Dette fejler, fordi prisen, billedet, navnebehandlingen og URL’en er håndskrevne. Beløbet kan være forældet eller bruge det forkerte marked; “kun” tilføjer en uunderstøttet værdidom; fragment-URL’en kan ikke nå et produkt; og billedet er afkoblet fra katalogmetadata. Der er ingen SKU, tilgængelighedsstatus, valutakode eller maskinstabil gruppering. Løsningen er ikke at fuldføre prosakortet. Erstat det med et kildeforbundet direktiv og behold kun den redaktionelle pasformforklaring uden for det.

Schema-markup og tilgængelighed

Et opløst kort kan fodre Product og Offer strukturerede data, når siden, produktet og synlige fakta kvalificerer sig under sitets skemapolitik. SKU’en kan kortlægges til sku; det officielle navn og billede kan kortlægges til name og image; et ægte tilbud kan levere price, priceCurrency, availability og url. Serveren skal generere synligt indhold og struktureret output fra den samme opløste post, så de ikke kan være uenige.

Undlad at udsende et Offer med en gættet pris, brug nul for et utilgængeligt beløb, eller marker en vare som på lager fordi CTA’en siger “Se produkt.” Hvis flere kort beskriver den samme SKU, bør skemaet ikke skabe modstridende duplikatentiteter. Forbind eller dedupliker dem gennem én stabil produktidentitet.

Tilgængelighed begynder med dokumentrelationer. Indpak hvert kort i et article eller tilsvarende mærket gruppe, gør produktnavnet til en logisk overskrift, og associér CTA’ens tilgængelige navn med det produkt. “Se produkt” gentaget seks gange er tvetydigt i en linkliste; “Se North Ridge Waterproof Hiking Boot” forbliver nyttig uden visuel kontekst.

Alternativ tekst bør beskrive produktet og meningsfuld synlig variant, ikke gentage pris eller skrive “billede af.” Dekorative sekundære billeder bruger tom alternativ tekst. Kommuniker ikke tilgængelighed, udsalgsstatus eller anbefaling kun gennem farve, gennemstregning, badgeform eller ikon. Tastaturfokus skal følge læserækkefølgen, og hele kortet må ikke blive ét kæmpelink, når det også indeholder en distinkt knap eller variantkontrol.

Skriveregler

Kortet forbliver kortfattet, fordi dets opgave er identitet og handling, ikke overtalelse. Hver regel beskytter enten kildeintegritet eller læserforståelse:

  • Én SKU forhindrer blandede identiteter. Hvert kort opløser præcis én SKU. Kombiner ikke et billede fra én variant med prisen fra en anden.
  • Kildeejerskab forhindrer forældede handelspåstande. Forfattere leverer placering og eventuelt en konteksetiket på to til seks ord. De skriver aldrig navnet, billedstien, prisen, valutaen, tilgængeligheden, URL’en eller CTA’en ind i kortet.
  • Redaktionel kontekst forklarer pasform. En fremhævet etiket kan angive et forsvarligt brugstilfælde som “Bedst til små køkkener.” Hold det på 50 tegn og understøt det i nærliggende brødtekst.
  • Aktuel pris har brug for fuld kontekst. Gengiveren viser en ISO-valutakode og håndterer almindelig pris versus udsalgspris fra produktkilden. Tilføj aldrig “billig,” “kun” eller sprog om besparelser, medmindre en separat verificeret påstand understøtter det.
  • Én handling reducerer tvetydighed. Brug én primær CTA, kortlagt til tilgængelighed. Tilføj ikke nyhedsbrevstilmelding, kuponindtastning, deleknapper eller konkurrerende forhandlerlinks inde i det kanoniske kort.
  • Kompakte grænser hjælper udtrækning. Det synlige kort indeholder ét billede, ét officielt navn, én pristilstand, én tilgængelighedstilstand når væsentlig, og én CTA. Lange beskrivelser, testresultater, fordele og ulemper samt juridiske vilkår forbliver i tilstødende elementer.
  • Produkter går forud for ikke-produkter. Når hjemmemidler eller andre ikke-produktalternativer deler et afsnit, vis relevante produktkort først, og begynd derefter et separat alternativunderafsnit.

Ton er faktuel og rolig. Den omgivende prosa kan anbefale, sammenligne eller advare, men de kildekontrollerede felter forbliver neutrale. Placer aldrig en udtalelse, uunderstøttet superlativ, nedtælling, skjult affiliaterklæring, recept, doseringsinstruktion, garantifortolkning eller returpolitikresumé inde i kortet. Disse påstande kræver deres egen dokumentation, ejerskab og opdateringsadfærd.

Posttyper, der bruger det

postTypes frontmatter-arrayet er den kanoniske relation. Tabellen forklarer kortets rolle i hver angivet specifikation.

PosttypeKravProduktkortets rolle
ProduktsideBetingetVis et kompatibelt tilbehør, bundtkomponent eller variant efter dets forhold til primærproduktet er forklaret.
KategorisideKerne for kuraterede produkterOmdan kategorikriterier og -filtre til kildeaktuelle produktvalg uden at kopiere katalogdata ind i brødindhold.
KøbsguideKerne når navngivne produkter anbefalesPlacer et kort efter pasformforklaringen for hvert shortlistet produkt.
Bedste X til Y-sideKerneBind hver dokumentationsunderstøttet anbefaling til en aktuel produktidentitet og handling.
Alternativer til X-sideBetingetBrug for købbare alternativer efter grunden til at skifte og målgruppepasform er etableret.
SammenligningssideBetingetBrug efter fælleskriterie-dommen, ikke inde i sammenligningsmatricen eller i stedet for dokumentation.
AnmeldelsessideBetingetGiv den anmeldte SKU en aktuel handling efter anmeldelsen oplyser metode, pasform og begrænsninger.

QA-tjekliste

  • Matcher blokkens formål et produktkort under forrangreglen?
  • Indeholder direktivet én gyldig SKU og ingen forfattede produktværdier?
  • Identificerer den opløste SKU det tilsigtede marked og den nøjagtige variant?
  • Kommer billede, navn, pris, valuta, tilgængelighed, URL og CTA fra godkendte kilder?
  • Matcher den synlige pris destinationen og eventuelle strukturerede data ved gengivelsestidspunktet?
  • Inkluderer en udsalgsstatus et gyldigt forhold til almindelig pris og en kildekontrolleret aktiv periode?
  • Er et utilgængeligt produkt mærket sandfærdigt med en passende ikke-købshandling?
  • Forklarer nærliggende prosa, hvorfor produktet passer, før kortet beder om handling?
  • Er produkter placeret før hjemmemidler, gør-det-selv-metoder og ikke-produktalternativer?
  • Er kortet adskilt fra modstridende priser, nedtællinger, udtalelser og duplikat-CTA’er?
  • Skaber produktnavnet en tydelig overskrift eller tilgængelig etiket for kortet?
  • Identificerer CTA’ens tilgængelige navn dets produkt, når links læses uden kontekst?
  • Beskriver alternativ tekst det meningsfulde produkt og variant uden at duplikere nærliggende tekst?
  • Er anbefaling, pris, tilgængelighed og udsalgsstatus udtrykt i tekst frem for kun farve?
  • Følger tastaturrækkefølge logisk billede, navn, pris, tilgængelighed og handling?
  • Udsendes skema kun for en kvalificeret opløst produkt, uden gættede eller modstridende tilbudsværdier?
  • Fejler en manglende eller udgået SKU sikkert i henhold til katalogpolitik i stedet for at gengive et blankt eller opdigtet kort?
  • Har siden undgået duplikatkort for samme SKU og holdt redaktionelle påstande uden for kildekontrollerede felter?

Et produktkort er først klar, når en læser og en maskine kan identificere det samme produkt, aktuelle kommercielle status og næste handling. Hvis en forfatter skal vedligeholde nogen af disse fakta i artikelprosa, er kildekontrakten brudt.

← All SEO Playbook guides

Klar til at føre det ud i livet?

Gratis tjek · 7-dages prøveperiode · intet kreditkort