Agregar color de texto personalizado WordPress 3.9 TinyMCE 4 Editor visual

3 minutos de lectura

Tenía un fragmento de código que me ayudaría a agregar un color personalizado al menú desplegable de color de texto del editor visual junto con los colores predeterminados. Estoy pegando el fragmento a continuación.

function change_mce_options( $init ) {
  $default_colours="000000,993300,333300,003300,003366,000080,333399,333333,800000,FF6600,808000,008000,008080,0000FF,666699,808080,FF0000,FF9900,99CC00,339966,33CCCC,3366FF,800080,999999,FF00FF,FFCC00,FFFF00,00FF00,00FFFF,00CCFF,993366,C0C0C0,FF99CC,FFCC99,FFFF99,CCFFCC,CCFFFF,99CCFF,CC99FF,FFFFFF";
  $custom_colours="e14d43,d83131,ed1c24,f99b1c,50b848,00a859,00aae7,282828";
  $init['theme_advanced_text_colors'] = $default_colours . ',' . $custom_colours;
  $init['theme_advanced_more_colors'] = true;
  return $init;
}
add_filter('tiny_mce_before_init', 'change_mce_options');

Después de la actualización de wordpress 3.9 dejó de funcionar, he intentado arreglarlo mucho, pero no puedo hacerlo, ¿pueden ayudarme?

avatar de usuario
urosevic

La opción para los colores del texto es textcolor_map y el formato de cada color es "color_hex", "color_name".

Entonces, a partir de su ejemplo, simplemente cambie el nombre de la opción y convierta la matriz de colores en algo como esto:

function my_mce4_options($init) {
  $default_colours=""000000", "Black",
                      "993300", "Burnt orange",
                      "333300", "Dark olive",
                      "003300", "Dark green",
                      "003366", "Dark azure",
                      "000080", "Navy Blue",
                      "333399", "Indigo",
                      "333333", "Very dark gray",
                      "800000", "Maroon",
                      "FF6600", "Orange",
                      "808000", "Olive",
                      "008000", "Green",
                      "008080", "Teal",
                      "0000FF", "Blue",
                      "666699", "Grayish blue",
                      "808080", "Gray",
                      "FF0000", "Red",
                      "FF9900", "Amber",
                      "99CC00", "Yellow green",
                      "339966", "Sea green",
                      "33CCCC", "Turquoise",
                      "3366FF", "Royal blue",
                      "800080", "Purple",
                      "999999", "Medium gray",
                      "FF00FF", "Magenta",
                      "FFCC00", "Gold",
                      "FFFF00", "Yellow",
                      "00FF00", "Lime",
                      "00FFFF", "Aqua",
                      "00CCFF", "Sky blue",
                      "993366", "Red violet",
                      "FFFFFF", "White",
                      "FF99CC", "Pink",
                      "FFCC99", "Peach",
                      "FFFF99", "Light yellow",
                      "CCFFCC", "Pale green",
                      "CCFFFF", "Pale cyan",
                      "99CCFF", "Light sky blue",
                      "CC99FF", "Plum"";

  $custom_colours=""E14D43", "Color 1 Name",
                      "D83131", "Color 2 Name",
                      "ED1C24", "Color 3 Name",
                      "F99B1C", "Color 4 Name",
                      "50B848", "Color 5 Name",
                      "00A859", "Color 6 Name",
                      "00AAE7", "Color 7 Name",
                      "282828", "Color 8 Name"";

  // build colour grid default+custom colors
  $init['textcolor_map'] = '['.$default_colours.','.$custom_colours.']';

  // enable 6th row for custom colours in grid
  $init['textcolor_rows'] = 6;

  return $init;
}
add_filter('tiny_mce_before_init', 'my_mce4_options');

EDITAR: La cuadrícula de muestras de color predeterminada es 5×8 (ROWSxCOLS), y para agregar colores personalizados después de la cuadrícula de colores predeterminada, debemos modificar el número de filas. Cambio incluido en el código anterior, y mejor explicado en mi entrada en el blog.

EDIT2: Ahora hay un complemento de selector de color – Selector de color TinyMCE¡así que todos los ajustes relacionados con los colores para WordPress 3.9 están resueltos ahora!

EDITAR 3: El selector de color anterior está desactualizado. Este es el complemento más actual a partir de septiembre de 2016: https://wordpress.org/plugins/kt-tinymce-color-grid/

Salud

  • Muchas gracias hombre. Esto va a salvar a mucha gente por ahí. Dios te bendiga (y)

    – iSaumya

    21 de abril de 2014 a las 14:49

  • También en el $init['textcolor_map'] primero tenemos que enviar el colores personalizados entonces el colores predeterminados, He intentado hacer lo contrario, pero no funciona, puede que la nueva versión no lo permita, pero muchas gracias por la ayuda. Gracias una tonelada.

    – iSaumya

    21 de abril de 2014 a las 15:02

  • @urosevic ¿Qué hay de agregar la selección de color personalizado: ” $init[‘theme_advanced_more_colors’] = verdadero;”

    – timson

    24/04/2014 a las 17:22

  • @ptimson Estoy bastante seguro de que TinyMCE 4.0 listo para usar no tiene la funcionalidad de selector de color personalizado.

    – urosevic

    25/04/2014 a las 21:05

  • Ahora tenemos una solución para el selector de color: echa un vistazo Selector de color TinyMCE enchufar

    – urosevic

    30/04/2014 a las 20:39

¿Ha sido útil esta solución?