FAIR

Federated and Independent Repositories

Presario Dark Mode for Elementor

Plugin Banner

Presario Dark Mode for Elementor

by Presario

Download
Description

Dark Mode for Elementor helps you build a consistent dark mode experience on Elementor sites without restyling every widget manually.

Core capabilities:

  • Add a dedicated dark mode toggle widget for Elementor.
  • Map dark colors to Elementor Global Colors and reuse them site-wide.
  • Keep the visitor preference in the browser.
  • Choose the startup mode and configure shortcode fallback controls.
  • Preview the mapped result before applying changes across the site.

This plugin is designed for sites that already rely on Elementor Global Colors and want a centralized dark mode workflow.

Why teams use it:

  • It keeps dark mode aligned with Elementor’s design system.
  • It gives you a simple site-wide workflow based on Elementor Global Colors.
  • It helps you ship a useful toggle experience with a focused setup flow.

External Services

This plugin does not require an external service for its core Free functionality.

It includes informational links to the Presario website:

  • https://darkmodeplugin.com/ – product website and documentation
  • https://darkmodeplugin.com/support – support page
  1. Upload the plugin files to the /wp-content/plugins/presario-dark-mode directory, or install the plugin through the WordPress plugins screen.
  2. Activate the plugin through the Plugins screen in WordPress.
  3. Make sure Elementor is installed and activated.
  4. Go to Dark Mode in the WordPress admin to configure your dark palette.
  5. Add the Dark Mode Toggle widget in Elementor where you want the switch to appear.
  1. Map Elementor Global Colors to dedicated dark mode values.

    Map Elementor Global Colors to dedicated dark mode values.

  2. Configure your site-wide dark palette from Elementor Global Colors.

    Configure your site-wide dark palette from Elementor Global Colors.

  3. Choose the startup mode and shortcode controls for the Free plugin.

    Choose the startup mode and shortcode controls for the Free plugin.

  4. Use the shortcode fallback when the switch must live outside an Elementor layout.

    Use the shortcode fallback when the switch must live outside an Elementor layout.

  5. Place the Dark Mode Toggle widget directly inside an Elementor layout.

    Place the Dark Mode Toggle widget directly inside an Elementor layout.

  6. Extend the mapping workflow across additional design-system colors.

    Extend the mapping workflow across additional design-system colors.

  7. Example preset workflow with saved presets and import/export.

    Example preset workflow with saved presets and import/export.

  8. Example automation workflow for system or time-based behavior.

    Example automation workflow for system or time-based behavior.

  9. Example transition workflow for the light and dark mode switch.

    Example transition workflow for the light and dark mode switch.

  10. Example logo replacement workflow for dark mode branding.

    Example logo replacement workflow for dark mode branding.

  11. Example exclusion workflow for pages, URLs, and selectors.

    Example exclusion workflow for pages, URLs, and selectors.

  12. Configure the fallback shortcode labels, colors, borders, and live preview.

    Configure the fallback shortcode labels, colors, borders, and live preview.

How do I add dark mode to my Elementor site?

Install the plugin, map Elementor Global Colors to darker values, preview the result, then place the visitor-facing switch where it fits your layout.

Does Elementor include a built-in dark mode toggle for visitors?

No. Elementor does not provide a native visitor-facing dark mode toggle. This plugin adds that layer on top of Elementor and connects it to your color mapping workflow.

Do I need Elementor Pro?

No. The free plugin works with Elementor itself. Elementor Pro is not required to map colors, preview the result, or place the toggle on the frontend.

Can I create dark mode without redesigning every page?

Yes. The plugin is built around Elementor Global Colors, so you can centralize your dark palette instead of restyling each page or widget one by one.

Can visitors switch between light mode and dark mode?

Yes. The free plugin includes an Elementor toggle widget and a shortcode fallback for theme areas that are not built with Elementor.

Can I preview the result before applying changes across the site?

Yes. The plugin includes a preview flow so you can review the mapped result before relying on it across the site.

Does it work with my current theme?

Yes. The plugin is theme-agnostic, but it is especially effective when the site colors are driven by Elementor Global Colors.

Can this help with accessibility and contrast review?

It helps you review mapped colour pairs on real layouts, but accessibility compliance still depends on the final colours, content, and contrast choices used on your site.

Are advanced automation and exclusions included in this WordPress.org plugin?

This WordPress.org plugin focuses on the free feature set: color mapping, preview, the toggle widget, and the shortcode fallback. Advanced workflows such as automation and exclusions are available separately in Presario Dark Mode Pro for Elementor.

1.0.0

  • First official public launch of Presario Dark Mode for Elementor.
  • Added the dark mode toggle widget and Elementor Global Colors mapping workflow.
  • Prepared the plugin for WordPress.org distribution and customer-ready production use.
Back to top