Darkify – Dark Mode & Night Mode for Website and Admin Dashboard

Darkify adds WordPress Dark Mode and Night Mode to both the website frontend and the WordPress admin dashboard. Visitors can switch between light and dark themes using a toggle, while site owners control how dark mode behaves across the frontend, admin panel, and editors.

Darkify supports frontend dark mode, admin dashboard dark mode, and editor-specific dark mode for Gutenberg (Block Editor) and the Classic Editor. It includes OS-aware detection, default dark mode, time-based scheduling, keyboard shortcuts, and multiple toggle placement options. Designed for performance and compatibility, Darkify works seamlessly with popular WordPress themes, page builders, and WooCommerce — without modifying theme files or requiring custom code.

Site owners can customize dark mode colors, switches, media handling, and element visibility. Darkify also provides controls for images, videos, scrollbars, mobile behavior, and page or element-level targeting to ensure dark mode integrates cleanly with different themes, builders, and layouts.

Cómo funciona Darkify

Darkify applies dark mode styling using configurable rules rather than modifying theme files. You can enable dark mode globally or limit it to specific areas, pages, posts, or elements. Settings can be adjusted from a centralized admin panel and reused across different sites using import and export tools.

Darkify está diseñado para funcionar con los temas de WordPress más populares, los maquetadores de páginas y las instalaciones multisitio, lo que permite configurar el modo oscuro sin necesidad de código personalizado.

Why Choose Darkify?

✔ Dark mode for frontend and admin dashboard ✔ Works with Gutenberg, Elementor, and popular builders ✔ OS-aware, scheduled, and manual switching ✔ Lightweight and performance-focused ✔ No theme modification required

Live Demo | Support | Documentation | Upgrade to Pro!

Características clave del plugin de modo oscuro Darkify

• Frontend Dark Mode: Enable dark mode on the public-facing website and allow visitors to switch between light and dark themes using a toggle.

• Admin Dashboard Dark Mode: Apply dark mode to the WordPress admin area to provide a darker interface while managing site content and settings.

• Modo oscuro específico del editor: Activa el modo oscuro de forma independiente para el panel de administración de WordPress, el editor de bloques (Gutenberg) y el editor clásico.

• Modo oscuro por defecto: Carga el sitio web en modo oscuro por defecto, permitiendo a los visitantes cambiar de nuevo al modo claro en cualquier momento.

• Modo oscuro según el sistema operativo: Detecta la preferencia del sistema operativo del visitante y aplica automáticamente el modo claro u oscuro en consecuencia.

• Modo oscuro programado: Programa el cambio automático entre el modo claro y el modo oscuro en función de un intervalo de tiempo definido.

• Keyboard Shortcut: Allow users to toggle dark mode using a simple keyboard shortcut: Ctrl + Alt + D for quick access.

• Multiple Floating Switch Designs: Choose from different floating switch styles and positions to control how the toggle appears on the site.

• Interruptor personalizable: Ajusta el tamaño del interruptor, los colores, los iconos y el estilo para que coincidan con el diseño del sitio.

• Conmutador en el menú: Inserta el conmutador de modo oscuro en los menús de navegación de WordPress seleccionados.

• Shortcode Switch: Place the dark mode toggle anywhere on the site using a shortcode, including pages, posts, widgets, or templates.

• Multiple Switch Placement Options: Display the dark mode toggle as a floating button, menu item, shortcode, or by targeting a custom CSS selector.

• Controles específicos para móviles: Controla la visibilidad, la posición, el espaciado y el comportamiento de los interruptores por separado para dispositivos móviles.

• Color Presets & Customization: Choose from 8 predefined dark color presets or manually configure background, text, link, and UI colors.

• Estilo de la barra de desplazamiento en modo oscuro: Aplica opcionalmente un estilo oscuro a las barras de desplazamiento del navegador para lograr una interfaz oscura más uniforme.

• Control avanzado de imagen: Ajusta el brillo, el contraste y los ajustes de escala de grises de la imagen para mejorar su visibilidad en el modo oscuro.

• Video Control: Modify video brightness and grayscale settings to better match dark mode layouts.

• Control a nivel de elemento: Incluye o excluye elementos HTML, etiquetas, clases o IDs específicos del estilo en modo oscuro.

• Copia de seguridad y restauración de ajustes: exporta los ajustes del plugin a un archivo e impórtalos en otro sitio o restáuralos más tarde.

• Clean Uninstall Option: Optionally remove plugin settings and data from the database when uninstalling the plugin.

• Compatibilidad con maquetadores de páginas: Compatible con maquetadores de páginas populares como Elementor, Divi, WPBakery, Beaver Builder, Visual Composer y Oxygen.

• Panel de ajustes fácil: Gestiona todas las características del plugin desde un panel de ajustes centralizado en el área de administración de WordPress.

• Compatibilidad con multisitio: Configura los ajustes de modo oscuro para redes multisitio de WordPress, de forma global o por sitio.

• Preparado para varios idiomas: Listo para traducción y compatible con configuraciones multilingües de WordPress.

• Theme Compatibility: Designed to work with most WordPress themes without requiring theme-specific modifications.

• Developer-Friendly: Provides a structured and extensible codebase that developers can customize using hooks and filters.

• Compatibilidad entre navegadores: Diseñado para funcionar en navegadores modernos como Chrome, Firefox, Safari, Edge, Opera, etc.

• Documentation & Support: User guides, tutorials, and support are available through documentation and the WordPress.org support forums.

Guía completa de características y configuración

«»

Cómo añadir el modo oscuro en Gutenberg (editor de bloques de WordPress)

«»

How to Add Dark Mode in Elementor

«»

Page Builder Compatibility

• Gutenberg
• WPBakery
• Elementor
• Beaver Builder
• SiteOrigin
• Divi
• «LayersWP»
• MotoPress
• Esencial
• Maquetador Themify

Temas compatibles (ejemplos)

• Hello Elementor
• Astra
• Divi
• Kadence
• Themify Ultra
• OceanWP
• Hestia
• Inspiro
• GeneratePress
• Avada
• Blocksy
• Neve

FUNCIONALIDADES DE LA VERSIÓN PRO

🎨 Opciones de diseño y personalización

• 16+ Floating Switch Designs Choose from a diverse collection of floating switch styles to perfectly match your website’s look and feel.

• Posicionamiento del interruptor arrastrable Permite a los usuarios mover el interruptor flotante del modo oscuro a cualquier lugar de la pantalla. Esta funcionalidad de arrastrar y soltar garantiza un acceso cómodo desde cualquier página o sección.

• Personalización especial de preajustes de color Personaliza tu tema en modo oscuro con ajustes avanzados de color. Cambia los colores de los enlaces, los colores de los bordes, el estilo de los campos de formulario y la apariencia de los botones para alinearlos con la identidad de tu marca.

• CSS personalizado para el modo oscuro Añadir estilos de CSS personalizado que se apliquen solo en el modo oscuro. Esto ofrece a los desarrolladores y diseñadores un control total para ajustar con precisión la experiencia del tema oscuro.

🖼️ Gestión de medios

• Inversión de imagen Invierte automáticamente imágenes específicas para mejorar la visibilidad en el modo oscuro. Mejora tanto la estética como la accesibilidad sin necesidad de editar los recursos originales.

• Sustitución de imágenes Sustituye sin problemas imágenes específicas por versiones optimizadas para el modo oscuro. Perfecto para logotipos, banners o ilustraciones que necesiten un aspecto personalizado en el modo noche.

• Sustitución de vídeo Cambia automáticamente los vídeos por versiones adecuadas para entornos oscuros para mantener un diseño coherente en los elementos visuales de tu sitio web.

🔧 Controles avanzados de visibilidad

• Permitir / Bloquear elementos Ajusta tu modo oscuro seleccionando qué elementos o secciones HTML deben usar el estilo de modo oscuro y cuáles no.

• Permitir / No permitir páginas Elige en qué páginas individuales se muestra el modo oscuro. Excluye las páginas de destino, los flujos de pago o cualquier contenido especial para ofrecer una experiencia de usuario totalmente personalizada.

• Permitir / Denegar entradas Decide qué entradas concretas son compatibles con el modo oscuro. Mantén el control editorial total sobre cómo aparece tu contenido en los distintos tipos de contenido.

OTROS PRODUCTOS INCREÍBLES DE ThemeAtelier

➡️ WhatsApp Chat Help – Un plugin de chat de WhatsApp flexible que ayuda a los visitantes del sitio web a iniciar conversaciones instantáneas contigo directamente desde tu sitio de WordPress.

➡️ Eventful – Events Showcase and Filter Bar for The Events Calendar – Un plugin de visualización de eventos para The Events Calendar que te ayuda a mostrar eventos en estructuras limpias, modernas y totalmente adaptables, sin necesidad de programar.

➡️ Greet – Video Bubble Warm Welcome Plugin – Un plugin de burbuja de vídeo de Te damos la bienvenida que te ayuda a saludar cordialmente a los visitantes y ofrecer opciones rápidas de contacto para aumentar la participación.

➡️ Domain For Sale – A domain listing and offer management plugin that helps you list domains, collect buyer offers, and manage secure sales with escrow payments directly from WordPress.

➡️ Eventful for Elementor – Events Showcase For The Events Calendar and Elementor – Una extensión de Elementor para The Events Calendar que te permite diseñar y mostrar eventos usando widgets de Elementor con estructuras avanzadas y adaptables.

➡️ Better Chat Support For Messenger – Un plugin de chat de Facebook Messenger que permite a los visitantes contactarte al instante a través de Messenger con burbujas de chat personalizables.