La presente guida fornisce le istruzioni per l’integrazione, la gestione e la personalizzazione del componente menu orizzontale all’interno della piattaforma SuperSite.
1. Introduzione e Inserimento del Componente
L'aggiunta del menu orizzontale all'interno del progetto web avviene attraverso l'interfaccia di editing drag-and-drop. Per procedere all'inserimento, è necessario seguire i passaggi descritti di seguito:
- Accedere alla barra degli elementi situata sul lato sinistro della schermata di lavoro
- Selezionare la categoria denominata Menu
- Individuare l'opzione Orizzontale
- Scegliere la variante desiderata e trascinare l'elemento nell'area di lavoro del sito
Per attivare le funzionalità di configurazione, occorre cliccare con il tasto sinistro del mouse sul componente inserito e selezionare la voce Modifica menu dal menu contestuale.
2. Gestione della Struttura e dei Collegamenti
La modalità di modifica consente di definire l’alberatura del menu e la natura dei collegamenti. L’aggiunta di nuove pagine avviene tramite l’icona + o del comando dedicato, che permette anche la ridenominazione delle voci. L’accesso alla gerarchia dei sottomenu richiede un doppio clic sulla voce principale corrispondente. Da questa sezione è possibile configurare collegamenti di vario tipo:
- Pagina specifica: reindirizzamento ad una pagina interna al sito
- Sito web esterno: collegamento ad un URL esterno
- Ancora interna: puntamento ad una sezione della pagina corrente
- Pop-up: attivazione di una finestra a comparsa al clic
- File scaricabile: collegamento diretto per il download di un documento
Ogni modifica ai collegamenti deve essere confermata e salvata per garantire il corretto funzionamento lato utente.
3. Personalizzazione Estetica e Animazioni
In seguito alla selezione del comando Modifica menu, viene resa disponibile un'interfaccia di configurazione dotata di icone specifiche per la gestione del design e del comportamento visivo del componente:
- Animazioni (Icona Stella): permette di definire lo stile di ingresso e interazione del menu attraverso una selezione di animazioni predefinite
- Spaziatura (Icona Freccia): consente di regolare le dimensioni dell'area cliccabile dei pulsanti e la distanza intercorrente tra i vari elementi del menu
- Colori (Icona Colori): dedicata alla modifica cromatica del testo dei pulsanti e del background del sottomenu
- Stile del Testo (Icona Stile): offre parametri per la scelta del carattere (font), della dimensione del testo e della spaziatura tra i singoli caratteri
4. Configurazione Avanzata del Sottomenu
Il sistema permette di scegliere la modalità di visualizzazione dei contenuti nidificati, selezionando tra Stile Classico o Stile Personalizzato. Con lo Stile Personalizzato è possibile gestire in modo modulare voci di menu, titoli testuali ed immagini, posizionandoli liberamente e rinominandoli. In questa modalità, i parametri configurabili comprendono i seguenti parametri:
- Dimensione: opzione tra visualizzazione centrata o a schermo intero
- Sfondo: selezione del colore di riempimento
- Voci e Titoli: impostazione indipendente di dimensione e colore per ciascuna tipologia di testo
- Distanza: regolazione dello spazio tra i pulsanti
5. Impostazioni di Layout e Rifiniture Avanzate
Attraverso l’icona Avanzate (rappresentata da un ingranaggio) è possibile accedere ad ulteriori regolazioni strutturali, ottimizzando ed allineamento i dettagli grafici del menu. Tra le opzioni disponibili vi sono:
- Divisori: inserimento di elementi di separazione tra le voci, con personalizzazione di colore e dimensione
- Bordi: funzione dedicata all'arrotondamento degli angoli del componente
- Orientamento: Permette di commutare il layout del menu da orizzontale a verticale
- Allineamento: Gestione del posizionamento delle voci (allineamento a sinistra, al centro o a destra)