typecho网站(小程序、https 301、熊掌号、AMP | MIP插件、QQ头像评论)折腾记录

2019-08-18 00:08

书写.png

本页面记录“流年伴夏”小网站,折腾修改到现在的各种问题。

从2013年开始,在微狐网上购买得到此套模板,一直用到今天,至今原作者已很久没有管过这套模板了。
这套模板如现在大家所见,样式简单,简约十足,清爽。

2019年,恢复小站的更新,目前折腾的几件小事如下。

1)typecho 小程序

本网站小程序名称 “伴夏君爱阅读”,大家可以搜索到,研究目前 typecho小程序都来自于 WeTypecho 的一套插件,然后在网上寻找更多更直观的小程序样式可以兼容。于是找到了 Kimi-基于Typecho的小程序

目前大家在 本网站中看到的小程序中,所见样式,和 成都第七帅 作者的样式是一致的。
小程序图.jpg

不一样的地方,一个是内容page页,删除了分类的按钮;另一个是 在 授权登陆页使用了 Kimi博主的 登陆样式(主要是更好看)。
其中,由于本网站缩略图的关系,最终使用了,“自定义字段 thumb = 图片地址”,所以才显示出图片。

在提交审核的过程中,需要选择 工具 — 信息查询,对应分类,否则会无法通过小程序审核(之前选择的图片类,被打回)

2019.08.20 补充更新记录

A - 完成小程序显示数量的调整,现在很多人打开小程序之后,点击类目,暖心故事会,青春风铃之后,加载很慢慢,查询到是由于调用了数据库所有的文章的原因,功能,小程序列表页只调用前10篇文章。
记录如下
找到具体调用的接口:getpostbymid
通过接口名,查询到小程序文件 Action.php,找到对应的代码。
修改:$pageSize = (int) self::GET('pageSize', 1000);
为 $pageSize = (int) self::GET('pageSize', 10);
至此,前端显示完成,如果想修改更多请直接改数字哦,之前的1000太多了。

2)typecho升级(从版本 0.8 升级到最新版本 1.1)

遇到问题如下
A:整个网站打不开
原因:由于需要使用小程序,那么就需要typecho程序升级到最新版,其中数据库也要升级,之前数据库的PHP版本是5.X,现在的版本是7.X,后台 config.inc.php 调用数据库的字段变化了
解决方法:$db = new Typecho_Db('Mysql', 'typecho_'); 修改为 $db = new Typecho_Db('Pdo_Mysql', 'typecho_');

B:升级之后网站发布文章,无法发布
后面查询到,是 之前 0.8版本所使用的插件,目前有一些已无法使用,分别为 TinyMCE,sitemap插件,评论表情贴图。
后面如果有朋友升级了版本,却有问题,大部分是由于后台插件的原因。插件需要升级或者禁用掉,即可以解决。

C:typecho升级,网站开启 https 访问
在阿里云买了3年的虚拟主机,想着阿里云免费给域名开https的使用,于是就开了一个,具体规则如下,而且由于在网站中,需要对feed页进行单独处理(feed页不进行http强制301跳转到https),对整个环境研究了很久,终于完成如下,所以目前 .htaccess最终的如下

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{SERVER_PORT} !^443$
RewriteCond %{REQUEST_URI} !feed*
RewriteCond $1 !(var|feed|index.php)
RewriteCond %{REQUEST_URI} !/var/Typecho/Feed.php
RewriteCond %{REQUEST_URI} !/lomo/var/Widget/Contents/Post/Edit.php
RewriteRule ^.*$ https://%{SERVER_NAME}%{REQUEST_URI} [L,R=301]
</IfModule>

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !^/var/Typecho/Feed.php
RewriteCond %{REQUEST_URI} !^/lomo/var/Widget/Contents/Post/Edit.php
RewriteRule ^(.*)$ /index.php/$1 [L]
</IfModule>

<IfModule mod_rewrite.c>
rewriteEngine on
rewriteCond %{http_host} ^www.liunianbanxia.com [NC]
rewriteRule ^(.*)$ https://liunianbanxia.com/$1 [R=301,L]
</IfModule>

————————————————————————

以及由于做了一个单独的类目 https://liunianbanxia.com/lomo/,所以也需要对 lomo这个文件夹进行单独的 设置。如下

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{SERVER_PORT} !^443$
RewriteCond %{REQUEST_URI} !feed*
RewriteCond $1 !(var|feed|index.php)
RewriteCond %{REQUEST_URI} !/var/Typecho/Feed.php
RewriteRule ^.*$ https://%{SERVER_NAME}%{REQUEST_URI} [L,R=301]
</IfModule>

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /lomo/
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /lomo/index.php/$1 [L]
</IfModule>

其中目录这一块,顺序不要放错,有先后,不然就会出现URL出现 /index.php/ 。

最终实现了 lomo目录的伪静态,以及实现了 目录的 301 到https 功能,以及 feed 的单独处理。

https.png

这是在百度站长工具进行https认证成功的界面,百度https需要整个站点(不仅仅首页,整个网站的可索引的URL)的所有URL都从 http 改成 https,包括JS、CSS样式,至于友情链接,当时博主是先下架了所有的https链接,再去提交,等了2天时间,认证成功。

3)熊掌号

流年伴夏.png

大家可以看到,熊掌号已经开通,目前开通熊掌号不用做熊掌号改造(听说,是熊掌号团队解散了),所以目前熊掌号里最有用的价值就是关于提交百度收录这一块了。

熊掌号.png

但是真实的熊掌号,只是配合百度MIP|AMP插件提交的更方便吧,具体如下。

4)百度MIP|AMP - typecho

插件作者:https://holmesian.org/AMP-for-Typecho
插件图 ——

MIP插件图.png

这个插件最大的好处是能提高百度和google以及已支持的神马搜索的抓取效率,然后附带熊掌号一起提交给百度。

大家看首页 ——
<link rel="amphtml" href="https://liunianbanxia.com/ampindex";>

page页
<link rel="amphtml" href="https://liunianbanxia.com/amp/sentences-that-love-you";>
<link rel="miphtml" href="https://liunianbanxia.com/mip/sentences-that-love-you";>

以上是经过处理之后的URL,本来担心会出现搜索引擎重复收录的问题。

但是目前百度、神马、google已支持,其他都可以暂时不考虑;但是有一点,可以修改主页的AMP站点的title,具体在模板的文件里。

首页title.png

其他,就没有需要注意的地方。

20190822插件更新如下:
博主提交了google站长工具,提示到一个问题,最后修改如下
google验证.jpg

以及在内容页,发现了重复页的一个问题,目前已修改如下
增加html标识.jpg

5)评论

代码来自:http://www.wg1997.cn/archives/headportrait2.html 的 模板中 的 comment.php 文件

起因 - 本博客模板买了之后,之前整个评论体系都是用多说系统,后来多说罢工了,后来用搜狐畅言,但是体验太差了,于是想着这次一定要转回默认评论体系。

目前在整个评论体系中,最终选择了,带有QQ头像的评论一套模板。

引用 - 获取QQ头像接口:https://www.jianshu.com/p/22170ca50ccb

由于模板不同,会导致评论代码的实效,需要注意几点

  • css样式,可以通过 chrome工具抓取到对应的css样式
  • 调用问题

博主解决完评论代码,于是测试提交,发现评论提交失败了。在网上找解决方案

具体地址:https://segmentfault.com/q/1010000006670404

解决方式,是在

“<button type="submit" class="submit"><?php _e('提交评论'); ?></button>”

后面提交了一段代码,注意这段代码的样式(其实我也不知道这段代码的意思)

<!-- 新增代码 -->

    <?php $security = $this->widget('Widget_Security'); ?>
        <input type="hidden" name="_" value="<?php echo $security->getToken($this->request->getReferer())?>">

<!-- 新增 代码结束 -->

至此,整个评论代码完成,记录最近整个整改的部分如下,大家有什么好的想法也可以和我留言沟通哦

6)typecho程序,自定义分类、TAG标签的title选项

目前博主的类目的标题并非是 类目名,请看
暖心故事会,标题为:故事会,传奇故事会大全,温馨睡前暖心故事在线阅读 - 流年伴夏
青春风铃,标题为:青春风铃,青年文摘合集,中短篇校园爱情故事,在线阅读
修改的参考文档见链接 - https://www.seogo.me/tec/277.html
里面教程很清楚,有以下几个点
1)操作数据库的时候记得备份(找到数据库表typecho_metas,添加字段),但是博主并没有添加字段,而是直接取了description字段当做标题。
2)
分类改标题.png
在/var/Widget/Archive.php,找到 以下代码“设置标题,archivetitle”提示,进行修改
TAG页标题修改,同
但是注意数据库的SQL写法:update typecho_metas SET description ='' WHERE mid = ''
3)至此修改完成,博主之后的操作都在数据库中修改的内容。

7)移动端适配

移动端适配已完成,用掉了好长时间修改样式,大家可以通过手机端查看一下

睡前故事:栏目大全

睡前故事:标签大全

睡前故事大全热门

睡前小故事大全