Highlighted

HTML5 topic content blank in IE when SVG images are used in Topic.slp

Participant ,
Dec 04, 2017

Copy link to clipboard

Copied

Using RH 11.4.0.291

Exporting HTML5

Using Internet Explorer 11

I've been asked by our Design team to replace the PNG logo I've been using in the Topic.slp file for some SVG code they've given me - basically, they've designed the logo in Illustrator, and exported it as SVG, and given me the inline code to use.

The resulting output works fine in Chrome, but when we test the site in IE, no content will appear in the topic frame. The logo appears okay - but somehow the SVG code is affecting the topic frame, and it just remains blank. I do have examples of SVG images in other topics, and they display just fine, otherwise. It's only when I try to use that code in the topic.slp file, that there's an issue.

Furthermore, when we click through the Table of Contents (which appears to display okay), it'll refresh itself, as if we've started again. Sometimes I do see the topic content flash into the entire IE window, but within a fraction of a second it has disappeared.

I've tried exporting my own SVG code from Illustrator, but it doesn't make a difference, so I'm satisfied there's nothing wrong with that code. I've also tried editing the output index.htm files, adding the SVG code directly to them, but I get the same issue. Perhaps it's an IE/Windows security issue, and nothing to do with RH?

Ha ha, yes, it works in Chrome, Firefox. I'd suspected it was an IE-specific issue.

As it happens, the workaround was to call the SVG file externally, from the template, instead of embedding the actual SVG definition in the template.

I'm not satisfied that this is a solution, because it doesn't explain why embedding the SVG doesn't work for IE. However, the end result does what I need it to.

TOPICS
HTML5 layout

Views

346

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

HTML5 topic content blank in IE when SVG images are used in Topic.slp

Participant ,
Dec 04, 2017

Copy link to clipboard

Copied

Using RH 11.4.0.291

Exporting HTML5

Using Internet Explorer 11

I've been asked by our Design team to replace the PNG logo I've been using in the Topic.slp file for some SVG code they've given me - basically, they've designed the logo in Illustrator, and exported it as SVG, and given me the inline code to use.

The resulting output works fine in Chrome, but when we test the site in IE, no content will appear in the topic frame. The logo appears okay - but somehow the SVG code is affecting the topic frame, and it just remains blank. I do have examples of SVG images in other topics, and they display just fine, otherwise. It's only when I try to use that code in the topic.slp file, that there's an issue.

Furthermore, when we click through the Table of Contents (which appears to display okay), it'll refresh itself, as if we've started again. Sometimes I do see the topic content flash into the entire IE window, but within a fraction of a second it has disappeared.

I've tried exporting my own SVG code from Illustrator, but it doesn't make a difference, so I'm satisfied there's nothing wrong with that code. I've also tried editing the output index.htm files, adding the SVG code directly to them, but I get the same issue. Perhaps it's an IE/Windows security issue, and nothing to do with RH?

Ha ha, yes, it works in Chrome, Firefox. I'd suspected it was an IE-specific issue.

As it happens, the workaround was to call the SVG file externally, from the template, instead of embedding the actual SVG definition in the template.

I'm not satisfied that this is a solution, because it doesn't explain why embedding the SVG doesn't work for IE. However, the end result does what I need it to.

TOPICS
HTML5 layout

Views

347

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Dec 04, 2017 0
Adobe Community Professional ,
Dec 05, 2017

Copy link to clipboard

Copied

If you try it in a few other browsers and they all work, then I would suspect IE is your problem.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 05, 2017 0
Participant ,
Dec 05, 2017

Copy link to clipboard

Copied

Ha ha, yes, it works in Chrome, Firefox. I'd suspected it was an IE-specific issue.

As it happens, the workaround was to call the SVG file externally, from the template, instead of embedding the actual SVG definition in the template.

I'm not satisfied that this is a solution, because it doesn't explain why embedding the SVG doesn't work for IE. However, the end result does what I need it to.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 05, 2017 0
Adobe Community Professional ,
Dec 07, 2017

Copy link to clipboard

Copied

I don't think RoboHelp has ever supported images in SVG format so maybe the external link is a workaround that can be used just in this scenario. In the past I have simply used SVGs by generating the required format from them. Perhaps that would work here?


See www.grainge.org for RoboHelp and Authoring information

@petergrainge

www.grainge.org for free RoboHelp & Authoring info. Use the blue Reply button at the top to help me help you.
The black Reply link nests replies and they sort out of order.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2017 0