Take the community feedback survey now.

Nicklas Israelsson
Jun 18, 2018
  5330
(7 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

Kristian
Kristian Aug 22, 2018 12:53 PM

@Nicklas Israelsson 

The epi-image-tools plugin (only for version 2.3.0 and higher) for "go to media" is a nice new feature for image content in the Xhtml property. 

Any chance that you will implement a plugin for similar behaviour on block content so you can navigate to the block by clicking it?

Nicklas Israelsson
Nicklas Israelsson Aug 22, 2018 02:05 PM

@Kristian Willumsen

There is no immediate plan for it but we're always interested in feedback. When you say block content, do you mean when you've drag and dropped a block into your Xhtml property?

Kristian
Kristian Aug 22, 2018 05:45 PM

@Nicklas Israelsson 

OK. Yes exactly. Similar to "Go to media". Just for blocks in Xhtml property. 

Please login to comment.
Latest blogs
How to Use IPlacedPriceProcessor in Optimizely Commerce to Preserve Custom Line Item Prices (Donation Example)

Optimizely Commerce 12+ automatically validates line item prices based on catalog data, which can overwrite user-entered prices for donations or...

Francisco Quintanilla | Oct 15, 2025 |

Optimizely CMS - Learning by Doing: EP05 - Create Content Tree: Demo

  Episode 5  is Live!! The latest installment of my  Learning by Doing: Build Series  on Optimizely CMS 12 is now available on YouTube!   This vide...

Ratish | Oct 15, 2025 |

A day in the life of an Optimizely OMVP - Creating a blazor add-on for CMS 12

Hello and welcome to another instalment of a day in the life of an Optimizely OMVP. In this post I will be covering how to create a blazor based...

Graham Carr | Oct 14, 2025

AI Tools, MCP, and Function Calling for Optimizely

You can now integrate AI Tools, Model Context Protocol (MCP), and function calling with Optimizely CMS, allowing editors to engage with actual,...

Luc Gosso (MVP) | Oct 14, 2025 |

Optimizely Forms : Setup, Configuration and Submission

I have exploring Optimizely Forms recently –  Installed NuGet package to enable Optimizely Forms, created a Contact Us Form and placed in a landing...

Madhu | Oct 13, 2025 |

Building a Discovery-First MCP for Optimizely CMS – Part 1 of 4

This post kicks off a four-part series on how we’re evolving the Optimizely Model Context Protocol (MCP). The project is still in beta and open...

Johnny Mullaney | Oct 13, 2025 |