Bildarkiv: ladda upp, organisera och återanvänd dina bilder

Bildarkivet är en gemensam plats där du samlar alla dina bilder, så att du kan återanvända dem i hela din webbshop. Istället för att ladda upp samma bild om och om igen laddar du upp den en gång och hämtar den där du behöver den. Det är särskilt användbart vid säsongsskiftet: när förstasidan ska bytas från sommar till vinter tar du bara fram förra årets bilder istället för att göra om allt från början.

Samtidigt kan du nu infoga bilder direkt i dina texter. En ”infoga bild”-knapp i textredigeraren låter dig placera en bild mitt i en produktbeskrivning, en sida, ett blogginlägg eller en kampanjtext, precis som du är van vid från ett textbehandlingsprogram.

Så här hittar du bildarkivet

Du hittar bildarkivet i administrationspanelen under Design → Bildarkiv. Här ser du alla bilder du har lagt in i arkivet, samlade i ett överskådligt galleri med mapparna i menyn till vänster.

Ladda upp dina bilder

Du kan ladda upp bilder på två sätt:

• Dra och släpp. Dra en eller flera bildfiler från din dator till uppladdningsfältet.
• Klicka och välj. Klicka på uppladdningsfältet och välj bilderna i filväljaren. Du kan markera flera samtidigt.

Om du vill placera bilderna direkt i en viss mapp väljer du mappen i menyn till vänster innan du laddar upp. Uppladdningsfältet visar vilken mapp bilderna placeras i.

Organisera i mappar

Mappar hjälper dig att hålla ordning på bilderna, t.ex. efter säsong eller kampanj. I menyn till vänster kan du:

• Skapa en mapp med knappen ”Ny mapp”. Mappen finns kvar även om den är tom, så du kan skapa den först och ladda upp till den senare.
• Byta namn på eller ta bort en mapp via de tre punkterna bredvid mappen.
• Se antalet bilder i varje mapp direkt i menyn.
• Söka efter en bild på namn eller beskrivning.

När du tar bort en mapp raderas inte bilderna. De flyttas bara ut ur mappen och finns kvar i arkivet under ”Alla”.

Redigera, flytta och rensa upp

Klicka på pennikonen på en bild för att redigera den. Här kan du ge bilden en alt-text (en beskrivning av vad bilden visar), flytta den till en mapp eller ta bort den. Du kan också kopiera bildens adress om du behöver använda den någon annanstans. Om du istället klickar på själva bilden markeras den (se avsnittet om att hantera flera bilder nedan).

Om du ska hantera många bilder på en gång markerar du dem (klicka på bilderna eller använd ”Välj alla”) och använder åtgärdsfältet längst ner för att flytta dem till en mapp eller radera dem samtidigt.

Infoga en bild i en text

När du redigerar en produktbeskrivning, en sida, ett blogginlägg, en kategori-, kampanj- eller landingssidetext hittar du en bildknapp i textredigerarens verktygsfält. Så här gör du:

1. Placera markören där bilden ska stå och klicka på bildknappen.
2. Bildarkivet öppnas. Välj en bild eller ladda upp en ny direkt i fönstret.
3. Välj en storlek (liten, medelstor, stor eller mycket stor) och klicka på ”Infoga bild”.
4. Om du vill ha bilden centrerad eller placerad till vänster eller höger markerar du den i texten och använder justeringsknapparna i verktygsfältet.

Bilden infogas som en länk till arkivet, så du behöver inte ladda upp den igen. Samma bild kan användas så många gånger du vill.

Bilderna optimeras automatiskt

Du behöver inte oroa dig för filstorlekar. Shoporama optimerar bilderna åt dig:

• När du infogar en bild väljer du en storlek (t.ex. medium på 800px), och bilden levereras i just den storleken, inte i originalets fulla upplösning.
• Bilderna levereras i det moderna WebP-formatet, vilket ger mindre filer.
• De skalerade bilderna sparas (cachas) så att de laddas snabbt vid senare besök.

Det innebär att inte ens en stor originalbild gör din produktbeskrivning tung, eftersom endast den valda storleken hämtas. Vill du läsa mer om hur Shoporama hanterar kvalitet och format, se bildkvalitet och bildformat samt optimering av bilder för mobil.

För utvecklare: bildjustering i anpassade teman

Detta avsnitt är endast relevant om du bygger eller anpassar ditt eget tema.

När en bild justeras i redigeraren tilldelas bilden en CSS-klass: aligncenter, alignleft eller alignright. Shoporamas inbyggda teman formaterar dessa klasser så att justeringen fungerar direkt. Om du bygger ett eget tema som rensar HTML-koden från inline-stilar måste du själv lägga till CSS för klasserna, t.ex.:

.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignleft { float: left; margin: 0 1rem 0.5rem 0; }
.alignright { float: right; margin: 0 0 0.5rem 1rem; }

Till utvecklare: styr arkivet via REST och AI (MCP)

Arkivets funktioner kan även styras programmatiskt:

• REST API. Du kan lista bilder, ladda upp (från en offentlig URL eller base64), tilldela en bild en mapp eller en beskrivning samt skapa, byta namn på eller ta bort mappar. Bilder finns under /library-image och mappar under /library-folder. Stora bilder skalas automatiskt till max 2000px och levereras som WebP, precis som i admin.
• AI (MCP). Samma funktioner finns som AI-verktyg (t.ex. library_image_create och library_folder_create), så att en AI-assistent kan hantera bilder åt dig. Verktygen kan aktiveras och inaktiveras under Integrationer → Styr webbutiken med AI (knappen ”Anpassa verktyg”) i domänen ”Bildarkiv”.

Observera: endast arkivets egna funktioner är tillgängliga via API. Själva infogningen av en bild i en text sker i textredigeraren.

Vanliga frågor

Måste jag ladda upp samma bild igen varje gång jag vill använda den?

Nej. Du laddar upp bilden en gång till arkivet och hämtar den där du behöver den. Det är hela poängen med arkivet. Du kan till exempel återanvända förra årets vårbilder utan att behöva ladda upp dem på nytt.

Måste jag skapa mappen först, eller kan jag flytta bilder efterhand?

Båda sätten fungerar. Du kan skapa en mapp med ”Ny mapp” och ladda upp till den, eller så kan du markera bilder i efterhand och flytta dem till en mapp via åtgärdsfältet. Samma fält finns även när du redigerar en enskild bild.

Kan jag välja flera bilder på en gång?

Ja. Klicka på de bilder du vill välja, eller använd ”Välj alla”. Då dyker en åtgärdsfält upp längst ner där du kan flytta eller ta bort dem samtidigt.

Hur centrerar jag en infogad bild eller gör den mindre?

När du infogar bilden väljer du en storlek (liten, medelstor, stor eller mycket stor). Om du vill centrera den eller placera den åt sidan markerar du bilden i texten och använder justeringsknapparna i redigerarens verktygsfält.

Får bilderna automatiskt en alt-text, och har det någon betydelse för SEO?

Du skriver själv alt-texten för varje enskild bild, och den används när bilden visas. En bra alt-text hjälper både skärmläsare och Googles bildsökning, så det är värt att fylla i den.

Gör stora bilder min sida långsam?

Nej. Du väljer bildens storlek när du infogar den, och den levereras som en komprimerad WebP-fil i just den storleken. Väljer du ”liten” hämtar sidan bara en liten fil, så att hastigheten bibehålls, även på mobilen.

Är arkivet gemensamt för mina butiker?

Nej. Varje webbshop har sitt eget privata bildarkiv. Om du har flera butiker kan de inte se varandras bilder eller mappar.

Vad händer om jag tar bort en bild från arkivet?

Bilden tas bort. Om den var infogad i en text någonstans försvinner den även där, så ta bara bort bilder som du är säker på att inte används. Att flytta eller byta namn på mappar är däremot helt ofarligt, eftersom bilderna aldrig raderas vid sådana åtgärder.

Fungerar bildjusteringen i mitt eget anpassade tema?

I Shoporamas inbyggda teman fungerar justeringen direkt. Om du bygger ditt eget tema kan du behöva lägga till CSS för de tre justeringsklasserna (se avsnittet ”För utvecklare” ovan).

Om du har frågor om bildarkivet är du välkommen att skriva till support@shoporama.dk.