WordPress如何自定义修改主题的颜色 字间距 字体大小 字体颜色等简单教程

我们如果使用WordPress建站,那么就肯定需要选择合适的主题。而市面上主题虽多,但是想找到一款100%满意的,难度却很大。再好的主题,可能也会有一些小细节,与我们的审美观有差别。当然,全方位付费定制的主题例外。

  • 修改主题简单吗

一款主题,除了自带的调整选项外,其它的外观设置,我们是不能直接进行的,需要修改主题文件里的一些参数。一提到参数,部分朋友可能就退缩了:难度太大了吧!

其实未必,今天我们就介绍一下,如何简单直观地修改主题中的字体大小、字体颜色、字间距、以及主题中的一些颜色等常用参数。当然,还有其它很多参数也是可以修改的,本文算是抛砖引玉吧。

  • 准备工作

为了方便操作,最好选用火狐或Chrome浏览器进行相关操作。

  • 修改方法

1.用火狐浏览器打开网站想要修改的界面,在要修改的地方点击右键,选择查看元素:

2.接下来在浏览器下方位置,会出现查看器窗口,窗口里是相关代码。默认选中的那一行,就是我们想要修改的地方。右边的规则窗口就是对应的相关参数,其中红色字体的为参数名称,后面的蓝色字体为参数,为可修改项。

3.点击规则窗口中的参数,就可以进行相关修改了,网站会实时显示修改后的效果。需要说明的是,这里的修改只是方便我们预览,只在我们自己的浏览器生效,网站本身的参数并没有实际修改。下图红框中为参数所在的文件,及对应代码的行数,方便我们后期准确定位。

几个常用参数:

color:颜色,使用16进制颜色,比如#000000为黑色。

font-size:字体大小。

letter-spacing:字间距,以pt为单位。

Line-height:行高。

background:背景颜色。

padding:内边距。

margin:外边距。

4.需要注意的是,规则窗口中,可能有部分参数名下有多个规则,其中划删除线的是没有生效的规则,我们可以忽略它。找到不带删除线的相关规则,即生效的规则进行修改,如下图:

5.在浏览器中调试完毕,确认想要的效果后,就可以对相关文件进行真正的修改了。配置参数一般都在主题中的Style.css文件中, 可以根据个人情况选择以下两种方法进行修改:(善用Ctrl+F搜索相关参数)

  1. 打开WordPress后台管理界面,点击左侧菜单中的外观-编辑,打开之后默认就是Style.css文件,如果不是的话手动选择。然后就可以直接进行编辑了。
  2. 也可以用Winscp连接VPS服务器,直接打开style.css文件进行修改

6.编辑好之后记得保存,保存完毕后,回到网站界面,Ctrl+F5强制刷新,查看修改后的效果。

 

原创内容,未经允许,请勿转载!https://www.zhihu.in