Using external links (a href=) in SVG Images

Forge
1

I create a custom svg image similar to the wheel of fortune app. Bitbucket
I add an external link to the svg image with the href tag. (a href=“https://atlassian.com”>Goto Atlassian From SVG)

Everthing works fine when I deploy the forge app to my site exept that I cannot click the links inside the svg images. When I open the svg image in a separate window inside my browser, I can open the link inside the svg image without any problems.

A “Tooltip” or a “Link” from “@forge/ui” is not an option, because I want to add more than one external link to my svg image.

Is it possible to access these svg links directly in confluence in my app?

Any help would be appreciated.

2

Hi Gerhard

This is more of a general web question but I’ll do my best to answer.

Are you embedding the SVG inside the Image component (which becomes an <img>) or testing without? I find in Firefox I’m able to click the SVG links only when it’s not surrounded by the img tag.

If you are set on elements of the SVG being clickable I’d recommend making use of the Custom UI instead of UI kit. That way you have more freedom editing the frontend.

1 Like