---
title: "Come impostare l'home page della tua app | App eCommerce - Tutorial - GoodBarber"
description: "Oggi impareremo come impostare la Home del tuo negozio\r \r La Home è la prima pagina che i tuoi utenti vedranno quando apriranno la tua app\r \r In questa pagina, puoi trovare una navigazione sec…"
canonical_url: "https://it.goodbarber.com/tutorials/shop/design/come-impostare-lhome-page-della-tua-app/"
lang: it
---

# Come impostare l'home page della tua app | App eCommerce - Tutorial - GoodBarber

[Indietro](https://it.goodbarber.com/tutorials/shop/)

# Come impostare l'home page della tua app

Oggi impareremo come impostare la Home del tuo negozio

La Home è la prima pagina che i tuoi utenti vedranno quando apriranno la tua app

In questa pagina, puoi trovare una navigazione secondaria per completare la tua navigazione principale

Cominciamo andando nel menu Content & Design, e poi Home

La tua Home è composta da diversi moduli chiamati widget
Ci sono diversi tipi di widget
Elenco di prodotti
Elenco delle collezioni
Ricerca
Banner promozionale
Newsletter
Link
Avvisi legali
Media sociali
Separatori
HTML

Attenzione, la maggior parte dei widget sono scorciatoie per le sezioni esistenti. Appariranno solo se hai già aggiunto la sezione al tuo negozio. Per esempio, se non hai una sezione Ricerca nel tuo negozio, il widget di ricerca non sarà disponibile.

Puoi trovare i video di ogni sezione nella barra delle informazioni

Per iniziare aggiungiamo il widget elenco prodotti
Seleziono la sezione o le sezioni relative

Widget aggiunto
Ora lo modifico

Seleziono un modello

Visualizzazione del titolo e tutti gli elementi di design

I prodotti visualizzati qui saranno ordinati per tag (il link al video dei tag è nella barra delle informazioni)
In questo caso, visualizzerò solo i prodotti di colore chiaro

Tutto fatto
Seleziono il numero di prodotti da visualizzare
I margini

Il formato delle miniature

E voilà

Ora creo il widget Ricerca
Stesso principio. Aggiungere e poi modificare il widget

Ok, vedi il widget c'è ma io preferisco averlo in cima alla pagina

Basta trascinarlo nella posizione desiderata, così

Ora un widget Promo banner

Altri widget per l'elenco dei prodotti

Un widget newsletter per creare la mia base di email

Un widget dei social media per visualizzare tutti i miei link

E infine gli avvisi legali

Voilà, tutto fatto

La home ti dà un sacco di possibilità, soprattutto con i widget dei link, per visualizzare i collegamenti alle tue diverse sezioni ma anche le azioni (chiamate, email, testo) e anche i link esterni. E il widget HTML che puoi totalmente personalizzare.

Lascia che ti mostri la versione finale della mia Home

Ora tocca alla tua Home! A presto per un altro tutorial!

## Video simili

[DesignCome impostare il tuo menu di navigazione](/tutorials/shop/design/come-impostare-il-tuo-menu-di-navigazione/)

![Come impostare il tuo menu di navigazione](https://portal.ww-cdn.com/portal_static/images/videos_shop11.4f7dad94042e.jpg)

[DesignCome personalizzare le icone del menu](/tutorials/shop/design/come-personalizzare-le-icone-del-menu/)

![Come personalizzare le icone del menu](https://portal.ww-cdn.com/portal_static/images/videos_shop12.6eeb6d5a859c.jpg)

[DesignCome personalizzare il tuo splashscreen](/tutorials/shop/design/come-personalizzare-il-tuo-splashscreen/)

![Come personalizzare il tuo splashscreen](https://portal.ww-cdn.com/portal_static/images/videos_shop14.5ba4ff60f4e0.jpg)

[DesignCome impostare l'header del tuo negozio](/tutorials/shop/design/come-impostare-lheader-del-tuo-negozio/)

![Come impostare l'header del tuo negozio](https://portal.ww-cdn.com/portal_static/images/videos_shop15.1e15b7c0b749.jpg)

[DesignCome impostare lo stile globale del tuo negozio](/tutorials/shop/design/come-impostare-lo-stile-globale-del-tuo-negozio/)

![Come impostare lo stile globale del tuo negozio](https://portal.ww-cdn.com/portal_static/images/videos_shop16.60bbdddf3a84.jpg)

[DesignCome personalizzare le icone principali del tuo negozio](/tutorials/shop/design/come-personalizzare-le-icone-principali-del-tuo-negozio/)

![Come personalizzare le icone principali del tuo negozio](https://portal.ww-cdn.com/portal_static/images/videos_shop17.5fb60f1ec20f.jpg)

[DesignCome impostare il design delle sezioni del tuo negozio](/tutorials/shop/design/come-impostare-il-design-delle-sezioni-del-tuo-negozio/)

![Come impostare il design delle sezioni del tuo negozio](https://portal.ww-cdn.com/portal_static/images/videos_shop18.471e5731e7e3.jpg)

[DesignCome sganciare il design di una sezione](/tutorials/shop/design/come-sganciare-il-design-di-una-sezione/)

![Come sganciare il design di una sezione](https://portal.ww-cdn.com/portal_static/images/videos_shop19.6bfd3cd7cba1.jpg)

[DesignCome scegliere le dimensioni del tuo header ?](/tutorials/shop/design/come-scegliere-le-dimensioni-del-tuo-header/)

![Come scegliere le dimensioni del tuo header ?](https://portal.ww-cdn.com/portal_static/images/videos_design_header.a341dbbe5c74.jpg)