Saltar al contenido

Cómo cambiar el color del texto en WordPress

Cómo cambiar el color del texto en WordPress

Los colores son uno de los elementos esenciales del diseño web que pueden evocar emociones específicas de su público objetivo y obtener su reacción. Tienen el poder de aumentar el reconocimiento de la marca e influir en la forma en que alguien percibe su marca, incitar a las personas a actuar, transmitir mensajes y emociones, impactar la legibilidad del texto y mucho más.

A medida que construye su sitio web de WordPress, puede sentir que los colores de texto predeterminados realmente no funcionan para usted, por lo que, naturalmente, querrá modificarlos. En este artículo, le mostraremos cómo cambiar el color del texto en WordPress usando cinco métodos diferentes:

Cambiar el color del texto en WordPress usando las opciones del tema Qode

Incluso cuando compre un tema de WordPress que se adapte a todos sus requisitos, es posible que desee modificar algunos de sus elementos para que se ajusten mejor al estilo que está tratando de lograr.

Algunos temas en el mercado le permiten controlar el aspecto visual de su sitio web y cambiar los colores del texto, generalmente haciendo clic en Apariencia> Personalizar y luego seleccionando las opciones relacionadas con la tipografía (que es donde se colocan las configuraciones de color de fuente).

Pero los temas de qode vienen con muchas más opciones de personalización que le permiten modificar los colores de casi cualquier sección de su sitio web. Usted puede ve a las opciones generales de tu tema y cambie no solo el color del texto, sino también el tamaño de la fuente, el peso, la altura y más (el título de la sección de opciones principales en el menú generalmente contiene el nombre del tema o el nombre del perfil + opciones, p. ej. Opciones Leitmotif, Opciones Mikado, etc.).

Por ejemplo, si ha instalado Bridge, puede ir a Opciones de Qode> Fuentes y modificar allí todos los principales ajustes globales relacionados con la tipografía.

Fuentes de opciones de Qode

Dependiendo de un tema, también Permitir a los usuarios modificar el color del texto en las secciones de encabezado y pie de página de su sitio, en títulos, etc.. Todo lo que tiene que hacer es seleccionar la sección que desea modificar (de las opciones generales) y ajustar el color del texto a su gusto.

La búsqueda de modificar los colores en su sitio web de WordPress se ha facilitado significativamente con el lanzamiento de nuestro nuevo marco interactivo Qode que elevó la experiencia del usuario a un nivel completamente nuevo. Este poderoso marco incluye una variedad de características prácticas que hacen que la experiencia de creación de sitios web del usuario sea más cómoda, una de ellas es la Buscar opción. A medida que navega hacia las opciones generales de su tema Qode que presenta el nuevo marco, notará la barra de búsqueda en la parte superior de la página. Puedes escribir Colores y verá la lista de todas las secciones donde es posible cambiar de color.

Nuevo marco de Qode

Tampoco somos ajenos a empaquetar códigos cortos potentes que permiten a los usuarios crear sitios web que se ajusten completamente a sus requisitos, por lo que, dependiendo de un tema, podemos incluir algunos códigos cortos que también presentan contenido textual, como nuestro Imagen con texto Código corto. Sería justo permitir que nuestros usuarios también personalicen los códigos cortos, por lo que hemos incluido las opciones que permiten el cambio de color del texto.

Imagen con código corto de texto

Eso es todo para las opciones de temas generales. Ahora veamos cómo cambiar los colores del texto en páginas individuales.

Cómo cambiar el color del texto en WordPress usando el editor clásico

Para cualquiera que use el Editor clásico, cambiar los colores del texto requiere unos pocos clics.

Para empezar, vaya a la página que desea editar o cree una nueva y agregue el contenido textual. En el menú de la barra de herramientas, haga clic en el Alternar barra de herramientas icono para mostrar la segunda fila de opciones donde el Color de texto se coloca la opción.

Alternar barra de herramientas

A continuación, resalte las partes del texto cuyo color desea cambiar y haga clic en el Color de texto icono para jugar con los colores.

Colores de texto del editor clásico

Si tiene un color específico en mente que no figura aquí, haga clic en Personalizado… y seleccione un tono del panel de colores o ingrese su código hexadecimal.

VER
Los 5 mejores plugins de testimonios de WordPress

Cómo cambiar el color del texto en WordPress usando Gutenberg

Si está trabajando en una página o una publicación en Gutenberg y desea cambiar el color del texto de todo el bloque, primero haga clic en el cuadro que contiene el texto. Ahora, eche un vistazo al lado derecho de la pantalla y haga clic en el Configuraciones de color opción.

Configuración de color de Gutenberg

Puede modificar no solo el color del texto, sino también establecer el color de fondo del bloque como más le guste.

En caso de que desee alterar el tono de solo partes del texto y no de todo el bloque, resalte el texto que desea colorear de manera diferente, haga clic en la flecha hacia abajo y elija Color de texto.

Color del texto de Gutenberg

A continuación, aparecerá una paleta de colores y todo lo que tiene que hacer ahora es seleccionar el tono que coincida con el estilo de su marca.

Color personalizado de Gutenberg

Nota: En Gutenberg, puede cambiar los colores del texto para los bloques de encabezado y párrafo, pero no puede alterar el color de fondo para los bloques de encabezado.

Cómo cambiar el color del texto en WordPress con Elementor

Cuando desee editar su texto en Elementor, puede usar el Editor de texto widget que es similar al editor clásico de WordPress. Todas las opciones se enumeran en el lado izquierdo de la pantalla, pero estamos interesados ​​en Color de texto. Resalta la parte del texto que deseas pintar en otro tono y elige el color a tu gusto.

Color de texto de Elementor

Elementor también viene con la práctica Editar sección opción que se muestra encima del widget que ha agregado a la página.

Sección de edición de Elementor

Haga clic en él y en el menú de la izquierda seleccione Estilo opción y luego haga clic en Tipografía.

Tipografía Elementor Style

Además de alterar el color del texto, también puede establecer la alineación del texto, el color del título, el color del enlace y más.

Cómo cambiar el color del texto en WordPress usando CSS

Por último, pero no menos importante, nos gustaría mostrarle cómo cambiar los colores de fuente en WordPress globalmente usando CSS. Si las opciones del tema que eligió no son suficientes, esto es lo que puede hacer para realizar algunos ajustes con respecto al color del texto.

En el menú de su panel, seleccione Apariencia> Personalizar.

Apariencia Personalizar

Aparecerán varias opciones en el lado izquierdo de la pantalla, pero debe hacer clic en CSS adicional.

Personalizar CSS adicional

Ahora aparecerá un cuadro CSS, en el que debe pegar las siguientes líneas de código:

h1 { 
color: #some_hex_code; 
}

Por supuesto, puede cambiar el color de cualquier título que desee, ya sea h2, h3, etc., dependiendo de los títulos que tenga en su sitio. Por ejemplo, queríamos colorear nuestro h1 en rojo, por lo que agregamos el siguiente código:

h1 { 
color: #cc0a0a;
}

Este código es suficiente para cambiar el color del texto en los títulos, pero si desea modificar el color de otros elementos de texto, use diferentes selectores, por ejemplo “un” para enlaces, “pags” para párrafos, etc.

p { 
color: #cc0a0a;
}

Vamos a concluir esto

Crear un sitio web atractivo es mucho más fácil cuando sabe cómo cambiar los colores del texto en WordPress. Con este tutorial, queríamos mostrarle cómo modificar las tonalidades de texto de forma global y en páginas individuales utilizando todos los editores y creadores de páginas populares, y el método que decida utilizar depende de sus preferencias y quizás de sus habilidades. Después de todo, no todos saben cómo usar CSS, pero con el tema de WordPress adecuado que incluye una gran cantidad de opciones de personalización, ni siquiera necesita saber cómo codificar.