Avancerede tilpasninger af visningen af produkter og kollektioner for Shopify-pluginnet

Disse avancerede indstillinger hjælper dig med at tilpasse dit butikslayout på WordPress, personliggøre dit virksomhedsbrand og forbedre dine kunders købsoplevelse.

Shopify-plugin og komponenter til Shopify-butikslayout

Shopify-pluginnet er bygget med Shopify Storefront Web Components. Følgende komponenter bruges som byggeklodser i dit Shopify-butikslayout:

• Produktkortkomponent: Denne komponent viser individuelle produktoplysninger og vises typisk på produktfortegnelser eller kollektionssider. Den indeholder ofte elementer som produktbillede, titel, pris og en Læg i kurv-knap.
• Modalkomponent til hurtig visning af produkt: Denne komponent viser en modal over det eksisterende indhold med produktoplysninger, en Læg i kurv-knap og et link til at se alle produktoplysninger.
• Komponent til side med produktoplysninger: Denne komponent viser et enkelt produkt med alle produktoplysninger. Hver komponent til en side med produktoplysninger har en unik webadresse.
• Kollektionskomponent: Denne komponent viser kollektioner af produkter, som du har oprettet.

Tilpasning af visningen af Shopify-produkter og -kollektioner

Standardkomponenterne til Shopify-butikslayout i dit plugin har værktøjer, der hjælper med at skabe en problemfri købsoplevelse. Du har også fleksibiliteten til at tilpasse visningen af disse komponenter, så de passer til din specifikke brandidentitet og dine designkrav.

For at foretage sådanne tilpasninger skal du have adgang til at redigere dine WordPress-temafiler og -mapper. Processen indebærer at oprette en dedikeret mappe i mappen for dit aktive WordPress-tema.

Fremgangsmåde:

1. Opret mappen Shopify: Begynd med at oprette en ny mappe med navnet Shopify direkte i mappen for dit aktive tema. Denne mappe fungerer som den centrale lokation for dine tilpassede komponenttilsidesættelser.
2. Tilsidesæt individuelle komponenter: Hvis du vil redigere en bestemt komponent, skal du tilføje en PHP-fil med et bestemt navn i den nyoprettede Shopify mappe. Navngivningskonventionen for disse tilsidesættelsesfiler er afgørende for, at pluginnet kan genkende og anvende dine tilpassede versioner:
   • Hvis du vil tilsidesætte Produktkortkomponenten, skal du oprette en PHP-fil med navnet product-card.php i mappen Shopify.
   • Hvis du vil tilsidesætte Modalkomponenten til hurtig visning af produkt, skal du oprette en PHP-fil med navnet modal.php i mappen Shopify.
   • Hvis du vil tilsidesætte komponenten for produktdetaljesiden, skal du oprette en PHP-fil med navnet pdp.php i mappen Shopify.
   • Hvis du vil tilsidesætte komponenten for kollektioner, skal du oprette en PHP-fil med navnet component.php i mappen Shopify.

Når din tilpassede PHP-fil er oprettet, ignorerer pluginnet sin standardkomponentfil for det pågældende element. Du kan implementere enhver kode i disse tilsidesættelsesfiler, lige fra statiske HTML-blokke til kompleks PHP-logik.

Selvom det på det kraftigste anbefales at udnytte Shopify Storefront Web Components (som bruges i pluginnets standardstruktur) for at sikre ensartethed og give adgang til indbyggede Shopify-funktioner, er du ikke begrænset til dem. Du kan integrere andre metoder til at hente og vise produkt- og kollektionsdata, hvilket giver mulighed for avancerede tilpasninger.

Du kan finde flere oplysninger og bedste fremgangsmåder i dokumentationen for udviklere af WordPress-plugins.

Omskrivninger af Shopify-produkter og -kollektioner

Når du udgiver et produkt eller en kollektion på Shopify, har hvert produkt og hver kollektion en unik webadresse. Disse webadresser oprettes som standard med dit Shopify-domæne. Med omskrivningsfunktionen kan du tilgå de unikke webadresser med dit offentlige WordPress-domæne.

Fremgangsmåde:

1. Gå til Indstillinger i Shopify-pluginnet.
2. Sørg for, at de to afkrydsningsfelter i afsnittet Omskrivninger af Shopify-links er aktiveret under fanen Avanceret.
3. Gå til Permanente links.
4. Klik på Gem for at anvende den nye regel.
5. Gå til din Shopify-administrator, og gå derefter til detaljesiden for det produkt eller den kollektion, du vil oprette et WordPress-link for.
6. På kortet med søgemaskinefortegnelsen vises der en webadresse, som linker kunder direkte til dit produkt eller din kollektion. F.eks.: https://johns-apparel.myshopify.com › products › huskee-reusable-cup.
7. Tilføj products/huskee-reusable-cup i slutningen af webadressen for dit WordPress-website. F.eks.: https://johns-apparel-wordpress.com/products/huskee-reusable-cup.

Tilpas funktionsmåden for dit produktkort

Med Shopify-butikslayoutkomponenter findes der to korttyper med produktoplysninger:

1. Hurtig visning: Når kunden holder markøren over produktkortet, har vedkommende mulighed for at vælge Hurtigt køb. Når der klikkes på den, vises produktoplysningerne i et pop op-vindue eller en modustilstand oven på eksisterende indhold i baggrunden.
2. Detaljeret produktside: Når en kunde klikker på produktkortet, f.eks. på billedet eller produktnavnet, vises produktoplysningerne i en helsidesvisning med en unik webadresse.

Du kan ændre denne indstilling, så der enten kun vises en hurtig visning, kun en detaljeret produktside eller begge dele.

Fremgangsmåde:

1. Gå til Indstillinger i Shopify-pluginnet i WordPress.
2. Gå til afsnittet Produktvisning på fanen Avanceret.
3. Vælg den valgmulighed, der passer bedst til din butik.
4. Klik på Gem.