Cómo cambiar el color de selección de texto por defecto en WordPress

¿Quieres cambiar el color de selección de texto por defecto en WordPress?

Puedes hacer que tu sitio de WordPress destaque prestando atención a los pequeños detalles, como hacer que el color de selección de texto coincida con el esquema de colores de tu sitio.

En este artículo, te mostraremos cómo cambiar el color de selección de texto por defecto en tu tema de WordPress.

Cómo cambiar el color de selección de texto por defecto en WordPress

¿Por qué cambiar el color de selección de texto por defecto?

Los colores son una parte importante de tu imagen de marca, por lo que deberías dedicar tiempo a elegir la combinación de colores perfecta. Aumentará el atractivo de tu sitio para que tus visitantes permanezcan más tiempo, impulsando tus ventas y conversiones

Un detalle que a menudo se olvida es el color de resaltado que se da al texto seleccionado. El color por defecto no queda bien en todos los sitios web.

Puede que tu tema de WordPress te dé la opción de cambiar este color, pero la mayoría no lo hace. Si el tuyo no lo hace, puedes cambiar el color de selección de texto de tu tema mediante un plugin o un fragmento de código.

Sólo es necesario un método, y a la mayoría de los usuarios les resultará más sencillo utilizar un plugin. Puedes utilizar los enlaces que aparecen a continuación para saltar a tu método preferido.

Método 1: Usar un plugin para cambiar el color de la selección de texto

Color de resaltado personalizado es un plugin de WordPress que te permite seleccionar un color de selección de texto personalizado. Este es el método más sencillo, pero el resultado puede no ser exactamente el mismo en todos los navegadores web.

Lo primero que tendrás que hacer es instalar y activar el Color de Resaltado Personalizado plugin. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Una vez instalado, debes navegar a Apariencia " Personalizar en tu panel de control de WordPress. Luego tienes que seleccionar Colores en el menú.

Navega hasta la sección de colores del personalizador de temas

Tendrás que hacer clic en el Color de Resaltado para escribir el código hexadecimal del color deseado o utilizar el selector de color. A continuación, simplemente haz clic en el botón Publicar para activar el nuevo color de resaltado.

Color de resaltado personalizado

Método 2: Usar el código para cambiar el color de la selección de texto

El segundo método utiliza un fragmento de código CSS. Esto puede ser complicado para los principiantes, y cometer un error podría romper tu sitio web de WordPress .

Si eres nuevo en el uso de fragmentos de código, quizá quieras consultar nuestra guía sobre cómo añadir fácilmente CSS personalizado a tu sitio de WordPress. En este tutorial, utilizaremos el Personalizador de Temas.

Lo primero que tienes que hacer es navegar a Apariencia " Personalizar en tu panel de control de WordPress. Una vez allí, tienes que hacer clic en CSS adicional en la parte inferior de la lista.

A continuación, sólo tienes que copiar y pegar los siguientes estilos.


::-moz-selection {
    background-color: #ff6200;
    color: #fff;
}
 
::selection {
    background-color: #ff6200;
    color: #fff;
}

Observa que hemos añadido dos estilos. El selector CSS ::moz-selection funciona con el navegador Firefox, y el selector CSS ::selection funciona con otros navegadores populares como Chrome, Safari, IE9+ y Opera.

La sección de colores del personalizador de temas

No olvides cambiar el color de fondo para que coincida con el esquema de colores de tu tema. Cuando hayas terminado, haz clic en el botón Publicar de la parte superior de la pantalla.

Ahora puedes navegar por tu sitio web para ver el cambio en acción. Aquí tienes capturas de pantalla del antes y el después de nuestro sitio web de prueba.

Vista previa del cambio de color de la selección de texto

Esperamos que este tutorial te haya ayudado a aprender a cambiar el color de selección de texto por defecto en WordPress.

Quizás también quieras ver nuestra guía sobre cómo elegir el mejor software de diseño web y consultar nuestra lista de los mejores plugins constructores de páginas de arrastrar y soltar de WordPress.

Si te ha gustado esta guía, considera la posibilidad de suscribirte a nuestra Canal de YouTube para los videotutoriales de WordPress. También puedes encontrarnos en Twitter y Facebook.

Si quieres conocer otros artículos parecidos a Cómo cambiar el color de selección de texto por defecto en WordPress puedes visitar la categoría Themes.

¡Más Contenido!

Deja un comentario

Tu dirección de correo electrónico no será publicada.

Go up