search
HomeBackend DevelopmentPHP Tutorialweb开发中如何实现皮肤的切换

在网站开发中,经常有皮肤或者主题切换的功能,比如discuz、wordpress等,只要选择了哪个主题,然后就可以切换到对应的样式中,请问背后的实现原理和逻辑是什么,具体用代码时怎么实现的?(在google和百度上搜了一圈没找打好的相关技术文章,来这里找小伙伴们帮忙解答下疑惑。谢了)

回复内容:

在网站开发中,经常有皮肤或者主题切换的功能,比如discuz、wordpress等,只要选择了哪个主题,然后就可以切换到对应的样式中,请问背后的实现原理和逻辑是什么,具体用代码时怎么实现的?(在google和百度上搜了一圈没找打好的相关技术文章,来这里找小伙伴们帮忙解答下疑惑。谢了)

有两种

  • 一种就是上边说的,切换css,html结构不变。

  • 第二种就是切换目录,一般都是定义一个目录为主题的根目录,子目录就是各种不同的主题,然后通过定义常量或者配置数组或者存到数据库,然后切换不同的目录名称就可以达到切换主题的目的

具体实现代码

<code><?php define('THEME', 'default'); //定义当前使用主题

function render($file, $vars = []) {
    extract($vars);
    ob_start();
    include ROOT . '/themes/' . THEME . '/' . $file;
    return ob_get_clean();
    
}</code></code>

换肤的实现一般是将颜色和背景相关的样式抽取出来,放到单独的样式表。换肤的时候,切换样式表即可。样式表的切换其实是非常简单的,麻烦的是如何去规划你的样式表,当你把皮肤样式抽取后,整个css样式依然还非常清晰,逻辑合理,这就需要比较深厚的css重构功底。

最简单的皮肤只要换个css就够了,HTML页面框架没变,展现修改

复杂点的是对于HTML模板和CSS的共同替换

这两个方式都很主流

实现都没有什么难度,无非就是你保存一个系统对应的CSS或者HTML模板的路径,请求时输出出来即可

皮肤的切换,前提是你先有几套可选择的皮肤。

皮肤的话,一般指的都是同一个(或多个)HTML 页面,只是 CSS 样式不一样。所以所谓多套皮肤,一般就是多套 CSS 样式。比如:skin1.css/skin2.css/skin3.css 分别表示三套不一样的皮肤。

当用户进行切换时,因为要保持用户此次所选择的皮肤,那么必须要有一个地方去记录下所选择的皮肤(因为下次访问还要记得)。对于是使用 cookie 进行记录,还是数据库或者其他存储介质,那自己选择就可以了。

一般像这种用户个性化定制类的信息(当然,前提这种信息是不重要的),如果你认为皮肤的选择并不很重要,那么可以选择记录到 cookie 中。就算用户清理了 cookie,下次重新选择就好了。当然如果你觉得要永久性记录下本次的皮肤选择,那选择像数据库这种存起来就可以了。

其实提前准备好几套css文件,用JavaScript切换link标签的herf属性,引入不同的css文件就行,用cookie或者数据库保持该用户的皮肤所使用的css的ID

切换 css 肯定是必须的,这就是根本嘛。。但题主既然提了解决方案,我觉得还是有必要说细点

1.像 discuz、wordpress ,甚至更古老一点的 ecshop,皮肤就是很多个文件夹,一个文件夹一个皮肤,要加入新皮肤,直接在 themes(一般都叫这个名字) 这个文件夹下面再加一个就是。到设置界面,配置皮肤的时候,就会加载一下 themes 下面的所有文件夹,然后选一个,存入数据库,非常传统的搞法。

2.现在有些 webapp 的话,皮肤是 css 样式的一种,选了后,把样式信息写入 cookie 或者 localstorge,不过现在这么干的还是很少。。也不推荐。。

Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
php怎么把负数转为正整数php怎么把负数转为正整数Apr 19, 2022 pm 08:59 PM

php把负数转为正整数的方法:1、使用abs()函数将负数转为正数,使用intval()函数对正数取整,转为正整数,语法“intval(abs($number))”;2、利用“~”位运算符将负数取反加一,语法“~$number + 1”。

php怎么实现几秒后执行一个函数php怎么实现几秒后执行一个函数Apr 24, 2022 pm 01:12 PM

实现方法:1、使用“sleep(延迟秒数)”语句,可延迟执行函数若干秒;2、使用“time_nanosleep(延迟秒数,延迟纳秒数)”语句,可延迟执行函数若干秒和纳秒;3、使用“time_sleep_until(time()+7)”语句。

php怎么除以100保留两位小数php怎么除以100保留两位小数Apr 22, 2022 pm 06:23 PM

php除以100保留两位小数的方法:1、利用“/”运算符进行除法运算,语法“数值 / 100”;2、使用“number_format(除法结果, 2)”或“sprintf("%.2f",除法结果)”语句进行四舍五入的处理值,并保留两位小数。

php字符串有没有下标php字符串有没有下标Apr 24, 2022 am 11:49 AM

php字符串有下标。在PHP中,下标不仅可以应用于数组和对象,还可应用于字符串,利用字符串的下标和中括号“[]”可以访问指定索引位置的字符,并对该字符进行读写,语法“字符串名[下标值]”;字符串的下标值(索引值)只能是整数类型,起始值为0。

php怎么根据年月日判断是一年的第几天php怎么根据年月日判断是一年的第几天Apr 22, 2022 pm 05:02 PM

判断方法:1、使用“strtotime("年-月-日")”语句将给定的年月日转换为时间戳格式;2、用“date("z",时间戳)+1”语句计算指定时间戳是一年的第几天。date()返回的天数是从0开始计算的,因此真实天数需要在此基础上加1。

php怎么读取字符串后几个字符php怎么读取字符串后几个字符Apr 22, 2022 pm 08:31 PM

在php中,可以使用substr()函数来读取字符串后几个字符,只需要将该函数的第二个参数设置为负值,第三个参数省略即可;语法为“substr(字符串,-n)”,表示读取从字符串结尾处向前数第n个字符开始,直到字符串结尾的全部字符。

php怎么替换nbsp空格符php怎么替换nbsp空格符Apr 24, 2022 pm 02:55 PM

方法:1、用“str_replace("&nbsp;","其他字符",$str)”语句,可将nbsp符替换为其他字符;2、用“preg_replace("/(\s|\&nbsp\;||\xc2\xa0)/","其他字符",$str)”语句。

php怎么判断有没有小数点php怎么判断有没有小数点Apr 20, 2022 pm 08:12 PM

php判断有没有小数点的方法:1、使用“strpos(数字字符串,'.')”语法,如果返回小数点在字符串中第一次出现的位置,则有小数点;2、使用“strrpos(数字字符串,'.')”语句,如果返回小数点在字符串中最后一次出现的位置,则有。

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Tools

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.

PhpStorm Mac version

PhpStorm Mac version

The latest (2018.2.1) professional PHP integrated development tool

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

This project is in the process of being migrated to osdn.net/projects/mingw, you can continue to follow us there. MinGW: A native Windows port of the GNU Compiler Collection (GCC), freely distributable import libraries and header files for building native Windows applications; includes extensions to the MSVC runtime to support C99 functionality. All MinGW software can run on 64-bit Windows platforms.

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools