Autoresize TinyMCE

Procurando uma maneira de tornar o editor TinyMCE sempre relativo ao seu conteúdo, de modo que a altura do editor mude de acordo com a quantidade de texto / imagens que ele contém.

Parece haver plugins para o TinyMCE para isso já, mas não tenho certeza sobre como aplicá-lo para a versão do WordPress: http://www.tinymce.com/wiki.php/Plugin : autoresize

function init_tinymce_autoresize($initArray){ $initArray['plugins'] = "autoresize"; return $initArray; } add_filter('tiny_mce_before_init', 'init_tinymce_autoresize'); 

Não funciona.

Idéias?

Solutions Collecting From Web of "Autoresize TinyMCE"

Aqui está uma solução. Há um pequeno problema, pois não reconhece quando as imagens são adicionadas ao editor.

1: Crie uma pasta com o nome tinymce-autoresize na pasta de plugins.
2. Crie um arquivo em tinymce-autoresize chamado tinymce_autoresize.php com este conteúdo:

 function intialize_autoresize_plugin() { // Check user permission if ( ! current_user_can('edit_posts') && ! current_user_can('edit_pages') ) return; // Add only in Rich Editor mode if ( get_user_option('rich_editing') == 'true') { add_filter("mce_external_plugins", "autoresize_plugin_load"); } } function autoresize_plugin_load($plugin_array) { $plug = WP_PLUGIN_URL . '/tinymce-autoresize/editor_plugin.js'; $plugin_array['autoresize'] = $plug; return $plugin_array; } add_action('init', 'intialize_autoresize_plugin'); 

3. Crie um arquivo em tinymce-autoresize chamado editor_plugin.js com este conteúdo:

 /** * editor_plugin_src.js * * Copyright 2009, Moxiecode Systems AB * Released under LGPL License. * * License: http://tinymce.moxiecode.com/license * Contributing: http://tinymce.moxiecode.com/contributing */ (function() { /** * Auto Resize * * This plugin automatically resizes the content area to fit its content height. * It will retain a minimum height, which is the height of the content area when * it's initialized. */ tinymce.create('tinymce.plugins.AutoResizePlugin', { /** * Initializes the plugin, this will be executed after the plugin has been created. * This call is done before the editor instance has finished it's initialization so use the onInit event * of the editor instance to intercept that event. * * @param {tinymce.Editor} ed Editor instance that the plugin is initialized in. * @param {string} url Absolute URL to where the plugin is located. */ init : function(ed, url) { var t = this, oldSize = 0; if (ed.getParam('fullscreen_is_enabled')) return; /** * This method gets executed each time the editor needs to resize. */ function resize() { var deltaSize, d = ed.getDoc(), body = d.body, de = d.documentElement, DOM = tinymce.DOM, resizeHeight = t.autoresize_min_height, myHeight; // Get height differently depending on the browser used myHeight = tinymce.isIE ? body.scrollHeight : (tinymce.isWebKit && body.clientHeight == 0 ? 0 : body.offsetHeight); // Don't make it smaller than the minimum height if (myHeight > t.autoresize_min_height) resizeHeight = myHeight; // If a maximum height has been defined don't exceed this height if (t.autoresize_max_height && myHeight > t.autoresize_max_height) { resizeHeight = t.autoresize_max_height; body.style.overflowY = "auto"; de.style.overflowY = "auto"; // Old IE } else { body.style.overflowY = "hidden"; de.style.overflowY = "hidden"; // Old IE body.scrollTop = 0; } // Resize content element if (resizeHeight !== oldSize) { deltaSize = resizeHeight - oldSize; DOM.setStyle(DOM.get(ed.id + '_ifr'), 'height', resizeHeight + 'px'); oldSize = resizeHeight; // WebKit doesn't decrease the size of the body element until the iframe gets resized // So we need to continue to resize the iframe down until the size gets fixed if (tinymce.isWebKit && deltaSize < 0) resize(); } }; t.editor = ed; // Define minimum height t.autoresize_min_height = parseInt(ed.getParam('autoresize_min_height', ed.getElement().offsetHeight)); // Define maximum height t.autoresize_max_height = parseInt(ed.getParam('autoresize_max_height', 0)); // Add padding at the bottom for better UX ed.onInit.add(function(ed){ ed.dom.setStyle(ed.getBody(), 'paddingBottom', ed.getParam('autoresize_bottom_margin', 25) + 'px'); }); // Add appropriate listeners for resizing content area ed.onChange.add(resize); ed.onSetContent.add(resize); ed.onPaste.add(resize); ed.onKeyUp.add(resize); ed.onPostRender.add(resize); if (ed.getParam('autoresize_on_init', true)) { // ed.onLoad.add(resize); ed.onLoadContent.add(resize); } // Register the command so that it can be invoked by using tinyMCE.activeEditor.execCommand('mceExample'); ed.addCommand('mceAutoResize', resize); }, /** * Returns information about the plugin as a name/value array. * The current keys are longname, author, authorurl, infourl and version. * * @return {Object} Name/value array containing information about the plugin. */ getInfo : function() { return { longname : 'Auto Resize', author : 'Moxiecode Systems AB', authorurl : 'http://tinymce.moxiecode.com', infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/autoresize', version : tinymce.majorVersion + "." + tinymce.minorVersion }; } }); // Register plugin tinymce.PluginManager.add('autoresize', tinymce.plugins.AutoResizePlugin); })(); 

Ative-o e você terminou!