Precisa criar uma barra de progresso gradiente em Elementor ?
Elementor tem um Widget da barra de progresso nativo que você pode usar para adicionar coisas como nível de habilidade ou o progresso de algo à página ou modelo que você criar.
Ao usar este widget, você pode personalizar sua aparência alterando a cor e a tipografia do texto. Este widget permite apenas que você use uma cor sólida para a barra.
Mas é possível criar uma barra de progresso com uma cor gradiente?
Se você tem habilidades em CSS, você pode usar a versão pro doElementor e adicione CSS personalizado ao widget Barra de progresso para criar uma barra de progresso de gradiente. Alternativamente, você pode instalar um complemento que oferece um widget de barra de progresso onde você pode escolher uma cor de gradiente ao alterar a cor.
Dois add-ons que oferecem tal widget são Complementos essenciais et JetElements. Mas vamos nos concentrar em complementos essenciais
Criando uma barra de progresso degradada no Elementor usando Add-ons essenciais
Essential Addons é um dos complementos Elementor o mais popular. Ele oferece mais de 60 widgets, incluindo um widget de barra de progresso que você pode usar para criar uma barra de progresso gradiente. Essential Addons é um complemento freemium. O widget Barra de Progresso está disponível na versão gratuita.
Você pode baixar o versão gratuita deste complemento no diretório oficial de plug-ins do WordPress.
Descubra o nosso guia em Como instalar (adicionar) um plugin no WordPress
Depois de instalar e ativar este plug-in, crie uma página ou modelo e edite-o com o Elementor e arraste o widget Barra de progresso para a caixa de edição.
Selecione o estilo da barra de progresso que deseja criar no menu suspenso de opções Layout. Existem 6 estilos de barra de progresso para você escolher. Para criar uma barra de progresso gradiente, você precisa selecionar o estilo Linha.
Defina o título, o valor do contador e a duração da animação. Uma vez feito isso, vá para a guia Style e abra o bloco Preencher. Na opção Tipo de fundo, selecionar Degradado e defina a primeira cor e a segunda cor. Você também pode definir o tipo de gradiente (linear ou radial), localização e ângulo.
Você pode abrir outros blocos de opções na guia Style para definir outras opções de estilo.
Obtenha o Elementor Pro agora!
Conclusão
Aqui está ! É isso neste artigo que mostra como criar uma barra de progresso gradiente no Elementor. Se você tiver alguma dúvida sobre como chegar lá fdeixe-nos saber no Comentários.
No entanto, você também pode consultar nossos recursos, se você precisar de mais elementos para realizar seus projetos de criação de sites da Internet, consultando nosso guia no site Criação de blog WordPress ou aquele em Divi: o melhor tema WordPress de todos os tempos.
Mas enquanto isso, compartilhe este artigo em suas diferentes redes sociais.
...
