Finestra Stile delle Righe

Passo 4 - Pagine > Comandi Barra Strumenti e Griglia >

Finestra Stile delle Righe

Previous pageReturn to chapter overviewNext page

Attraverso i comandi di questa finestra, richiamata dal pulsante Stile Righe presente nella barra di strumenti della Griglia di impaginazione proposta nella finestra Creazione della Pagina, si può definire l'aspetto grafico di una Riga, ovvero di una fascia orizzontale occupata da un gruppo di Oggetti posizionati in una Pagina.

La finestra Stile delle Righe propone:

una Griglia che riprende la configurazione della Pagina così come è stata definita nella finestra Creazione della Pagina;
l'elenco delle opzioni disponibili.

E' sufficiente selezionare la Riga sulla quale si intende lavorare e utilizzare le opzioni disponibili per definirne l'aspetto. La Riga selezionata viene colorata di blu e il numero che la contraddistingue viene evidenziato in grassetto.

A fianco di ciascuna Riga viene visualizzato un pallino che può essere pieno o vuoto a seconda del fatto che l'aspetto della Riga sia già stato definito o meno.

E' possibile collegare fra loro più Righe consecutive in modo che siano accomunate dallo stesso aspetto grafico. Può anche accadere che, in conseguenza a come vengono disposti gli Oggetti sulla Griglia o a come vengono ordinati in caso di Sito Responsive, alcune Righe vengano automaticamente unite. Per maggiori informazioni, vedere Come lavorare sull'Aspetto Riga.

Selezionata la Riga o il gruppo di Righe su cui si intende lavorare si può procedere definendo, per prima cosa, il tipo di Sfondo che si vuole impostare scegliendo tra:

Colorato: lo sfondo della Riga viene colorato in tinta unita.

Sfumato: lo sfondo della Riga viene riempito con un gradiente di cui si possono definire i colori di partenza e di fine e la direzione della sfumatura.

Immagine: lo sfondo della Riga viene creato attraverso l'importazione di un'immagine.

Video: come sfondo della Riga viene utilizzato un video.

A seconda del tipo di Sfondo, è possibile agire su diverse opzioni del riquadro Impostazioni. Le opzioni che possono essere disponibili sono:

Colore: specifica il colore da utilizzare come riempimento dello sfondo.
Colore iniziale / Colore finale: specificano i colori di partenza e di arrivo da utilizzare per comporre una sfumatura.
Diffusione: stabilisce se nella sfumatura deve essere predominante il colore iniziale o il colore finale, definendo lo spazio (in %) entro il quale deve avvenire la transizione dal primo al secondo.
Direzione: imposta il tipo di sfumatura che deve essere applicato, scegliendo tra dall'Alto, dal Basso, da Sinistra, da Destra.
File locale su PC: seleziona il file grafico (.JPG, .GIF, .PNG.) relativo all'immagine da utilizzare come sfondo. L'immagine può essere ricercata o all'interno della Libreria online richiamabile attraverso il pulsante o nelle cartelle locali attraverso il pulsante Selezione file.
Disposizione: specifica se l'immagine inserita come sfondo deve essere ripetuta o meno. L'Immagine può essere ripetuta solo in senso orizzontale, solo in senso verticale o in entrambe i sensi, in modo da giungere ad occupare l'intero spazio a disposizione. In più, è possibile fare in modo che l'immagine venga adattata, ovvero ridimensionata in modo da coprire tutto lo sfondo.
Allineamento: specifica come deve essere allineata l'immagine inserita come sfondo rispetto all'area occupata dalla Riga.
Opacità: imposta il grado di opacità del colore/della sfumatura/dell'immagine di sfondo applicato. Per valori tendenti allo 0 diminuisce l'opacità e lo sfondo della Riga diventa più trasparente lasciando vedere lo sfondo della Pagina.
Tipo di video: definisce se per il video da impostare come sfondo della Riga deve essere utilizzato un File locale su PC, un File su Internet o un Video di Youtube.
File locale su PC / File su Internet / URL Video Youtube: proposte in base al Tipo di video selezionato, queste voci consentono di selezionare il file video da importare o di digitare l'indirizzo URL presso il quale il file del video è già disponibile online.
Immagine di anteprima: specifica un'immagine di anteprima da associare al Video. Anche in questo caso l'immagine può essere ricercata o all'interno della Libreria online richiamabile attraverso il pulsante o nelle cartelle locali attraverso il pulsante Selezione file.

L'immagine di anteprima viene visualizzata prima del video e scompare con effetto di dissolvenza solo dopo che questo è stato avviato. Impostare l'immagine di anteprima è, dunque, particolarmente utile per gestire la visualizzazione su dispositivi mobile dove il video non viene mai avviato automaticamente.

Infine, è possibile attivare le seguenti Opzioni:

Estendi alla larghezza della finestra del Browser: l'aspetto definito per la Riga non viene applicato solo per la larghezza corrispondente al contenuto della Pagina ma si estende per tutta la larghezza della finestra del Browser.
Attiva Effetto Parallasse: attiva l'effetto parallasse sulla Riga selezionata. Il parallasse è una tecnica visuale che, attraverso il movimento di immagini a diverse velocità e prospettive, conferisce profondità e ricchezza al design di una Pagina Web, creando un'illusione 3D. Questo effetto rende lo scrolling delle Pagine un'esperienza più coinvolgente per il Visitatore.

Basandosi sul movimento di immagini a diverse velocità, l'effetto parallasse non può essere attivato se come sfondo della Riga viene impostato un colore in tinta unita.

 


Best practice:

-

Come lavorare sull'Stile delle Righe


Approfondimenti:

-

Il Box Model in WebSite X5