È necessario creare una barra di avanzamento del gradiente Elementor ?
Elementor ha un Widget della barra di avanzamento nativo che puoi usare per aggiungere cose come il livello di abilità o l'avanzamento di qualcosa alla pagina o al modello che crei.
Quando si utilizza questo widget, è possibile personalizzarne l'aspetto modificando il colore e la tipografia del testo. Questo widget consente solo di utilizzare un colore solido per la barra.
Ma è possibile creare una barra di avanzamento con un colore sfumato?
Se hai competenze in CSS, puoi utilizzare la versione pro diElementor e aggiungi CSS personalizzato al widget Barra di avanzamento per creare una barra di avanzamento sfumata. In alternativa, puoi installare un componente aggiuntivo che offre un widget della barra di avanzamento in cui puoi scegliere un colore sfumato quando cambi colore.
Due componenti aggiuntivi che offrono un tale widget sono Componenti aggiuntivi essenziali et JetElements. Ma ci concentreremo su Essential Addons
Creazione di una barra di avanzamento degradata in Elementor utilizzando Essential Addons
Componenti aggiuntivi essenziali è uno dei componenti aggiuntivi Elementor il più popolare. Offre oltre 60 widget, incluso un widget Barra di avanzamento che puoi utilizzare per creare una barra di avanzamento sfumata. Componenti aggiuntivi essenziali è un componente aggiuntivo freemium. Il widget Barra di avanzamento è disponibile nella versione gratuita.
Puoi scaricare il versione gratuita di questo componente aggiuntivo nella directory ufficiale dei plugin di WordPress.
Scopri la nostra guida su Come installare (aggiungere) un plugin su WordPress
Dopo aver installato e attivato questo plug-in, crea una pagina o un modello e modificalo con Elementor e trascina il widget Barra di avanzamento nella casella di modifica.
Seleziona lo stile della barra di avanzamento che desideri creare dal menu a discesa delle opzioni Layout. Ci sono 6 stili di barra di avanzamento tra cui scegliere. Per creare una barra di avanzamento del gradiente, devi selezionare lo stile Linea.
Imposta il titolo, il valore del contatore e la durata dell'animazione. Una volta fatto, vai alla scheda Style e apri il blocco Riempire. Nell'opzione tipo di sfondo, selezionare Degradato e impostare il primo colore e il secondo colore. È inoltre possibile definire il tipo di gradiente (lineare o radiale), la posizione e l'angolo.
Puoi aprire altri blocchi di opzioni nella scheda Style per impostare altre opzioni di stile.
Ottieni Elementor Pro ora!
Conclusione
Ecco ! Questo è tutto per questo articolo che mostra come creare la barra di avanzamento del gradiente in Elementor. Se hai dubbi su come arrivarci ffacci sapere in commentaires.
Tuttavia, puoi anche consultare le nostre risorse, se hai bisogno di più elementi per realizzare i tuoi progetti di creazione di siti Internet, consultando la nostra guida su Creazione di blog WordPress o quello acceso Divi: il miglior tema WordPress di tutti i tempi.
Ma nel frattempo, condividi questo articolo sui tuoi diversi social network.
...
