Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

since WP3.9/TinyMCE 4 image edit overlay button not shown anymore WordPress

  • SOLVED

I use wp_editor() to load a custom tinymce instance for editing the popuptexts of maps. See demo at [[LINK href="https://demo.mapsmarker.com/wp-admin/admin.php?page=leafletmapsmarker_marker"]]https://demo.mapsmarker.com/wp-admin/admin.php?page=leafletmapsmarker_marker[[/LINK]]

There is an issue since WP3.9/TinyMCE4.0 when inserting an image: before 3.9 when you hovered the image, you were shown the edit and remove overlay buttons in the top left corner of the image. With WP3.9/TinyMCE4.0 this is not shown anymore, see attached screenshot.

Please see the core trac ticket on how I load the editor on backend: [[LINK href="https://core.trac.wordpress.org/ticket/27904"]]https://core.trac.wordpress.org/ticket/27904[[/LINK]]

Does anyone know how I can get these "edit hover-buttons" back?

Answers (2)

2014-05-20

Bob answers:

Hi Robert,

Can you please show whole code how you created editor. I wan to check $settings array that you specified for your editor.

Regards,
Bhavesh


Robert Seyfriedsberger comments:

see code here: https://github.com/robertharm/Leaflet-Maps-Marker/blob/dev/leaflet-marker.php#L558


Bob comments:

In your editor you are loading custom css [[LINK href="https://demo.mapsmarker.com/wp-content/plugins/leaflet-maps-marker-pro/inc/css/leafletmapsmarker-admin-tinymce.php?defaults_marker_popups_maxwidth=251&defaults_marker_popups_image_css=max-width%3A234px+%21important%3B+height%3Aauto%3B+width%3Aauto+%21important%3B"]]https://demo.mapsmarker.com/wp-content/plugins/leaflet-maps-marker-pro/inc/css/leafletmapsmarker-admin-tinymce.php?defaults_marker_popups_maxwidth=251&defaults_marker_popups_image_css=max-width%3A234px+%21important%3B+height%3Aauto%3B+width%3Aauto+%21important%3B[[/LINK]]

How you set it up?

you code has .... there so can not see full settings you specified for the tinymce editor

'setup' => 'function(ed) {
ed.on("keyup", function(ed,e) {
...
unsaved = true;
});
}'


Bob comments:

Please temporary remove that css and try it again without your custom css.


Bob comments:

I am attaching image which show result with your custom css and without your custom css