• Resolved edmondoddy

    (@edmondoddy)


    Hi, my website’s default body color is white, so I got a dark color logo so it can be visible on white.

    When the dark mode is enabled, the body color changed to black and the logo stays dark and it becomes invisible.

    How to change the logo path when the dark mode enabled?

    Thanks

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author markoarula

    (@markoarula)

    Hello,

    the easiest way to change the logo in this situation is with CSS.

    Your logo HTML is probably looking like this:

    <a href="#" class="your-logo-link-class">
      <img src="logo-path" class="your-logo-img-class">
    </a>

    so you will need to add some CSS, something like this:

    /*This will hide your current logo*/
    body.wp-night-mode-on .your-logo-img-class {
      opacity: 0;
    }
    
    /*This will show your inverted/white logo, you only need to change "path-to-your-logo" with real image path. Just upload white logo to Media Library and use that image path*/
    body.wp-night-mode-on .your-logo-link-class {
      background-image: url('path-to-your-logo');
      background-repeat: no-repeat;
      background-position: top;
      background-size: 100%;
    }

    If you need a little more detailed help, please send me a link from your website.

    Best regards

    Hi, Markoarula,

    I’ve installed the WP Night Mode Plugin and got the “switch” to display on my menu, but can’t get the logo to change to my “White” logo when the background is changed to “night/black”… I tried the CSS editing you’ve recommended above, but still no success.
    Is there a way that you can perhaps assist me?

    Thank you kindly.

    Plugin Author markoarula

    (@markoarula)

    Hi,

    I can assist you, but I will need at least a link to your website.

    Best regards

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Logo Issue’ is closed to new replies.