Mac SEO Blog

In this video, we’re going to show you how you can add an image map made in MapDesign to a RapidWeaver 5 website.

Video Transcript

There are two types of image maps that you can make in MapDesign. A Simple map, and an Effects Map. This tutorial is going to show you how you can add a Simple Map to your RapidWeaver website.

After you have created your image map, you will need to export the image map by pressing the Export To Web Site button. Make sure Simple Image Map is selected and press the Next button and save your image map.

Once you save your image map, you will notice that you have an index  file, as well as an images folder that contains your image.

Open RapidWeaver and add a new page. Make sure you select the HTML Code page. Next, open the images folder, and drag and drop the image into the Resources section.

Now open up the index file in an HTML editor so that you can see the code. Highlight all of the code that is within the opening, and closing body tags. Copy this code, and go back to RapidWeaver, and paste the code in your HTML Code page.

Locate the image path, and replace images with resources just like I have done.

When you press the preview button, you will see your image map, and you can test to see if it works by clicking on the hotspots.