Deseja aplicar a máscara de imagem em Elementor ?

Um truque simples pode determinar o design geral da sua página. Ao criar uma página com Elementor, talvez você queira aplicar uma máscara de imagem para tornar as imagens da sua página destacadas e exclusivas. Infelizmente, Elementor não possui uma opção de estilo padrão para aplicar a máscara de imagem a uma imagem.

Se você usar Elementor Pro e tiver conhecimento de CSS, você pode adicionar CSS personalizado para aplicar a máscara de imagem a uma imagem. Se você não tem conhecimento de CSS, você pode usar o Plugin de complemento Happy Addons para aplicar máscara de imagem no Elementor.

Happy Addons é um addon freemium Elementor que vem com uma função para aplicar a máscara de imagem. Esse recurso em si está disponível apenas na versão pro, portanto, você precisa usar a versão pro do Happy Addons para usar esse recurso.

A propósito, o que é a máscara de imagem?

O mascaramento de imagem é um processo de ocultar certas partes de uma imagem para enfatizar outras partes. Este processo é frequentemente aplicado em ferramentas de edição de imagens como Photoshop e GIMP.

Aqui está o exemplo.

O CSS basicamente tem um recurso para aplicar a máscara de imagem. Mas, novamente, você deve ter habilidades de CSS para usá-lo. você pode ler cet article para mais informações.

Happy Addons é uma ótima solução para aplicar máscara de imagem no Elementor se você não tiver nenhum conhecimento de CSS.

Como funciona isto

O recurso Aplicar máscara de imagem funciona em widgets Elementor que manipulam uma imagem, como widget de imagem e widget de caixa de imagem. Você verá uma nova opção chamada Máscara de imagem logo abaixo do seletor de imagem. Você pode escolher entre trinta e nove diferentes formas de máscara. Você também pode usar uma forma de máscara personalizada carregando um arquivo SVG.

Como aplicar máscara de imagem

Antes de começar, certifique-se de ter instalado e ativado a versão pro do Happy Addons no seu site WordPress. você pode obtê-lo em seu site oficial.

Quando tudo estiver pronto, crie uma nova página e edite lá com o Elementor, ou você também pode editar uma página existente. Adicione um widget que envolva uma imagem — como o widget Imagem — à caixa de edição.

aplique máscara de imagens no Elementor com complementos Happy

Vá para o painel esquerdo e clique no seletor de imagens no Imagem bloco sob o Conteúdo guia para selecionar uma imagem que deseja usar. Depois de selecionar a imagem, clique no ícone de lápis na Máscara de imagemopção g.

aplique máscara de imagens no Elementor com complementos Happy

Selecione uma forma de máscara que você gosta. Você também pode definir a posição do mascaramento, definir o tamanho e repetir. Se você quiser usar uma forma de máscara personalizada usando um arquivo SVG, clique no ícone da imagem (ao lado do ícone Happy Addons).

aplique máscara de imagens no Elementor com complementos Happy

Depois de terminar a configuração de mascaramento de imagem, você pode ir para Style guia para personalizar sua imagem, como definir o tamanho e aplicar filtros. Publique sua página assim que terminar de editá-la.

Obtenha o Elementor Pro agora !!!

Conclusão

Aqui ! É isso neste artigo que mostra como aplicar máscara de imagem no Elementor. Se você tiver alguma dúvida sobre como chegar lá, avise-nos dentro 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.

...