WP主题开发
WordPress教程

wordpress主题开发中如何自定义网站主题色调

WordPress日记 2017-10-20 WP主题开发 1,127 次

在本站开发的wordpress中文企业主题mxtheme02和Mxtheme03中都包含了网站主题色调自定义(直接使用色值随意设置),这个功能其实是很有用的,这样如果想改变网站主题的主色调就不用到代码里修改了,可以一键修改。也不用通过预设多种配色方案来切换了。今天超哥就跟大家分享一下我是通过什么方法和思路实现的。

一、创建色调设置字段

想要在后台随意更改主题色调,首先需要有一个颜色设置的字段,关于字段在这里就不多说了,自己可以去研究一下自定义字段,或者使用《wordpress主题开发中如何添加主题设置页面》这篇文章中提到的Options Framework框架来实现。

二、创建存放使用主题色CSS的文件

在主题制作过程中,将您希望自定义色调的标签的关于颜色的CSS样式都写到一个PHP文件中(注意不要写到您的CSS文件里),并且CSS样式要包含在<style></style>中间,格式见下面的截图。名字你可以随便叫,colorstyle.php,然后在您的头部文件header.php中引入这个colorstyle.php文件。引入方法:将代码<?php include 'colorstyle.php'; ?>放到</header>前。

当然,您也可以不单独创建colorstyle.php这个文件,直接把关于自定义颜色的CSS写到您的html里,但是建议单独创建,方便管理。

三、定义相关内容的颜色样式

当你定义颜色相关CSS的时候,因为我们是要后台自定义(也就是说是个不固定的色值),所以我们不能用color:#333;这样的形式来定义,应该用类似这样的

 其中background后面的php代码就是获取的自定义颜色的色值,具体用什么样的PHP代码,需要根据你创建自定义字段的方法。

支付宝扫码打赏 微信打赏

发布这篇文章把最后一根烟抽完了,赏根烟抽吧,哈哈

共有 0 条评论