Riduzione dell'intestazione

Panoramica

La Riduzione dell'intestazione è una versione ridotta dell'intestazione del sito, che ti consente di mantenere fisse le informazioni di navigazione importanti senza distrarre gli utenti mentre scorrono una pagina verso il basso e senza occupare troppo spazio. Agisce come un'intestazione adesiva, condensando però la dimensione del logo e degli altri widget presenti nell'intestazione. È particolarmente utile nei siti che hanno intestazioni di grandi dimensioni e che sono progettati per lo scorrimento lungo. 

shrinkingheader.gif

Guida

Apri l'Editor di design dell'intestazione facendo clic sull'icona dell'intestazione e selezionando "Modifica design".

Attiva la riduzione dell'intestazione facendo clic sul pulsante di spunta.

shrinkingheader2.png

Cosa succede quando la riduzione dell'intestazione viene attivata?

Quando la riduzione dell'intestazione viene attivata:

  • Il sito verrà fatto scorrere verso il basso per un po' per visualizzare gli effetti della riduzione dell'intestazione.
  • La funzionalità di intestazione adesiva viene applicata automaticamente all'intestazione.
  • La spaziatura dell'intestazione modificherà i margini e la spaziatura interna superiore/inferiore di 0, Notare che questa operazione modifica i margini e la spaziatura interna dell'intestazione, ma non le righe all'interno dell'intestazione. 
  • Le immagini nell'intestazione si ridurranno della percentuale indicata nella barra delle dimensioni del logo (predefinito = 66%). Notare che tutte le immagini nell'intestazione si ridurranno alle dimensioni del logo.
  • Modificando il layout dell'intestazione non si modificano le impostazioni di riduzione dell'intestazione.
  • Non tutti i widget sono compatibili e appariranno nella riduzione dell'intestazione. I widget seguenti sono gli unici widget che verranno visualizzati in una riduzione dell'intestazione:
    • Navigazione
    • Widget multilingua
    • Icone dei social
    • Pulsante Chiamata con un clic
    • Pulsante OpenTable
    • Pulsante Email con un clic
    • vCita
    • Pulsante PayPal
    • Pulsante Mi Piace di Facebook
    • Immagini e loghi
    • Carrello negozio
    • Widget del paragrafo
    • Widget del titolo
    • Pulsanti

Opzioni di personalizzazione del design

Nell'Editor di design, è possibile modificare le seguenti impostazioni per personalizzare la riduzione dell'intestazione:

  • Visualizza solo la riga di navigazione - quando l'intestazione viene ridotta verrà visualizzata solo la riga di navigazione. Questa funzione è applicabile solo se l'intestazione è composta da più di una riga.
  • Dimensioni del logo - modifica le dimensioni in cui viene ridotto il logo o l'immagine quando l'intestazione viene ridotta (predefinito = 66%).
  • Colore dello sfondo - modifica il colore dello sfondo della riduzione dell'intestazione. Notare che il colore dello sfondo della riga sostituisce il colore dello sfondo della riduzione dell'intestazione. 
  • Spaziatura dell'intestazione - consente agli utenti di regolare la spaziatura interna superiore e inferiore della riduzione dell'intestazione. Puoi modificare la spaziatura dell'intestazione per dispositivo. 

Quali sono alcuni effetti di un'intestazione ridotta?

Quando l'utente scorre oltre l'intestazione, l'altezza dell'intestazione viene ridotta. Quando l'intestazione è ridotta:

  • Se le colonne hanno un widget visibile, il widget verrà centrato all'interno della colonna verticalmente e i margini e la spaziatura interna superiore/inferiore verranno impostati su 0.
  • Se le colonne hanno più di un widget visibile, i widget non saranno allineati verticalmente e i margini e la spaziatura interna superiore/inferiore verranno impostati su 10px.
  • Se sono presenti righe vuote con colonne, le colonne occuperanno lo spazio intero della riga. 
  • Per gestire i modelli con un valore minimo dell'altezza nell'intestazione, l'altezza minima dell'intestazione viene impostata su auto.

Considerazioni

Posso modificare i widget quando l'intestazione è ridotta?

No. Dovrai scorrere fino alla parte superiore del sito per poter apportare modifiche nell'intestazione.

Su quali viste e impostazioni sarà visibile la riduzione dell'intestazione?

La riduzione dell'intestazione è disponibile sulle viste Desktop e Tablet. Le riduzioni delle intestazioni possono essere attivate solo quando l'intestazione viene trasformata in una riga. Se l'intestazione non è una riga e il modello ha un'intestazione fissa, l'opzione di riduzione dell'intestazione non sarà disponibile.

La riduzione dell'intestazione modificherà il margine e la spaziatura interna applicate alle righe all'interno dell'intestazione?

No, la riduzione dell'intestazione ridurrà l'intestazione impostando i margini e la spaziatura interna superiore/inferiore sullo 0, tuttavia, se alle righe presenti all'interno dell'intestazione è applicata una spaziatura, non modificherà i margini e la spaziatura di queste righe. 

Le proprietà di progettazione della riduzione dell'intestazione sostituiscono le proprietà della riga (ad es. il colore di sfondo)? 

No, le proprietà di progettazione della riga sostituiranno le proprietà della riduzione dell'intestazione. Ad esempio, se si imposta uno sfondo della riga nell'impostazione, lo sfondo della riga verrà visualizzato sopra lo sfondo della riduzione dell'intestazione.  

Cosa succede se nell'intestazione è presente un widget che appare nella riduzione dell'intestazione?

Se nell'intestazione è presente un widget che non è compatibile con la riduzione dell'intestazione, al posto del widget verrà visualizzata una colonna vuota quando viene attivata la riduzione dell'intestazione. 

Le righe vuote vengono visualizzate nella riduzione dell'intestazione?

Sì. Anche se si rimuove il widget da una riga per creare una riga vuota, i margini e la spaziatura interna della riga non scompariranno e verranno visualizzati sulla riduzione dell'intestazione.

Cosa succede se aggiungo un logo centrale alla navigazione o se modifico il logo?

Anche il logo centrale diminuirà di dimensione come il logo normale, ma se si modifica il logo, sarà necessario ridefinire le dimensioni del logo.

I widget verranno allineati alla riga o alla colonna?

I widget verranno allineati verticalmente al centro della colonna.

Non riesco a vedere la riduzione dell'intestazione. Cosa è successo?

Se la lunghezza della pagina ha le dimensioni del riquadro di visualizzazione, la riduzione dell'intestazione non verrà visualizzata. Per poter scorrere verso il basso sul sito e attivare la riduzione dell'intestazione è necessario che sia presente un numero sufficiente di righe sul sito. Se è presente una sola riga sulla pagina, il sito non scorrerà e la riduzione dell'intestazione non verrà attivata.