Visite: 2292
Template Zhong: variare le dimensioni area instestazione
Riporto il codice che Antonio Polito ha indicato nel gruppo Facebook e che, utilizzando la customizzazione del template, consente di diminuire l'altezza del campo intestazione
/*Titolo*/
body.default-layout #zf--site-titles--skin {
top: .4em !important;
}
body.default-layout #zf--site-titles {
position: relative !important;
top: 0 !important;
}
body.default-layout #zf--site-title, body.default-layout #zf--site-subtitle {
white-space: normal !important;
}
Visite: 2914
L'override del template per la modifica della dimensione del font del template
Il template Zhong, nella versione free, non consente l'utilizzo di font differenti da quelli incorporati e neppure la gestione del font size. È possibile, tuttavia, ricorrere ad una customizzazione del template dal pannello di amministrazione di Zhong inserendo un codice specifico che riportiamo sotto
aprire la tab "Your custom CSS" e incollare il codice CSS:
#zf--main-article h2.item-title {
font-size: 180%;
}
Visite: 4187
Modificare lo sfondo del template
Il template Zhong consente, anche nella sua versione free, di modificare l'aspetto predefinito del sito mediante la personalizzazione di alcuni parametri che consentono di avvicinare l'aspetto delle pagine web ai riferimenti estetici di ciascuno.
Tra le possibilità a disposizione, c'è quella di poter scegliere il colore dello sfondo o di assegnare un'immagine personale come background.
La procedura è molto semplice e la illustriamo negli screenshot che seguono.
Descrizione testuale della procedura
- Da Gestione template, selezionare Zhong
- Selezionare la scheda "Custom Style & colors“
- In “Generic Elements”, individuare "Body Background Image”
- Scegliete “Custom”, selezionate l'immagine e il gioco è fatto...
Ricordiamo a tutti che per maggiori informazioni sulla personalizzazione del template è possibile inviare un quesito nel gruppo Facebook, "PASW: Joomla per le scuole e le PA"
Antonio Todaro
Visite: 5742
La personalizzazione dei moduli con Zhong
-
Il template Zhong consente di personalizzare i moduli mediante l'aggiunta di codici predefiniti disponibili nella guida del template. Gli stili possono essere applicati intervenendo sulla scheda "avanzate" dei moduli e inserendo in "suffisso classe CSS modulo" il codice più adatto; inoltre, è possibile combinare codici differenti per ottenere stili ulteriori. Nell'esempio che riportiamo è possibile notare che allo stile "zf--block-coat--marked-light", che consente di attribuire al modulo una cornice leggera con padding e margini predefiniti, abbiamo aggiunto il codice "zf--menu-container" specifico per i moduli che contengono voci di menu.
Da notare che anche a questa immagine abbiamo aggiunto uno stile per l'allineamento dell'immagine a sinistra e l'attribuzione di angoli smussati. In questo caso è sufficiente aggiungere il codice intervenendo sugli attributi dell'immagine dal comando "Insert/edit Attribute" presente in JCEditor:
e aggiungendo il codice nella scheda "Classes".
Gli "Snippets" per personalizzare voci di menu, immagini o paragrafi sono disponibili al seguente link:
http://www.accessibletemplate.com/demo/gallery/v4/documentation/template-snippets
La personalizzazione dei moduli è invece descritto al seguente link:
http://www.accessibletemplate.com/zhong/v4/updates/manual-upload
Ricordo, inoltre, che il template consente la personalizzazione delle posizioni con stili predefiniti per ciascuna sezione:
Per accedere ai parametri di personalizzazione occorre aprire la scheda del template dal pannello di controllo e, dopo aver selezionato "Custom Modules Style", attribuire alle diverse posizioni dei moduli uno tra gli stili riportati nella figura precedente.
Visite: 2662
Assegnazione moduli e stili
In questo breve articolo spieghiamo ai nostri utenti cosa cambia con l'aggiornamento del template alla Ver. 3.x.
Dal 15 marzo 2015, il modello è stato aggiornato alla versione di Joomla! "3.4.0 Stable [ Ember ] 24-February-2015 23:00 GMT" mentre il template Zhong Framework è stato aggiornato alla versione 3.
Entrambi i processi di aggiornamento sono stati effettuati dal collega Rosario Profeta che ringraziamo per il suo prodigarsi.
L'aggiornamento del template ha comportato una ridefinizione delle posizioni dei moduli e degli stili ad essi assegnati: per ottenere l'effetto visibile nella home page abbiamo assegnato il menu principale alla posizione "Side Menu" e gli ulteriori moduli della colonna a sinistra sono stati riposizionati nella posizione "aside left".
Ricordiamo che è possibile aggiungere menu alle stesse posizioni: in questo caso, il riquadro di stile che abbiamo assegnato al modulo comprenderà entrambi i menu.
In merito agli stili css utilizzati, tramite la scheda "avanzate" di gestione dei moduli abbiamo assegnato i seguenti stili: zf--block-coat--marked-light
I moduli "notizie" ed in "evidenza", assolutamente personalizzabili in termini di contenuto, sono stati posizionati in "main-top-B1 position" e "main-top-B2 position"; anche ad essi è stato assegnato lo stile "marked light".
Rinviamo al sito del produttore del template per maggiori informazioni in merito a personalizzazione e posizione dei moduli di Zhong Framework:
https://www.accessibletemplate.com/demo/gallery/documentation/module-positions
https://www.accessibletemplate.com/demo/gallery/documentation/modules-and-menus-style
Procedure eseguite e descritte da:
Antonio Todaro
16/3/15

















