---
title: "Come personalizzare le icone del menu | App eCommerce - Tutorial - GoodBarber"
description: "Oggi impareremo come cambiare le icone del tuo menu di navigazione.\r \r Se non hai ancora selezionato il tuo modello di navigazione, puoi guardare il video che ho aggiunto nella barra informativa.\r \r …"
canonical_url: "https://it.goodbarber.com/tutorials/shop/design/come-personalizzare-le-icone-del-menu/"
lang: it
---

# Come personalizzare le icone del menu | App eCommerce - Tutorial - GoodBarber

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

# Come personalizzare le icone del menu

Oggi impareremo come cambiare le icone del tuo menu di navigazione.

Se non hai ancora selezionato il tuo modello di navigazione, puoi guardare il video che ho aggiunto nella barra informativa.

Se hai selezionato la navigazione, swipe, Little Swipe, TabBar o Grid, allora questo tutorial è per te.
In queste modalità di navigazione, le sezioni della tua app sono rappresentate da icone personalizzabili.

Lascia che ti mostri come.

Vai al menu La mia app> Design, menu di navigazione

Apri la modalità di navigazione che hai selezionato, per me Swipe
Con lo Swipe, le icone non sono obbligatorie ma puoi attivarle qui: menu impostazioni, vedi che basta attivare l'opzione.
Ora torniamo al menu Layout:
Clicca sull'icona della sezione che vuoi personalizzare, poi modifica l'icona.

Ho ora 2 possibilità/: o uso 1 delle 150 icone offerte da Goodbarber

Oppure carico un'icona personalizzata

Per farlo vado nel menu Icone personali

Se selezioni l'opzione Icona, devi caricare un'immagine bianca su sfondo trasparente, poiché potrai applicare i colori del tuo tema a questa icona.

Nel mio caso, sceglierò dalla libreria di icone GoodBArber
voilà!

Cambio rapidamente le icone delle altre sezioni. Tutto fatto!
Per cambiare il colore delle icone, vai nel menu delle impostazioni, colore delle icone e voilà!

Puoi evidenziare una sezione del tuo menu usando un colore diverso per l'icona. Per farlo vai al menu layout, seleziona la sezione che vuoi evidenziare e attiva l'opzione "feature this link" . ora hai molte più opzioni. Tutto quello che ti serve è selezionare i colori della tua icona. Tutto fatto!

Guarda il risultato finale.
Ora sai come personalizzare le icone del tuo menu di navigazione.
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 impostare l'home page della tua app](/tutorials/shop/design/come-impostare-lhome-page-della-tua-app/)

![Come impostare l'home page della tua app](https://portal.ww-cdn.com/portal_static/images/videos_shop13.e1aed198d25d.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)