Banner

Banner Top Home

I banner attualmente caricati misurano 1760x860 poiché non viene applicato un crop e resize alle foto si consiglia per una resa grafica ottimale di rispettare queste dimensioni e sopratutto di usare immagini tutte delle stesse dimensioni.

E' possibile compilare tutti i campi, se viene inserito un link a una pagina il campo abstract definisce il pulsante, se non viene inserito abstract e c'è un link viene messo un testo generico nel pulsante.

Di default il blocco di testo è allineato a sinistra se si vuole allinearlo a destra inserire nella classe di pagina la classe right.

Banner top pagine
In questo caso si può caricare l'immagine della stessa larghezza del banner home e di altezza almeno pari a 430px

Banner Bottom
Viene utilizzato per creare i layer in sovraimpressione e verrà associato come il banner top ad una pagina

Banner di Loghi
E' un banner di canale visibile in tutto il sito e contiene i loghi dei partners i loghi devono avere dimensione 270x70

Immagini generiche e gallery

L'immagine di pagina ha una dimensione che la fa stare in un riquadro 575x650 senza crop e come da grafica c'è un float naturale a sinistra per cui il testo girerà intorno all'immagine posizionata sul lato sinistro dello schermo, qual'ora nel testo ci sia un elenco l'immagine di quel blocco flotterà a destra poiché gli elenchi puntati non funzionano correttamente con il float naturale.

Immagini dei Trainer
Caricare l'immagine di dimensione proporzionale a 270x330px poiché sulle anteprime verrà effettuato un crop e resize, l'immagine del traine che rispetta queste direttive può essere la stessa sia in home che nella pagina specifica.


Gallery

  • Default -> Le immagini delle gallery hanno dimensione 575x380px con crop e resize il blocco che contiene la gallery di default non deve avere immagine poiché la gallery flotterà con il testi. Per le immagini di questa tipologia di gallery non è prevista decription
  • Special-Gallery -> Per il carousel è necessario inserire al blocco che la contiene la classe special-gallery oltre le 4 immagini si attiva lo scroll per avere questa gallery . Eventuale description associata all'immagine viene posta in sovrimpressione all'immagine con uno sfondo nero trasparente

Gallery di default

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.

Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.

Personalizzazione testi

Elenco di stili applicabili a testi

Le seguenti classi sono applicabili a tutti gli elementi, preferibilmente vanno su tag in linea di tipo: span, a, strong, i.

  • class="evidenza" colora il testo in Arancione
  • class="colore" colora il testo in Rosso
  • class="small" rimpicciolisce il testo
  • class="big" ingrandisce il testo
  • class="center" crea un blocco di testo centrato

Personalizzazione Blocchi

Blocchi da due colonne
Per creare linee da due blocchi classe col_2 su tutti e due i blocchi questa classe mantiene i blocchi due a due.
Per interrompere il float dei blocchi sul blocco prima di andare a capo inserire oltre a col_... la classe stop.
Le eventuali immagini dovranno essere massimo 130x115px.
Questi blocchi sono stati pensati per creare una sorta di pulsanti che consentano di rimandare ad altre pagine, poiché potrebbero essere ripetuti in più pagine per non dare troppa rilevanza al testo e poter inserire un blocco completamente cliccabile bisogna avere le seguenti accortezze:

  • Non compilare il campo titolo e sommario
  • Inserire sul "titolo" ad esempio contatta un consulente il link alla pagina
  • Non inserire nel testo altri link

Esempio di blocchi a due colonne

Contatta un consulenteLorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

Contatta un consulenteLorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.