Актуальный релиз „DataLife Engine 20.0 Final“ buildid 109

подробнее о релизе

Главная страница / DataLife Engine / Скрипты и другая информация / Фикс моргания темных шаблонов в DataLife Engine 21.0

Фикс моргания темных шаблонов в DataLife Engine 21.0

11 сентября 2026 | 09:45 | Пятница
26
0
[ Рейтинг: 5 / Голосов: 3 ]
Фикс моргания темных шаблонов в DataLife Engine 21.0

Многие уже начали тестировать новую версию DLE 21.0 и как всегда по мере тестирования обнаруживаются баги скрипта. Но в этом релизе на смену старым дефолтным шаблонам пришли новые с возможностью переключаться на темную версию сайта, по умолчанию — светлая тема прописана в шаблонах. Но новые buildid релизов, как правило, нацелены только на исправление багов самой CMS, но никак не шаблонов, поэтому предлагаю фикс этого бага в шаблонах.

Так вот, при переключении шаблона на темную версию при обновлении страниц сайта сначала появляется светлая тема, и только потом применяется темная версия шаблона, своего рода — эффект моргания светлой-темной версии сайта. Помимо этого в консоли браузера ошибка в коде, который прописан в шаблоне.

Решение: удалить из шаблона код перед закрывающим тегом </body>:

<script>(function(){var d=document.documentElement,t=null,a=null;try{t=window.localStorage.getItem("air-theme");a=window.localStorage.getItem("air-accent")}catch(e){}if(t!=="dark"&&t!=="light"){t=(window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches)?"dark":"light"}if(a!=="blue"&&a!=="sage"&&a!=="mauve"){a="blue"}d.setAttribute("data-theme",t);d.setAttribute("data-accent",a);document.body.classList.toggle("dle_theme_dark",t==="dark")})();</script>

В секцию head перед подключением CSS файлов:

{include file="{THEME}/css/engine.css"}

 прописать под:

<script>
(function(){
    var d=document.documentElement, t=null, a=null;
    try{
        t=window.localStorage.getItem("air-theme");
        a=window.localStorage.getItem("air-accent");
    }catch(e){}
    if(t!=="dark"&&t!=="light"){
        t=(window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches)?"dark":"light";
    }
    if(a!=="blue"&&a!=="sage"&&a!=="mauve"){
        a="blue";
    }
    d.setAttribute("data-theme",t);
    d.setAttribute("data-accent",a);
    d.classList.toggle("dle_theme_dark",t==="dark");
    var metaTheme = document.querySelector('meta[name="theme-color"]');
    if(metaTheme) metaTheme.content = (t==="dark") ? "#1a1a1a" : "#f2f5f8";
})();
</script>

Таким образом мерцание светлой-темной версии не будет при обновлении страниц сайта на темной версии шаблона, и не будет ошибок JS кода в консоли браузера.

Ошибка в консоли, которая была с JS кодом, который прописан в шаблоне по умолчанию:

Uncaught TypeError: Cannot read properties of null (reading 'classList')

После замены JS кода больше не будет никаких ошибок в консоли.

Комментарии:
ℹ️
 

Модули для создания киносайта и не только на базе DataLife Engine, и многое другое...
Просто блог Евгения Попова, он же - byroot © 2015-2026 | Карта сайта