Con ElementsKit, puoi presentare i membri del tuo team al tuo sito web con un elegante carosello scorrevole. Utilizzando il widget Elementor Team Carousel Slider puoi mostrare le carte dei membri del team con foto, nomi, designazioni, descrizioni, collegare profili social e altro ancora.

Leggi questa documentazione per scoprire come utilizzare il widget Elementor Team Carousel Slider di ElementsKit.

Plugin richiesti: #

• Elementore: Scarica plug-in.
• ElementsKit Lite: Scarica plug-in.
• ElementsKit Pro: Ottieni il plug-in.

Passaggio 1: attiva il widget cursore carosello del team #

Innanzitutto, devi abilitare il widget dalla dashboard di WordPress. Per abilitare il widget Dispositivo di scorrimento carosello team:

1. Navigare verso ElementsKit > Widget.
2. Trovare il Dispositivo di scorrimento della squadra dall'elenco e abilitare il widget.
3. Clicca sul SALVARE LE MODIFICHE.

Passaggio 2: trascina e rilascia il widget #

Successivamente, trascina e rilascia il widget ElementsKit Team Carousel Slider nell'editor di Elementor.

Passaggio 3: configura il widget Carousel del team Elementor #

La scheda Contenuto ti consente di configurare i contenuti dei membri del team e le impostazioni del dispositivo di scorrimento del carosello del team.

3.1 Contenuto della squadra #

Il widget del dispositivo di scorrimento della squadra ha le seguenti funzionalità:

1. Stile: Il widget viene fornito con 12 stili diversi tra cui predefinito, sovrapposizione, passaggio del mouse sui social, sovrapposizione con dettagli e così via. 

Nota: Stili diversi vengono forniti con opzioni e impostazioni individuali. Le opzioni verranno discusse nella parte successiva di questa documentazione.

2. Abilita popup: I dettagli del membro del team appariranno in un popup quando si fa clic sul nome.
3. Visualizza profili social: Per collegare il profilo dei social media ai dettagli dei membri del team.
4. Descrizione dello schermo: Per mostrare una breve descrizione del membro del team.
5. Pulsante di visualizzazione: Per aggiungere un pulsante che potrebbe collegarsi al profilo o al portfolio del membro.

Dettagli dei membri del team #

Puoi aggiungere membri del team allo slider facendo clic su AGGIUNGI ARTICOLO pulsante ed eliminare un membro esistente con il ✖ pulsante. Inoltre, puoi copiare i dettagli del membro del team.

Sotto il contenuto del membro:

1. Scegli l'immagine del membro: Aggiungi la foto del membro del team.
2. Nome del membro: Inserisci il nome del membro del team.
3. Posizione del membro: Menziona la designazione del membro del team.
4. Informazioni sul membro: Aggiungi una breve descrizione del membro del team.

Contenuto del pulsante:

1. Icona: Decidi se mostrare l'icona del pulsante e scegli un'icona.
2. Posizione dell'icona: Imposta la posizione dell'icona prima o dopo il testo.
3. Testo: Inserisci il testo del pulsante.
4. URL del collegamento: Aggiungi un URL per collegare il pulsante a una pagina.

Contenuto popup:

Nel contenuto popup, puoi aggiungere il file Numero di telefono E E-mail del membro della squadra.

Sotto i contenuti social:

Puoi collegare fino a 5 account di social media. Per ogni profilo social, puoi aggiungere un Profilo URLe utilizzare individuale Icone per ogni social media.

3.2 Impostazioni del cursore #

Le seguenti opzioni sono disponibili nelle Impostazioni dello slider del widget Elementor Team Carousel:

1. Spaziatura: Regola lo spazio tra ogni diapositiva.
2. Diapositive da mostrare: Imposta il numero di diapositive da mostrare su una singola finestra.
3. Diapositive da scorrere: Decidi quante diapositive scorrere alla volta.
4. Riproduzione automatica: Abilita la riproduzione automatica per scorrere automaticamente le diapositive.
5. Velocità: Quando la riproduzione automatica è abilitata, imposta la velocità di scorrimento in millisecondi (ms).
6. Pausa al passaggio del mouse: La riproduzione automatica verrà messa in pausa quando l'utente passa il mouse sul dispositivo di scorrimento.

7. Mostra freccia: Per abilitare la navigazione tramite freccia per lo slider.
8. Mostra freccia al passaggio del mouse: Le frecce sono visibili solo quando si passa il mouse.
9. Tipo di freccia: Scegli il tipo di freccia tra le opzioni fornite: Freccia, Testo e Testo con freccia.
10. Icona freccia sinistra: Puoi scegliere un'icona per la freccia sinistra dalla libreria di icone.
11. Icona freccia destra: Puoi scegliere un'icona per la freccia sinistra dalla libreria di icone.
12. Mostra punti: Per abilitare la navigazione tramite punti per lo slider.

• Velocità E Pausa Passa il mouse le opzioni vengono visualizzate solo quando la riproduzione automatica è abilitata.
• Mostra Arros al passaggio del mouse, Tipo di freccia, Icona della freccia sinistra, E Icona della freccia destra le opzioni vengono visualizzate solo quando "Mostra freccia" è abilitato.

Passaggio 4: personalizza gli stili del widget Carousel del team Elementor #

Puoi personalizzare ogni aspetto dello slider del carosello della squadra e creare uno stile che si adatti al tuo marchio.

4.1 Contenuto #

Per personalizzare l'area contenuto dello slider:

• Scegli il Tipo di sfondo E Colore di sfondo per lo stato “Normale” e lo stato “Hover”.
• Seleziona un Animazione al passaggio del mouse dalle opzioni fornite.
• Impostare il Allineamento per il contenuto a sinistra, a destra o al centro.
• Aggiusta il Imbottitura, Imbottitura dei contenuti, E Raggio del confine per l'area dei contenuti.

4.2 Immagine #

Per personalizzare gli stili di immagine nel dispositivo di scorrimento del carosello del team Elementor,

1. Impostare il Dimensione dell'immagine da visualizzare.
2. Aggiusta il Altezza e larghezza dell'immagine.
3. Imposta un Scatola Ombra per l'immagine visualizzata.
4. Imposta un'ombra della casella per l'immagine nel popup.
5. Regolare Raggio del confine, Imbottitura, E Margine per l'immagine del membro del team.
6. Cambiare il Tipo di sfondo E Colore di sfondo.

4.3 Nome #

Puoi modificare gli stili dei nomi dei membri del team.

1. Impostare il Tipografia del nome.
2. Scegliere Colori per lo stato “Normale” e “Hover”.
3. Aggiusta il Margine superiore e Margine inferiore per il nome del membro.

4.4 Designazione #

Puoi modificare gli stili di designazione dei membri del team.

1. Impostare il Tipografia della designazione.
2. Scegliere Colori per lo stato “Normale” e “Hover”.
3. Aggiusta il Margine inferiore.

4.5 Descrizione #

Puoi personalizzare gli stili delle descrizioni dei membri del team.

1. Impostare il Tipografia della descrizione.
2. Scegliere Colori per lo stato “Normale” e “Hover”.
3. Aggiusta il Margine attorno alla descrizione.

4.6 Pulsante #

Per personalizzare gli stili dei pulsanti,

1. Impostare il Tipografia del testo del pulsante.
2. Scegli il pulsante Colore del testo.
3. Selezionare Tipo di sfondo E Colore di sfondo.
4. Scegli il Tipo di bordo per il pulsante.
5. Impostare il Raggio del bordo, imbottitura, E Margine per il pulsante.

Puoi impostare singoli colori del testo, colori di sfondo e colori dei bordi per lo stato "Normale" e lo stato "Al passaggio del mouse".

4.7 Icona del pulsante #

Se utilizzi l'icona di un pulsante, puoi personalizzarne gli stili,

1. Scegli il Colore per l'icona del pulsante.
2. Seleziona un Passa il mouse su Colore per l'icona del pulsante.
3. Regola l'icona Misurare.
4. Impostato Margine attorno all'icona del pulsante.

4.8 Profilo socialeS #

Puoi personalizzare le icone del profilo social con il widget carosello del team Elementor,

1. Cambiare il Allineamento delle icone sociali.
2. È possibile selezionare il Schermo layout delle icone del profilo social dalle opzioni fornite: Blocco in linea E Bloccare.
3. Regola il generale Dimensioni dell'icona.
4. Abilita il Utilizza Altezza Larghezza funzione per regolare individualmente larghezza, altezza e altezza della linea.
5. Puoi scegliere l'icona Colore, Colore di sfondo, E Tipo di bordo.
6. Impostare il Raggio del confine, Imbottitura, E Margine per le icone dei profili social.

4.9 Controlli modali #

Quando abiliti il popup, questa opzione Controlli modali è disponibile. Con il widget sono disponibili i seguenti controlli modali,

Sovrapposizione:

1. Scegli la sovrapposizione Tipo di sfondo.
2. In base al tipo di sfondo, scegli lo Sfondo Colore per sovrapposizione.

Modale:

1. Scegli il modale Tipo di sfondo.
2. In base al tipo di sfondo, scegli lo Sfondo Colore per il modale.

Nome:

1. Scegli un colore per il membro Nome.
2. Impostare il Tipografia per il testo del nome.
3. Aggiusta il Margine inferiore per il nome.

Designazione:

1. Scegli un colore per i membri Designazione.
2. Impostare il Tipografia per il testo della designazione.
3. Aggiusta il Margine inferiore per la designazione.

Descrizione:

1. Scegli un colore per Descrizione del membro della squadra.
2. Impostare il Tipografia per il testo della descrizione.
3. Aggiusta il Margine inferiore per la descrizione.

Telefono ed e-mail:

1. Impostare il Tipografia per il testo del telefono e dell'e-mail.
2. Scegli un testo Colore per il telefono e l'e-mail.
3. Aggiungere un Passa il mouse su Colore per il telefono e l'e-mail.

4.10 Icona Chiudi #

Per il popup è possibile personalizzare l'icona Chiudi.

1. Seleziona un Chiudi icona dalla libreria di icone di Elementor.
2. Impostare il Chiudi allineamento icone a destra o a sinistra.
3. Puoi scegliere Colore dell'icona, Colore di sfondo dell'icona, E Tipo di bordo.
4. Inoltre, imposta il Raggio del confine E Imbottitura per l'icona di chiusura.

4.11 Frecce #

Se abiliti la navigazione tramite freccia, puoi personalizzarne gli stili.

1. Aggiusta il Misurare delle Frecce sulla giostra.
2. È possibile impostare il Posizione della freccia. La posizione della freccia sinistra e la posizione della freccia destra possono essere regolate individualmente.

3. Seleziona un Colore della freccia.
4. Scegli una freccia Colore di sfondo.
5. Seleziona il Tipo di bordo per le frecce.
6. Impostare il Raggio del confine per le frecce.
7. Aggiusta il Imbottitura.

4.12 Punti #

Se i punti sono abilitati, puoi personalizzare gli stili dei punti.

1. Aggiusta il Spazio in mezzo i punti.
2. Regola i punti Spaziatura dall'alto verso il basso.
3. Puoi cambiare il Opacità dei punti.
4. Impostare il Larghezza dei punti.
5. Impostare il Altezza dei punti.
6. Aggiungere un Raggio del confine per i punti.
7. Seleziona un Tipo di sfondo e il colore dello sfondo.

Attivo:

È possibile personalizzare il punto attivo separatamente.

1. Scegliere Tipo di sfondo e Colore per il punto attivo.
2. Seleziona un punto attivo Colore.
3. Regolare Scala (dimensione) dei punti attivi.
4. Aggiusta il Larghezza dei punti attivi.
5. Aggiusta il Altezza dei punti attivi.
6. Seleziona il Tipo di bordo.

Finalmente, il carosello della squadra è pronto per essere esposto. Il widget Elementor Team Carousel Slider viene fornito con ElementKits Pro. Ottieni il plug-in per progettare siti Web sofisticati con funzionalità avanzate come Elementor Team Carousel Slider e altro ancora.