加载头像

添加今日诗词

添加今日诗词

创建组件
主题新建themes/anzhiyu/layout/includes/widget/card_poem.pug,内容如下

======= }

添加今日诗词

添加今日诗词

创建组件
主题新建themes/anzhiyu/layout/includes/widget/card_poem.pug,内容如下

>>>>>>> 717ae3c6365faca4ef4790738e6dbc153ed3e8aa
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
#card-poem.card-widget
#poem_sentence
#poem_info
#poem_dynasty
#poem_author
script(src='https://cdn.jsdelivr.net/npm/js-heo@1.0.11/poem/jinrishici.js', charset='utf-8')
script(type='text/javascript').
jinrishici.load(function(result) {
var sentence = document.querySelector("#poem_sentence")
var author = document.querySelector("#poem_author")
var dynasty = document.querySelector("#poem_dynasty")

var sentenceText = result.data.content
sentenceText = sentenceText.substr(0, sentenceText.length - 1);
sentence.innerHTML = sentenceText
dynasty.innerHTML = result.data.origin.dynasty
author.innerHTML = result.data.origin.author + '《' + result.data.origin.title + '》'
});

引入组件
themes/anzhiyu/layout/includes/widget/index.pug中你需要的位置添加以下内容

1
!=partial('includes/widget/card_poem', {}, {cache: true})

引入CSS
在主题配置文件中添加

inject:
head:

heoMainColor.css

引用主css

这里调用的是今日诗词API,是一个可以返回一句古诗词名句的接口。

它可以通过图片和 JSON 格式调用。今日诗词 API 根据不同地点、时间、节日、季节、天气、景观、城市进行智能推荐。

访问链接:https://www.jinrishici.com

头像头像
zhangjialiang
打赏作者
本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 张嘉亮
avatar
本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 张嘉亮
avatar
最近发布
搜索栏
字数统计
永久链接
日历
引用到评论
随便逛逛博客分类文章标签
复制地址关闭热评深色模式轉為繁體