---
title: "Så här utformar du dina sektioner | Självstudiekurser - GoodBarber"
description: "Hej och välkommen till din nya GoodBarber-tutorial! \r Idag ska vi lära oss hur man ställer in designen för sektionerna i din app.\r \r Varje typ av sektion har sina egna designegenskaper, men processen…"
canonical_url: "https://se.goodbarber.com/tutorials/design/sa-har-utformar-du-dina-sektioner/"
lang: sv
---

# Så här utformar du dina sektioner | Självstudiekurser - GoodBarber

[Tillbaka](https://se.goodbarber.com/tutorials/)

# Så här utformar du dina sektioner

Hej och välkommen till din nya GoodBarber-tutorial!
Idag ska vi lära oss hur man ställer in designen för sektionerna i din app.

Varje typ av sektion har sina egna designegenskaper, men processen för att ställa in dem är alltid densamma.

För att designa en sektion går vi till Min app > Design > Sektionsdesign.

I det här exemplet väljer vi att designa ett artikelavsnitt i min app för lokala nyheter.
Som du ser här erbjuder artikelavsnittet två sidor att konfigurera. Sidan med artikellistan och sidan med artikeldetaljer.

Låt oss börja med artikellistan.

Det första du ska göra här är att välja mellan de föreslagna visningsmallarna. Du kan se ändringarna live på förhandsgranskningen i backoffice.

Vi kommer att välja mall 2.

Sedan ställer vi in utformningen av innehållszonen

Färgen på bakgrunden och kanterna.

Den information vi visar i listan.

Teckensnitt och teckensnittsfärger för de olika elementen.

Slutligen formatet på miniatyrbilden.

Det är det, det är redan gjort!

Här är listan över artiklar helt utformad!

Jag kommer snabbt att göra detsamma för sidan med artikeldetaljer.

Och voila!

Nu är det upp till dig!

Vi ses snart för en ny tutorial!

## Relaterade videor

[DesignSå här ställer du in din rubrik](/tutorials/design/sa-har-staller-du-in-din-rubrik/)

![Så här ställer du in din rubrik](https://portal.ww-cdn.com/portal_static/images/videos1.c14acaebb684.jpg)

[DesignSå här ställer du in den globala stilen för din app](/tutorials/design/sa-har-staller-du-in-den-globala-stilen-for-din-app/)

![Så här ställer du in den globala stilen för din app](https://portal.ww-cdn.com/portal_static/images/videos2.7fa910b14581.jpg)

[DesignSå här anpassar du stänkskärmen i din app](/tutorials/design/sa-har-anpassar-du-stankskarmen-i-din-app/)

![Så här anpassar du stänkskärmen i din app](https://portal.ww-cdn.com/portal_static/images/videos3.667f4857c54e.jpg)

[DesignSå här ställer du in navigeringsläget för din app](/tutorials/design/sa-har-staller-du-in-navigeringslaget-for-din-app/)

![Så här ställer du in navigeringsläget för din app](https://portal.ww-cdn.com/portal_static/images/videos4.e9c3404b35cf.jpg)

[DesignSå här anpassar du ikonerna i din meny](/tutorials/design/sa-har-anpassar-du-ikonerna-i-din-meny/)

![Så här anpassar du ikonerna i din meny](https://portal.ww-cdn.com/portal_static/images/videos5.a023e3a7a47c.jpg)

[DesignHur man kopierar designen av ett avsnitt](/tutorials/design/hur-man-kopierar-designen-av-ett-avsnitt/)

![Hur man kopierar designen av ett avsnitt](https://portal.ww-cdn.com/portal_static/images/videos7.8952466a8027.jpg)

[DesignSå här ställer du in din startsida](/tutorials/design/sa-har-staller-du-in-din-startsida/)

![Så här ställer du in din startsida](https://portal.ww-cdn.com/portal_static/images/videos9.49f835842cd5.jpg)

[DesignHur väljer man rubrikstorlek?](/tutorials/design/hur-valjer-man-rubrikstorlek/)

![Hur väljer man rubrikstorlek?](https://portal.ww-cdn.com/portal_static/images/videos_design_header.a341dbbe5c74.jpg)

[DesignSå här anpassar du bakgrunden i din app](/tutorials/design/sa-har-anpassar-du-bakgrunden-i-din-app/)

![Så här anpassar du bakgrunden i din app](https://portal.ww-cdn.com/portal_static/images/thumbnail_background.01a5a9e37ad2.jpg)