Переключатель "сменить цвет шаблона" на dle пользователем

Как для пользователя сделать красивую кнопку смены шаблона на лету на сайте? Как сменить "дневной" шаблон на "ночной", светлый на темный? Предлагаю вам простой вариант на ajax с помощью стандартной функции change color на DLE. Как многие знают, сменить шаблон можно по ссылке

Код:

ВАШСАЙТ/index.php?action_skin_change=yes&skin_name=ИМЯШАБЛОНА

Эту функцию мы и используем, причем делать мы будем лишь в шаблоне, движок не затронем, а пользователь останется на той же странице. Результат будет такой, справа кнопка:


Код в ваш tpl

Код:

<ul class="change-color" onclick="skinChange('dark-theme');" title="Сменить цвет дизайна">
<li class="is-active"><span class="fal fa-sun"></span></li>
<li><span class="fal fa-moon"></span></li>
</ul>

Где dark-theme название шаблона на который меняем, а класс is-active выделяет активный пункт. То есть, если код выше для светлого шаблона, то для темного dark-theme соответственно будет

Код:

<ul class="change-color" onclick="skinChange('light-theme');" title="Сменить цвет дизайна">
<li><span class="fal fa-sun"></span></li>
<li class="is-active"><span class="fal fa-moon"></span></li>
</ul>

В ваш css файл

Код:

.change-color, .change-color * {box-sizing: border-box;}
.change-color {display: inline-flex; justify-content: space-between; align-items: center; cursor: pointer;
   background-color: #444; height: 40px; border-radius: 20px; padding: 5px 0; margin-left: 20px;}
.change-color li {cursor: pointer; width: 30px; height: 30px; line-height: 30px;
   border-radius: 50%; text-align: center; color: #ccc; margin: 0 5px;}
.change-color li.is-active {background-color:#fff; color: #444;}

В ваш js файл

Код:

function skinChange(a) {
   $.ajax({
   type: "POST",
     url: "/index.php",
   data: {'action_skin_change': 'yes', 'skin_name': a},
   beforeSend: function() { ShowLoading(''); },
   success: function() { window.location = window.location.href.split("#")[0]; }
  });
};

Вот и все.

В настройках - посетители должно быть включено "Разрешить посетителям смену скина на сайте"
Код css подгоняйте для себя, иконки fal (популярный набор Font Awesome) меняйте на свои иконки, если требуется.

Источник Переключатель "сменить цвет шаблона" на DLE пользователем

 

Heiz у меня нет внятного ответа, не все так просто. В перспективе одним файлом с общими настройками где переменные. Но у меня сейчас такого нет и в новом шаблоне.