SOLVED: Embed any link with Inkscape SVG easily!

Don't bother with overly complicated element id manipulation within an SVG. There's an easy way.

And that way is to simply add two lines in the Object Attributes and the Object Interactivity fields of any object within your SVG whether its a raster image or vector geometry. So yes it is totally possible to make fully responsive image maps with Inkscape (v1.0.2.2).

Steps

1. Import or create an object inside your canvas/art board bounds in your svg file using Inkscape.
2. Select the object once.
3. Right click the object to bring up the options dialog.
4. Select "Create Link."
5. Under the Object Attributes pane (might need to open that first) enter your canonical url within the Href: field e.g., "http://SOME-WEBSITE-URL.html" sans apostrophes.
6. Under the Interactivity section, within the onclick field, enter the script call e.g., "window.open('http://SOME-WEBSITE-URL.html','_parent');" sans apostrophes. Take note there is no space after the comma in this entry.
7. Save your SVG file and open it with Firefox or any browser to test your work.

Visual steps

You will now see your object will link to the page you specified AND the onclick event will change the mouse state from the standard pointer to the appropriate link click icon. Simple and effective and no mucking about inside the svg element id data.

Think green

Remember to always optimize your embedded raster images in your SVGs but only after you have scaled them properly outside of Inkscape. This is best done with GIMP. Your users, the internet and the planet will thank you for doing so as this cuts down considerably on bandwidth, processing and ultimately energy used to run the web. Developers should always consider the carbon footprint as part of their performance budget. And of course you silly graphic designers!

Are you a small business owner that is smart enough to know that Adobe Creative Cloud pay-every-month-rip-off (Photoshop/Illustrator/InDesign/Premiere) isn't the way to go? We offer reasonable tempered-by-fire consulting on hardware and libre software solutions that you own! Save thousands, not pay for silly SaaS products...give us a call at (559) 242-6647 and we’ll provide a perfect IT solution that respects your liberty, your privacy and just works.

About the Writer

Author: Chris Lessley

A server admin, dev ops warrior and website designer since 2002, Chris is a lover of all things Linux and open-source! Each blog topic has been tested by fire in the real world and shared with the hope to help others. Need more help? Hire me! Chris' other interests include fine art and the humanities in the classical tradition and can be found writing for our friends over at gripfastart.works. If you like this content, kindly consider donating to keep this website free to all, without ads.