Load on demand using compressor

This example shows you how to load TinyMCE on demand using the compressor. This page only includes a small loader file that is 4kb in size. But if you click the Load TinyMCE link below it will load the editor and all of it's components using a serverside gzip compressor. This will both reduce the number of requests but since it's gzipped it will reduce the download size by 70%. So if you think that TinyMCE is to large we strongly recommend using the compressor packages.

HTML source

Below is all you need to setup the example.

<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce_gzip.js"></script>
<script type="text/javascript">
function setup() {
   tinyMCE_GZ.init({
      themes : "advanced",
      plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template",
      languages : "en",
      disk_cache : true
   }, function() {
      tinyMCE.init({
         mode : "textareas",
         theme : "advanced",
         plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template",
         theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontselect,fontsizeselect",
         theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
         theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
         theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak",
         theme_advanced_toolbar_location : "top",
         theme_advanced_toolbar_align : "left",
         theme_advanced_statusbar_location : "bottom",
         theme_advanced_resizing : true
      });
   });
}
</script>

<form method="post" action="somepage">
	<textarea name="content" style="width:100%">
	</textarea>
	<a href="javascript:setup();">Load TinyMCE</a>
</form>