Creating Image Maps With Fireworks And Joomla

Follow us on Facebook!

Creating Image Maps With Fireworks And Joomla

Creating clickable hotspots on your images is a really neat way to liven up your website. Here we show you how using Adobe Fireworks to create the image map html code and then publish it in a Joomla article.

First you're going to need an image

example image

Open the image in Adobe Fireworks and using the Rectangle Hotspot Tool select the area you want the hotspot to cover

Image with hotspot added

Don't forget to complete the details for the Link, ALT and Target for your new hotspot:
Link - enter the full url address of the new page
ALT - type in a description for the image Target - Set this to Self for the link to open in the same browser tab or Blank to open a new tab when clicked

Next Export the image. Make sure you select the option to export the HTML files as well as the image

Export image example

Now we need to add the image to our Joomla media library and import to our Joomla article

Finally we need to edit the code behind the image to include the HTML map information

buy wifi for business

You’re Done.

If you found this article useful please remember to Like us on Facebook

Your website is your online shop window and if potential customers find it difficult to navigate they are unlikely to translate into sales.

When you are working with your web developer to design your business website it can be difficult to be truly subjective about the layout of the site. You want to get everything on the home page after all!

Let us give you real and impartial advice by reviewing your website from a customers perspective.


To give you the best possible experience, this site uses cookies. Continuing to use means you agree to our use of cookies. If you'd like to learn more about the cookies we use please find out more