从多个主题中选择用户（PHP）的动态主题

Question

我想将动态主题添加到我的PHP网站上，该主题将从用户的数据库中存储，下次用户使用该网站应显示该主题，该主题已由用户选择并保存到数据库中。我到处都在搜索，但由于我是PHP的新手，但没有获得逻辑和解决方案。请帮助我。

Answer 1

由于摘要的沙箱，下面的片段将在此处丢弃错误，但如果复制到您自己的文档中，则可以使用。

不同主题的选择机制可以是超链接，按钮，无线电按钮或下拉菜单，如下所示。当然，需要修改活动的侦听器，以适合任何选择的机制。

当用户制作选择时，使用setItem将关联的值保存到localstorage。加载页面后，检查了localStorage，并为样式表分配了正确的URL。

const _STORE = 'site_SHEET';
const oSelect = document.querySelector('select[name="theme"]');

// function that saves the selected value to localStorage
const eventhandler = function(e) {
  localStorage.setItem( _STORE, this.value );
  setsheet( this.value );
};

// function to return the full path to the actual stylesheet. Change path to suit...
const setpath=( theme )=>`css/${theme}.css`;

// method to assign the new style
const setsheet=( theme )=>document.getElementById('theme').setAttribute('href', setpath( theme ) );

// Set the dropdown to the stored theme when the page loads...
const setoption=(theme)=>oSelect.value=theme;

// assign the event listener to whatever selection mechanism you use to select themes
oSelect.addEventListener('change', eventhandler );

// if the localStorage contains a selected theme, load it...
if( localStorage.getItem( _STORE )!=null ){
  setsheet( localStorage.getItem( _STORE ) );
  setoption( localStorage.getItem( _STORE ) )
}

<link rel='stylesheet' type='text/css' id='theme' />

<select name='theme'>
  <option disabled hidden selected>Select Theme
  <option value='modern'>Modern
  <option value='standard'>Standard
  <option value='dark'>Dark
  <option value='visually-impaired'>Visually-Impaired
</select>

Update

我忽略了上述代码使用的四个样式表，这些样式表按选择菜单中的选项命名，例如：Modern.css ＆amp; dark.css等。使用简单setPath函数设置样式表目录的路径，该功能将路径硬编码为返回字符串（更改以适合自己的环境）