Til toppen

Hvordan generere lenker til produktbilder i nettbutikken?

Det finnes en enkel teknikk for å generere lenker til bilder og dokumenter på produkter i nettbutikken. Vi ser på hvordan og hvorfor det kan være nyttig i denne artikkelen.

15. november 2021 av Linda Fermann


Alle produktbilder og dokumenter som knyttes til et produkt i nettbutikken får et filnavn som er bygd opp etter en fast konvensjon. Det gjør at det er enkelt å vite URL til ethvert produktbilde eller dokument, og vi skal se på en enkel måte å komme fram til dette.

Vi starter med å vise dette med et eksempel hvor vi skal hente ut lenke til hovedbilde på en del produkter. Prinsippet er det samme uansett om du skal finne det til 10 produkter eller alle produktene i nettbutikken. I tillegg er det helt likt for å finne alle galleribilder eller dokumenter som er lagt på produkter, det eneste som er ulikt er siste del av filnavnet. Det skal vi se på etter at vi har forklart teknikken som vi benytter for å finne fram til lenkene.

Teknikk for å finne fram til alle lenkene

I dette eksemplet så skal vi se på hvordan vi finner lenke til hovedbilde for en del produkter. På bilde under ser du en oversikt over de stegene vi skal gjennom.


Kort fortalt så oppretter vi et tomt regneark. I første kolonne legger vi inn alle produktnumrene vi ønsker å generere lenke til hovedbilde på. Overskrift på kolonne A setter vi til å være "Produktnummer", og overskrift på kolonne B setter vi til å være "URL til hovedbilde". Deretter finner vi lenke til et hovedbilde på et tilfeldig produkt i nettbutikken. Denne skal vi bryte opp i noen ulike deler, og så lager vi en formel som setter sammen dette igjen, men hvor produktnummeret endres til å være det vi har lagt inn i kolonne A. Så fort vi har laget denne formelen på første produktnummer, så kan vi kopiere formelen til alle radene, og vipps så har vi laget alle lenkene til hovedbilde på disse produktene.

OK - la oss skride til verket og se litt mer i detalj på disse stegene.

Steg 1: Regneark

Vi lager oss et nytt tomt regneark i Google Sheets og legger inn to kolonneoverskrifter. I den første skriver vi "Produktnummer", og den andre "URL til hovedbilde". Deretter legger vi inn de produktnumrene som vi skal generere URL til hovedbilde på i kolonne A.


Steg 2: Finne URL til et hovedbilde

Vi går så til et tilfeldig produkt i nettbutikken, klikker på hovedbildet, og kopierer med oss URL til bilde.


Vi limer denne URL inn på en tilfeldig rad i regnearket (vi skal slette dette etter at vi har laget oss formelen). Det første vi gjør er at vi fjerner versjonsnummeret og de parametrene som er lagt til i URL'en som vist nedenfor. Parametrene må ikke fjernes, det er kun versjonsnummeret som må fjernes. Men vi har ikke behov for disse parametrene, så vi tar de like så godt vekk.


Da ser URL ser slik ut:


Steg 3: Lage formel

Vi skal lage en formel i regnearket som skal generere URL'er til hovedbilde på de produktnummer som vi har lagt inn i kolonne A. Vi markerer celle B2 og gjør følgende:

  • Vi må først skrive =CONCATENATE(
  • Deretter skal vi hente ut alt i URL'en helt fram til der produktnummeret begynner og legge det i fnutter ", altså i dette tilfellet "https://res.cloudinary.com/cloudinary-konto-navn/image/upload/p_".
  • Deretter legger vi inn skilletegnet semikolon ;
  • Det neste vi skal hente ut, er produktnummeret i kolonne A, så da angir vi celleidentifikatoren A2
  • Deretter legger vi inn skilletegnet semikolon ;
  • Dernest skal vi hente ut alt som kommer etter produktnummeret i URL'en, i dette tilfellet "_default_1"
  • Til slutt må vi lukke formelen med parantes )

Her ser vi hvordan det ser ut i regnearket:


Det vi har gjort nå er følgende:
Vi har en statisk tekst først og sist i formelen, og så ber vi om at produktnummeret legges inn på den plassen som vi så at det opprinnelig lå på. Bare at nå så henter vi produktnummeret fra kolonnen hvor vi har lagt inn de produktnumrene som vi ønsker å hente URL til hovedbilde på. Vi har med dette opprettet en dynamisk formel som vil hente de ulike produktnumrene nedover, og vi sitter da med et sett av URL'er til hovedbilde på disse produktnumrene. Og nå kan vi slette den URL'en som vi hentet fra et tilfeldig bilde, da vi er ferdige med den.

Steg 4: Kopier formel

Vi markerer så celle B2 som vi la formelen inn i, og kopiere dette nedover i hele listen vår:



Og med det så har vi fått opprettet lenker til hovedbilde på alle disse produktene.

Til info:

Denne teknikken kan brukes til både galleribilder og dokumenter. Da henter du bare lenken til et slik bilde eller dokument, slik at du får med deg den riktige filendelsen etter produktnummeret i URL'en.

Hva skal vi med alle disse lenkene da?

Det kan være ulike scenarier hvor dette kan være nyttig, og vi skal kort nevne noen her.

Lage produktkatalog

Dersom dere skal lage en produktkatalog, og ønsker å hente ut de bildene som ligger på produktene i nettbutikken, så vil dette være en nyttig framgangsmåte. Da sikrer du at du benytter de samme bildene som er lagt på produktene i nettbutikken.

Overføre bilder til testmiljø

Dersom du ønsker å berike produkter i testmiljøet med de samme bildene som ligger på produkter i produksjonsmiljøet, så kan du gjøre det på denne måten. Da vil du generere URL'er til bildene i produksjonsmiljøet, og så laster du dette opp ved bruk av "Masseopplasting" under "Media" i testmiljøet. Adminverktøyet vil da laste ned en kopi av disse bildene, og dytte dette opp til Cloudinary-kontoen på testmiljøet.

Gjøre samme endring på mange bilder

Det kan også benyttes til å gjøre en endring på mange bilder, ved å benytte redigeringsfunksjonalitet i Cloudinary. Et slikt eksempel er forklart i denne artikkelen, i det eksemplet som gjelder Etman og endring av litt gule brytere til hvite brytere.

Se også presentasjon og opptak fra Summit 2021 på det som er gjennomgått i denne artikkelen, som du finner under Kundedag - "PIM - Cloudinary Tips & Tricks".


Hva synes du om denne artikkelen?