Logg på
Start gratis prøveperiode

Laste opp bilder

Du kan bruke ulike typer bilder, for eksempel en firmalogo, produktbilder, lysbildefremvisninger, bannere og bilder fra blogginnlegg. Du kan også endre bildene dine med beskjæringer og endring av størrelse, og tilpasse medieinnstillingene i temaet ditt for å endre kanten eller skyggen på alle medier som vises i butikken din.

Du må bruke riktig størrelsesforhold i bilder for å vise bilder i nettbutikken nøyaktig slik du ønsker. Bilder optimaliseres automatisk for butikkfronten din med Shopify Content Delivery Network (CDN).

På denne siden

Last opp et bilde i temaredigeringsprogrammet

Du kan legge til bilder i temaet ditt i temaredigeringsprogrammet. Du kan også laste opp bilder i Innhold > Filer-delen av Shopify-administrator. For å finne ut mer kan du se Laste opp og administrere filer.

Steg:

Datamaskin
  1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
  2. Klikk på Tilpass for temaet du vil laste opp et bilde for.
  3. Valgfritt: Hvis du vil legge til et bilde på en side i butikken annet enn startsiden, klikker du på Startside-rullegardinmenyen og velger malen du vil redigere.
  4. Fra sidefeltet i temaredigeringsprogrammet klikker du på delen eller blokken du vil legge til et bilde i.
  5. I Bilde-feltet gjør du et av følgende:
    • Fullfør følgende trinn for å laste opp et bilde fra datamaskinen din:
      1. Klikk på Velg > Legg til bilder.
      2. Finn og åpne bildet på datamaskinen din.
      3. Klikk på Ferdig.

- Fullfør følgende trinn for å bruke et gratis arkivbilde fra Burst: 1. Klikk på Utforsk gratis bilder. 2. Finn et bilde du vil bruke. 3. Klikk på Velg.

  1. Klikk på Lagre.
iPhone

  1. Trykk på …-knappen fra Shopify-appen.

  2. I Salgskanaler-seksjonen trykker du på Nettbutikk.

  3. Trykk på Administrer alle temaer.

  4. Trykk på Tilpass for temaet du vil laste opp et bilde for.

  5. Valgfritt: Hvis du vil legge til et bilde på en side i butikken annet enn startsiden, trykker du på Startside-rullegardinmenyen og velger malen du vil redigere.

  6. Trykk på Deler og trykk deretter på delen eller blokken du vil legge til et bilde i.

  7. I Bilde-feltet gjør du et av følgende:

    • For å laste opp et bilde fra enheten din fullfører du de følgende trinnene:
      1. Trykk på Velg bilde > Legg til bilder.
      2. Finn og åpne bildet på enheten din.
      3. Trykk på Ferdig.

- Fullfør følgende trinn for å bruke et gratis arkivbilde fra Burst: 1. Trykk på Utforsk gratisbilder. 2. Finn et bilde du vil bruke. 3. Trykk på Ferdig.

  1. Trykk på Lagre.
Android

  1. Trykk på ☰-knappen fra Shopify-appen.

  2. I Salgskanaler-seksjonen trykker du på Nettbutikk.

  3. Trykk på Administrer alle temaer.

  4. Trykk på Tilpass for temaet du vil laste opp et bilde for.

  5. Valgfritt: Hvis du vil legge til et bilde på en side i butikken annet enn startsiden, trykker du på Startside-rullegardinmenyen og velger malen du vil redigere.

  6. Trykk på Deler og trykk deretter på delen eller blokken du vil legge til et bilde i.

  7. I Bilde-feltet gjør du et av følgende:

    • For å laste opp et bilde fra enheten din fullfører du de følgende trinnene:
      1. Trykk på Velg bilde > Legg til bilder.
      2. Finn og åpne bildet på enheten din.
      3. Trykk på Ferdig.

- Fullfør følgende trinn for å bruke et gratis arkivbilde fra Burst: 1. Trykk på Utforsk gratisbilder. 2. Finn et bilde du vil bruke. 3. Trykk på Ferdig.

  1. Trykk ✓.

Legge til bilder med metafelter

Hvis du har konfigurert metafelter for bildene dine, kan du bruke den dynamiske kildevelgeren til å legge til et bilde i nettbutikken. Hvis du vil ha mer informasjon om metafelter og støttede bildeformater, kan du se Legge til verdier for metafelter.

Angi et fokuspunkt på et bilde

Du kan bruke fokuspunkter til å definere den viktigste delen av et bilde i nettbutikken din. Når du angir et fokuspunkt på et bilde, gjør du det til et fokusområde. Fokuspunkter vises alltid i rammen, selv om du har et tema som beskjærer bildet slik at det passer layouten. Med fokuspunkter får du mer kontroll over hvordan bildet vises på ulike skjermstørrelser, og i tilfeller der temaer bruker ulike høyde- og breddeforhold.

Du kan bare ha ett fokuspunkt per bilde, men du kan endre fokuspunktet eller fjerne det når som helst.

Kompatibilitet med fokuspunkter med gratistemaer i Shopify

Du kan angi et fokuspunkt for følgende versjoner av gratistemaer i Shopify:

  • Colorblock versjon 3.0.0 eller nyere
  • Craft versjon 5.0.0 eller nyere
  • Crave versjon 5.0.0 eller nyere
  • Dawn versjon 7.0.0 eller nyere
  • Origin versjon 1.0.0 eller nyere
  • Publisher versjon 1.0.0 eller nyere
  • Refresh versjon 2.0.0 eller nyere
  • Ride versjon 3.0.0 eller nyere
  • Rise versjon 1.0.0 eller nyere
  • Sense versjon 5.0.0 eller nyere
  • Spotlight versjon 0.0.1 eller nyere
  • Studio versjon 4.0.0 eller nyere
  • Taste versjon 4.0.0 eller nyere
  • Trade versjon 1.0.0 eller nyere

Hvis du bruker et tema fra en tredjepart, må du sjekke temaets dokumentasjon for å finne ut om temaet støtter bruk av fokuspunkter.

Legg til et fokuspunkt i et bilde

Hvis du legger til et fokuspunkt for et bilde og bruker bildet flere steder i nettbutikken, gjelder det samme fokuspunktet uansett hvor du bruker bildet.

Avhengig av hvordan temaet ditt beskjærer og endrer størrelsen på bilder, er det ikke sikkert at fokuspunktet alltid er visuelt sentrert.

Steg:

  1. Klikk på et bilde fra en av følgende steder i Shopify-administrator:

  2. For å velge delen av bildet der du vil angi et fokuspunkt, klikker du enten på bildet eller drar på den blå prikken.

  3. Klikk på Lagre.

Fjerne et fokuspunkt fra et bilde

Steg:

  1. Klikk på et bilde fra en av følgende steder i Shopify-administrator:

  2. Klikk på Fjern.

  3. Klikk på Lagre som ny.

Bildeformater

Følgende bildeformater støttes:

  • JPEG
  • Progressiv JPEG
  • PNG
  • GIF
  • HEIC
  • WebP
  • AVIF

Bruke JPEG-bilder

JPEG-bilder er ideelle for fotografier og andre stillbilder med kompliserte farger. JPEG-formatet har en palett med flere millioner farger. JPEG har også komprimering med kvalitetstap, noe som kan bidra til at sider lastes inn raskt uten merkbart tap av bildekvalitet. Bruk JPEG-format for følgende bildetyper:

  • produkter
  • bannere eller lysbilder
  • sider og blogginnlegg

Bruke PNG-bilder

PNG-bilder er ideelle for grafikk og ikoner med flate farger uten gradient. PNG-formatet støtter også gjennomsiktighet i bilder. Bruk PNG-format for følgende bildetyper:

  • logoer
  • ikoner
  • kanter og beskjæringer

Automatisk bildekomprimering og formatvalg

For å oppnå lave innlastingstider for sider komprimerer Shopify automatisk bilder når de vises i nettbutikken. Komprimering av et bilde betyr å redusere filstørrelsen for å gi raskere innlasting av sider.

I tillegg avgjør Shopify automatisk det best mulige filformatet for levering av bilder. Når vi for eksempel registrerer at nettleseren til en kunde støtter moderne bildeformater som WebP og AV1 Image File Format (AVIF), blir bildene dine levert i disse formatene.

For å forbedre ytelsene ved å redusere filstørrelsen konverteres GIF-filer automatisk til det animerte WebP-formatet.

Grenser for bildeopplasting

Bildeopplastinger til Shopify har begrensninger for både megapiksler og filstørrelse, som måles i megabyte. Megapiksler brukes til å indikere hvor mange millioner piksler et bilde består av. Megabyte brukes til å indikere hvor mange millioner byte minne eller diskplass et bilde tar opp.

Bilder som lastes opp til Shopify, kan ikke overskride disse grensene:

  • 20 megapiksler
  • 20 megabyte

For å finne megapiksler-verdien for bildet kan du bruke følgende formel:

(pixel width x pixel height)/1,000,000

For eksempel er et bilde med en oppløsning på 4900 piksler ganger 6930 piksler 33,9 megapiksler basert på ligningen: (4900x6930)/1,000,000 = 33.9 MP.

Fargeprofiler for bilder

Når du ser et bilde i nettbutikken din, kan fargene i bildet vises annerledes enn i det opprinnelige bildet du lastet opp til Shopify. Dette kan skje når et bilde har en fargeprofil, som er et datasett som er lagret i en fil med en .ICC- eller .ICM-utvidelse.

Fargeprofiler er ofte innebygget i bilder for å standardisere måten fargene vises på ulike enheter. Når bilder vises i nettbutikken din, fjernes fargeprofilene deres.

Fargeprofiler er fjernet av følgende årsaker:

  • Ikke alle enheter kan lese .ICC- eller .ICM-fargeprofiler, så hvis de beholdes, kan det resultere i inkonsekvente farger på forskjellige enheter.
  • Når et opplastet bilde ikke inkluderer en fargeprofil, antar nettleseren sRGB, som er den vanligste fargeprofilen som brukes til å vise bilder på nettet. Dette sikrer at bildene dine ser like ut på alle større nettlesere og enheter.
  • Fargeprofiler kan ta opp mye diskplass, som kan resultere i lengre innlastingstid for sider.

Fjerne fargeprofilen fra et bilde

Du kan fjerne fargeprofilen fra bildet ditt ved å lagre det uten fargeprofilen før du laster det opp til Shopify. Denne prosessen varierer etter hvilket bildebehandlingsprogram du bruker.

Se Adobe-dokumentasjonen for hvordan du tildeler eller fjerner en fargeprofil (Illustrator, Photoshop) og tildeler eller fjerner en fargeprofil (InDesign).

Beste praksis for lysbildefremvisninger, bildebannere og fullbreddebilder

Mange Shopify-temaer har store bilder eller lysbildefremvisninger som skaleres til nettleserens høyde eller tilpasser seg skjermstørrelsen.

Hvis du bruker et av disse temaene eller har en stor lysbildefremvisning eller et stort bakgrunnsbilde, må du forstå hvilke bildetyper som vises best.

Siden store bilder ikke passer på alle enheter, viser Shopify av og til bare deler av bildet, avhengig av enheten du bruker. Hvis lysbildefremvisningen din inneholder mange store bilder, kan du oppdage at deler av bildene ikke er synlige.

Hensyn ved bruk av bilder til lysbildefremvisninger eller bildebannere

Vær oppmerksom på følgende punkter for å sørge for at bildene fungerer bra med temaet:

  • Bilder du bruker til lysbildefremvisninger eller bakgrunner, bør ikke inneholde tekst. Hvis teksten er en del av selve bildet, kan den bli flyttet rundt, beskjært eller justert basert på temaet du bruker. Bruk temaredigeringsprogrammet for å legge til tekst og koblinger i lysbildefremvisninger og bakgrunner.

  • Bilder du bruker i lysbildefremvisninger eller bakgrunner, bør være enkle bilder, slik at overliggende tekst blir enkel å lese.

Brede bilder på høye skjermer

Brede bilder kan beskjæres på venstre og høyre side når enheten som brukes til å vise dem, har en høy skjerm, for eksempel en mobiltelefon eller et nettbrett i portrettmodus. I eksempelet nedenfor, dersom mennesker er den viktigste delen av bildet, kan du plassere et fokuspunkt på høyre side av bildet.

Brede bilder på høye skjermer

Høye bilder på brede skjermer

Høye bilder kan beskjæres øverst og nederst når enheten som brukes til å vise dem, har en bred skjerm, for eksempel en bærbar eller stasjonær datamaskin. I eksempelet nedenfor, dersom skoene er den viktigste delen av bildet, kan du plassere et fokuspunkt nederst på bildet.

Høye bilder på brede skjermer

Finner du ikke svarene du leter etter? Vi er her for å hjelpe deg.