SVG icons not loading

[AttitudeMonger]

I downloaded the zipped structure, built it with bower and loaded the index.html page in examples. The icons are not showing up.

As per the documentation here: http://alex-d.github.io/Trumbowyg/documentation.html#svg-icons, I added this line of code before $('#editor').trumbowyg();:

$.trumbowyg.svgPath = '/Users/attitude/Desktop/Trumbowyg-develop/dist/ui/icons.svg';

Same result. How do I get the icons to load correctly? Or is it that because they will be loaded by XHR, they will show up only in a server-client environment, not if the page is loaded in the browser locally?

[Alex-D]

You need to be in HTTP(S)

[AttitudeMonger]

Okay, I will try it. Can you give me an idea about the directory structure? Which files are important? I can see there are three - the .svg file and .css file in dist/ui, and .js file in dist. Is that all? Do I need to include the directory which contains lots of svg image files as well? If so, what should be its directory level with respect to these three files?

[Alex-D]

You should only use files from dist folder. The only constraint by default is to have SVG next to CSS.

[SuN-80]

Same thing here. I added the path to svg sprite:

svgPath: '/path/to/icons.svg'

...but it remains undefined in the DOM. It works if I hard code this value on L688. There must be something wrong with how this value is parsed.

[Alex-D]

I can't help you without context.

• The option is here: http://alex-d.github.io/Trumbowyg/documentation.html#svg-icons
• You can add SVG directly in your page without AJAX like this: https://github.com/Alex-D/Trumbowyg/blob/gh-pages/documentation.html#L16 with all icon.svg content.