Un banner stretto sopra l’intestazione viene visualizzato su tutte le pagine del sito e aiuta ad attirare ulteriore attenzione su promozioni, offerte e altre informazioni importanti.
Esempi di banner sopra l’intestazione del sito
Nota bene: Abbiamo creato una nuova interfaccia di gestione dei banner e stiamo aggiornando gradualmente i negozi dei nostri clienti.
Le seguenti istruzioni si applicano sia alla vecchia che alla nuova interfaccia.
Come aggiungere un banner sopra l’intestazione
Nuova interfaccia:
Vai alla sezione Sito web → Banner, seleziona la scheda Header e fai clic su + New banner.
Configura il contenuto del banner e fai clic su Save.
Dettagli su alcune impostazioni:
Height — l’altezza del banner: S (30 pixel), M (40 pixel) o L (50 pixel). Nella versione mobile, l’altezza aumenta automaticamente se il testo del banner non entra in una sola riga — per garantirlo, è necessario caricare un’immagine di sfondo con un’altezza aggiuntiva.
Show on — mostra il banner solo nella versione desktop, solo nella versione mobile o ovunque.
Show dismiss button — se abilitato, il visitatore del sito potrà nascondere
il banner, dopodiché non verrà più visualizzato.
Text — il testo sul banner; supporta HTML e CSS.
Vecchia interfaccia:
Vai su Sito web → Banner e fai clic su Aggiungere.
Nel campo Pagina, seleziona Tutte le pagine.
Configura il contenuto del banner e poi fai clic su Salvare.
Dettagli su alcune impostazioni:
Immagine — un’immagine per lo sfondo, posizionata al centro del banner, ritagliata sugli schermi stretti.
Testo — testo sul banner, supporta HTML e CSS.
Altezza — l’altezza del banner: 30, 40 o 50 pixel. Nella versione mobile, l’altezza aumenta automaticamente se il testo del banner non entra in una sola riga — per questo, è necessario caricare un’immagine di sfondo con un’altezza aggiuntiva.
Mostra il banner su — mostra il banner solo nella versione desktop, solo nella versione mobile o ovunque. Usa questa impostazione per creare due banner diversi per ciascuna versione del tuo sito.
Mostra pulsante di chiusura — se abilitato, il visitatore del sito potrà nascondere il banner, dopodiché non verrà più visualizzato.
Banner nella versione mobile
Nella versione mobile, il banner viene visualizzato sotto l’intestazione: rimane visibile e l’intestazione non si sposta dalla sua posizione abituale sullo schermo. Questo è importante per un uso confortevole del sito.
Quando progetti un banner, assicurati che sia chiaro e leggibile nella versione mobile. Consigliamo diverse opzioni per risolvere questo problema.
1. Imposta il contenuto del banner come testo. Nella versione mobile, il testo non verrà tagliato, ma spostato su una nuova riga. Allo stesso tempo, il banner può aumentare in altezza se l’immagine di sfondo viene caricata con un margine.
2. Progetta il layout in modo che i contenuti importanti rientrino nella larghezza dello schermo dello smartphone. L’immagine verrà ritagliata su entrambi i lati, ma i contenuti rimarranno leggibili.
3. Crea un banner separato per la versione mobile. Nelle impostazioni di questo banner, specifica che deve essere visualizzato solo nella versione mobile e che il banner originale deve essere visualizzato solo sul desktop (l’impostazione Mostra il banner su ).
L’ordine di visualizzazione dei banner
Sopra l’intestazione può essere visualizzato un solo banner — quello che si trova più in alto nell’elenco nella sezione del pannello di amministrazione Sito web → Banner → Header (Sito web → Banner per la vecchia interfaccia).
Tuttavia, se per il banner con priorità più alta è abilitato il pulsante di chiusura, allora dopo che questo banner viene nascosto, il visitatore del sito vedrà quello successivo (dopo aver ricaricato la pagina o passando a un’altra pagina).
