0 Replies Latest reply on Jan 17, 2018 2:23 PM by james1.hicks

    Add-On: Referencing own icons/images in add-on?


      Jive Support jive software This is similar to a post from March 2016 Add-on:How to reference own icons/images?. A lot of what he asked is what I am looking for a solution to. How do I access my images/svgs from within the add-on? What path should I be using?


      Our add-ons follow the format of



      We've developed a jive hosted add-on that has images (svgs) that it needs to reference. When the reference is in the html (in the form of <img src=""...>), the asset loads no problem. When I attempt to reference the image in my javascript file, the image cannot be found in the add-on once uploaded to Jive.


      This works when placed int he index.html:

      <img id="image-upper" src="./images/folder/image.svg">


      Using a javascript file to reference the image/svg outside of the html file does not work. I get a 'cannot not find' error. The path that it says it cannot find it at is at jiveUrl/gadgets/pathToSVG.

      This doesn't work when in the javascript file (when uploaded to


      const image = './images/folder/folder/image.svg'



      I have to do this to access the asset, which is not something I think is intended by Jive, or is it?


      const image = '/resources/add-ons/../../apps/simpleapp/images/folder/folder/image.svg/'


      I've tried various ways to get to that URL that I know it is at with no luck.






      None of the above path targeting work.


      Is the only way to access these images/svgs in the javascript file to provide the absolute file path ( jiveUrl/resources/add-ons/.../.../apps/simpleapp/images/image.svg)?

      Or am I missing something on how to access these resources with a basic 'images/image.svg'?