Home › Forums › Support › Two almost identical SVG:s behave differently and produce GP width/height error
- This topic has 16 replies, 3 voices, and was last updated 1 year ago by David.
-
AuthorPosts
-
March 27, 2023 at 6:51 am #2584012NrH
Hello. I have two almost identical SVG:s, one that is an older version of my logo and one that is a newer version. The older version, which is the same exact image except with different colors, works fine with GP, but the new one, when I use it, gives me this error:
“Notice: Undefined index: width in /home/customer/www/domain/public_html/wp-content/plugins/gp-premium/menu-plus/functions/generate-menu-plus.php on line 2074”
I have looked at the SVG:s to try find out the differences but I just can’t see any, and yet, one works great with GP and the other doesn’t.
What can the issue with this be?
March 27, 2023 at 9:05 am #2584379DavidStaffCustomer SupportHi there,
this kind of issue occurs if WP cannot get work out what the
width
of the image is.
Which with SVGs can be complex. Are therewidth
attributes in the<svg>` code ?
March 27, 2023 at 11:01 am #2584560NrHHi David! I’ve tried with and without width and the one that works does not have width-attributes in it.
Both don’t have the attributes and yet one works and the other doesn’t. And if I try add width and height to the one that doesn’t work it still doesn’t work. And I can see no differences in their source code.
If I upload them to WordPress, I can see the image the doesn’t work in the previews, and the image that does work doesn’t show in the previews. Please see the private information. Maybe that has something to do with it? Thank you!
March 27, 2023 at 7:10 pm #2584908Fernando Customer SupportHello there,
Can you try adding a plugin like this?: https://wordpress.org/plugins/safe-svg/
After adding this plugin, try re-adding your SVG.
March 28, 2023 at 4:24 am #2585368NrHHi Fernando! Amazingly, that fixed it. Weird. Perhaps it is the way Illustrator formats files or something, because I see no differences in the content of the SVGs.
Nevertheless, whatever Safe SVG does, it fixed it for me. Thank you
March 28, 2023 at 11:07 am #2586056NrHActually, I have to add, Safe SVG was breaking the SVG:s, but they were still showing because of my browser cache. Now, a few hours later, I see the SVG isn’t working on the site after uploading it with Safe SVG, and the SVG gives this error:
“error on line 1 at column 65: Entity ‘ns_extend’ not defined”
So Safe SVG doesn’t solve it either.
What can the issue be? This is not feasible. I am generating 18mb of GeneratePress errors a day, and there is seemingly nothing we can do it beside using the old logo.
March 28, 2023 at 5:36 pm #2586361Fernando Customer SupportDoes this only occur for the new Logo SVG you’re using?
If you try to use an icon from here for instance: https://icons.getbootstrap.com/ does it work?
Can you share the “new” SVG file you’re using? I’ll try uploading it on my test site to see what will happen. You can probably use Google Drive for this.
March 29, 2023 at 5:21 am #2587018NrHI don’t seem to be able to upload SVGs from that website to my site. It says I don’t have the permissions.
I added the SVGs I am trying to make work to the private information of this post.
March 29, 2023 at 5:39 am #2587043DavidStaffCustomer SupportTry opening your SVGs in this app:
https://jakearchibald.github.io/svgomg/
And download the copies it creates, it will remove a lot of useless meta data including all the stuff adobe left behind. Then try its copies.
March 29, 2023 at 7:04 am #2587168NrHNope, still same behavior. Per the information I added to the private information earlier, the issue should be replicable. I can’t figure out why Generate Press continues to throw the error despite adding the width/height attributes
March 29, 2023 at 7:43 am #2587231DavidStaffCustomer SupportI passed both of them through the optimizer.
Then opened them in Affinity Designer, compounded the paths to reduce the code.
Then tried both on my test site and they work.March 29, 2023 at 7:57 am #2587393NrHHi David, thank you, downloaded. Yep, now it works. This is so weird, but I’ll remember those steps for the future. Will also keep the old versions and the new to compare them in case this arises in the future.
Thank you again! Love it if the files could be removed
Thank you again so much! πππ»March 29, 2023 at 8:11 am #2587413DavidStaffCustomer SupportAdobe saves its SVGs with a lot of proprietary meta, all of which has to be sanitizied when they are uploaded. And the more code the more chances something gets messed up, and WP cannot provide the relevant info for the logo.
There are some tutorials online about exporting them from illustrator without all the cruft π
Glad to be of help. Files removed.
March 30, 2023 at 11:57 am #2589386NrHWanted to add, in case anybody stumbles upon this in the future. The issue turned out to have been SiteGround, which adds a meta_value called “_wp_attachment_metadata” to all images uploaded to WP when it’s hosted on their platform. The value is added to the database table postmeta. I figured given the files had no differences, it had to have been some meta_value injected by WP that produced a different behavior with the two SVGs. I removed that meta_value and now it works.
Writing this here in case I encounter this issue again or someone else does. Thank you again GP for great help π ππ»
March 31, 2023 at 1:31 am #2590155DavidStaffCustomer SupportThe
_wp_attachment_metadata
meta data is generated by WordPress by thewp_generate_attachment_metadata
function when an image is uploaded.https://developer.wordpress.org/reference/functions/wp_generate_attachment_metadata/
The problem with SVGs is they do not have a fixed
width
andheight
like a JPEG or PNG, which can result in a undefined value being saved in the attachments meta data.So removing the metadata values will resolve the issue but is probably not the best method for resolving the issue if you can fix it at the source ie. the
SVG
HTML.I just wanted to clarify this as its not a Siteground specific issue.
-
AuthorPosts
- You must be logged in to reply to this topic.