Fluid -14- 添加'一言'

本文最后更新于：2024年5月7日下午

一言指的就是一句话，用代码表达言语的魅力，用代码书写山河的壮丽。本文记录在 Fluid 主题中加入’一言’的方法。

简介

一言网（hitokoto.cn）创立于 2016 年，隶属于萌创团队，网站主要提供一句话服务。
‘一言’ 的初衷——动漫也好、小说也好、网络也好，不论在哪里，我们总会看到有那么一两个句子能穿透你的心。我们把这些句子汇聚起来，形成一言网络，以传递更多的感动。
简单来说，一言指的就是一句话，可以是动漫中的台词，也可以是网络上的各种小段子。或是感动，或是开心，有或是单纯的回忆。来到这里，留下你所喜欢的那一句句话，与大家分享，这就是一言存在的目的。

官网链接：https://developer.hitokoto.cn/

添加效果

可以在首页位置加入随机的中二 slogan

可以在网页 Footer 中加入一句随机生成的酷酷的话

使用方法

Slogan

在 Fluid 主题配置文件修改 index/slogan 配置的 url 和 keys

slogan:
  enable: true

  # 为空则按 hexo config.subtitle 显示
  # If empty, text based on `subtitle` in hexo config
  text: "明眸如初，又见苍岚"

  # 通过 API 接口作为首页副标题的内容，必须返回的是 JSON 格式，如果请求失败则按 text 字段显示，该功能必须先开启 typing 打字机功能
  # Subtitle of the homepage through the API, must be returned a JSON. If the request fails, it will be displayed in `text` value. This feature must first enable the typing animation
  api:
    enable: true

    # 请求地址
    # Request url
    url: "https://v1.hitokoto.cn/"

    # 请求方法
    # Request method
    # Available: GET | POST | PUT
    method: "GET"

    # 请求头
    # Request headers
    headers: {}

    # 从请求结果获取字符串的取值字段，最终必须是一个字符串，例如返回结果为 {"data": {"author": "fluid", "content": "An elegant theme"}}, 则取值字段为 ['data', 'content']；如果返回是列表则自动选择第一项
    # The value field of the string obtained from the response. For example, the response content is {"data": {"author": "fluid", "content": "An elegant theme"}}, the expected `keys: ['data','content']`; if the return is a list, the first item is automatically selected
    keys: ['hitokoto']

footer 位置添加“一言”

官方教程：
- 语句接口：https://developer.hitokoto.cn/sentence/
- 使用示例：https://developer.hitokoto.cn/sentence/demo/#网页
在 Fluid 中我使用了新API 的写法

1	`<script src="https://v1.hitokoto.cn/?encode=js&select=%23hitokoto" defer></script>`

仅需将如下代码加入到 fluid\layout\_partial\statistics.ejs 文件中

 <div class="statistics">
 	<a href="https://developer.hitokoto.cn/" id="hitokoto_text"><span style="color: #DDD;"  id="hitokoto"></span></a>
<script src="https://v1.hitokoto.cn/?encode=js&select=%23hitokoto" defer></script>
 </div>