Skapa en Index-sida

Nu ska jag skapa några vanligt förekommande exempelsidor för min påhittade fotograf, Frida Larsson. Till att börja med: startsidan.

Jag nämnde "Index-sidor" tidigare i kursen - långa, scrollbara sidor som består av olika sektioner. Nu ska jag göra just en sådan. Notera dock att alla templates inte har stöd för Index-sidor, och att de ser ut och fungerar lite olika från template till template. Här kan du se vilka templates som stödjer Index-sidor.

Som alltid när jag jobbar med min sajts innehåll så går jag till Pages-menyn från huvudmenyn. Jag klickar på +-symbolen intill Main Navigation för att skapa en ny sida, och i rutan som kommer upp väljer jag Index:

Jag döper min Index-sida till "Hem" och sen har jag som en tom "mapp" i navigationsmenyn, och en tom sida till höger:

Nu kan jag skapa vanliga sidor som jag gjort förut, men om jag placerar dem under Index så blir de en "sektion", alltså en del av Index-sidan.

Jag skapar en första sektion på min startsida. Eftersom att den här sektionen ligger högst upp så kommer den agera sidhuvud (header) och vara det första en besökare ser. Jag döper därför sektionen till "Välkommen". Jag väljer sen en av Squarespaces mallar för att skapa en tillfällig "Om mig"-sektion på sidan:

Klickar på "Start editing" och redigerar sidans Settings:

Notera att jag nu använder "Description"-rutan för att skapa en rubrik (fetstil), text (normal text) och knapp (länkad text) för att skapa dessa element i headern på sidan. När jag i nästa steg lägger in en "Banner"-bild under Mediafliken så är det mot den bilden som min rubrik, text och knapp kommer ligga. Så här ser ut när jag är klar:

Jag går vidare med att skapa fler sektioner i min Index. En om de olika fotograftjänsterna, en med ett urval ur portfolion, en med referenser från tidigare kunder och slutligen ett kontaktformulär.

Det behövs inte, men jag väljer att lägga in banner-bilder även på undersektionerna i min Index för att bryta av lite från allt det vita. När jag lägger in bannerbilder på Index-sektioner i det här templatet så fungerar det på samma sätt som med fristående sidor: Jag kan skapa en rubrik, text och knapp med hjälp av sidans Description-fält. Jag väljer att bara sätta en rubrik ovanpå resterande banners:

Jag pysslar vidare med att skapa sektioner, lägga in rubriker och banner-bilder och placera tillfälliga mallar på sidorna som jag senare kan ändra i. Såhär ser det ut när jag är klar:

Screen Shot 2017-11-09 at 15.00.49.png
Screen Shot 2017-11-09 at 15.51.00 (1).png
Screen Shot 2017-11-09 at 15.51.24.png
Screen Shot 2017-11-09 at 15.51.40.png