SVGs not visible

Can you please tell me if the theme supports SVG in the various sections?

I have SVG for the logo images and those work just fine.

I have many more in the homepage but none of them is visible. As a test, I have tried the same image in both logo and the section you can see in the screenshot attached, and it only displays it as a logo in the header. So, it’s not a problem with the files.

Between 2 sections there are 13 svg images. The only one shown is a png I used as a test.

Attachments:

You must be logged in to view attached files.

Hello,

Please provide your login URL.

Best Regards

Hello,

sorry I thought I did

Hello,

I cannot log in, please check your credentials.

Best Regards

Hello Elise,

My bad, it works now. Please try again and let me know

Hello,

Please provide your FTP access to the private are we need to check deeper.

Best Regards

What do you mean exactly?

Do you mean the cPanel?

It must be. Find the details in the private area.

Don’t know if it’s related, but there are many things behaving weirdly, I have opened several tickets.

– Plugin updates aren’t shown in Appearance > Install plugins
– A correctly uploaded custom font is displayed as a totally different font in Slider Revolution
– Cannot set a global header

Please let me know.

Hello,

We have checked and see that the problem is caused by this file: file_get_contents please contact your host support on this issue.

Best Regards

Hi,

Could you be more precise? What should I say to them exactly?

Also, are those other problems still related to that file?

– Plugin updates aren’t shown in Appearance > Install plugins
– A correctly uploaded custom font is displayed as a totally different font in Slider Revolution
– Cannot set a global header

Hello,

Please let them know that the file file_get_contents causes the problem with SVG display on the site and show them this screen: http://prntscr.com/ur13et

Best Regards

Hello,

Thank you, the problem with SVGs was solved.

Can you please tell me if those other problems are related with that file in any way?

Because so far I still have those issues.

Kind regards

Hello,

What other problems do you have, please provide the details and screens?

Best Regards

Hello, when hosting support fixed that file you told me, everything was working fine, but now some of the icons changed color. They are green instead of blue.

Can you please tell me how to fix this?

Please check the screenshots.

Attachments:

You must be logged in to view attached files.

Hello,

Please update your site admin access. I cannot log in with the provided credentials.

Best Regards,

Please check now

Hello,

Please try to clear the browser cache. Here is what I see https://prnt.sc/ut18fq Also, disable the maintenance mode and check how it works in incognito for not authorized.

Best Regards

Hello,

I’ve checked from incognito and the problem remains.

The problem is not in the section you showed in the screenshot, it is the one below that.

Please check my screenshot above.

Hello,

This color is inside the SVG image https://prnt.sc/utgdwo you need to recreate or edit it.

Best Regards

Hi,

I’m not sure to understand.

The SVGs are all blue, you can check the media yourself. They are all the same colors, you can also check the screenshot I’ve sent you earlier.

Besides, they all used to be blue on the front end as well.

Please check those things I mentioned and let me know.

Hello,

Embedded SVG styles applied to each individual image cant be removed by WordPress theme. If your SVG styles classes use the equal name they will interfere with each other. You can open your SVG image in any text editor and manually change styles to inline like is shown on this screenshot https://prnt.sc/loz0mw.

If you create SVG in Adobe Illustrator we would suggest exporting SVG with appropriate CSS properties in the first place. During export from Illustrator choose style attributes. You can read more about resolving this issue in Illustrator here https://cobwwweb.com/inline-style-attributes-svg-elements.

Below I add an example file of the correct use of SVG styles.

Best Regards,

Attachments:

You must be logged in to view attached files.

Hello Elise, thanks for your reply.

May I ask why this is happening only on 4 of those 14 SVGs? They were all done in the same exact way.

Also, why they used to be blue and now, all of a sudden they turned green?

I mean, is this normal behaviour?

Hello,

The SVG images are differently created.

You need to replace <path class="st0"></path> with <path style="color:#558063"></path>-and color would not change.

Best Regards

Oh ok! One last thing, can you please tell me how I can check the CSS attached to those images?

The SVG images were created by my designer with Adobe Illustrator, and we’ll modify them with AI.
I was just wondering how I can check them myself without AI.

Thanks in advance.

Hello,

You can check it with the Chrome inspector. I would suggest you to show the correspondence to your designer he would understand what to change.

Best Regards

Elise I just checked the color you told me to use, and it’s green. I need those icons to stay blue.

You need to replace <path class=”st0″></path> with <path style=”color:#558063″></path>

I don’t think the code above is correct. Maybe I got it wrong, but am I mistaken in thinking that if I use that code those SVG images will become Green?

Hello,

I have just provided a sample for your designer. He should remove the class from SVG and add the color as <path style=”color:#558063″></path> Let him insert the correct color.

Best Regards

[Author]

Posts