Question

I am trying to install Image map onto Wygwam 2.6.3 in ExpressionEngine 2.5.2.

Following the below instructions (twice to make sure). However, the Imagemap icon is showing in the full configuration, but when I click on an image and then the imagemap icon it doesnt do anything. But when nothing is selected and I press the Imagemap icon, it says “please select an image”.

Drop the imagemap plugin folder into your
/themes/third_party/wygwam/lib/ckeditor/plugins/ folder.

Open /themes/third_party/wygwam/lib/ckeditor/skins/wygwam2/editor.css

At the end of the file, add:

.cke_skin_wygwam2 .cke_button_imagemap
.cke_icon{background:url(../../plugins/imagemap/imagemap.gif);}

In /system/expressionengine/third_party/wygwam/helper.php Line 76:
add ‘ImageMap’ after ‘Image’ in the array. Line 149: add ‘ImageMap’
=> ‘Image Map’ to the array. Line 226: add ‘ImageMap’ after ‘Image’ in the array.

Clear your browser’s cache.

From inside EE, go to Add-Ons->Modules->Wygwam->Editor
Configuration->Full

In the toolbar, the Image Map icon should be greyed out. Click it to
enable it.

Under Advanced Settings on the same page, select ‘extraPlugins’ and
set ‘imagemap’ as the value (without the quotes, case sensitive)’.

I am getting the following error when i click on the imagemap icon.

$.modal is not a function

Is the Imagemap plugin even compatible? Any pointers? Thanks

Answer 1

Ckeditor3 uses jquery simplemodal.

SimpleModal has to be loaded by the imagemap plugin. I added

CKEDITOR.scriptLoader.load(CKEDITOR.getUrl(‘../plugins/imagemap/jquery.simplemodal.1.4.2.min.js’));

to plugin.js to load it when imagemap plugin is loaded.