Come faccio a creare un carosello di immagini in WordPress?

Pubblicato: 2021-12-06
Image Carousel

Ultimo aggiornamento - 8 marzo 2022

Potresti non essere a conoscenza del termine carosello ma lo vedi ancora frequentemente nel mercato digitale. Un carosello di immagini viene utilizzato nella maggior parte dei siti Web new age: immagini scorrevoli che includono informazioni sul prodotto o sui servizi offerti dalle aziende. Le immagini ruotano automaticamente ed entrano ed escono dalla vista.

Il carosello di immagini mantiene in modo efficace i visitatori del sito Web agganciati più a lungo poiché le immagini scorrevoli li rendono più curiosi riguardo al prodotto o servizio offerto dall'azienda. In alcuni casi, lo scorrimento dell'immagine non è automatizzato e il visitatore deve ruotare manualmente l'immagine per visualizzare la diapositiva successiva.

Crea un carosello di immagini in WordPress

A seconda del tono aziendale, il carosello di immagini può includere alcune affermazioni audaci e rivelare molto sull'attività senza una descrizione lunga. Se hai desiderato ardentemente imparare modi per incorporare un carosello di immagini nel tuo sito Web, sei nel posto giusto.

Descriveremo il processo di installazione del plug-in Smart Slider 3 in word press. Esistono molti altri strumenti per il lavoro e il processo di installazione potrebbe essere simile a Smart Slider 3.

Prima di entrare nel tutorial, c'è un piccolo avvertimento. Se vendi prodotti su un sito Web, optare per un carosello di immagini potrebbe non essere l'opzione più intelligente, per quanto riguarda le conversioni. Ma se stai facendo foto o stai progettando un sito web e vuoi che abbia un aspetto esteticamente gradevole, leggi l'intero blog.

Inizia con la scelta della dimensione dell'immagine

Smart slide 3 ridimensionerà l'immagine in wordpress in base al formato di presentazione selezionato. Quindi, se le immagini sono grandi, lo strumento le ridimensionerà e viceversa. E, forse, saprai, quando le piccole immagini vengono ingrandite, la qualità inizia a deteriorarsi. Quindi, cerca di non includere immagini più piccole della dimensione del Carousel.

Inoltre, le immagini di grandi dimensioni hanno un aspetto migliore in Carousel ma hanno anche tempi di download più lunghi. Quindi, devi trovare un equilibrio tra qualità e dimensioni, quindi sembra ancora fantastico nello Slider.

Un piccolo consiglio: i caroselli di immagini scorrono orizzontalmente, quindi scegliere immagini più larghe sarà più interessante di quelle quadrate.

Installazione di Smart Slider 3

Installazione di Smart Slider 3.png

Il processo di installazione di Smart Slider 3 è praticamente lo stesso per qualsiasi altro strumento disponibile sul mercato. Per iniziare, per prima cosa, accedi alla dashboard dell'amministratore di Word Press. Sul lato sinistro, vedrai un pannello di navigazione con molte opzioni diverse tra cui scegliere. Dalle opzioni, scegli il plug-in e fai clic sul collegamento "Aggiungi nuovo".

Di fronte a te apparirà una barra di ricerca. Cerca Smart Slider 3 al suo interno. Una volta installato il plug-in, fare clic sull'opzione di attivazione.

Inizio del viaggio del carosello di immagini

Smart Slider 3 utilizza le immagini della libreria multimediale, quindi assicurati di caricare alcune immagini prima di iniziare a creare lo Slider. Puoi guardare il loro video tutorial per avere una visione migliore su come iniziare a selezionare le immagini e aggiungerle al formato di presentazione. Premi su Smart Slider 3 e ottieni il video introduttivo "Learn Smart Slider 3" che fornisce una conoscenza approfondita di come utilizzare lo strumento.

Puoi prendere l'aiuto del video o semplicemente leggere questo articolo per iniziare.

Scegli l'opzione di base dal menu.

  • Assegna un nome al tuo dispositivo di scorrimento per facilitare l'individuazione del tuo carosello quando gestisci più caroselli alla volta.
  • Larghezza e Dimensioni influiscono sulle dimensioni e sulla forma del dispositivo di scorrimento. Ignora la selezione di qualsiasi pixel che desideri configurare per occupare l'intera larghezza del dispositivo o del browser.
  • La scelta della larghezza e della dimensione predefinite imposterebbe il carosello alla larghezza e alle dimensioni attuali, mentre la scelta dell'opzione "Larghezza intera" ignorerebbe qualsiasi dimensione e farebbe ruotare il carosello per l'intera larghezza delle finestre.

Dopo aver ottimizzato l'immagine, premere "Crea".

Aggiunta di immagini al dispositivo di scorrimento

Aggiunta di immagini a Slider.png
Fonte

Dopo aver configurato la dimensione e la larghezza predefinite del Carousel, il passaggio successivo ovvio è riempire il Carousel con immagini accattivanti. Per questo, segui i passaggi seguenti:

  • Fare clic su Aggiungi immagini diapositiva in Smart Slider 3.
  • Avrai la possibilità di selezionare un'immagine per il tuo dispositivo di scorrimento. Fare clic su quell'opzione.
  • Scegli le immagini dalla libreria di wordpress.
  • Carousel presenterà quindi le immagini selezionate. Una volta che sei soddisfatto delle immagini selezionate, fai clic sulla sezione "Pubblica".

Se prevedi di inserire uno slider all'interno del codice, copia il codice PHP dallo strumento o seleziona l'opzione dell'editor di post.

Quando inizi a scrivere un nuovo blog per il sito Web, sulla pagina viene visualizzata l'opzione tre di scorrimento intelligente. Se stai utilizzando un editor classico, fai clic sull'icona del dispositivo di scorrimento intelligente. Ora seleziona lo Slider personalizzato che hai preparato in precedenza e, una volta pubblicato il post, lo Slider viene caricato sul sito Web e pronto per essere visualizzato dai visitatori.

Il Carousel avanzerà o ritornerà su entrambi i lati dei cursori per scorrere manualmente le immagini.

Per impostazione predefinita, le immagini del carosello non scorrono automaticamente, ma puoi cambiarlo.

Ciclo automatico per le immagini del carosello

Nella dashboard di amministrazione di WordPress, fai clic sul collegamento Smart Slider 3 e seleziona l'opzione di modifica. Scegli lo stile "Riproduzione automatica" e premi "Abilita". Il tempo predefinito tra il passaggio è di otto secondi. Ora salva l'impostazione aggiornata dal pulsante Salva sul lato destro del pannello.

Utilizzo del carosello come widget

Smart Slider può essere utilizzato anche come immagine di WordPress Slider. Questi cursori possono essere aggiunti ovunque come widget, come una barra laterale.

  • Vedrai un pannello di navigazione sul lato sinistro. Fare clic sull'aspetto e quindi sul collegamento "Widget".
  • Quando vedi la sezione "Widget disponibili", fai clic sul pulsante "Smart Slider".
  • Seleziona la zona in cui desideri visualizzare l'immagine e seleziona il pulsante "Aggiungi widget".

Immagini o nessuna immagine è la grande domanda

La progettazione e lo sviluppo di siti Web sono soggettivi e ciò che altri potrebbero trovare interessante, altri no. Passa attraverso diverse fasi di aggiornamenti e modifiche e il carosello di immagini era una volta il requisito più richiesto nei siti Web quando le aziende hanno iniziato a incorporarlo ovunque.

La discussione di cui sopra ha fornito una guida passo passo sull'aggiunta di un carosello di immagini al sito web. Il processo non è complesso e richiede pazienza e competenza nella selezione di immagini pertinenti per migliorare l'aspetto del sito web. I caroselli sarebbero molto coinvolgenti per un sito Web creativo, mentre non sarebbero utili in un sito Web di e-commerce.

Quindi, la prossima volta che prevedi di aggiungere immagini vivaci nei dispositivi di scorrimento, considera di valutare se aggiungerebbe valore al sito Web o inciderebbe in modo significativo sul tasso di conversione.

Ulteriori letture

  • Come ottimizzare le dimensioni dell'immagine del prodotto?
  • I migliori plugin per Zoom immagine per WooCommerce
  • Suggerimenti intelligenti per migliorare le immagini