How To Enable The HTML/Code Button in TinyMCE in the Episerver editor

A common requirement by content editors on most new projects is to be able to edit the HTML within the rich-text area. By default, a lot of the buttons are turned off in TonyMCE when you create a new page type. The quick and easy way to add the button is via the admin and it should only take you a few minutes :) episerver_configuring_tonymce First, open your Episerver admin and click on the 'Content Type' tab. In this tutorial, I'm going to enable the HTML button on the 'Main Description' property on my 'Start Page' page type. episerver_configuring_tinymce_2 Select the page type you want to edit and then find the TinyMCE field that you want to configure. TinyMCE fields will be marked as type 'XHTML string (>255). Click on the link in the name field to load up the property edit screen. Click the 'Custom Settings' tab and you should see an 'Editor Toolbar' section. episerver_configuring_tinymce_3 In here you should be able to see a list of components that you can enable/disable on TonyMCE. To enable/disable components simply drag them onto the toolbar, or, remove them. To enable the HTML option, find the component called 'HTML' episerver_configuring_tinymce_4 Drag it onto the TonyMCE toolbar at the position where you want to see it on your TinyMCE toolbar. episerver_configuring_tinymce_5 Now at the bottom of the page hit the 'Save' button. episerver_configuring_tinymce_6 Now when you go back to the editor and try to create a new page using the page type you selected above, you should see the 'HTML' button on your rich-text property.

Jon D Jones

Software Architect, Programmer and Technologist Jon Jones is founder and CEO of London-based tech firm Digital Prompt. He has been working in the field for nearly a decade, specializing in new technologies and technical solution research in the web business. A passionate blogger by heart , speaker & consultant from England.. always on the hunt for the next challenge

Back to top
var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-35662136-1']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + ''; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })();