Demo 8: Image Map     |     home
Page 1   |   Page 2   |   Page 3   |   Page 4

Final step is to cut & paste the code and image into a Build Your Own Web Gem ->
Page 3
On this page, I show you inserting the code genereated
into a Build Your Own Web Gem (BYOWG).

Step 1.

Use Notepad, or another text editor, and open up the file you created in step 8 of Page 2, then select and copy the entire file to the Windows clipboard.

Then switch to your Trellix file and click where you want your image map to appear

Then insert your BYOWG by clicking on: Insert -> Web Gem -> Make Your Site Informative -> Choose

Then click the Paste button to copy the code into the BYOWG.
Step 2.

You have two things to edit with this code once you copied it to the Web Gem:

1. Remove the two lines <HTML> and </HTML>

These are NOT required by Trellix

2. Edit the line that begins with <IMG SRC =" and insert ^GEMDIR/ in front of the actual image name
Example

Before:
<IMG SRC = "sampleimagemap.JPG" WIDTH = "427" HEIGHT ="355" BORDER="0" USEMAP ="#imagemap1">

After:
<IMG SRC = "^GEMDIR/sampleimagemap.JPG" WIDTH = "427" HEIGHT ="355" BORDER="0" USEMAP ="#imagemap1">
Step 3.

Click on the button labeled 'Files for this gem...', then click on 'Add a file'.

Then browse and locate your  image map to insert ->

Click OK, then save your Trellix file and publish.
Step 4.

Here's the final result for my little image map.  Go ahead and try it out!
CNN News ESPN Sports News The Weather Channel
Finally, to see some other links and choices, let's proceed to Page 4 ->