Documentazione Gantry 5 per Joomla!

Concetti fondamentali per iniziare con un template framework di nuova generazione.

Il pannello Menu Editor di Gantry Admin è quel posto dove è possibile configurare e migliorare i menu utilizzati sul front-end del sito.

Anteprima menu editorQuesto non sostituisce completamente il Menu Manager fornito dalla piattaforma, ma ti dà la possibilità di aggiungere rapidamente e facilmente degli elementi, come ad esempio le particelle in-line, per fornire un esperienza migliore agli utenti. Il pannello amministrativo Menu Editor prende ciò che fornice la Gestione Menu del CMS e vi permette di fare l'override su questo. Le modifiche apportate in questo pannello non influiscono il modo in cui il CMS gestisce le voci di menu.

Questo pannello è un pannello Globale, il che significa che non è specifico a nessun Outline. E 'per questo che le modifiche apportate qui influenzeranno tutte le istanze di un particolare menù come appare in qualsiasi Outline.

Selezionare un Menu

La prima cosa che si deve fare è selezionare il menu che si desidera modificare. Questa cosa si può realizzare utilizzando il menu a discesa situato vicino alla parte superiore del pannello amministrativo Menu Editor.
Selezionare un menu

Questi menu provengono da Gestione Menu del CMS. Se si desidera creare un nuovo menu, è necessario farlo utilizzando il Menu Manager di Joomla. Una volta fatto questo, è sufficiente selezionarlo dal menu a discesa, e il suo contenuto verrà caricato e sarà disponibile per le modifiche.

ATTENZIONE

Se si desidera cambiare il menu che viene caricato in una particella Menu Particle in front-end, è necessario configurare questo nelle impostazioni della Particella Menu.

Configurazione Menu

Il menu ha un icona Impostazioni sul lato destro (a forma di rotellina), che vi dà la possibilità di accedere alle impostazioni che riguardano il menù nel suo complesso. Queste impostazioni possono differire tra i CMS (Joomla, WordPress, GRAV).

Un'impostazione comune è il Base Path (percorso di base) che definisce il percorso di base con cui il menu viene interpretato. Ad esempio, se si desidera che il menu viene interpretato in front-end dalla sottocartella /blog, piuttosto che dal menu principale come quello fornito del CMS.

Tenete presente che all'interno della particella Menu, si possono fare ulteriormente diverse modifiche, l'impostazione di un percorso di base, così come il livello di avvio e quello di fine, che sono utili quando si crea un menu diviso.

Configurazione della voce di menu

Configurazione voce di menu
Ogni voce di menu ha una serie di impostazioni che possono essere configurate per soddisfare le vostre esigenze. Queste impostazioni possono variare leggermente tra i CMS, ma in sostanza hanno le stesse funzioni di base. È possibile attivare le Configurazioni di elemento menu selezionando l'icona a forma di rotellina sul lato destro della voce di menu.

Ecco qui un'elenco di queste impostazioni con una breve spiegazione.
Configurazione voce di menu Descrizione
ID voce di menu Questo è l'ID specifico alla voce di menu
Tipo voce di menu Imposta il tipo di voce di menu, controllando il comportamento e il ruolo che essa svolge nel menu
Link Il collegamento (relativo o assoluto) dove l'utente viene indirizzato
Append Hash Aggiungere un ancora alla voce di menu.
Link target Imposta la finestra di destinazione per il link. È possibile impostare di aprire il link in una nuova finestra, o in quello attuale
Dropdown Style Imposta lo stile di discesa per gli elementi di sottomenu che appaiono in questa particolare voce di menu
Dropdown Direction Imposta la direzione del menu dropdown (sinistra, destra o centrato)
Disable Dropdowns Casella di selezione se si desidera disabilitare la discesa del menu.
Dropdown Width Imposta la larghezza del menu
CSS Classes Permette di assegnare una o più classi CSS alla voce di menu.
Icon Creata da FontAwesome, questa funzione vi dà la possibilità di aggiungere un icona vettoriale per la voce di menu
Image Permette di assegnare un'immagine alla voce di menu
Icon Only Casella di selezione se si desidera far comparire soltanto l'icona.
Subtitle Consente di inserire un testo sottotitolo, visualizzato sotto il titolo voce di menu

Dopo aver effettuato le impostazioni desiderate, è sufficiente selezionare Apply and Save per salvare le modifiche e chiudere quindi la finestra pop-up.

Queste impostazioni espandono le capacità del menu integrato nel CMS, migliorandolo con ulteriori opzioni di funzionalità e di personalizzazione - ma solo nei casi in cui il CMS non fornisce già queste funzionalità e modificando queste opzioni non influiscono in negativo la funzionalità del menù.
Ad esempio, in Joomla, l'ID Voce di Menu, Tipo Voce di Menu, e il Link sono forniti dal CMS. Anche le immagini sono abbinabili alla voce di menu direttamente in joomla, ma effetuando l'ovverride di queste in Menu Editor si realizza un cambiamento visivo piuttosto che uno funzionale, così si possono modificare queste impostazioni senza problemi.

Tipi di voci di menu

Nel Menu Editor ci sono sei tipi di voci di menu. Ecco qui un elenco con cinque di questi tipi, e il ruolo che questi svolgono.
Tipo voce di menu Descrizione
Link Un link reindirizza l'utente ad un collegamento interno all'interno del sito
Alias Un alias punta ad un'altra voce di menu
URL esterno Questo tipo di voce di menu punta direttamente ad un URL esterno
Separator Voce di menu non cliccabile che ha un nome, di solito utilizzata per i menu di primo livello che contengono una o più voci di menu.
Heading Voce di menu non cliccabile che contiene solo testo.

Il sesto tipo di voce di menu, che viene aggiunto e configurato nel Menu Editor è Particella. Questo vi permetterà di fare cose come ad esempio creare un blocco di informazioni che appaiono nel menu.
Nei casi in cui il tipo di voce di menu è fornito dal CMS, questa potrebbe non essere modificabile tramite il Menu Editor in quanto sarebbe in conflitto con le impostazioni del CMS.

Iniezione Modulo/Widget

L'iniezione dei moduli nel menu è molto facile da realizzare con il Menu Editor. Sopra il menu ci sono 2 pulsanti. Uno chiamato Module e altro Particle. Per inserire un modulo nel menu si deve cliccare sul pulsante Module e trascinarlo sul menu. Si aprirà una finestra popup che consente di scegliere tra i moduli esistenti quello che si desidera far comparire nel menu.
Inserisci un modulo Questo popup contiene molte informazioni utili per aiutarvi a trovare il modulo desiderato. Una barra di ricerca nella parte superiore vi permette di filtrare la ricerca, mentre i pulsanti dei moduli stessi forniscono informazioni sul nome del modulo, la pubblicazione, il tipo e la posizione assegnata.
Non è necessario assegnare dei moduli a delle posizioni per farli funzionare nel menu. Aggiungendo un modulo utilizzando il Menu Editor, il modulo viene visualizzato in frontend come se fosse assegnato ad una posizione esistente all'interno del menu.
Tuttavia, è necessario assicurarsi che il modulo sia assegnato su tutte o solo in alcune pagine tramite le impostazioni di assegnazioni di menu del modulo, altrimenti il modulo non può essere visualizzato.

Esempio pratico

In questo esempio vogliamo aggiungere il modulo CERCA tra le voci di menu. Dobbiamo accorgerci che esiste il modulo CERCA tra i moduli esistenti, altrimenti dobbiamo crearlo tramite Estensioni > Moduli > Nuovo e selezionare il tipo di modulo CERCA.
Non è necessario avere il modulo assegnato ad una posizione specifica.

esempio pratico cerca

Poi, dal Menu Editor di Gantry, fare clic e trascinare il modulo CERCA sul menu dove si desidera farlo comparire. È sempre possibile regolare il suo posizionamento successivamente cliccando sul modulo e trascinandolo sinistra/destra.
popup inserimento modulo

A questo punto, è possibile perfezionare ulteriormente questo modulo in una finestra pop-up che appare, pop-up che vi permette di configurare i parametri Module ID e Chrome.
È inoltre possibile di accedere alle stesse impostazioni del Blocco che si trovano nelle Particelle, comprese le classi CSS e gli attributi Tag.

anteprima cerca sul menu
Dopo aver configurato il modulo e dopo aver impostato lo stile desiderato cliccare su SALVA e il gioco e fatto.

Iniezione di una Particella

L'iniezione delle Particelle è possibile farla tramite il Menu Editor di Gantry, consentendo così di aggiungere qualsiasi Particella al menu con la stessa semplicità dell'utilizzo del Layout Manager.
Il primo passo consiste in un clic sul pulsante Particle e trascinandolo al menu in cui si desidera che questa appaia. Come qualsiasi voce di menu, la sua posizione può essere modificata in qualsiasi momento cliccando sopra e trascinando nella posizione desiderata.

Selezionare una particella

Il pop-up che appare consente di cercare e di selezionare una particella da utilizzare nel menu. Basta cliccare sul nome della particella e selezionarla.

Particella Data

Da qui, compare un pop-up con le stesse impostazioni della particella che si visualizza in Layout Manager così come nel pannello di amministrazione delle impostazioni del Outline. In questo esempio, stiamo aggiungendo una particella Data che visualizza la data corrente.

Menu personalizzato con Data e Cerca