显示标签为“主题”的博文。显示所有博文
显示标签为“主题”的博文。显示所有博文

2022年11月23日星期三

开始使用WordPress子主题

新的主题安装好以后或多或少会对它进行修改,但是当主题更新以后修改的内容就会被覆盖丢失了,WordPress早就考虑到这个问题,那就是子主题。

除非你安装的主题永远不会更新,不然尽快使用子主题吧,建议安装完新主题后立即创建子主题。

创建子主题的方法:

一、通过WordPress万能的插件,比如Child Theme Configurator,创建完成子主题就可以把插件删除了。

二、手工创建,下面说下手工创建的步骤

假设原主题的名字是ABC

1.在themes目录新建一个文件夹ABC Child(和ABC在同一级目录)

2.在ABC Child下新建style.css文件

3.在style.css文件中添加以下内容:

/*
Theme Name: ABC Child
Template: ABC
*/

4.这样子主题也就创建完成了,启用子主题

5.以后如果改动原主题中任何的内容,只要在ABC Child新建同名文件就行了。简单的方法是复制一份文件到ABC Child中,然后再修改这份文件。

6.模板函数 (functions.php)是个例外,子主题的functions.php和原主题是同时生效的,也就是说原主题的functions.php里的内容不要出现在子主题中,子主题functions.php一开始是空白的,只新增修改的内容。

2022年9月24日星期六

博客换了新的主题样式

博客从一开始使用iNove主题,一用就是12年,今天花了几个小时换了一款新的主题SacchaOne,这款主题文章块状显示,支持页面自适应和嵌套评论。

为什么要换主题,就是LiteSpeed Catch这个插件闹的。

自从安装了LiteSpeed Catch插件,博客的加载速度明显快了好多。但是有一个问题,博客首页总是随机显示桌面版和手机版的主题,怎么搞都搞不定。

为什么会出现这个问题?因为博客用了两套主题,分别是桌面版和移动版。这个功能是WPtouch插件自动实现的。WPtouch插件会自动判断访问者的客户端是PC端还是移动端,如果是PC端就加载PC端的主题,如果是移动端就加载移动端的主题。

为什么要用这个插件啊?因为iNove主题不是自动响应/自适应的主题,只能显示PC端主题,因为是固定宽度,在移动端显示要缩放很不方便。所以为了方便在移动端浏览网站,只好安装了WPtouch插件。

那么为什么不换一个支持自响应的主题?因为iNove主题用了这么久,前前后后修改了不少的东西,如果换一个新的主题又要花时间来进行修改和适配。因为懒,还是因为现在对主题样式无所谓,所以一直都没有更换主题。

这次为了LiteSpeed Catch插件,我动起了更换主题的念头。 去WordPress官方themes列表里浏览自己觉得好看的主题,我的需求不高,想要简约的,最好是无图片的主题。没想到却找到一款满意的主题出来。找到以后更换主题,也就用了几分钟,但是之后花了一下午的时间来修改。修改的主要地方有如下:

一、字体和样式

SacchaOne有的字体小,有的字体大。利用浏览器的「调试工具F12」很容易调试,可以实时查看修改的效果。现在WordPress支持自定义CSS功能,也能实时查看效果,CSS改起来很方便。

又调整了几处div块的位置,修改了顶部菜单显示分类而不是页面。

这一处的修改基本上没费什么时间。

二、侧边栏隐藏

SacchaOne主题支持自动响应浏览器屏幕的大小,遇到小屏幕的客户端,侧边栏会自动掉到下面去。但是我想要的效果是侧边栏隐藏,而不是掉下去。修改起来也很简单,改一下CSS,如下:

@media (max-width: 760px){
.hideonmobile{
display: none;
}
}

这段代码的意思就是当屏幕小于760像素时,侧边栏自动隐藏。这里的760可以根据需要修改。

三、侧边栏增加内容

侧边栏使用WordPress自带的「最新评论」,修改了显示的样式,但是显示的效果还是不满意,每条评论显示两行,一行是文章的标题,一行是评论内容。我只想要一条带内容的,暂时还没有时间去摸索。

增加了AdSense广告,修改了样式。

四、首页摘要显示

首页摘要显示搞了半天也没搞好,还是用之前的WP-UTF8-Excerpt插件来搞定。

五、浏览量显示

在首页和文章页加了WP-PostViews插件的显示函数就可以了。

六、相关文章显示

Yet Another Related Posts Plugin (相关文章)插件调CSS样式调了半天。

七、其他自定义页面

修改了「常用链接」的页面,这个CSS调了好久才调好。

这次更换主题比我想的简单一些,因为不懂CSS,花了好长时间来摸索。启用了LiteSpeed Catch插件后停用了WP-PageNavi和WPtouch两个插件,目前的使用的插件有:Akismet、Database Backup for WordPress、WP-PostViews、WP-Syntax、WP-UTF8-Excerpt、Yet Another Related Posts Plugin、LiteSpeed Catch.

2023/4/5更新

现在博客启动了Google Adsense自动广告,不用自己考虑广告的位置和样式了。

首页文章摘要显示一百字左右,也没必要使用WP-UTF8-Excerpt插件了。

因为WordPress后台支持代码格式,于是停用了WP-Syntax插件,不过之前的有代码的文章需要我一篇篇修改,工作量有点大。

增加了文章存档页,用列表的方式显示全部文章。

用代码实现侧边栏「最新评论」,觉得WordPress自带的还是太繁琐,我不想显示作者和文章标题,只想用列表显示评论的内容即可。

博客换了新的主题样式

博客从一开始使用iNove主题,一用就是12年,今天花了几个小时换了一款新的主题SacchaOne,这款主题文章块状显示,支持页面自适应和嵌套评论。

为什么要换主题,就是LiteSpeed Catch这个插件闹的。

自从安装了LiteSpeed Catch插件,博客的加载速度明显快了好多。但是有一个问题,博客首页总是随机显示桌面版和手机版的主题,怎么搞都搞不定。

为什么会出现这个问题?因为博客用了两套主题,分别是桌面版和移动版。这个功能是WPtouch插件自动实现的。WPtouch插件会自动判断访问者的客户端是PC端还是移动端,如果是PC端就加载PC端的主题,如果是移动端就加载移动端的主题。

为什么要用这个插件啊?因为iNove主题不是自动响应/自适应的主题,只能显示PC端主题,因为是固定宽度,在移动端显示要缩放很不方便。所以为了方便在移动端浏览网站,只好安装了WPtouch插件。

那么为什么不换一个支持自响应的主题?因为iNove主题用了这么久,前前后后修改了不少的东西,如果换一个新的主题又要花时间来进行修改和适配。因为懒,还是因为现在对主题样式无所谓,所以一直都没有更换主题。

这次为了LiteSpeed Catch插件,我动起了更换主题的念头。 去WordPress官方themes列表里浏览自己觉得好看的主题,我的需求不高,想要简约的,最好是无图片的主题。没想到却找到一款满意的主题出来。找到以后更换主题,也就用了几分钟,但是之后花了一下午的时间来修改。修改的主要地方有如下:

一、字体和样式

SacchaOne有的字体小,有的字体大。利用浏览器的「调试工具F12」很容易调试,可以实时查看修改的效果。现在WordPress支持自定义CSS功能,也能实时查看效果,CSS改起来很方便。

又调整了几处div块的位置,修改了顶部菜单显示分类而不是页面。

这一处的修改基本上没费什么时间。

二、侧边栏隐藏

SacchaOne主题支持自动响应浏览器屏幕的大小,遇到小屏幕的客户端,侧边栏会自动掉到下面去。但是我想要的效果是侧边栏隐藏,而不是掉下去。修改起来也很简单,改一下CSS,如下:

@media (max-width: 760px){
.hideonmobile{
display: none;
}
}

这段代码的意思就是当屏幕小于760像素时,侧边栏自动隐藏。这里的760可以根据需要修改。

三、侧边栏增加内容

增加了的WordPress自带的「最新评论」,修改了显示的样式,但是显示的效果还是不满意,每条评论显示两行,一行是文章的标题,一行是评论内容。我只想要一条带内容的,暂时还没有时间去摸索。

增加了AdSense广告,修改了样式。

四、首页摘要显示

首页摘要显示搞了半天也没搞好,还是用之前的WP-UTF8-Excerpt插件来搞定。

五、浏览量显示

在首页和文章页加了WP-PostViews插件的显示函数就可以了。

六、相关文章显示

Yet Another Related Posts Plugin (相关文章)插件调CSS样式调了半天。

七、其他自定义页面

修改了「常用链接」的页面,这个CSS调了好久才调好。

这次更换主题比我想的简单一些,因为不懂CSS,花了好长时间来摸索。启用了LiteSpeed Catch插件后停用了WP-PageNavi和WPtouch两个插件,目前的使用的插件有:Akismet、Database Backup for WordPress、WP-PostViews、WP-Syntax、WP-UTF8-Excerpt、Yet Another Related Posts Plugin、LiteSpeed Catch.

2012年8月10日星期五

结婚主题的制作小记

年初就和Jasmine说我想做个结婚的主题页面,以展示结婚的照片和文章。Jasmine听到后拍手称赞。她负责在网上寻找婚礼专题的网页作为参照,最后锁定在2011年威廉王子的婚礼主题,然后用Photoshop做了一张设计图。

结婚网站专题策划

下面的网页工作就交给我去实现了。一开始我想着依托在现有博客的基础上制作一个页面而已。以为可以借助WordPress强大的主题和插件得以实现。尝试的结果是很糟,因为牵扯着CSS、JS和jQuery,如果这些功能都加到页面(Model)上会影响其他页面的显示。

想来想去,百思不得其解,简单的一个主题汇总页面却让我如此头疼。最终一不做二不休,向IT抄袭鼻祖腾讯学习,抄袭去。于是就找来2011年各大网站做的“威廉王子婚礼”专题页面,把现成的网页“另存为”,需要修改的地方编辑替换一下,最后在各个浏览器中调试一下效果,完工。

这就是抄袭的力量,想得少来的快啊。

最终这个结婚专题的页面并没有出现,一是怕人家告我侵权,二是我们的婚礼不比人家皇室婚礼,没有丰富厚实的图片和文字作支撑,整个一个框架根本填不满支不起来。

2012年8月9日星期四

结婚主题的制作小记

年初就和Jasmine说我想做个结婚的主题页面,以展示结婚的照片和文章。Jasmine听到后拍手称赞。她负责在网上寻找婚礼专题的网页作为参照,最后锁定在2011年威廉王子的婚礼主题,然后用Photoshop做了一张设计图。

结婚网站专题策划

下面的网页工作就交给我去实现了。一开始我想着依托在现有博客的基础上制作一个页面而已。以为可以借助WordPress强大的主题和插件得以实现。尝试的结果是很糟,因为牵扯着CSS、JS和jQuery,如果这些功能都加到页面(Model)上会影响其他页面的显示。

想来想去,百思不得其解,简单的一个主题汇总页面却让我如此头疼。最终一不做二不休,向IT抄袭鼻祖腾讯学习,抄袭去。于是就找来2011年各大网站做的“威廉王子婚礼”专题页面,把现成的网页“另存为”,需要修改的地方编辑替换一下,最后在各个浏览器中调试一下效果,完工。

这就是抄袭的力量,想得少来的快啊。

最终这个结婚专题的页面并没有出现,一是怕人家告我侵权,二是我们的婚礼不比人家皇室婚礼,没有丰富厚实的图片和文字作支撑,整个一个框架根本填不满支不起来。

2011年11月24日星期四

换博客主题小记

这个博客的主题自从刚开始费了九牛二虎之力确定以后就再也没有换过,可能是审美疲劳吧,从上回换了空间后就打算换个主题,于是指使Jasmine去找个主题来。

Jasmine满世界找(她所知道的主题所在地也都是我提供的),在她看得眼花缭乱、老眼昏花后终于敲定了十几个备选主题,接着就让我装上看看。

等一个个尝试以后,她都不太满意,然后委屈地对我说:“你能不能恢复我们以前的主题啊?”

并没有费功夫就恢复了修改过的Inove主题,Jasmine很是高兴,在她的提议下,我更换了头部的header.jpg文件。