How to change logo depending on night/ light theme

1 reply · opened May 1, 2023

WworkstickersMay 1, 2023

Hello & hope this finds you well

I am using Version 6.6.5 on a project and https://themes.semicolonweb.com/html/canvas/v6/demo-photographer-dark.html as main template because it has the dark/ light mode

Questions:

  1. how do I change the logo img whereas the logo is a .png , depending on the dark/light setting? ( I have dedicated logo images for either of options )
  2. continuing on the above inquiry, within the body, how do I set to include images depending on the dark/light setting?

thank you very much

SSemicolon WebSTAFFMay 2, 2023

Hello,

  1. This particular demo does not have the Light/Dark Logo option as other Demos: https://themes.semicolonweb.com/html/canvas/v6/header-transparent.html . In the Photographer Demos, the Light/Dark Demo must be set manually depending on the Scheme the user is on currently.

  2. This unfortunately is currently not supported. You will notice that the Photographer Demo has two different Pages for different schemes. Light: https://themes.semicolonweb.com/html/canvas/v6/demo-photographer.html and Dark: https://themes.semicolonweb.com/html/canvas/v6/demo-photographer-dark.html. So you can simply use the Images and change them accordingly by changing their names (For Example, Light Image: image-light.jpg and Dark: image-dark.jpg) based on the Scheme you are using.

For advanced Color Mode switching, we recommend using Canvas 7: https://canvastemplate.com/color-mode-switcher.html .

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard