Grid

Ett grid används för att bygga mallar på webbplatsen. Man kan säga att ett grid är som ett rutnät som innehåller rader och kolumner som fungerar som en mall där vi kan placera in vår design (text, bild m.m) för att den ska bli konsekvent och tydlig.

Man ställer in sitt grid centralt på webbplatsen där man anger bredd, mellanrum mellan kolumner, hur många kolumner som ska användas och om det ska vara centrerat. Sedan använder man gridrader och spalter för att placera ut innehållet.

När man har aktiverat ett grid på webbplatsen kan man använda det när man bygger mallar. Det går också, precis som layouter, att använda på enskilda sidor.

För att lägga till ett grid på en sida/mall så högerklickar man på innehållsytan eller en layout (i detta exempel har innehållsytan namnet "Mittenspalt").

En mall som är uppbyggt med grids innehåller alltid ett eller flera grid. Anledningen till att man använder flera grids i en mall är att ibland kanske man vill att bakgrunden ska vara 100% på vissa delar av sidan.

Gridrad

En gridrad lägger man till för att börja på en ny rad i rutnätet. När man lägger ut en gridrad avslutas allt flöde från raden innan.

För att lägga till en gridrad på en sida/mall så högerklickar man på en innehållsyta/grid/ layout.

Spalt

En spalt lägger man till för att börja på en ny kolumn i rutnätet.

För att lägga till en spalt på en sida/mall så högerklickar man på en innehållsyta/grid/ layout. Man väljer bredd i antal kolumner på en gång. Väljer man fel kan man gå in i efterhand och justera detta genom att högerklicka på spalten och välja Egenskaper -> Grid.

Storlek på en spalt sätts alltså inte i pixlar (exempelvis vänsterspalt 230px) utan anges i hur många kolumner som ska användas (exempelvis 4 av 12 kolumner).

Exempel på grid, gridrad och spalt

Om man har en skiss som ser ut som nedan gör man följande:

1. Markera innehållsytan/layout, högerklicka och välj Lägg till grid (som man har aktiverat på webbplatsen och gett en bredd).

2. Markera grid, högerklicka och välj Lägg till gridrad. Lägg till en bildmodul.

3. Markera grid igen, högerklicka och välj Lägg till gridrad. Markera raden och högerklicka och välj Lägg till spalt -> 8 kolumner. Lägg till en bildmodul. Markera raden igen och högerklicka och välj Lägg till spalt -> 4 kolumner. Lägg till en textmodul.

4. Markera grid igen, högerklicka och välj Lägg till gridrad. Markera raden och högerklicka och välj Lägg till spalt -> 4 kolumner. Lägg till en puff. Markera raden igen och högerklicka och välj Lägg till spalt -> 4 kolumner. Lägg till en puff. Upprepa en gång till.

5. Markera grid igen, högerklicka och välj Lägg till gridrad. Lägg till en sidfot.