Hello, I am looking for some assistance from the community.
I have recently discovered that using .svg is a preferred way to upload vector files onto my website. They have lossless quality and weigh close to nothing.
The difficulty I am facing is the improper visualization of such files on my website. Until recently, I did not know that additional steps had to be taken for the .svg file type to be correctly uploaded. I have activated the “SVG Support” plug-in and optimized all the settings, but to my surprise, the files are still not showing up correctly.
Here are a few issues that I am experiencing:
1. Some of the images do not appear on the page. There is an appropriate place for them, but it is reflected as blank space. If you click on the empty space, the image appears.
2. Some of the images do not show up as they should. Ex. only background is present.
3. The sizing of specific files was changed after the “SVG Support” plug-in was installed. My logo increased in size.
Additionally, I have browsed around to see if there are other ways to approach this. The first way is the plug-in route, which I used, and the second is the manual configuration, and I wonder if the manual approach is the better option overall.
​
I found a few possible explanations for this, but I am not sure how to fix it:
* Improper sizing – size has to be predetermined(I thought this would happen by default when I uploaded the file since I chose the size of the SVG file)
* Visualization program that doesn’t know how to format these files
* The possible intervention of caching apps
Here is a little more information:
I have W3 Cache and Cloudflare installed, possibly colliding with each other. To see some changes, I need to keep flushing my cache for both plug-ins, and that may be causing issues. I am using Elementor Pro as my primary development and visualization tool, possibly Elemntor not registering certain things.
​
Appreciate your feedback
[ad_2]
Share your url