• Saltar al contenido principal
  • Saltar a la barra lateral principal
  • Saltar al pie de página
Jessica Gestoso

Jessica Gestoso

Consultoría tecnológica para emprendedoras digitales que quieren cambiar el mundo

  • Quien soy
  • Trabaja Conmigo
  • Blog
  • Podcast
  • Contacto
  • Test Gratuito

Como añadir un color personalizado al editor de WordPress

Publicado el 20/04/2016 por Jessica Gestoso
Última actualización el 17/02/2019

¡Hola! ¿Qué tal el día? Estaba yo el otro día escribiendo un post y pensé. «Jo, siempre que quiero aplicar color a un texto tengo que escoger entre los que vienen por defecto y a mi me gustaría poder usar mis colores»

Así que acudí a Google (que todo lo sabe)  y descubrí que el editor, el botón de escoger color tiene una opción que pone «personalizado» y que desde ahí puedo poner el código del color que quiera. Si lo sé, si es un perro me muerde (como se suele decir)

Y estaba yo toda happy con mi recién hallazgo, cuando guardo el post, voy a vista previa, vuelvo a entrar, sigo escribiendo y… Mi personalización no estaba y me tocó volver a poner el código.

Y si, ya sé que menos da una piedra, pero a mi me toca mucho la moral tener que estar pendiente del código del color (que por alguna extraña razón aún no me sé de memoria).

Así que acudí otra vez a Google y di con este foro donde explican lo que hay que trastear en el código para añadir colores al editor de texto de tu WordPress.

Y me sentí muy feliz :D

Si, lo sé, los seres humanos «normales» no se emocionan por poder poner una frase de un tono de color diferente, pero ya ves, una que tiene sus pequeñas rarezas jejje

Al principio iba a dejar ahí las cosas porque no me gusta complicarte la vida con el código.

Pero es que es copiar y pegar

Y me ha hecho tanta ilusión dejar de usar este verde y empezar a usar mi verde en los textos (bueno igual es sólo cosa mía)

 

Pasos a dar para poder personalizar el color de tus textos

Me repito como el ajo, lo sé. Pero si vas a tocar el código, copia de seguridad.

 

A continuación te dejo el código que vas a tener que añadir (también puedes pillarlo del link del foro que te puse un poco más arriba)

function mytheme_change_tinymce_colors( $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", «Brown»,
"C0C0C0", «Silver»,
"FF99CC", «Pink»,
"FFCC99", «Peach»,
"FFFF99", «Light yellow»,
"CCFFCC», «Pale green»,
"CCFFFF», «Pale cyan»,
"99CCFF", «Light sky blue»,
"CC99FF", «Plum»,
"FFFFFF», «White»
';
$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»
';
$init['textcolor_map'] = '['.$default_colours.','.$custom_colours.']';
$init['textcolor_rows'] = 6; // expand colour grid to 6 rows
return $init;
}
add_filter('tiny_mce_before_init', 'mytheme_change_tinymce_colors');

 
Y ahora sólo tienes que ver el video con la explicación de cómo utilizarlo

 

¿Te atreves a trastear y me cuentas?

 

  • facebook
  • Twitter
  • LinkedIn

Publicado en: Ayuda para tu blog Etiquetado como: guía, video, WordPress

Interacciones con los lectores

Comentarios

  1. Lau Cardozo dice

    21/02/2020 a las 22:33

    Impresionante explicación ! Mirá q busqué mucho tiempo como personalizar los colores. Gracias

    Responder

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Los datos que proporciones al enviar tu comentario sólo serán utilizados para responder a tu comentario.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Footer

Algo más a lo que echarle un ojo:

  • ¿Membresía o cursos sueltos?, con Isra Bravo
  • ¿Cómo crear tu sitio web sin programación?
  • ¿Qué son los funnels de ventas y cómo ayudan a tu negocio?
  • ¿Qué es una membresía?
  • Estrategias de marketing para eventos: promociona tu marca

Desarrollo WordPress

  • Mantenimiento WordPress
  • Creación de páginas Web
  • Soporte a medida (bolsa de horas)
  • Creación de formularios de suscripción
  • Los errores más comunes en una web (CheckList gratuito)

Servicios de consultoría tecnológica

  • Consultoría para emprendedoras
  • Mentoring 1 a 1
  • ¿Estás preparada para monetizar tus conocimientos? (Test Gratuito)

Formación para emprendedoras

  • Comunidad para emprendedoras digitales
  • Curso «Cómo crear un lead magnet»
  • Training Mejora la Visibilidad de tu Web

Aviso legal, política de privacidad y de cookies
Jessica Gestoso © 2023 · Todos los derechos reservados

Utilizo cookies analíticas, publicitarias y de terceros para ofrecerte la mejor experiencia en la web.

Puedes aprender más sobre qué cookies utilizo o desactivarlas en los ajustes.

Resumen de privacidad

Esta web utiliza cookies para que podamos ofrecerte la mejor experiencia de usuario posible. La información de las cookies se almacena en tu navegador y realiza funciones tales como reconocerte cuando vuelves a nuestra web o ayudar a nuestro equipo a comprender qué secciones de la web encuentras más interesantes y útiles.

Cookies de terceros

Esta web utiliza cookies de terceros para recopilar información anónima tal como el número de visitantes del sitio, o las páginas más populares.

Dejar esta cookie activa nos permite mejorar nuestra web.

¡Por favor, activa primero las cookies estrictamente necesarias para que podamos guardar tus preferencias!