Personalizza le pagine portfolio e i progetti tuo sito.

Le pagine portfolio sono pagine di destinazione stilizzate che collegano i visitatori ai progetti. Puoi personalizzare le pagine portfolio per adattarle al tuo brand e al tuo stile. Utilizza questa guida per trovare le opzioni di stile per le pagine portfolio e i loro progetti individuali. Per creare una pagina portfolio e aggiungere contenuti, visita Pagine portfolio.

Pagine portfolio vs progetti portfolio

Le pagine portfolio sono organizzate in due parti: la pagina principale del portfolio, che crea una griglia di immagini in primo piano o un elenco di link su cui i visitatori fanno clic per esplorare il tuo portfolio, e i singoli progetti a cui questi link portano a dove aggiungi contenuti.

Apri le opzioni di stile

Definirai lo stile della pagina portfolio e dei progetti in due punti:

• Pagina portfolio - Clicca su Modifica nella pagina portfolio, quindi clicca sull'icona della matita nella sezione portfolio.
• Progetti : fai clic sul progetto nella pagina portfolio per aprirlo, fai clic su Modifica, quindi fai clic sull' icona della matita sulla sezione a cui desideri applicare lo stile. Ogni progetto è composto da sezioni e ogni sezione ha le proprie opzioni di stile.

Pagina Portfolio

La pagina portfolio mostra tutti i tuoi progetti come immagini in evidenza o link di testo, su cui i visitatori cliccano per aprire i singoli progetti.

Negli stili della sezione portfolio, puoi personalizzare i seguenti dettagli:

• Formato - Imposta il layout della pagina portfolio. Ogni layout a griglia e layout al passaggio del mouse ha opzioni di formattazione uniche.
• Sfondo - Aggiungi un'immagine di sfondo, un video di sfondo o uno sfondo Scenographik dietro i link dei progetti.
• Colori - Imposta i colori del sito o cambia il tema sezione del portfolio.

Ricorda:

• Queste modifiche si applicano a tutte le Pagine portfolio che utilizzano lo stesso layout.
• Le modifiche apportate a un layout specifico vengono salvate anche se passi a un nuovo layout, quindi se ritorni a un layout precedente, le impostazioni verranno ripristinate.
• A seconda del numero di progetti nella pagina portfolio, alcuni tweak di stile potrebbero non influire sul layout. Ad esempio, se hai un layout Al passaggio del mouse: sfondo con un numero elevato di progetti, il tweak Altezza potrebbe non avere un effetto visibile perché la sezione deve avere una certa altezza per mostrare tutti i link dei progetti. In alternativa, utilizza il tweak Spaziatura link verticale.

Formatta i layout a griglia

I layout a griglia mostrano le pagine secondarie in una griglia di immagini in evidenza. I visitatori cliccano sull'immagine o sul testo del titolo per aprire il progetto. Le opzioni disponibili nella scheda Formato degli stili di sezione variano a seconda del layout a griglia scelto.

Formatta i layout al passaggio del mouse

I layout "Al passaggio del mouse" mostrano i tuoi progetti come un elenco di link, con le relative immagini in evidenza che appaiono quando il cursore passa sopra. I visitatori cliccano sul link per aprire il progetto. Le opzioni disponibili nella scheda Formato degli stili di sezione variano a seconda del layout al passaggio del mouse scelto. I layout "Al passaggio del mouse" dispongono di un overlay semitrasparente sulle immagini in evidenza dei progetti. Non è possibile aumentare o rimuovere questo effetto:

Testo del titolo del progetto

Il titolo di ogni progetto appare nella pagina portfolio principale, sotto l'immagine in evidenza, sovrapposto all'immagine in evidenza o in un elenco di link, a seconda del layout. Puoi modificare il testo del titolo nelle impostazioni del progetto. Il testo del titolo segue gli stili del tipo di carattere e del colore dell'intero sito.

Tipo di carattere titolo

Per applicare uno stile al tipo di carattere del titolo del progetto:

1. Durante la modifica di una pagina, apri Stili sito, quindi clicca su Tipi di carattere.
2. Clicca su Intestazioni.
3. Scegli una famiglia di tipi di carattere e modifica altre impostazioni di stile.
4. In Dimensioni, utilizza il cursore dell'intestazione corrispondente per regolare la dimensione del titolo.

Il cursore utilizzato dipende dal layout della pagina del portfolio:

• Griglia: semplice - Intestazione 4
• Griglia: sovrapposizione - Intestazione 3
• Layout al passaggio del mouse - Intestazione 1

Tieni presente che la modifica del formato intestazione incide su tutto il testo del sito con tale formattazione. Per modificare individualmente il tipo di carattere e la dimensione del testo del titolo, clicca su Assegna stili, trova il tweak Titolo per il tuo layout e cambia lo stile e la dimensione in Personalizzato.

Dopo aver apportato le modifiche, clicca su Salva per salvare il lavoro e continuare ad apportare modifiche, oppure clicca su Esci e poi su Salva per chiudere l'editor.

Colore titolo

Per applicare uno stile al colore del titolo del progetto:

1. Durante la modifica di una pagina, apri Stili sito, quindi clicca su Colori.
2. Clicca sull'icona della matita sul tema cromatico della sezione portfolio.
3. Scorri verso il basso e trova la sezione Portfolio che corrisponde al tuo layout.
4. Modifica il colore tramite il tweak Titolo progetto. Ciascun layout di portfolio ha un tweak Titolo progetto.
5. Clicca su Salva per salvare il lavoro e continuare ad apportare modifiche, oppure clicca su Esci e poi su Salva per chiudere l'editor.

Delimitatori

Per i layout Al passaggio del mouse che si servono di link ipertestuali in linea, è possibile aggiungere "delimitatori" o punteggiatura per separare visivamente i link dei progetti.

Per selezionare o nascondere i delimitatori:

1. Clicca su Modifica nella Pagina portfolio.
2. Passa il mouse sopra la sezione Portfolio e clicca sull'icona della matita.
3. Nella scheda Formato, imposta Formato link su In linea.
4. Scorri verso il basso, clicca su Delimitatore e seleziona una delle opzioni oppure scegli Nessuno per nasconderlo.
5. Clicca su Salva per salvare il lavoro e continuare ad apportare modifiche, oppure clicca su Esci e poi su Salva per chiudere l'editor.

Progetti

I progetti sono creati a partire da sezioni di pagina, quindi le opzioni di stile dipendono dalle sezioni aggiunte. Puoi aggiungere sezioni blocco, sezioni galleria o layout intelligenti.

Definisci lo stile di qualsiasi sezione cliccando sull'icona della matita visualizzata al passaggio del mouse. Per maggiori informazioni, visita Apportare modifiche di stile.

Impaginazione del progetto

I link ai progetti successivi e precedenti di un portfolio appaiono in fondo a ciascun progetto. Tutte le pagine portfolio condividono gli stessi stili di impaginazione, anche se utilizzano layout diversi.

Tipo di carattere dell'impaginazione

Per definire il tipo di carattere dell'impaginazione:

1. Durante la modifica di una pagina, apri Stili sito, quindi clicca su Tipi di carattere.
2. Clicca su Intestazioni.
3. Scegli una famiglia di tipi di carattere e modifica altre impostazioni di stile.
4. In Dimensioni, utilizza il cursore Intestazione 3 per regolare la dimensione del titolo.

Tieni presente che la modifica del formato intestazione incide su tutto il testo del sito con tale formattazione. Per modificare individualmente il tipo di carattere e la dimensione del testo del titolo, clicca su Assegna stili, trova il tweak Impaginazione sotto Portfolio: elemento e cambia lo stile e la dimensione in Personalizzato.

Dopo aver apportato le modifiche, clicca su Salva per salvare il lavoro e continuare ad apportare modifiche, oppure clicca su Esci e poi su Salva per chiudere l'editor.

Colore dell'impaginazione

Il colore dell'impaginazione segue il tema cromatico della sezione inferiore di ogni progetto. Se i progetti utilizzano temi cromatici diversi nelle loro sezioni inferiori, il colore dell'impaginazione può variare da una progetto all'altro.

Per definire il colore dell'impaginazione:

1. Durante la modifica di una pagina, apri Stili sito, quindi clicca su Colori.
2. Clicca sull'icona della matita sul tema cromatico della sezione portfolio.
3. Scorri verso il basso e trova i tweak Portfolio: elemento.
4. Modifica il testo del titolo con il tweak Titolo impaginazione progetto e modifica l'icona dell'impaginazione con il tweak Icona impaginazione progetto.
5. Clicca su Salva per salvare il lavoro e continuare ad apportare modifiche, oppure clicca su Esci e poi su Salva per chiudere l'editor.

Le modifiche riguardano tutte le sezioni che utilizzano lo stesso tema cromatico.

Tipi di carattere e colori

I colori e i tipi di carattere nella pagina portfolio e nei progetti seguono i tweak sui colori e i tipi di carattere applicati al sito. Puoi inoltre modificare il tema cromatico della sezione pagina portfolio e delle sezioni dei progetti nei relativi editor di stile delle sezioni.

Nel tema cromatico del tuo portfolio, utilizza i tweak di colore Portfolio che si adattano al tuo layout. Nel tema cromatico dell'ultima sezione di ogni pagina secondaria, utilizza i tweak Portfolio: elemento per definire lo stile dell'impaginazione in fondo alla pagina di ciascun progetto. Questo può variare da una pagina secondaria all'altra, in base al tema cromatico utilizzato dalla sezione inferiore. 

Mobile

Sui dispositivi mobili o sui tablet, i layout del portfolio si impilano verticalmente in un'unica colonna, indipendentemente dal numero di colonne o dal formato dei link sui browser più grandi.

Gli effetti al passaggio del mouse non sono supportati nella maggior parte dei browser mobili, quindi se stai utilizzando il layout Griglia: sovrapposizione con i titoli impostati per apparire Dopo il passaggio del mouse, i titoli potrebbero non essere visualizzati dai visitatori che utilizzano dispositivi mobili.

Per assicurarsi che i titoli vengano visualizzati su tutti i dispositivi per il layout Griglia: sovrapposizione:

1. Clicca su Modifica nella pagina del portfolio, quindi passa il mouse sulla sezione del portfolio e clicca sull'icona a forma di matita.
2. Nella scheda Formato, seleziona Prima del passaggio del mouse dal menu a discesa Mostra testo.
3. Clicca su Salva per salvare il lavoro e continuare ad apportare modifiche, oppure clicca su Esci e poi su Salva per chiudere l'editor.