Take the community feedback survey now.

Nicklas Israelsson
Jun 18, 2018
  639
(0 votes)

Episerver Image Tools in TinyMCE

EPiServer.CMS.TinyMce versions 2.3.0 and 2.4.0 bring two Image Tools features inside the XHTML editor.

Go to media (version 2.3.0)

Image gotomedia.PNG

This new button will make it easier for the editors to locate and navigate to the image that is included in the HTML property.

Additionally, after hovering it will show a tooltip with a full path to the image.

Drag & Drop from local disk (version 2.4.0)

It is possible to drag and drop an image from a local disk directly onto the editor.

An image preview will be shown immediately upon dropping while the image is being uploaded to the server.

All dropped images are automatically placed in the "For this page" or "For this block" folder. 

Please note that although it is technically possible to drag & drop multiple images at the same time, it does not work deterministically.

There is a bug reported in TinyMCE #4055 that EPiServer has already submitted a bugfix  to. The bug is still pending review.

 

The Image Tools are enabled by the default configuration, but they can be disabled.

To disable or re-enable the features, you should use the EnableImageTools/DisableImageTools methods available when you are configuring your properties:

context.Services.Configure<TinyMceConfiguration>(config =>
{
    ...
    // Disable the image tools
    config.For<ArticlePage>(t => t.MainBody)
        .DisableImageTools()
    ...
    // Enable the image tools for a property (if the property does not have it already)
    config.For<ArticlePage>(t => t.MainBody)
        .EnableImageTools();
     ...
}

The information about enabling and disabling the features is included in the SDK - Episerver Plugins.

Jun 18, 2018

Comments

Please login to comment.
Latest blogs
A day in the life of an Optimizely OMVP - Opticon London 2025

This installment of a day in the life of an Optimizely OMVP gives an in-depth coverage of my trip down to London to attend Opticon London 2025 held...

Graham Carr | Oct 2, 2025

Optimizely Web Experimentation Using Real-Time Segments: A Step-by-Step Guide

  Introduction Personalization has become de facto standard for any digital channel to improve the user's engagement KPI’s.  Personalization uses...

Ratish | Oct 1, 2025 |

Trigger DXP Warmup Locally to Catch Bugs & Performance Issues Early

Here’s our documentation on warmup in DXP : 🔗 https://docs.developers.optimizely.com/digital-experience-platform/docs/warming-up-sites What I didn...

dada | Sep 29, 2025

Creating Opal Tools for Stott Robots Handler

This summer, the Netcel Development team and I took part in Optimizely’s Opal Hackathon. The challenge from Optimizely was to extend Opal’s abiliti...

Mark Stott | Sep 28, 2025

Integrating Commerce Search v3 (Vertex AI) with Optimizely Configured Commerce

Introduction This blog provides a technical guide for integrating Commerce Search v3, which leverages Google Cloud's Vertex AI Search, into an...

Vaibhav | Sep 27, 2025

A day in the life of an Optimizely MVP - Opti Graph Extensions add-on v1.0.0 released

I am pleased to announce that the official v1.0.0 of the Opti Graph Extensions add-on has now been released and is generally available. Refer to my...

Graham Carr | Sep 25, 2025