
The extension also allows users to access TinyMCE plugins produced by Ephox or third parties. This includes the ability to have multiple editor instances on a single page (in both page view mode and in forms) with different configurations for each editor instance if desired. However, for more advanced uses, developers are also given total control over the configuration of TinyMCE from LocalSettings.php.

TinyMCE can be used 'out of the box' by following the installation instructions below. For example, they may want to integrate their wikis in an environment where other tools may already use TinyMCE, such as Angular, Bootstrap Django, Rails, React, Swing, Vue, Joomla and Wordpress to name a few. The TinyMCE extension provides users with an alternative to the standard VisualEditor. The editor can be added to the standard edit page, to forms defined by the Page Forms extension, and to regular pages in view mode. TinyMCE is a MediaWiki extension that lets users edit wiki pages using version 5 of the popular open source JavaScript-based WYSIWYG editor TinyMCE created by Ephox corp. First, I am going to show you the way without TinyMCE then later we will bring it down through Nuget.Translate the TinyMCE extension if it is available at In order to make it more clear, I have created a very simple BlogPost model to work with.

TinyMCE.JQuery : Holds the JQuery integration files for TinyMCE. TinyMCE : The main package which holds the infrastructure. (This list might extend in the future) Briefly the packages are : There are several packages which are related to TinyMCE that I have pushed to live Nuget feed as you can see in the picture left hand side. In this post, I am going show you the easiest way to get it work ASP.NET MVC but I hope I am going to cover for Web Forms as well in near future. It’s even easier to get it working with ASP.NET MVC. It is now easy to get TinyMCE package to your project with Nuget. Mostly, I will show how to set up your environment to get TinyMCE working in a short time. I am not going to get into details of how I created the package. TinyMCE Nuget has replied my post in a short time and gave me a go ahead to push the package to live Nuget feed. So, I have contacted with the package admins on their forum : (The article was nice but it wasn’t following the DRY way)Īfter that, I have decided to enhance my packages to push them to live Nuget feed. The process which has been documented there is a very well working sample but well…, it looked more like a poor man’s TinyMCE integration for me. Remember the balloon which popped up inside my head? This blog post widened that balloon and it hit me harder this time. After I thought this, I have come across a blog post about TinyMCE integration on ASP.NET MVC 3 (The blog post is in Turkish). That worked pretty well for me but don’t miss the point here. Even, I have created EditorTemplates so that I could just give my model a hint to use the template. In order to do that, I’ve created an internal Nuget package just for myself to pull the TinyMCE package with plugins. So this hits me hard and I thought I should automate this process. This action popped up a balloon inside my head that tells me I had been doing this stuff over and over again for 80% of the projects that I have created. Then, I go to to grab the latest version of TinyMCE which is an awesome Javascript WYSIWYG Editor.

Couple of weeks ago, I was setting up a new project and I have created a folder called ‘lib’ inside the $(SolutionDir) as usual to put all the dependencies that I am going to be using for my project (.Net libraries, JavaScript libraries, etc.).
