Yilia主题文章增加"原创/转载"标识

yuanandzhuan

给博客文章增加类型说明:“原创”或“转载”。

准备工作

这个标识是添加在博客的“字数统计”功能里的,所以需要先配置字数统计功能,点击跳转:https://anyway1314.cn/post/25766.html#3、字数、阅读时长统计

添加配置

在博客根目录的_config.yml添加:

# 文章类型,在上面word_count: true的前提下可以进行开启
# 文章类型具体在对应的md文件开头的 article_type属性进行定义。原创:article_type:0 ,,转载:article_type:1 :
article_type: true

添加代码

找到themes\yilia\layout\_partial\post\word.ejs,代码替换为:

<div style="margin-top:10px;margin-bottom:-15px;">
    <% if (theme.article_type == true){ %>
      <% if(post.article_type == 0){ %>
        <span class="article-type" style="
          color: white;
          font-size: 14px;
          background: #bf59f3;
          padding: 0 5px 1px 5px;
          margin-right: 5px;
          border-radius: 2px;">原创</span>
      <% } else if (post.article_type == 1){ %>
        <span class="article-type" style="
          color: white;
          font-size: 14px;
          background: #8BC34A;
          padding: 0 5px 1px 5px;
          margin-right: 5px;
          border-radius: 2px;">转载</span>
      <% } %>
    <% } %>
    <span class="post-time">
      <span class="post-meta-item-icon">
        <i class="fa fa-keyboard-o"></i>
        <span class="post-meta-item-text" style="font-size: 15px;color: navy">  字数统计: </span>
        <span class="post-count" style="font-size: 14px;color: navy"><%= wordcount(post.content) %></span>
      </span>
    </span>
    
    <span class="post-time">
      &nbsp; | &nbsp;
      <span class="post-meta-item-icon">
        <i class="fa fa-hourglass-half"></i>
        <span class="post-meta-item-text" style="font-size: 15px;color: navy">  阅读时长: </span>
        <span class="post-count" style="font-size: 14px;color: navy"><%= min2read(post.content) %></span>
      </span>
    </span>
</div>

文章修改

根据自己的文章内容,在其对应的md文件里,需要声明为“原创”的开头写上article_type: 0,“转载”则是article_type: 1

20200413202026

*hexo new生成优化

毕竟每次手动写article_type: 0挺费时间,直接把它写在博客根目录的scaffolds\post.md里,每次创建自动生成。

20200413203418

移动端细节调整

在没有增加“字数统计”的功能前,文章标题有一个下边框

20200413202819

可以在themes\yilia\source\main.xxxxx.css里进行修改,如图:

20200413203030

完结、✿✿ヽ(°▽°)ノ✿

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值