Registro de botones TinyMCE personalizados, para el área de administración, para trabajar con instancias personalizadas de wp_editor

2

Gracias a esta respuesta aquí , puedo usar diferentes instancias de wp_editor para determinar qué botones cada uno de mis diferentes instancias de TinyMCE usa.

Sin embargo, estoy luchando para que mis botones se registren. ¡Simplemente no aparecen en la interfaz de TinyMCE de la forma que creo que deberían!

He intentado dos enfoques diferentes: poner el código en mi complemento species-profiles (un Tipo de publicación personalizado llamado species en el que deseo que se muestren las instancias de TinyMCE), y poner el código en el functions.php de mi tema .

El código que estoy usando es:

function add_SF_buttons() {
    if ( ! current_user_can('edit_posts') && ! current_user_can('edit_pages') )
        return;
    if ( get_user_option('rich_editing') == 'true') {
        add_filter('mce_external_plugins', 'add_SF_buttons_plugins');
    }
}

function add_SF_buttons_plugins($plugin_array) {
    $plugin_array['pH'] = get_bloginfo('template_directory') . '/tinymce_buttons/pH/editor_plugin.js';
    $plugin_array['pH_min'] = get_bloginfo('template_directory') . '/tinymce_buttons/pH_min/editor_plugin.js';
    $plugin_array['pH_max'] = get_bloginfo('template_directory') . '/tinymce_buttons/pH_max/editor_plugin.js';
    return $plugin_array;
}

add_action( 'init', 'add_SF_buttons' );

El código que estoy usando para inicializar la instancia wp_editor según la respuesta mencionada anteriormente es este:

<?php
    wp_editor(
        $distribution,
        'distribution',
        array(
          'media_buttons' => false,
          'textarea_rows' => 8,
          'tabindex' => 4,
          'tinymce' => array(
            'theme_advanced_buttons1' => 'bold, italic, |, bullist, numlist, |, pH, pH_min',
            'theme_advanced_buttons2' => '',
            'theme_advanced_buttons3' => '',
            'theme_advanced_buttons4' => '',
          ),
        )
    );
?>

Los complementos que estoy tratando de usar se ven así:

(function() {
    tinymce.create('tinymce.plugins.pH', {
        init : function(ed, url) {
            ed.addButton('pH', {
                title : 'pH',
                image : url+'/pH.png',
                onclick : function() {
                    var caret = "caret_pos_holder";
                    var insert = '[pH]';
                    ed.execCommand('mceInsertContent', false, insert);
                    ed.selection.select(ed.dom.select('span#caret_pos_holder')[0]); //select the span
                    ed.dom.remove(ed.dom.select('span#caret_pos_holder')[0]); //remove the span
                }
            });
        },
        createControl : function(n, cm) {
            return null;
        },
        getInfo : function() {
            /*
             * I intentionally left the information of
             * Brett Terpstra, as his code was the
             * foundation for this.
            */
            return {
                longname : "Brett's YouTube Shortcode",
                author : 'Brett Terpstra',
                authorurl : 'http://brettterpstra.com/',
                infourl : 'http://brettterpstra.com/',
                version : "1.0"
            };
        }
    });
    tinymce.PluginManager.add('pH', tinymce.plugins.pH);
})();

Que yo sepa, ¿todo lo que he hecho es correcto? Sin embargo, los botones personalizados no aparecen. Supongo que estoy haciendo algo mal, inicializándolos incorrectamente, o algo así.

Gracias de antemano,

    
pregunta dunc 12.04.2012 - 15:58

2 respuestas

3

Copié su código en mi functions.php, y agregué un panel de administración simple ('Foo') para mostrar el editor. Luego, creé un nuevo directorio dentro de mi tema actual para el botón editor y coloqué el botón editor JS en el archivo correspondiente: /wp-content/themes/[my-theme-dir]/tinymce_buttons/pH/editor_plugin.js .

Resultado: cuando fui a Dashboard > Foo (el panel que había creado), funcionó como se esperaba. Captura de pantalla:

Código:

/***ThisfunctionconditionallyhooksthefunctionthataddscustombuttonstotheTinyMCEinitarray*/functionwpse_48782_add_SF_buttons(){if(!current_user_can('edit_posts')&&!current_user_can('edit_pages'))return;if(get_user_option('rich_editing')=='true'){add_filter('mce_external_plugins','wpse_48782_add_SF_buttons_plugins');}}add_action('init','wpse_48782_add_SF_buttons');/***AddsthepHbuttontotheTinyMCEinitarray*/functionwpse_48782_add_SF_buttons_plugins($plugin_array){$plugin_array['pH']=get_bloginfo('template_directory').'/tinymce_buttons/pH/editor_plugin.js';return$plugin_array;}/***Loadadummyadminpaneltodisplayeditor*/functionwpse_48782_add_panel(){add_menu_page('Foo','foo','manage_options','foo','wpse_48782_render_panel');}add_action('admin_menu','wpse_48782_add_panel');/***Callbacktorenderthe'Foo'adminpanel'*/functionwpse_48782_render_panel(){?><divclass="wrap">

    <?php

    $distribution = 'abc';

    wp_editor(
        $distribution,
        'distribution',
        array(
          'media_buttons' => false,
          'textarea_rows' => 8,
          'tabindex' => 4,
          'tinymce' => array(
            'theme_advanced_buttons1' => 'bold, italic, |, bullist, numlist, |, pH, pH_min',
            'theme_advanced_buttons2' => '',
            'theme_advanced_buttons3' => '',
            'theme_advanced_buttons4' => '',
          ),
        )
    );

    ?>
    </div>
    <?php
}

Entonces, básicamente lo has entendido bien, y debes estar haciendo algo diferente a lo que estoy haciendo en las cosas de las que no has hablado en tu explicación. Un par de posibilidades:

  1. No has puesto el archivo editor_plugin.js en el lugar correcto. Como se mencionó anteriormente, su ruta lleva a: [your-theme-dir]/tinymce_buttons/pH/editor_plugin.js (y las versiones -max y -min). Asegúrese de que estos archivos existan y que contengan el editor_plugin js que ha publicado anteriormente. Si abres la consola JS de tu navegador, deberías poder saber de un vistazo si has acertado con las rutas: obtendrás un "error de red" o algo así, si no es así.

  2. Conflicto de complementos. Un complemento / tema muy rudo puede filtrar 'mce_external_plugins' y eliminar los cambios realizados por otros complementos (devolviendo una matriz de inicio que no está relacionada con el $pluginsArray pasado al filtro). Busque en el directorio wp-content para 'mce_external_plugins' y examine lo que encuentre; o puedes intentar desactivar todos los demás complementos y cambiar a Twenty Eleven. Tenga en cuenta que un complemento también podría borrar su configuración haciendo algo tonto en el filtro 'tiny_mce_before_init' , que es el último en activarse antes de que se muestre el editor. Busque eso en su directorio de contenido. >

  3. Estás poniendo tu código en el lugar equivocado, para que WP no lo cargue. Sé que dices que lo pusiste en functions.php de tu tema, pero ¿estás seguro? Tal vez lo has puesto en el tema equivocado o algo así? Todos tenemos días así;)

  4. Al principio de la primera función hay una condición que dice: si el usuario actual no puede editar postpos y tampoco puede editar páginas, no les muestre los botones. Asegúrese de realizar las pruebas con un usuario que tenga al menos una de estas mayúsculas. (O intente comentar este cheque por completo, solo como una prueba).

respondido por el Boone Gorges 15.04.2012 - 16:54
1

Gracias a la excelente respuesta de Boone, encontré el problema exacto.

Por alguna razón, cuando hay instancias de wp_editor en el conjunto de páginas con teeny=true , los botones personalizados no se pueden usar en ninguna instancia de wp_editor .

Si elimina el argumento teeny=true , el problema desaparece.

    
respondido por el dunc 16.04.2012 - 14:48

Lea otras preguntas en las etiquetas