Oltre 15 eccellenti esempi di slider per WordPress (vetrina)
Pubblicato: 2018-09-21Cerchi ispirazione per il tuo slider WordPress? Gli slider consentono ai proprietari di siti Web di mostrare i loro contenuti più importanti in una presentazione coinvolgente e interattiva, in modo che gli utenti possano vedere i punti salienti e agire immediatamente. Non c'è da stupirsi che così tanti siti utilizzino gli slider con tutto ciò che possono fare!
- Distribuisci contenuti in modo efficiente e con stile
- Riponi molte informazioni in un piccolo spazio
- Aggiungi interazione al tuo sito web
- Indirizzare i visitatori a promozioni e pagine importanti
In questo articolo, ti mostreremo oltre 15 eccellenti esempi di slider WordPress. Ti mostreremo anche come creare rapidamente uno splendido slider per il tuo sito web.
Vetrina di ispirazione per lo slider
Ecco alcuni dei migliori esempi di slider per la tua ispirazione. I criteri che abbiamo utilizzato per scegliere questi cursori erano 1) creatività e 2) usabilità. Alcuni design hanno entrambi e altri hanno solo un aspetto.
CNBC Primo

Il cursore di CNBC è leggibile e facile da usare. Usano un carattere spesso per i titoli degli spettacoli, quindi è facile da leggere. Colorare il testo lo aiuta davvero a risaltare anche sullo sfondo.
CBS

Il dispositivo di scorrimento di CBS utilizza immagini accattivanti con caratteri grandi e molto spazio bianco per facilitarne la lettura e l'utilizzo. I proiettili grandi rendono super chiaro cosa accadrà quando fai clic.
Universal Orlando

Lo slider della Universal ha un semplice scopo: invogliarti a visitare il loro parco divertimenti. Sebbene le CTA facciano alcune offerte allettanti, le foto fanno tutto il discorso.
Dove Cotes di Saville

Saville's utilizza un elegante carattere serif abbinato a foto che mettono in risalto la qualità e l'artigianalità delle loro colombaie. Spiegano anche la loro vasta conoscenza delle colombe, quindi puoi essere sicuro che stai acquistando le migliori case in assoluto per i tuoi amici pennuti.
Panetteria Magnolia

Magnolia Bakery è un ottimo esempio di slider di sole immagini. Quando hai dei pasticcini deliziosi, chi ha bisogno di chiacchiere? Questi tre mini-cursori sembrano semplicemente deliziosi su questa pagina web.
Gola Fiammeggiante

Flaming Gorge è una popolare attrazione dello Utah. I titoli della loro galleria dicono tutto: puoi goderti l'ampiezza della vista senza snaturarla al resort Flaming Gorge.
Temi del progresso

Headway Themes fa un uso creativo del dispositivo di scorrimento. Invece del tipico dispositivo di scorrimento nella parte superiore della pagina, hanno posizionato il loro più in basso e lo utilizzano per mostrare i siti Web che utilizzano i loro temi. Intelligente!
Galleria Smithsonian Freer Sackler

Smithsonian Freer Sackler utilizza un semplice cursore di navigazione per indirizzarti alle pagine chiave del sito web. L'aspetto semplice e pulito del dispositivo di scorrimento, circondato da spazi bianchi che ti attirano alle immagini, è perfetto per una galleria d'arte.
Pianeta solitario

Il dispositivo di scorrimento di Lonely Planet diventa fantasioso con un'immagine a schermo intero rotante e animazioni accattivanti. Non solo questo è uno slider dall'aspetto meraviglioso, ma è anche facile navigare in qualsiasi luogo che colpisce la tua fantasia.
Baia Orientale

Lo slider di Converse mette tutta l'attenzione proprio dove dovrebbe essere: sul prodotto. I dettagli e le trame sono così chiari in questo cursore che potresti quasi allungare la mano e toccare il tessuto.
Fogliz

Il dispositivo di scorrimento di Sheetz utilizza colori vivaci e divertenti con pulsanti in avanti interattivi che scorrono verso l'esterno mentre ci passi sopra con il mouse. Slider come questo chiedono solo di essere giocati.
Xbox


Il dispositivo di scorrimento di Xbox va per semplicità con immagini del prodotto pulite, poche parole e molti spazi bianchi. Questo è sicuramente un caso in cui meno è di più.
Tim Horton

Lo slider di Tim Hortons è un classico esempio di ottima fotografia di cibo al lavoro. Fatti venire l'acquolina in bocca, abbinalo ad alcuni ottimi affari e BOOM! Hai uno slider a cui è estremamente difficile resistere.
Sony Crackle

Bastoncini crackle con una semplice combinazione di colori bianco e arancione che attira l'attenzione sul cursore rotante. Le piccole sfocature su ogni diapositiva ti danno la voglia di accendere il tubo e guardare alcuni programmi TV.
Istituto Smithsonian

Il dispositivo di scorrimento di Smithsonian utilizza frecce grandi e evidenti in modo da poter tornare a una diapositiva precedente che hai perso. Questo è importante in questo caso, perché c'è molto testo da leggere su ogni diapositiva.
Louvre

Il cursore del Louvre è esattamente quello che ti aspetteresti: storico ed elegante. Questo grazie all'ampio spazio bianco, al carattere serif e alla semplice ma drammatica dissolvenza in nero nelle immagini. L'altra cosa grandiosa di questo dispositivo di scorrimento è il pulsante di riproduzione/pausa nell'angolo in basso a destra.
Come creare il tuo dispositivo di scorrimento WordPress
Ora ti starai chiedendo: " Questi slider sono fantastici, ma come posso crearne uno per il mio sito Web?"
Bene, per fortuna, in realtà è abbastanza semplice grazie al plugin Soliloquy per WordPress.
Innanzitutto, devi installare e attivare il plug-in Soliloquy Slider. Per maggiori dettagli, consulta questa guida passo passo su come installare un plug-in in WordPress.
Successivamente, è il momento di creare il tuo primo dispositivo di scorrimento. Vai a Soliloquio »Aggiungi nuovo per aggiungere uno slider. Puoi selezionare i file dal tuo computer se devi caricare immagini. Se hai già caricato immagini sul tuo sito web, seleziona file da altre fonti.

Continua a scorrere verso il basso. Vedrai le immagini che hai selezionato per il tuo dispositivo di scorrimento. Da qui, puoi fare clic sull'icona a forma di matita per modificare le immagini o fare clic sulla X rossa per rimuovere le immagini dal dispositivo di scorrimento.

Puoi anche configurare altri dettagli sul tuo dispositivo di scorrimento selezionando la scheda Config a sinistra. È possibile impostare la dimensione dell'immagine, il tema del dispositivo di scorrimento e la velocità delle transizioni delle diapositive. Anche la posizione della didascalia del testo può essere modificata qui. Rivedi queste impostazioni.

Una volta che sei soddisfatto delle tue impostazioni, dai un'occhiata alla scheda Mobile . Ciò ti consentirà di testare l'aspetto del tuo sito Web su un dispositivo mobile e di regolare le impostazioni di risoluzione mobile secondo necessità.
(Vedi anche la scheda Varie per importare o esportare il tuo dispositivo di scorrimento.)
Aggiungi un dispositivo di scorrimento a una pagina o a un post
Hai finito di creare il tuo slider! Ora è il momento di aggiungerlo al post o alla pagina di tua scelta. Modifica un post o una pagina, fai clic sul pulsante Aggiungi dispositivo di scorrimento e seleziona il dispositivo di scorrimento. Ricordati di pubblicare o aggiornare il tuo post/pagina per salvare le modifiche.

Il tuo dispositivo di scorrimento sarà ora attivo sul tuo sito web:

Questo è tutto! Ora hai il tuo dispositivo di scorrimento WordPress personale. Ci auguriamo che questo articolo ti abbia ispirato con oltre 15 eccellenti esempi di slider WordPress e ti abbia aiutato a creare il tuo primo slider.
Potresti anche voler controllare tutte le funzionalità avanzate che puoi utilizzare durante la progettazione dei tuoi cursori. Le possibilità di personalizzazione del tuo dispositivo di scorrimento sono praticamente infinite, quindi inizia oggi stesso con Soliliquy! Ecco solo alcuni esempi di cosa puoi fare con uno slider di Soliloquy.
- Crea uno slider di immagini a larghezza intera in WordPress
- Cambia il tempo del cursore in WordPress
- Crea uno slider video reattivo in WordPress
Se ti piace questo articolo, seguici su Facebook e Twitter per ulteriori tutorial gratuiti su WordPress.
