Calling all developers! We invite you to provide your input on Feature Experimentation by completing this brief survey.
Calling all developers! We invite you to provide your input on Feature Experimentation by completing this brief survey.
https://docs.developers.optimizely.com/content-cloud/v12.0.0-content-cloud/docs/default-settings
@Mark, the link you shared only contains the information on how to configure the TinyMCE? Can you specify what specific setting is to disable it?
I looked into following but I am not sure how to add it withing our configuration
@Praful have you tried the .DisableImageTools() option
public static class TinyMceConfigurationExtensions
{
/// <summary>
/// Configure Tiny MCE settings
/// </summary>
/// <param name="services"></param>
public static void ConfigureTinyMce(this IServiceCollection services)
{
services.Configure<TinyMceConfiguration>(config =>
{
config
.Default()
.DisableImageTools()
.AddEpiserverSupport()
.ContentCss("/css/edit.css")
.Toolbar(
// "styleselect | bold italic | image link | epi-link epi-image-editor epi-personalized-content | bullist numlist outdent indent | alignleft aligncenter alignright alignjustify | cut copy paste | undo redo | table | fullscreen | help ")
"styleselect | bold italic | link | epi-link epi-personalized-content | bullist numlist outdent indent | alignleft aligncenter alignright alignjustify | cut copy paste | undo redo | table | fullscreen | help ")
.AddPlugin("wordcount")
.StyleFormats(
new { title = "---Text---" },
new { title = "Default", block = "P" },
new { title = "small", block = "small" });
});
}
}
The extention contains the following
public static class TinyMceSettingsExtensions
{
private const string ImageToolsKey = "imagetools_toolbar";
private const string PasteDataImagesKey = "paste_data_images";
private const string ImagesReuseFilenameKey = "images_reuse_filename";
/// <summary>Enables the Episerver image tools.</summary>
/// <param name="settings">The settings instance.</param>
/// <returns>The same instance of <see cref="T:EPiServer.Cms.TinyMce.Core.TinyMceSettings" /> modified with the new setting.</returns>
public static TinyMceSettings EnableImageTools(this TinyMceSettings settings) => settings.AddSetting("imagetools_toolbar", (object) "epi-gotomedia").AddSetting("paste_data_images", (object) true).AddSetting("images_reuse_filename", (object) true).AddPlugin("epi-image-tools", "imagetools", "epi-image-uploader", "paste");
/// <summary>Disables the Episerver image tools.</summary>
/// <param name="settings">The settings instance.</param>
/// <returns>The same instance of <see cref="T:EPiServer.Cms.TinyMce.Core.TinyMceSettings" /> modified with the new setting.</returns>
public static TinyMceSettings DisableImageTools(this TinyMceSettings settings)
{
settings.Remove("imagetools_toolbar");
settings.Remove("paste_data_images");
settings.Remove("images_reuse_filename");
return settings.RemovePlugin("epi-image-tools").RemovePlugin("imagetools").RemovePlugin("epi-image-uploader").RemovePlugin("paste");
}
/// <summary>
/// Adds default Episerver settings for plugins and styles
/// </summary>
/// <param name="settings">The settings instance.</param>
/// <returns>The same instance of <see cref="T:EPiServer.Cms.TinyMce.Core.TinyMceSettings" /> modified with the new setting.</returns>
public static TinyMceSettings AddEpiserverSupport(this TinyMceSettings settings) => settings.AddPlugin("epi-block-tools epi-link epi-create-block epi-dnd-processor epi-personalized-content epi-image-editor").AddSetting("epi_content_css", (object) Paths.ToClientResource(typeof (TinyMceSettings), "ClientResources/epi-addon-tinymce/styles/content.css")).EnableImageTools();
}
Solved it. I added a setting to the TinyMce configuration called invalid_elements:
config.Default()
.DisableImageTools()
.AddEpiserverSupport()
.AddSetting("invalid_elements", "img") // restricts d&d and pasting of images
Now it neither can drop or paste images to a XhtmlString
Is there a way to restrict editors so that they can't add images to XhtmlString property fields?