Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Cómo añadir el modo oscuro a su escritorio de administrador de WordPress

Algunos miembros de nuestro equipo prefieren trabajar hasta altas horas de la noche, y han descubierto que la brillante interfaz de administrador / administración de WordPress puede ser bastante dura para los ojos. Por eso, hemos intentado encontrar una forma de hacer que el área de administración sea más cómoda para los noctámbulos y los que trabajan con poca luz.

Fue entonces cuando descubrimos las ventajas del modo oscuro. Un esquema de colores más oscuros puede reducir significativamente la luz blanca y azul procedente de la pantalla, lo que facilita la vista durante las sesiones de edición nocturnas.

En este artículo, te mostraremos cómo añadir el modo oscuro a tu escritorio de administración de WordPress. Si eres un búho nocturno, un usuario consciente de la batería, o alguien que simplemente ama el aspecto elegante de las interfaces oscuras, te tenemos cubierto.

How to Add Dark Mode to Your WordPress Admin Dashboard

¿Qué es el modo oscuro y por qué añadirlo a WordPress?

Si suele trabajar en su sitio web de WordPress a altas horas de la noche o en condiciones de poca iluminación, la luz brillante de la pantalla del ordenador puede provocarle fatiga visual.

Algunas personas creen incluso que la luz brillante puede alterar los ritmos circadianos naturales y dificultar el sueño.

En este sentido, muchas aplicaciones, sitios web e incluso sistemas operativos incorporan un modo oscuro que reduce la cantidad de luz blanca procedente de la pantalla.

Dark mode in macOS

Si tienes un iPhone o un smartphone Android, es posible que puedas cambiar al modo oscuro mediante un conmutador.

Algunos sitios web populares como YouTube incluso ofrecen un esquema de colores oscuros integrado.

An example of Dark Mode on the YouTube website

Añadir el modo oscuro a su sitio web WordPress es genial para los visitantes, pero es posible que también desee añadir un modo oscuro al back-end de su sitio web. WordPress viene con esquemas de color de administración, pero ninguno de los esquemas de color predeterminados reduce realmente la cantidad de luz blanca que entra por la pantalla.

Dicho esto, vamos a añadir un modo oscuro al área de administrador de WordPress para que pueda trabajar cómodamente en su sitio a altas horas de la noche o en condiciones de poca luz.

Manera rápida y fácil de añadir el modo oscuro a su área de administración de WordPress

La forma más sencilla de añadir un modo oscuro al escritorio de administrador de WordPress es utilizando WP Dark Mode. Este plugin permite a los administradores activar y desactivar el modo oscuro con un solo clic.

Mejor aún, si tienes un blog de WordPress con varios autores, cada uno puede activar y desactivar el modo oscuro según prefiera. El plugin recordará sus preferencias la siguiente vez que accedan. Para saber más, vea nuestra reseña / valoración completa de WP Dark Mode.

En primer lugar, tendrás que instalar y activar el plugin WP Dark Mode. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Tras la activación, vaya a la página WP Dark Mode ” Settings en su panel de control de WordPress y, a continuación, haga clic en la pestaña Admin Panel Dark Mode.

A continuación, active el botón “Activar el modo oscuro del panel de administración”.

Enabling dark mode in WordPress

Si lo prefiere, también puede activar el modo oscuro para el editor de bloques.

A continuación, desplácese hacia abajo y pulse el botón “Guardar cambios”.

Saving WP Dark Mode plugin settings

En este punto, verás un nuevo interruptor “Claro / Oscuro” en la barra de herramientas de administración.

Puede hacer clic en este conmutador para activar y desactivar el modo oscuro en el área de administración.

Turning on the dark mode in WordPress

El ‘Modo Oscuro’ no es un esquema de color de administrador, así que después de activarlo puede que quieras intentar cambiar el esquema de color de administrador.

Si eliges una combinación de colores oscuros, podrás reducir aún más la cantidad de luz procedente de la pantalla. Otra opción es elegir un esquema de color más brillante, lo que hará que el tablero de instrumentos en modo oscuro sea más fácil de leer.

Para cambiar la combinación de colores del administrador, vaya a Usuarios ” Perfil y elija cualquiera de las opciones en Combinación de colores del administrador.

Admin Color Scheme

También puede activar el modo oscuro en la parte frontal de su sitio web.

Para ello, cambie a la pestaña “Modo oscuro frontend” y active el botón “Activar modo oscuro frontend”.

Enabling dark mode for the website's front end

Como antes, asegúrate de pulsar el botón “Guardar cambios” cuando hayas terminado.

Los visitantes seguirán viendo la versión normal y clara de su blog o sitio web de WordPress. Pero pueden cambiar al modo oscuro en cualquier momento haciendo clic en el icono de la esquina inferior derecha.

Adding dark mode to your WordPress website

Para más consejos y trucos sobre cómo personalizar tu área de administración, consulta estas guías:

Esperamos que este tutorial te haya ayudado a aprender cómo añadir el modo oscuro a tu escritorio de administración de WordPress. Puede que también quieras ver nuestra selección de los mejores plugins para el escritorio de administración de WordPress y nuestra guía sobre cómo desactivar todos los plugins cuando wp-admin no está accesible.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Descargo: Nuestro contenido está apoyado por los lectores. Esto significa que si hace clic en algunos de nuestros enlaces, podemos ganar una comisión. Vea cómo se financia WPBeginner , por qué es importante, y cómo puede apoyarnos. Aquí está nuestro proceso editorial .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

El último kit de herramientas de WordPress

Obtenga acceso GRATUITO a nuestro kit de herramientas - una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Reader Interactions

11 comentariosDeja una respuesta

  1. Jiří Vaněk

    Thank you for the advice. I have both system and browser dark mode set on Windows 11, but WordPress keeps ignoring this setting. Browser settings and even a browser extension that should force dark mode didn’t help. And now I understand that it will be a problem of WordPress missing color scheme for dark mode. Thank you for the valuable experience and advice on how to force dark mode.

    • WPBeginner Support

      You’re welcome :)

      Administrador

  2. Dan

    Thank you.
    This is a workaround plugin, which is not ideal.
    I’ve observed that every time I click anything in the interface, it blinks for 1 second in the original color and then switches to dark mode.
    Ideally, WordPress should add it to its color scheme.

    • WPBeginner Support

      You may want to change your color scheme under User>Profile to set the base color to help prevent the delay in the style’s loading.

      Administrador

  3. Thia

    Awesome. Just tried the plugin and It’s really cool.

    • WPBeginner Support

      Glad you liked our recommendation!

      Administrador

  4. Darlington

    What about how to implement dark mode in the frontend of my wordpress website?

    • WPBeginner Support

      That would be determined by your theme, if you reach out to your theme’s support they should be able to let you know.

      Administrador

  5. Kuldeep Singh

    Awesome!

    Thank you guys. It helped me to get desired dashboard dark theme. But I need the default editor background in dark theme too. It there any single plugin which can change the dashboard and editor background to dark mode?

    • WPBeginner Support

      You would want to reach out to the plugin’s support for their recommendation first

      Administrador

Deja tu comentario

Gracias por elegir dejar un comentario. Tenga en cuenta que todos los comentarios son moderados de acuerdo con nuestros política de comentarios, y su dirección de correo electrónico NO será publicada. Por favor, NO utilice palabras clave en el campo de nombre. Tengamos una conversación personal y significativa.