Förhandsgranska teman i mobilvy

Här går vi igenom hur man kan förhandsgranska teman i mobilvy för olika webbläsare.

De flesta webbläsare har verktyg som anpassar fönstret till olika storlekar för att kunna imitera utseende i en mobil eller surfplatta. Eftersom att många slutkunder gör köp i mobil och surfplatta kan det vara intressant att t.ex. förhandsgranska ett nytt tema man skapat så att man även vet hur utseendet på shopen kommer se ut för dessa kunder.

Förhandsgranska med Firefox, Google Chrome och Edge

När man förhandsgranskar ett aktivt eller inaktivt tema under Utseende>Teman så gör man följande för att öppna inspektionsverktyget i webbläsaren:

  • Firefox: Ctrl + shift + M
  • Google Chrome: F12 och sedan Ctrl + shift + M
  • Edge: F12 och sedan Ctrl + shift + M


Nu är inspektionsverktyget igång, man kan då välja att bredda höjden eller bredden på vyn själv , eller välja någon av de färdiginställda storlekarna för att imitera hur det skulle se ut för ett antal olika enheter. 

firefoxdevice

 

chromemobil

Förhandsgranska med Safari

När man förhandsgranskar ett aktivt eller inaktivt tema under Utseende>Teman så gör man följande för att öppna inspektionsverktyget i webbläsaren:

1. Safari-meny> Inställningar> Avancerat

2. Bocka i rutan för  "Visa utveckla meny i menyraden"

3. "Utveckla" ligger nu som ett alternativ i menyraden i Safari. Klicka på Utveckla-> "Responsivt design läge"

 

Nu är inspektionsverktyget igång, man kan då välja att bredda höjden eller bredden på vyn själv, eller välja någon av de färdiginställda storlekarna för att imitera hur det skulle se ut för ett antal olika enheter. 

 

För att förhandsgranska med Safari behöver man gå igenom lite fler steg, så vi rekommenderar att du i första hand använder en Firefox, Chrome eller Edge för förhandsgranskning i mobil vy.