[Support request] Favicon dark theme and light theme

Home Forums Support [Support request] Favicon dark theme and light theme

Home Forums Support Favicon dark theme and light theme

  • This topic has 3 replies, 2 voices, and was last updated 1 month ago by David.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #2279172
    Yannick

    Hello,

    I’m developping a website that needs a favicon for dark theme and a favicon for light theme. Is there an option in generatpress or is there standard code that i can use?

    I know it is possible but i hope there’s an easier way than this site.

    explain about svg favicon
    (I have the logo in png or svg)

    Please let me know if there’s a function in the customizer or if there’s code that i can add to my theme to fix this?

    #2279213
    David
    Staff
    Customer Support

    Hi there,

    no, neither the theme or WP has any function for this.
    And Favicons can be a pain at the best of times.
    For this requirement i know of 3 approaches:

    1. The method you linked to, which if possible is probably one of the most reliable as the styles are embedded in the SVG.

    2. Methods using Javascript to swap the images….

    3. Adding 2 x separate favicon links to your site and using media support to swap them.

    Options 2 and 3 are listed here:

    https://joyofcode.xyz/dark-mode-favicon

    For #3 you could try:

    1. DO NOT add a favicon in the customizer.

    2. Create a new Hook Element, and set the hook to wp_head and set the Display Rules to Entire Site

    3. Add the 2 links like the HTML in the above post, and swap out your URLs for your 2 images eg.

    <link
      href="the_full_url_to_your_image/favicon-light.png"
      rel="icon"
      media="(prefers-color-scheme: light)"
    />
    <link
      href="the_full_url_to_your_image/favicon-dark.png"
      rel="icon"
      media="(prefers-color-scheme: dark)"
    />
    #2279229
    Yannick

    Thank you very much!

    #2279253
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.