SVG File Issues

I also have the same problem, all the SVG assets must publish out to the same bin or something and they overwrite each other. So sloppy.

Hi Mark!

I Just wanted to check in and see if Earl's method worked to solve your issue? If not, please open a support case with us so we can troubleshoot further. 

Hi Larry! 

I apologize for the issues you are experiencing, and thanks for sharing a screenshot. 

If you haven't done so already, you can check the SVG export settings (from the image editor you used). Since SVG is created in a way that other published files can control, you might want to adjust your export settings to see if better results appear. 

Have you tried any of Earl's tips and tricks? It looks like it has worked well for some community members. 

If none of that helps, please open a support case with us so we can investigate further. 

I have not been able to import SVGs successfully even with the newest SL360 update. I imported one and now all my text is invisible in global preview mode, but not on individual slide previews.

Hi AWS PPO!

I apologize for the issues you are experiencing importing SVGs in Storyline.

There have been a lot of valuable workarounds that have helped many people in this thread, specifically Earl's ideas here. 

Also, if you haven't done so already, you can check the SVG export settings (from the image editor you used). Since SVG is created in a way that other published files can control, you might want to adjust your export settings to see if better results appear. 

If you need additional assistance, please don't hesitate to reach out to us in a support case! 

What's happening now is I am making my animated SVGs, when I import that SVG into my SL Project all other text in the project goes invisible. When I remove the SVG from my Storyline Project all the text returns.

It's almost like the SVG text is controlling all my other text styles/settings. Very odd.

Hi again AWS PPO!

If you are comfortable, it would be helpful if you could share the SVG with us publicly here or privately in a case so we can troubleshoot further. We will delete it from our systems when troubleshooting is complete. 

Sure, here is a copy of the SVG causing issues.

Hi,
open the svg in an text editor and remove the lines

<style type="text/css">
  text {
    text-anchor: middle; font-size: 80px; opacity: 0;
  }
</style>

"opacity: 0" set all svg-text (in storyline) to invisible

Jürgen

Thank you!!!

Hi,
here are the corrected SVGs, Storyline doesn't seem to support putting the animation instructions in a separate style tag. The animation description can stay there.

not stoyline compatible:

<style>
   #eteEOPbDcB539 {
      animation: eteEOPbDcB539_tr__tr 1500ms linear infinite normal forwards
      }
      @keyframes eteEOPbDcB539_tr__tr {
         ...
      }
   }
</style>

<g id="eteEOPbDcB539_tr" ... >

storyline compatible

<style>
  @keyframes eteEOPbDcB539_tr__tr {
    ...
  }
}
</style>

<g style="animation: eteEOPbDcB539_tr__tr 1500ms linear infinite normal forwards" ... >

https://360.articulate.com/review/content/2a574975-8760-42f3-81ba-117825a979aa/review

Jürgen