The challenge on winkiwear.ca was to create a collage of images that incourages users to get excited about the designer brands offered and then be able to access more information. We tried different options including building mapped images and embedding the html into the page. The results were unreliable and didn’t work consistently across different browsers and on mobile.

The solution: Adding links in images with the Image Map HotSpot WordPress Plugin

The setup works like in a slider plugin; you add the title and description of the content to be embedded and pick the options.

You can add all kinds of content: links, video, images and text.

This plugin would also be great for interactive maps, team pages or any other image that you want to make more interesting.

When you are done, the image can easily be placed in any page or post on the WordPress website with the use of a shortcode. You can find the code conveniently placed in the sidebar of the development screen - ready to cut & paste.

click to enlarge

Of course every option has to stand the test of working well on all screen sizes. Here is a screenshot from my android phone showing that the image is responsive and still functional on a small screen.

Summary:

I am thrilled with this plugin. It allows me to create a great user experience and add more functionality on a web page. Considering that the importance of images on the internet continues to grow, options like this are a great asset for any website developer.

The Image Map HotSpot Plugin is available on CodeCanyon for a $18 one time license fee.

Have you used this or a similar solution? Share your experience in the comments!

featured image by envato

What do you think about this article?