Um usuário perguntou ?
Olá, obrigado pelo seu plugin! Como posso alterar a cor da imagem SVG com CSS? Existe um tutorial?
Obrigado
(@benbodhi)
Há 1 ano
Olá,
Fico feliz que tenha gostado do meu plugin ?
Você pode fornecer um link para o site por favor?
É muito fácil, porém, você só precisa se concentrar na classe correta do seu elemento e aplicar a cor ou a cor de preenchimento.
Por exemplo:
.your-svg-class { fill: red; color: red; }
Você provavelmente só precisa usar um desses (preenchimento ou cor), que geralmente é preenchido, mas depende especificamente do seu SVG.
Eu espero que isso ajude. Deixe-me saber como você vai.
P.S. Estou trabalhando em um site com algumas dicas e tutoriais. Ainda não há MTE, mas está sendo feito.
(@woodypad)
Há 1 ano
Olá, O site ainda é local, mas estou usando plguin para inserir apenas ícones. Eu já tentei, como você diria, mas não funciona. Preciso salvar o arquivo svg de uma maneira específica?
Obrigado
(@benbodhi)
Há 1 ano
Olá,
É difícil dizer o que está acontecendo. Normalmente você deve ser capaz de salvar. Você pode enviar o arquivo SVG para eu testar?
(@woodypad)
Há 1 ano
Olá, tentei novamente. Dentro do WPbakery e dentro de uma seção WP normal, não há nada colorido. Estou anexando um svg de teste.
Obrigado
(@benbodhi)
Há 1 ano
Você precisa ter certeza de que o SVG está em linha ou nenhum SEC tocará nos elementos que ele contém. Você pode verificar se ele é fornecido como um código SVG ou como uma tag IMG com o SVG como src.
A SEC que afetaria os 2 elementos do seu SVG que seriam fornecidos é:
circle#Ellipse_97 {
fill: green;
}
path#Path_461 {
fill: blue;
}Você pode alterar as cores para o que quiser.
Se você quiser modificar os alvos, abra seu SVG em um editor de código como texto sublime. Você pode adicionar suas próprias classes aos 2 elementos e focar neles.
(@woodypad)
Há 1 ano
Olá, desculpe, não consigo fazer funcionar… Nem mesmo com o código que você forneceu. Definitivamente, há algo que estou perdendo.
Está claro para mim como alterar o conteúdo do arquivo SVG, isso não é um problema. Mas não consigo descobrir por que não muda de cor com CSS. Algo deve ser ativado nas configurações?
Obrigado
(@benbodhi)
12 meses atrás
Olá,
Você precisaria de um modo de alto nível e precisa garantir que seu SVG seja entregue online para que você possa se concentrar nos elementos internos.
(@ graphicker29)
12 meses atrás
Eu também tenho esse problema. Implementei o modo avançado e o svg está ficando inline, mas não consigo focar nos elementos internos com CSS.
Esta resposta foi modificada há 12 meses por.
(@benbodhi)
11 meses, 4 semanas atrás
Olá @grafiker29
Você realmente deve iniciar seu próprio tópico, mesmo que pareça.
Se o seu SVG estiver embutido e você vir os elementos dentro do inspetor, tudo o que você precisa fazer é usar o CSS necessário para manipular esses elementos.
Se você tem um SVG embutido, esse é o fim da linha para o meu plugin, o resto é completamente externo.
Geralmente, se você não pode mudar algo com CSS, você precisará aumentar a especificidade.
Por exemplo, se isso não funcionar:
.your-svg-class { fill: red; }
Parece que algum CSS de alto nível já está lhe dizendo qual será a cor… Ou as cores já estão localizadas dentro do seu código SVG.
Você só precisa ser o mais específico possível. O seguinte é uma excelente versão de:
html body .your-svg-class {fill: red;}
Isso pode até não funcionar, você precisa ser específico para o código exato. Mas espero que isso ajude.
Só para ficar claro, isso acontece depois que meu plugin faz sua postagem. Você pode precisar encontrar um desenvolvedor para corrigir o SEC para você.
Este ano vou montar um site cheio de recursos para ajudar as pessoas a usar o poder do meu plugin. Vou descobrir como escrever CSS para manipular seus elementos SVG.
Enquanto isso, se você quiser que eu dê uma olhada, abra um novo tópico e compartilhe seu URL e informações sobre o problema. Vou levá-lo rapidamente.
Isto foi útil?
0 / 0