Support » Plugin: WP Night Mode » dark mode and cached pages problem
dark mode and cached pages problem
-
Hello
If the page is cached the page will always flash the previous colors every time I load a new page.
i use your perfect plugin in :
https://www.tasvirezendegi.com/you can check some page of it
these two site also use dark mode and do not have any problem.
https://digiato.com/
http://www.tgju.org/sorry for poor english
-
Hello,
that is the main issue and i will try to solve it as soon as possible.
I’ll let you know as soon as I solve this problem.
Best regards
this site also use dark mode(custom code) and does not have any problem with cache.(Of course I might be wrong)
This may give you a clue to the problem
https://digiato.com/
sorry,I am little slow in english
best regardsSame problem here :(. Have you found a solution by any chance? Otherwise it’s a great plugin!
Hi. How can i use this plugin without any caching problem for this websites:
https://rokida.com/
&
https://Ronata.com/I’m tries to using your awesome plugin but in caching mode i’ve seen some problems.
-
This reply was modified 1 year, 1 month ago by
Increase SEO.
I think I’ve found the culprit.
The JavaScript file public/js/wp-night-mode-public.js has a function, wp_night_mode_load_cookie() that loads the cookie and if WP Night Mode is enabled, it adds the class ‘wp-night-mode-on’ to the body.
It seems this script is loading deferred and the ‘wp-night-mode-on’ class is sometimes added to the body after the whole page has loaded. This causes the dark mode to activate too late.
I think I solved it (well, it’s a hacky solution) by adding the following JavaScript after the <body> tag in the header.php (find it in your theme editor):
<script>
var nmCookie=document.cookie.match(“(^|;) ?wpNightMode=([^;]*)(;|$)”);nmEnabled=nmCookie?nmCookie[2]:null,”true”===nmEnabled?document.body.classList.add(“wp-night-mode-on”):document.body.classList.remove(“wp-night-mode-on”);
</script>This is minified code. What it does: the cookie is loaded, and if WP Night Mode is ‘true’, then directly add ‘wp-night-mode-on’ to the classes of the body. Not sure if this is right, but it solved my problem.
i want to use this for this domain قیمت دلار
Hi,
Thank you @ivarvanwooning for your fix proposal, but it does not work here: https://www.jtmartelli.com/. In my case, the problem appeared when I installed another plugin (LoftLoader) whose cookie is cached (by WP Fastest Cache) before WP Night Mode. Because it is cached first, it defers the loading of the JavaScript of “WP Night Mode”, hence creating the flashing issue. Excluding one of the two cookies from caching solves the flashing issue, but slows down any return to the homepage by at least 2-3s.
Does anyone know how to force the WP Night Mode cookie to be cached first?
Best regards from Delhi,
JT
Hi guys
Forgive me for poor English first. Unfortunately, although I searched a lot, I was not able to open a new topic, so I am asking my questions here, please help.
I want to transfer a site written with Asp.net to WordPress. Please tell me what to do.
This is the site
https://www.khasbox.com/If the page is cached the page will always flash the previous colors every time I load a new page.
https://simakade.ir/Buddhism and other eastern traditions teach that life itself is an illusion. That what we experience with our senses – or even think with our minds – is not reality in its entirety. Spiritual awareness enables us to recognize a grander Mysteryچت
@markoarula did you found a fix for flashing content?
@jtmartelli The solution I proposed does not rely on the WP Night Mode JavaScript. It’s vanilla JavaScript, placed directly under the <body> tag, so it’s executed immediately I think?
<script> var nmCookie=document.cookie.match(“(^|;) ?wpNightMode=([^;]*)(;|$)”);nmEnabled=nmCookie?nmCookie[2]:null,”true”===nmEnabled?document.body.classList.add(“wp-night-mode-on”):document.body.classList.remove(“wp-night-mode-on”); </script>
So it completely ignores WP Night Mode and adds the wp-night-mode-on class to the body if a cookie is found. You can edit your header.php and paste this below <body>. It fixed the problem for me, but not sure if it works for everyone.
Try adding this below the <body> tag in your header.php file (most of the time it can be found in your template folder):
<script> var nmCookie=document.cookie.match(“(^|;) ?wpNightMode=([^;]*)(;|$)”);nmEnabled=nmCookie?nmCookie[2]:null,”true”===nmEnabled?document.body.classList.add(“wp-night-mode-on”):document.body.classList.remove(“wp-night-mode-on”); </script>
Your WP Night Mode plugin does the exact same, but by adding it in vanilla JS below the body tag, it’s executed immediately on loading the page and you shouldn’t have any FUOC because the plugin doesn’t need to be loaded first. It will only flash the first time the page is loaded, because a cookie needs to be created the first time.
Thank you @ivarvanwooning but we are getting
Uncaught SyntaxError: Invalid or unexpected token
We are using Oxygen, which is not really a theme, but a builder. There is no theme with Oxygen
Maybe there is another way of trying this?
-
This reply was modified 1 year, 1 month ago by
- You must be logged in to reply to this topic.