Hur använder jag höjd och marginaler för widgetar?

När du lägger till en widget av något slag får du val för Höjd, Anpassad innehållsyta och Marginaler. Som standard behöver du inte fylla i dessa men om du vill justera marginalerna eller höjden på din widget kan du använda denna guide.

Höjd och rullningslist

Rutan Höjd ställer in antalet pixlar widgeten ska ta upp i höjdled. Om fältet lämnas tomt tar widgeten upp så mycket utrymme den behöver i höjdled. Detta är oftast det önskade beteendet för en widget. 

Om du ställer in en lägre höjd än widgeten tar upp så kommer endast den översta delen av widgeten att synas på sidan vilket inte är så lämpligt. Om du kryssar i rutan Visa rullningslist så kommer widgeten om den har innehåll som inte får plats med din satta höjd att visa en rullningslist. Det gör att användaren kan scrolla inom widgeten för att se allt innehåll i den. Detta kan dock ge en svåröverskådlig sida. I exemplet nedan är det extra tydligt att rullningslist inte är rätt val då widgeten även behöver scrollas i sidled vilket bör undvikas.

Men bredd då?

Notera att bredden för en widget på en sida ställer du inte in här, utan genom att avgöra hur många kolumner den ska ta upp. Detta sagt så går det att få en widget att behöva flera pixlar både i bredd- och höjdled genom att lägga på marginaler, (se nedan). Men om en widget tar upp flera pixlar på bredden än den fått tilldelat av inställningarna för kolumner så kommer den att beskäras i högerkanten.

Anpassad innehållsyta

Anpassad innehållsyta är en mallspecifik listruta som, om din butiks mall har specifika innehållsytor gjorda för widgetar, ger dig förinställda val för widgetens utseende. Om du inte vet att du vill använda en sådan mall bör du använda det förvalda alternativet Standard.

Ett exempel på en anpassad innehållsyta är rubriken "Nyheter" på ljusbutik.se, som är centrerad och har en linje på båda sidor om sig.

Eftersom butiken har en mall för sådana rubriker väljer de helt enkelt valet "Linjerubrik" i listrutan när de vill skapa en ny sådan rubrik.

Marginaler

Marginaler är extra utrymme du lägger till på en widget, för att flytta widgetens innehåll. På bilden nedan har en vänster- och en toppmarginaler satts för att flytta innehållet i widgeten nedåt och till höger, medan höger- och bottenmarginalen satts till noll. Om vi tänker på en widget som en låda med saker i, så flyttar marginaler på sakerna i lådan, de flyttar inte på själva lådan.

Om du kryssar för rutan Använd marginal på innehållsyta så kan du ställa in marginaler i pixlar i rutorna nedan. Om du till exempel sätter marginalerna Toppen: 15px, Vänster: 10px så kommer innehållet i widgeten att flyttas ned 15 pixlar och till höger 10 pixlar.

Om du kryssar i rutan Placera rubrik inuti innehållsyta så kommer även rubriken att använda marginalerna.

Lämnas vänster- och högerfälten tomma sätts dessa per automatik till 12 pixlars marginal, vill du inte ha några marginaler så sätt dem istället till 0 pixlar.

Observera att om du inte kryssar i rutan Använd marginal på innehållsyta men ändå fyller i värden för marginaler så kommer dessa värden inte att användas eller sparas.