L'utilizzo di un banner aggiunge un tocco visivo al tuo sito web e conferisce personalità ai tuoi contenuti, che si tratti di una galleria , una pagina , una cartella , un album clienti o un blog . Puoi aggiungere il testo alternativo (alt text) alle immagini del banner , il che contribuisce al posizionamento sui motori di ricerca (SEO).
I banner possono essere posizionati sopra o sotto i contenuti (sotto l'intestazione del sito web) e vengono generalmente utilizzati per mostrare un'immagine banner a larghezza intera, una presentazione di immagini o un video.
Consiglio
Se desideri semplicemente visualizzare un messaggio di testo nella parte superiore del tuo sito web, utilizza la barra degli annunci . In alternativa, se preferisci creare un pop-up che appaia quando i visitatori accedono al tuo sito, puoi provare il popup di marketing.
Ecco come appare un banner:
Dai un'occhiata al sito demo live.
Le impostazioni del banner sono classificate come:
1. Contenuto
Le opzioni nella categoria di contenuto sono:
Tipo di banner
Seleziona il tipo di banner. Puoi scegliere una delle seguenti opzioni:
- Diapositive – Seleziona l'opzione Diapositive se desideri visualizzare le immagini nel banner. Puoi aggiungere più diapositive di immagini sotto un unico banner.
- Video – Se desideri visualizzare i video come diapositive banner, seleziona questa opzione. Sotto ogni banner puoi aggiungere più diapositive video.
- Automatico – L'immagine in evidenza, il titolo e la descrizione della galleria verranno utilizzati per il banner. Verrà creato automaticamente dal sistema.
- Inattivo – Il banner non sarà visibile sul sito web.
Diapositive
- Clicca sul +Aggiungi diapositive (1) pulsante per aggiungere le diapositive personalizzate al banner.
- Una volta caricate le diapositive, puoi edit (2) o delete (3) la diapositiva.
Punti da ricordare:
- La dimensione ideale di un'immagine Banner sarà 2560 pixel X 1440 pixel.
- I formati di file immagine supportati per il banner sono JPG, JPEG, PNG e GIF.
- Il numero massimo di diapositive supportate è 25 per ogni striscione.
- Ti consigliamo di caricare immagini in formato orizzontale anziché verticale.
- Aggiungere il testo sopra le immagini da Testo master/diapositiva campo. Non caricare immagini contenenti testo.
Modifica diapositiva immagine/testo
- Dopo aver cliccato su edit icona, vedrai il cassetto Diapositiva Immagine/Testo.
Le opzioni disponibili qui sono:
- Immagine
- Clicca sul Caricare pulsante per cambiare l'immagine/diapositiva. Fare clic sul pulsante Elimina pulsante per eliminare la diapositiva.
- Per cambiare il punto focale dell'immagine, basta cliccare su un punto qualsiasi dell'immagine.
- Immagine mobile – Carica un'immagine banner per dispositivi mobili. Ti consigliamo di aggiungere immagini in formato verticale.
- Specificare il testo alternativo per la diapositiva dell'immagine. Questo è utile per scopi SEO.
- Testo della diapositiva – Inserisci il testo che apparirà sopra la diapositiva. Puoi rendere il testo in grassetto, corsivo, sottolineato, creare un collegamento e molto altro ancora.
Vedi anche: L'editor di testo Pixpa.
- Collegamento diapositiva
-
- Fare clic sull'icona delle impostazioni e immettere il collegamento sovrapposto per la diapositiva.
- Puoi specificare qualsiasi pagina all'interno/esterno del tuo sito web, la tua email o un numero di contatto.
Controlla anche: Testo/pulsante di collegamento.
Note:
L'intera diapositiva verrà convertita in un collegamento solo se l'opzione "Testo banner e pulsanti" è selezionata su "Diverso per ogni diapositiva".
- Pulsante & Icone
-
- Aggiungi fino a 10 pulsanti/link al contenuto della diapositiva.
- È possibile aggiungere un pulsante normale, un collegamento di testo oppure utilizzare un'immagine/icona come pulsante.
Controlla anche: Pulsante e collegamenti.
- Colpire il Salva pulsante per salvare le modifiche.
Testo banner e pulsanti
- Specifica se il testo e i pulsanti saranno gli stessi per tutte le diapositive o diversi per ogni diapositiva. Quando selezioni l'opzione Uguale per tutte le diapositive opzione, verranno utilizzati il testo del banner e i pulsanti 1 e 2.
- Dopo aver selezionato il Diverso per ogni diapositiva opzione, verranno utilizzati il testo e i pulsanti specificati per una particolare diapositiva.
Testo del banner
- Inserisci il testo del banner che sarà comune a tutte le diapositive.
Vedi anche: L'editor di testo Pixpa.
Pulsanti e icone
- Questi pulsanti/link vengono visualizzati sopra le diapositive del banner (comuni a tutte le diapositive).
Controlla anche: Pulsante e collegamenti.
2. impostazioni
Nella scheda Impostazioni banner sono disponibili le seguenti opzioni:
- Opzioni di visualizzazione del banner
- Comportamento dell'intestazione del sito
- Visibilità del banner
- Opzioni di styling
- Presentazione banner
- Pulsanti e collegamenti
Opzioni di visualizzazione del banner
- Larghezza bandiera – Specificare la larghezza del banner.
- 'Intera larghezza' visualizzerà il banner coprendone l'intera larghezza senza lasciare alcun margine.
- 'Boxed' visualizzerà il banner lasciando un po' di spazio a destra e a sinistra dello schermo.
- 'Larghezza del sito' può essere specificato nel file Design sezione. Lì puoi specificare una larghezza fissa.
Verrà visualizzato il banner rispettando la larghezza fissa specificata.
-
- Scala e adatta – Le immagini si adatteranno alla larghezza e all'altezza del banner.
- Adatta alla larghezza (Solo desktop) – Le immagini verranno ridimensionate in base alla larghezza del banner. L'altezza del banner erediterà l'altezza dell'immagine.
- Altezza del desktop del banner – Specificare l'altezza del banner del desktop se è stata scelta l'opzione al vivo or scala e adattamento opzione nel campo Modalità di visualizzazione.
- Altezza mobile del banner – Specificare l'altezza del banner mobile.
Nota:
Se la sezione banner viene aggiunta a una pagina, l'altezza del banner verrà ereditata dall'altezza della sezione.
Comportamento dell'intestazione del sito
- Intestazione di pagina – Seleziona lo stile dell'intestazione che verrà applicato al banner.
- Nel caso in cui tu abbia selezionato Predefinito, l'intestazione utilizzerà lo stile predefinito dell'intestazione del sito Web e il banner verrà posizionato dopo l'intestazione. Dai un'occhiata a esempio dal vivo.
- Nel caso in cui tu abbia selezionato Indicazione, lo sfondo dell'intestazione sarà impostato come trasparente e gli elementi dell'intestazione saranno bianchi. Il banner verrà posizionato sotto l'intestazione. Dai un'occhiata a esempio dal vivo.
- Elementi di intestazione - Se hai imposta l'intestazione in modo che sia trasparente, puoi scegliere il colore delle voci di intestazione/voci di menu:
- Nel caso Colore predefinito è selezionato, il colore degli elementi dell'intestazione viene ereditato da Design .
- Nel caso Specifica il colore è selezionato, puoi fare clic e scegliere il colore degli elementi dell'intestazione.
Vedi anche: Come personalizzare gli elementi dell'intestazione di qualsiasi pagina.
Visibilità del banner
- Visibilità – Imposta la visibilità del banner.
- Posizione – Specificare la posizione del banner.
Messa in Piega
- Posizione del contenuto – Specificare la posizione del contenuto sul banner.
- Larghezza contenuto – Specificare la larghezza del contenuto del banner.
- Colore di sfondo – Imposta il colore di sfondo del banner.
- Colore sovrapposizione – Imposta il colore di sovrapposizione per il banner.
- Stile di navigazione – Specifica lo stile di navigazione del banner. Puoi scegliere tra Chevron, Frecce lunghe e Frecce corte. Seleziona Nessuno se desideri disattivare i controlli di navigazione.
- Colore di navigazione – Specifica il colore dei controlli di navigazione sul banner.
- Margine esterno – Applica il margine esterno al banner. Quando si applica il margine esterno, si crea spazio libero nella parte inferiore del banner.
- Freccia di scorrimento verso il basso – Seleziona questa opzione per visualizzare una freccia di scorrimento verso il basso sopra il banner.
presentazione
- presentazione - Scegli il Autoplay opzione per abilitare la presentazione per il banner.
- Velocità della presentazione – Specificare la velocità della presentazione (in secondi).
- Transizione della presentazione – Specificare lo stile di transizione dell'immagine per il banner.
- Finalmente, colpisci Salva pulsante.
Pulsante e collegamenti
- Allineare il pulsante/i link essere allineato a sinistra, a destra o al centro.
- specificare la Spazio tra il Pulsante/collegamenti che sono stati aggiunti.
- specificare la Spazio sopra il Pulsante/collegamenti.
- Scegliere il effetto hover per il pulsante/link.
- Scegliere il dimensione del pulsante Normale che hai aggiunto nel Pulsante/collegamenti.
- specificare la altezza del pulsante Immagine se hai aggiunto un collegamento all'immagine nel Pulsante/collegamenti.
- specificare la dimensione del pulsante icona se hai aggiunto un'icona social nel Pulsante/collegamenti.
Se hai aggiunto un'icona social in Pulsanti/Collegamenti , allora:
- Scegliere il Tipo di icona social/Forma.
- Scegliere il Stile colore icona social.
Se hai scelto il file Colore selezionato opzione sopra quindi:- specificare la Colore dell'icona social.
- specificare la Colore di sfondo dell'icona social.
3. disposizione
È possibile modificare facilmente il layout di un banner. Scopri di più sui layout dei banner.