---
title: "Personalizzare le icone del menu di navigazione"
description: "Quando si imposta la modalità di navigazione, è possibile mostrare le icone nel menu.  Queste icone possono essere visualizzate negli shortcuts o nella navigazi"
canonical_url: "https://it.goodbarber.com/help/shop/personalizzare-la-navigazione-la-home-e-l-header-r88/personalizzare-le-icone-del-menu-di-navigazione-a167/"
lang: it
---

# Personalizzare le icone del menu di navigazione

Source: https://it.goodbarber.com/help/shop/personalizzare-la-navigazione-la-home-e-l-header-r88/personalizzare-le-icone-del-menu-di-navigazione-a167/

Quando si imposta la [modalità di navigazione](https://it.goodbarber.com/help/shop/personalizzare-la-navigazione-la-home-e-l-header-r88/configurare-e-personalizzare-il-design-del-menu-di-navigazione-a251/) , è possibile mostrare le icone nel menu.
Queste icone possono essere visualizzate negli shortcuts o nella navigazione principale, a seconda del tipo di menu scelto.

Per impostare il tuo menu di navigazione:
1. Fai clic su **La mia app > Struttura > Menu**
2. Fare clic **sull'icona** che si desidera modificare, il blocco si dispiegherá
3. Fai clic su "**Modifica l'icona**":

![](https://cmsphoto.ww-cdn.com/superstatic/1878436/art/default/34457511-31501318.jpg?v=1774274944.9057002)

A questo punto hai diverse opzioni:

- Scegli tra le **icone predefinite** fornite da GoodBarber nella scheda “**Collezioni**”.

oppure

- Importa **la tua icona/immagine** nel back office dalla scheda “**Icone personali**”.

## 1. Icone di default

Nelle schede della raccolta sono disponibili diversi set di icone, oltre a vari stili di icone.
Nella raccolta Material Icons è presente anche una barra di ricerca che ti aiuta a trovare le icone più facilmente.

1. Imposta la dimensione dell'anteprima* (16, 32 o 64) per regolare la modalità di visualizzazione delle icone.
2. Seleziona l'icona che preferisci: sostituirà automaticamente quella attuale.

*La dimensione dell'anteprima influisce solo sulla visualizzazione delle icone nel back office. Non influisce sulle loro dimensioni effettive nell'app.

![](https://cmsphoto.ww-cdn.com/superstatic/1878436/art/default/34457511-31501320.jpg?v=1774274944.9257004)

## 2. Icone personali

1. Clicca sulla scheda "**Icone personali**"
2. Seleziona "**Icona**"
3. Clicca su "**Sfoglia**" per caricare la tua icona

⚠️ Per garantire che la tua icona si adatti correttamente al design della tua app (colori e texture), deve rispettare rigorosamente i seguenti requisiti:
- **Formato**: .png
- **Dimensioni**: 260 × 260 px
- **Colore: solo bianco al 100% (#FFFFFF)**
*(nessun altro colore, sfumatura o variazione di trasparenza, nemmeno per un singolo pixel)*
- **Sfondo**: trasparente Se questi requisiti non vengono rispettati, l'icona non si adatterà ai colori definiti nel design della tua app.

Una volta caricate, le tue icone appariranno qui sotto nella sezione **Collezione personale**.

![](https://cmsphoto.ww-cdn.com/superstatic/1878436/art/default/34457511-31501321.jpg?v=1774274944.9297004)

## 3. Immagini personali

L'opzione "Immagine" consente di caricare **immagini a colori**.
1. Clicca sulla scheda "**Icone personali**"
2. Seleziona "**Immagine**"
3. Clicca su "**Sfoglia**" per caricare la tua icona

⚠️ Per garantire che la tua icona si adatti correttamente al design della tua app (colori e texture), deve soddisfare rigorosamente i seguenti requisiti:
- **Formato**: .png
- **Dimensioni**: 260 × 260 px

Una volta caricate, le tue icone appariranno in basso nella sezione **Collezione personale**

![](https://cmsphoto.ww-cdn.com/superstatic/1878436/art/default/34457511-31501322.jpg?v=1774274944.9377005)