en | nl
Adding/editing Image Map

In the content editor you can also add an image map to an inserted image. An image map allows you to add links on selected areas of the image. This means that you can insert an image and make it clickable.

Insert an image using the "CFMediaBasket" button

The "Insert/Edit Image Map" button is only visible in professional mode of the content editor
 

Click on the inserted image with the left mouse button and select the "Insert/Edit Image Map" button

You will see an "Image Map Editor" po-pup

In the part called "Map" you can input a map name or click the "Remove map" button



In the part called "Image Map Areas" you can select a cursor type:

  • Pointer - does nothing, but you can select image map areas which are already created,
  • Rectangle - allows you to create a rectangle map area,
  • Circle - allows you to create a circle map area,
  • Polygon - allows you to create a more complicated map area,
  • Delete selected area - allows you to delete a selected map area

In the part called "Image Map Areas" there is also a dropdown with a few filters.By using a filter you can see selected data on already existing map areas. Available filters are:

  • No labeling
  • Label with numbers (shows numbers of areas)
  • Label with alt text (shows alt text)
  • Label with href (shows WWW adress)
  • Label with title (shows title)
  • Label with coordinates (shows map area coordinates)

When you create new map area or click on an existing one,  you will also see a place for the URL, alternative text, advisory title and dropdown with target selection (not set, same window, new window, topmost window).

In the part called "Preview" you can see an image with inserted map areas 

ADDING AN IMAGE MAP

Video Manual. Adding image map

Click on the inserted image with the left mouse button and select the "Insert/Edit Image Map" button

Select a rectangle, circle or polygon cursor



In the place where you want to add a map area - click with the left mouse button on the image preview

Using your mouse, select the size ofthe  map area and click with the left mouse button again

Now input the URL, alternative text, advisory title (not neccessary) and select the target type



Click "OK" to confirm changes or add more map areas and then click "OK"

EDITING IMAGE MAP

Video Manual. Editing image map

Click with the left mouse button on the inserted image and select the "Insert/Edit Image Map" button



Click with the left mouse button on the selected map area

Change the URL, alternative text, advisory title or target selection



Click "OK" to confirm changes

DELETING A SELECTED MAP AREA

Video Manual. Deleting selected map area

Clickwith the left mouse button on the inserted image and select the "Insert/Edit Image Map" button



Select the map area and click the "Remove map area" button



Click "OK" to confirm changes

DELETING IMAGE MAP

Video Manual. Deleting image map

Click the left mouse button on an inserted image and select the "Insert/Edit Image Map" button



Click the "Remove map" button



The Image map was removed from the image