WordPress网站新增一言功能——微语录就是这么简单!

少羽.
少羽.
少羽.
1603
文章
92
评论
2018年11月22日22:22:30 评论 7.5K 1969字阅读6分33秒

前言:

一直想给网站添加个“经典语录”的模块,来记录些少羽看到的不错的句子或者是少羽的一些所思所想,但苦于自己技术有限,始终没有好的实现方法,最近在浏览张戈博客的时候发现博主分享了网站添加一言功能的代码,觉的很是不错便移植到了少羽的网站上。

Wordpress网站新增一言功能——微语录就是这么简单!

说一下个人之所以选择这代码的原因吧。

1.纯代码,无需写入数据库。这个功能的实现是通过随机调用一个TXT文本中的句子来实现的,所以就避免了每一次请求调去数据库中的信息的过程,减轻了数据库的负担。WordPress有一款名叫的插件,但是需要将语录文字写进数据库,当然这有助于对语录文字的分类,但是个人感觉对于个人博客,如果不是专门做经典语录的话没有必要如此消耗数据库。

2.模块化,方便随时添加或移出。这一点对于喜欢折腾的站长及新手站长还是挺好的,模块化的网站管理方式可以使得我们对于网站各个功能的清晰把握,即使某一模块出现故障也不会对网站整体有什么影响,但是模块化也会造成系统臃余的问题,具体如何大家自己把握。

好了,废话不多说了,来看下具体实现的步骤吧。

正文:

部署接口

新建一个index.php文件,在文件中填写如下代码:

<?php
// 获取句子文件的绝对路径
// 如果你介意别人可能会拖走这个文本,可以把文件名自定义一下,或者通过Nginx禁止拉取也行。
$path = dirname(__FILE__);
$file = file($path."/hitokoto.txt");
 
# 随机读取一行
$arr  = mt_rand( 0, count( $file ) - 1 );
$content  = trim($file[$arr]);
 
# 编码判断,用于输出相应的响应头部编码
if (isset($_GET['charset']) && !empty($_GET['charset'])) {
    $charset = $_GET['charset'];
    if (strcasecmp($charset,"gbk") == 0 ) {
        $content = mb_convert_encoding($content,'gbk', 'utf-8');
    }
} else {
    $charset = 'utf-8';
}
header("Content-Type: text/html; charset=$charset");
 
# 格式化判断,输出js或纯文本
if ($_GET['format'] === 'js') {
    echo "function hitokoto(){document.write('" . $content ."');}";
} else {
    echo $content;
}

新建一个名为hitokoto.txt的文本文档,将hitokoto.txt文本文档与上面的index.php文件同时放入一个名为hitokoto的文件夹中,当然这里文本文档及文件夹的名称可以更改为其他任意字符,但是要将代码中对应调用部分也做更改。现在通过浏览器访问路径“http://你的域名/hitokoto/”就可以查看输出内容了,借此我们也可以确认自己的接口部署是否正确。

网站集成

在网站中你需要显示语录文字的地方添加上如下代码既可以实现对hitokoto.txt中文字语录的调用。

<script type="text/javascript" src="https://你的域名/hitokoto/?format=js&charset=utf-8"></script>
<div id="hitokoto"><script>hitokoto()</script></div>

建议大家使用Notepad++编辑工具对hitokoto.txt文件进行编辑,一行一句语录。Windows默认的文本工具打开TXT文档后可能会无法智能分句。

样式美化

通过上面两步我们就可以在网站前端查看到自己添加的语录了,但是默认的显示效果可能不太好看,这里将我网站上的样式分享给大家(其实也只是在张戈大神的基础上做了些简单修改以适应本站)。

/* hitokoto一言样式 */
#hitokoto{
    border-left: 5px solid #00a0f0;
    border-right: 5px solid #00a0f0;
    background-color: #f0f0f0;
    padding: 9px 24px;
    text-align: center;
    font-size:14px;
    color: #63b4f0;
    margin: 9px 0px;
}

除了代码实现微语录的方法,WordPress丰富的插件库中自然也少不了相关的插件,这里个大家介绍一款名为 Quotes Collection 这款插件可以很好地帮助我们实现网站微语录的功能,但是这些经典语录都会被写进数据库,当然这非常有利于一些专业收集语录的网站后期根据数据库灵活地调用或分类语录,然而对于小水管的个人博客而言频繁地调用网站数据库似乎并不是一件好事。

继续阅读
少羽.
  • 本文由 发表于 2018年11月22日22:22:30
  • 除非特殊声明,本站文章均为原创,转载请务必保留本文链接
禁用 WordPress 5.5 图片延迟加载功能 WordPress

禁用 WordPress 5.5 图片延迟加载功能

WordPress 5.5除了不断优化修改区块编辑器之外,还增加了几个新功能,其中的图片延迟加载功能,经本人测试,除了在火狐下有效果,在Chromium内核的浏览器中无效,难道是开发人员也和我一样只用...
WordPress纯代码实现独立相册功能 WordPress

WordPress纯代码实现独立相册功能

其实,这篇文章很早准备发了,一直拖,拖,拖硬生生拖到了现在,今天整合闲着,就更新一下博客吧! 想到这个文章,我忘记发了,今天就补上 hhh 正文 思路是前段时间写模板琢磨出来的,模板写废了,也不准备写...
广告也精彩
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: