SVG rendered only when logged in

Hi,
Thanks!

I’m not sure how being logged in or not would affect them at all…
Sounds like some other conflict.
I can take a look though if you shoot me the url

Hi,

Thanks. The URL is https://goo.gl/qxdeDr

I do see https://goo.gl/ybrDLO when unlogged, and https://goo.gl/TjpCfO when logged.

cool, thanks…
so, as you say, it has not swapped out the IMG tags for your SVG code, i can see that it’s still IMG tags.
Maybe go into your text/html editor instead of visual and remove the width and height attributes and all the other classes (keeping the style-svg class of course) like this:
<img src="https://cdn.theplanetarysystem.org/wp-content/blogs.dir/8/files/2014/10/test1.svg" class="style-svg" />
see if that makes any difference.
If that doesn’t help, I’m not sure what’s happening, it must be a conflict with another plugin. In which case you could test by deactivating all other plugins and see if it works then (which it should), then one by one turning them all back on and checking to see if it works each time to find the culprit.

If it does come to that, I would love to know of any conflict so I can try to work out why that would happen.

Oh, I know what it is!

Your image will need to be hosted on the same domain because calling XML from another origin is not allowed by the browser for security reasons. This is in the inspector:

XMLHttpRequest cannot load https://cdn.theplanetarysystem.org/wp-content/blogs.dir/8/files/2014/10/test1.svg. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘https://test.theplanetarysystem.org’ is therefore not allowed access.

If you upload the SVG’s directly to your WordPress media library it should work fine.

Interesting. It does work. You can test the URL again.

In addition, in the editor, I see the preview of the simpler <img, whereas I did/do not see the preview of the complex one. Ref. https://goo.gl/yZcUJt

Please note, those img attributes were inserted automatically when I Add Media, chose the SVG file and add it. Shouldn’t the media selector insert the right code?

yeh unfortunately the WP media selector chucks in a bunch of code with classes etc which for the majority is fine, but in this case pretty annoying.
I might look into a way to strip it all out if it’s an SVG being embedded.

Glad you got it sorted… So it can be hosted on a different sub domain then? That’s something I haven’t even tried.

Regarding your last comment on XMLHttpRequest, probably that is due because https://cdn.theplanetarysystem.org/wp-content/blogs.dir/8/files/2014/10/test1.svg is in the img tag and not considered XML.

The SVG is working if I edit the <img> attributes manually as you suggested.

It also works if I use <object>, but your solution it’s nicer.

Well, cdn is actually on an AWS CloudFront bucket, but yes, I suppose the request of the resource (the SVG) is handled by the browser, not by WP.

I now got it sorted out. If you manage to tweak the code inserted by the media selector for the SVG files, it would be a nice feature.

Thank you very much for the support.

Awesome ??
It would be a cool plugin of it’s own “no more media bloat” or something.
I am certainly looking into this feature now.
Cheers for the support!

P.S. I am not sure how the plugin work: it might be just that you need to parse all the class attribute’s values and look for “type-svg”… Perhaps the plugin now assumes <img> has only one class value. ??

I wouldn’t have thought it would matter having all the other stuff in there, but just thought may as well remove it all and try because it all is removed when the SVG code goes in anyway.

But yeh, I will run a bunch of tests on this aspect and see what’s happening and try to work a solution to include in the plugin in the future.

Hello,

Just wanted to shoot you an update…
“If you manage to tweak the code inserted by the media selector for the SVG files, it would be a nice feature.”
In the latest version of my plugin (2.2), I have added a checkbox in the settings (Dashboard > Settings > SVG Support) that allows you to automatically apply the custom class and also strips the WordPress default classes when inserting any images.

Additionally, any SVG file that is added will have the width and height attributes removed automatically, regardless of the checkbox option.

Hope you are still enjoying the plugin ??

Nice work. Thanks for following up. Really appreciated!

My Pleasure!
Sorry for the ridiculous wait!