• I’m helping an artist friend with their website and we’re having some issues with the header navigation color sometimes being set wrong (eg, being set to black when it should be white, or vice-versa).

    It seems that there is a Javascript that tries to detect whether there is a light or dark image (eg, Featured Image) and then it adjusts the header navigation coloring accordingly. On some pages this works fine. But we have several pages where it chooses wrong.

    This seems very difficult to troubleshoot, though I will give examples in case you can spot an easy solution. But I’m also wondering if there is any built-in way to force a particular color for the header/nav on a given page?

    On the home page sometimes it chooses white text (which is the correct choice) and sometimes it chooses black (which is very difficult to see.

    On the portfolio page it chooses white when black would be better (you can’t hardly see the page title).

    On the “fragmented” page it chooses black text on a black background, making the header/nav completely invisible.

    Note that we’re using a child theme, though in theory that shouldn’t make any difference.

    Thanks in advance for your help! My friend loves your theme and it feels like a great fit overall for their needs. But we do need to figure out something for this color issue.

    ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter grapepress

    (@grapepress)

    Addendum: My friend is trying out different Featured Images for some of the above pages, so some of the above examples will no longer illustrate the problem.

    Thread Starter grapepress

    (@grapepress)

    My workaround for now has been to add the class block-lite-bg-dark the <header> and #nav-bar in the header.php file. This works for the time being, but basically forces the text to always be white for all pages.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘JS That Detects/Sets Light vs Dark Header Colors Makes Wrong Choice Sometimes’ is closed to new replies.