Page Comparison

Så här gör du

I det här exemplet beskrivs hur du använder Layout builder på en befintlig genomgångssida och hur du lägger till komponenterna "Textruta" och komponenten "Video" i tvåspaltssektion.

1. När du står på din sida, klicka på "Layout" i raden med flikar.
   Image Modified
   
   
2. Lägg till sektion
   Nedanför de fasta fälten har du möjlighet att skapa din layout genom att först lägga till vad som kallas sektioner. 
   1. Klicka på länken "Lägg till sektion" längst ner till höger på sidan eller använd den förvalda "två-spalt sektionen" på sidan.
      Image Modified
      
3. Sektionstyp
   Du får nu möjlighet att välja hur många spalter sektionen ska ha genom att klicka på någon av de olika layouterna till höger på sidan.
   1. "Två-spalt" (tre val).
   2. "Tre-spalt".
   3. "En-spalt".
   4. "Fullbredd".
      
      Image Modified
      
      
4. Konfigurera sektion
   Ange sektionsrubrik, bakgrundsfärg (Ingen eller grå) och om det ska finnas marginal till ovanliggande sektion. Det gäller för alla sektioner utom typen "Fullbredd" som inte har några inställningar.
   1. Klicka på den blå knappen "Lägg till sektion".
      
      Image Modified
      
      
5. Fyll sektionen med innehåll och lägg till komponent
   Den sektion du precis lade till kan du nu börja fylla med innehåll.
   Klicka på länken "Lägg till komponent" som ligger till vänster i två-spalten.
   
   
   
   1. Välj komponent
      I det här exemplet väljer vi att lägga till komponenten "Textruta" i listan till höger. Klicka på länken "Textruta".
      
      
      
      
   2. Konfigurera komponent
      Fyll i text i den rutan som dyker upp och klicka på den blå knappen "Lägg till komponent" för att spara.
      
      
6. Lägg nu till innehåll i den högra spalten i två-spalten. Klicka  på länken "Lägg till komponent".
   
   
   
   
   1. Välj komponent
      I det här exemplet väljer vi att lägga till komponenten "Video". Klicka på länken "Video".
      
      Image Modified
      
      
   2. Konfigurera komponent
      
      1. Titel
         Ange videons  namn/rubrik i fältet"Titel", obligatoriskt. Denna text kommer att placeras i filmens underkant.
      2. Video URL
         Ange URL till videon genom att klistra in adressen i fältet "Video URL" (obligatoriskt).
      3. Video längd
         Ange videons längd i formatet m:s (minuter och sekunder) eller t:m:s (timmar, minuter och sekunder) i fältet "Video längd".
      4. Video omslag
         Lägg till en bild som skall fungera som omslagsbild för video innan den spelas i fältet "Video omslag" (obligatoriskt). Klicka på den grå knappen "Öppna bildbibliotek.
      5. Lägg till komponent
         Klicka på den blå knappen "Lägg till komponent"
         
         Image Modified
         
7. Publicera sedan ändringarna på sidan genom att välja "Publicerad" och klicka därefter på den blå knappen "Spara ändringar".
   
   Image Modified
   
   
   
   
8. Komponenten "Bild"
   Välj komponenten "Bild".
   1. Klicka på "Öppna bildbibliotek".
   2. Välj bild från biblioteket, markera bild och klicka på "Välj bilder".
   3. Ange alternativ text (obligatorisk text). Bilder som enbart har en dekorativ funktion eller inte är meningsbärande ska inte ha en alt-text.
      
   4. Klicka på "Lägg till komponent".
9. Komponenten "Puff - extern (länk)"
   Välj komponenten "Puff - extern (länk)" - fyll i rubrik i fältet "Titel" och länkadress i fältet "Länk". Klicka på "Lägg till komponent".
   1. Du kan också välja att:
   2. lägga till en etikett i fältet "Etikett/Kategori", för att hjälpa besökaren.
   3. skriva en kortare sammanfattning i fältet "Ingress".
   4. lägga till en bild som visas för puffen genom att klicka på "Öppna bildbibliotek".
      OBS: När man nu lägger in en URL ifrån ett sökresultat i en extern puff ska den inte ha ikonen som visar att man lämnar webben. 
      Image Modified
      För att den interna länkningen på en puff (en pil) ska fungera så tar du bort det som är överstruket i denna url https://www.gu.se/om-universitetet/hitta-person?organisation=Administrativt stöd
      
10. Komponenten "Puff - intern (länk)"
    Välj komponenten "Puff - intern (länk)" - fyll i rubrik i fältet "Titel" och länkadress i fältet "Länk". Klicka på "Lägg till komponent".
    
    1. Du kan också välja att:
    2. lägga till en etikett i fältet "Etikett/Kategori", för att hjälpa besökaren.
    3. skriva en kortare sammanfattning i fältet "Ingress".
    4. lägga till en bild som visas för puffen genom att klicka på "Öppna bildbibliotek".
11. Komponenten "Video"
    Välj komponenten "Video".
    1. Ange videons Title i fältet "Title" (obligatoriskt).
       
    2. Klistra in en länk från t.ex. Youtube, Vimeo eller GU Play i fältet "Video URL" (obligatoriskt).
       
    3. Ange videons längd i fältet "Video längd" (obligatoriskt).
    4. Lägg till en bild som skall fungera som omslagsbild för video innan den spelas i fältet "Video cover".
    5. Klicka på "Lägg till komponent".
12. Komponenten "Textruta"
    Välj komponenten "Textruta".
    1. Lägg in din text i editorn.
    2. Klicka på "Lägg till komponent".
13. Komponenten "Dokument"
    Välj komponenten "Dokument".
    1. Ange rubriken i fältet "Rubrik".
    2. Klicka på "Lägg till dokument".
    3. Klicka på länken "Bläddra bland existerande dokument" för att ange fil eller genom att söka efter existerande fil. 
    4. Klicka i kryssrutan och klicka på knappen "Välj dokument".
    5. Du kan också välja att Ladda upp nytt dokument:
       
       1. Klicka på länken "Ladda upp nytt dokument"
       2. Ange titel i fältet "Titel".
       3. Klicka på knappen "Bläddra..." i fältet "Fil" och leta upp ditt dokument.
       4. Ange ett kort sammandrag som beskriver dokumentet.
       5. Ange "Försättsbild" om du vill lägga till en bild till vänster om dokumentlänken.
14. Komponenten "Länklista"
    Välj komponenten "Länklista".
    
    1. Ange länklistans rubrik i fältet "Rubrik"
    2. Ange länk till sidan i fältet "URL" och länktext i fältet "Länktext".
    3. Klicka på knappen "Lägg till ytterligare alternativ" för att lägga till fler länkar.
    4. Länkordning ändras genom knappen "Visa radernas vikt".
15. Komponenten "Editor" (denna komponent kan bara användas på informationssidor och i den vänstra sektionen)
    Välj komponenten "Editor".
    
    1. Lägg in din text i editorn.
    2. Klicka på "Lägg till komponent".
16. Komponenten "Dragspel"
    Välj komponenten "Dragspel".
    
    1. Ange rubrik och rubriknivå (H2-H4) för dragspelet i fältet "Rubrik".
    2. Lägg in fakta-text i editorn under "Innehåll".
    3. Klicka på "Lägg till komponent".
    4. Spara dina ändringar via knappen "Spara ändringar".
17. Komponenten "Faktaruta"
    Välj komponenten "Faktaruta". 
    1. Ange titel i fältet "Titel".
    2. Lägg in fakta-text i editorn i fältet "Fakta".
    3. Klicka på "Lägg till komponent".
       
       OBS! Tänk på att du måste fylla i både "Titel" och faktatext i fältet "Fakta" för att rutan ska synas.
       
       
18. Komponenten "Textruta"
    Välj komponenten "Textruta".
    
    1. Lägg in fakta-text i editorn.
    2. Klicka på "Lägg till komponent".
19. Glöm inte att spara ändringar.
    Image Modified