不凡博客(Bufanz.com)
ZBlog/WordPress网站搭建
ZBlog/WordPress速度优化
ZBlog/WordPress插件定制
ZBlog主题模板定制、仿站
32624142(注明来意)

《三栏自适应博客主题》主题配置使用教程

ZBlog | 2020年12月29日16:01:05 | 阅读:607 | 评论:3

爱奇艺独家折扣,黄金VIP仅需99元

《三栏自适应博客主题》主题配置使用教程

《三栏自适应博客主题》的主题和功能介绍:bufanz.com/post/109.html

《三栏自适应博客主题》的自定义CSS用法 美化页面样式:bufanz.com/post/112.html

为方便新用户和新手快速配置主题功能,写了一篇此主题的使用教程。

基本/SEO

《三栏自适应博客主题》主题配置使用教程

网站Logo、站标,左侧栏作者信息的显示开关

《三栏自适应博客主题》主题配置使用教程

文章信息的显示开关

《三栏自适应博客主题》主题配置使用教程

左侧栏作者信息和文章信息的显示总开关

《三栏自适应博客主题》主题配置使用教程

移动端和电脑端的搜索框显示开关

《三栏自适应博客主题》主题配置使用教程

幻灯片设置

《三栏自适应博客主题》主题配置使用教程

幻灯片图片的最佳尺寸:宽度720px,高度140px(高度值不能过多,否则过不了百度移动落地页检测)

幻灯片的数量是没有限制,但是建议最多设置5个,控制好图片文件大小,否则会影响网页加载速度。

幻灯片代码如下

<li><a href="第一图片的链接" target="_blank"><img src="第一图片的地址"></a></li>
<li><a href="第二图片的链接" target="_blank"><img src="第二图片的地址"></a></li>
<li><a href="第三图片的链接" target="_blank"><img src="第三图片的地址"></a></li>
<li><a href="第四图片的链接" target="_blank"><img src="第四图片的地址"></a></li>

如果图片的链接是站外链接,建议在target="_blank"的后面添加rel="nofollow",防止域名权重流失,代码如下:

<li><a href="第一图片的链接" target="_blank" rel="nofollow"><img src="第一图片的地址"></a></li>

在自定义CSS添加以下代码:

@media only screen and (max-width: 999px) {
.hdp li img {height: 100px;}
}

三种页面的广告位代码和显示开关

《三栏自适应博客主题》主题配置使用教程

广告位尺寸最佳比例为10:1,如果是自己设计广告图片,图片尺寸宽和高分别是700px和70px。

如果是用已设计好的广告图片,宽度最好是700px以上。

图片广告代码如下:

<a href="链接" rel="nofollow" target="_blank"><img src="图片地址" width="100%" alt="名称"></a>

如果链接是自己网站的链接或者允许搜索引擎蜘蛛爬取广告的链接,把代码中的rel="nofollow"删掉。

自定义区

《三栏自适应博客主题》主题配置使用教程

左侧栏导航栏的二级分类代码

如果一级分类有二级分类,一级分类的链接必须是#。

此样式未完善,不建议添加二级分类导航。

<li><a href="#">一级分类(带二级分类)</a>
<ul>
<li><a href="此二级分类的链接">第一个二级分类</li>
<li><a href="此二级分类的链接">第二个二级分类</li>
<li><a href="此二级分类的链接">第三个二级分类</li>
</ul>
</li>
<li><a href="此一级分类的链接">一级分类(不带二级分类)</a><li>
<li><a href="此一级分类的链接">一级分类(不带二级分类)</a><li>

文章列表的缩略图

文章列表调用缩略图顺序是:自定义缩略图 > 文章第一张图 > 无图不显示缩略图

《三栏自适应博客主题》主题配置使用教程

如果无图文章需要在列表中显示缩略图,或者文章内容仅一个视频,建议上传自定义缩略图。

《三栏自适应博客主题》主题配置使用教程

使用低带宽服务器和虚拟主机的优化建议

调用文章的第一张图片的大小平均超过50kb,建议使用阿里云、腾讯云、七牛云、又拍云等对象存储服务,可缩短页面加载时间。

教程一:又拍云对象存储:bufanz.com/post/56.html

免费插件,免费存储流量(申请又拍云联盟可获取),需要备案域名,插件功能少。

应用中心有阿里云、腾讯云、七牛云等对象存储的免费插件,请自行研究配置插件。

教程二:一键替换文章内容:bufanz.com/post/114.html

需要手动调整的插件

启用插件后,如果功能正常,需要手动调整什么就可以完美适配。

UEditor编辑器

带有链接的长文本(比如网址),移动端页面右边会多出宽度,在自定义CSS添加以下代码:

.news p {width: 100%; height: auto; word-wrap:break-word;word-break:break-all; overflow: hidden;}

首字母标签云

标签页面移位,在主题自定义CSS添加以下代码:

.alltopics-content {width: auto}
.alltopics-content .item .item-content {padding:0}

与主题有冲突的插件

我不能对ZBlog所有插件测试是否与主题完美兼容,只对我网站目前所安装的插件测试是否兼容,如果有不兼容的插件,会列出名单供于参考,也是不建议安装的插件。

外链杀手

解决办法:在站外链接添加nofollow(bufanz.com/post/114.html

正文目录索引

解决办法:无

阅读更多[查看全文]插件

解决办法:无

此主题的定位是简洁、轻巧和极致优化,请不要对主题作者反馈建议可能影响页面加载速度的功能,如需要增加新功能,请自行安装或者购买相应功能的插件。

淘宝购物先领券,更省钱

本文标题:《三栏自适应博客主题》主题配置使用教程

本文链接:https://bufanz.com/post/111.html

温馨提示:本文是作者 不凡 的原创文章,转载请注明出处和附带本文链接!

网友点评 展开评论

619128 头像很秀啊
不凡 回复 619128: 还可以设计更多的头像框
相约 整挺好啊

本文已有3位网友发表了点评 - 欢迎您

  • 文章

    163篇

  • 评论

    100条

  • 用户

    178位