dimayakovlev.ru


Переключение темы оформления веб-сайта на GetSimple CMS из фронтэнда

Если посетителям веб-сайта, работающего на основе системы управления контентом GetSimple CMS, требуется предоставить право самостоятельного выбора используемой тему оформления, то в этой заметке описан вариант решения задачи.

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

Для начала установите подходящие темы оформления веб-сайта в GetSimple CMS. Важно проверить, чтобы установленные темы оформления включали полный набор использованных шаблонов оформления страниц и поддерживали работу установленных в системе управления контентом плагинов. Повторяющиеся блоки контента и фрагменты программного кода, определённые в шаблонах оформления страниц, перенесите в компоненты - это предотвратит ошибки и сохранит полную функциональность веб-сайта при изменении темы оформления.

Не стоит применять рассматриваемое решение, если темы оформления отличаются только визуальным оформлением страниц, определяемым в подключаемом CSS файле. Для этого случая возможно ограничиться динамическим подключением CSS файла без изменения заданной в настройках темы оформления веб-сайта.

Для упрощения использования программного кода, вместо написания отдельного плагина, предлагаю использовать плагин SA Hook Components и размещать программный код в компонентах. В примере имя темы оформления предлагается хранить в cookie с именем gstheme. В своём коде вы можете изменить предложенное имя cookie на собственное.

Первый блок PHP-кода вызывается хуком index-header или index-post-dataindex и изменяет стандартную тему оформления веб-сайта. Здесь используется функция get_installed_themes(). Это не стандартная функция GetSimple CMS предложена мною ранее для получения массива установленных тем оформления веб-сайта. Подробное описание принципа работы функции и исходный код находятся в заметке Функция для получения установленных тем оформления в GetSimple CMS.

<?php
global $TEMPLATE, $TEMPLATES;
$TEMPLATES = get_installed_themes();
if (isset($_COOKIE['gstheme']) && in_array($_COOKIE['gstheme'], $TEMPLATES)) {
  $TEMPLATE = $_COOKIE['gstheme'];
}
?>

Второй блок PHP-кода формирует HTML-код выпадающего списка с перечнем установленных тем оформления веб-сайта. Рекомендую разместить вызов этого блока кода в стандартном компоненте sidebar.

<?php
global $TEMPLATE, $TEMPLATES;
echo '<h2>Select Theme</h2>';
echo '<select id="gsthemes">';
foreach ($TEMPLATES as $item) {
  $selected = ($TEMPLATE == $item) ? ' selected' : '';
  echo '<option value="' . $item . '"' . $selected . '>' . $item . '</option>';
}
echo '</select>';
?>

Третий блок кода - код JavaScript, выполняющийся при выборе элемента выпадающего списка с перечнем установленных тем оформления веб-сайта. При выборе элемента выпадающего списка устанавливается новое значение cookie gstheme с именем выбранной темы оформления. После этого выполняется обновление страницы в браузере. Этот код должен включаться в любое место страницы после HTML-кода выпадающего списка. Для этого так же подойдёт стандартный компонент sidebar.

<script>
document.getElementById('gsthemes').addEventListener('change', function() {
  document.cookie = 'gstheme=' + this.value + '; path=/; max-age=31536000';
  location.reload(true);
});
</script>

Рассмотренный вариант переключения между темами оформления веб-сайта будет полезен и разработчикам тем оформления: на этапе разработки даёт возможность лёгкого переключение с одной темы оформления на другую и упрощает последующую демонстрацию вариантов оформления веб-сайта для клиента.

При необходимости решение может быть адаптировано для использования без JavaScript или оформлено в виде отдельного плагина для GetSimple CMS.