前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >hexo美化

hexo美化

作者头像
王先森sec
发布2023-04-24 16:41:24
6960
发布2023-04-24 16:41:24
举报
文章被收录于专栏:王先森

暂时未有写美化更新的想法!!

推荐文章增加文章描述

修改/scripts/helpers/related_post.js文件

代码语言:javascript
复制
/**
 * Butterfly
 * Related Posts
 * According the tag
 */

'use strict'

hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
  let relatedPosts = []
  currentPost.tags.forEach(function (tag) {
    allPosts.forEach(function (post) {
      if (isTagRelated(tag.name, post.tags)) {
        const relatedPost = {
          title: post.title,
          path: post.path,
          cover: post.cover,
          randomcover: post.randomcover,
          weight: 1,
          updated: post.updated,
          created: post.date,
          description: post.description,
          content: post.content
        }
        const index = findItem(relatedPosts, 'path', post.path)
        if (index !== -1) {
          relatedPosts[index].weight += 1
        } else {
          if (currentPost.path !== post.path) {
            relatedPosts.push(relatedPost)
          }
        }
      }
    })
  })
  if (relatedPosts.length === 0) {
    return ''
  }
  let result = ''
  const hexoConfig = hexo.config
  const config = hexo.theme.config

  const limitNum = config.related_post.limit || 6
  const dateType = config.related_post.date_type || 'created'
  const headlineLang = this._p('post.recommend')

  relatedPosts = relatedPosts.sort(compare('weight'))

  if (relatedPosts.length > 0) {
    result += '<div class="relatedPosts">'
    result += `<div class="headline"><i class="fas fa-thumbs-up fa-fw"></i><span>${headlineLang}</span></div>`
    result += '<div class="relatedPosts-list">'

    for (let i = 0; i < Math.min(relatedPosts.length, limitNum); i++) {
      const cover =
        relatedPosts[i].cover === false
          ? relatedPosts[i].randomcover
          : relatedPosts[i].cover
      const title = this.escape_html(relatedPosts[i].title)
      const description = this.strip_html(relatedPosts[i].description)
      const content = this.strip_html(relatedPosts[i].content)
      result += `<div><a href="${this.url_for(relatedPosts[i].path)}" title="${title}">`
      result += `<img class="cover" src="${this.url_for(cover)}" alt="cover">`
      if (dateType === 'created') {
        result += `<div class="content is-center"><div class="date"><i class="far fa-calendar-alt fa-fw"></i> ${this.date(relatedPosts[i].created, hexoConfig.date_format)}</div>`
      } else {
        result += `<div class="content is-center"><div class="date"><i class="fas fa-history fa-fw"></i> ${this.date(relatedPosts[i].updated, hexoConfig.date_format)}</div>`
      }
      result += `<div class="title">${title}</div>`
      switch (config.index_post_content.method) {
        case false:
          break
        case 1:
          result += `<div class="info">${description}</div>`
          break
        case 2:
          if (description) {
            result += `<div class="info">${description}</div>`
          }
		  else {
            let expert = content.substring(0, config.index_post_content.length)
            content.length > config.index_post_content.length ? expert += ' ...' : ''
            result += `<div class="info">${expert}</div>`
          }
		  break
        default:
          let expert = content.substring(0, config.index_post_content.length)
          content.length > config.index_post_content.length ? expert += ' ...' : ''
          result += `<div class="info">${expert}</div>`
          break
	  }
      result += '</div></a></div>'
	  }
    result += '</div></div>'
    return result
  }
})

function isTagRelated (tagName, TBDtags) {
  let result = false
  TBDtags.forEach(function (tag) {
    if (tagName === tag.name) {
      result = true
    }
  })
  return result
}

function findItem (arrayToSearch, attr, val) {
  for (let i = 0; i < arrayToSearch.length; i++) {
    if (arrayToSearch[i][attr] === val) {
      return i
    }
  }
  return -1
}

function compare (attr) {
  return function (a, b) {
    const val1 = a[attr]
    const val2 = b[attr]
    return val2 - val1
  }
}

遇到报错

代码语言:javascript
复制
文章中描述description为空是会发生报错

上下一篇文章增加文章描述

修改替换layout/includes/pagination.pug

代码语言:javascript
复制
-
  var options = {
    prev_text: '<i class="fas fa-chevron-left fa-fw"></i><div class="pagination-prev">上页</div>',
    next_text: '<div class="pagination-next">下页</div><i class="fas fa-chevron-right fa-fw"></i>',
    mid_size: 1,
    escape: false
  }
if is_post()
  - let prev = theme.post_pagination === 1 ? page.prev : page.next
  - let next = theme.post_pagination === 1 ? page.next : page.prev
  nav#pagination.pagination-post
    if(prev)
      - var hasPageNext = next ? 'pull-left' : 'pull-full'
      .prev-post(class=hasPageNext)
        - var pagination_cover = prev.cover === false ? prev.randomcover : prev.cover
        a(href=url_for(prev.path))
          img.prev-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
          .pagination-info
            .label=_p('pagination.prev')
            .prev_info=prev.title
            //- Display the article introduction on homepage
            case theme.index_post_content.method
              when false
                - break
              when 1
                .content!= prev.description
              when 2
                if prev.description
                  .content!= prev.description
                else
                  - const content = strip_html(prev.content)
                  - let expert = content.substring(0, theme.index_post_content.length) 
                  - content.length > theme.index_post_content.length ? expert += ' ...' : ''
                  .content!= expert
              default
                - const content = strip_html(prev.content)
                - let expert = content.substring(0, theme.index_post_content.length) 
                - content.length > theme.index_post_content.length ? expert += ' ...' : ''
                .content!= expert
          
    if(next)
      - var hasPagePrev = prev ? 'pull-right' : 'pull-full'
      - var pagination_cover = next.cover == false ? next.randomcover : next.cover
      .next-post(class=hasPagePrev)
        a(href=url_for(next.path))
          img.next-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
          .pagination-info
            .label=_p('pagination.next')
            .next_info=next.title
            //- Display the article introduction on homepage
            case theme.index_post_content.method
              when false
                - break
              when 1
                .content!= next.description
              when 2
                if next.description
                  .content!= next.description
                else
                  - const content = strip_html(next.content)
                  - let expert = content.substring(0, theme.index_post_content.length) 
                  - content.length > theme.index_post_content.length ? expert += ' ...' : ''
                  .content!= expert
              default
                - const content = strip_html(next.content)
                - let expert = content.substring(0, theme.index_post_content.length) 
                - content.length > theme.index_post_content.length ? expert += ' ...' : ''
                .content!= expert
else
  nav#pagination
    .pagination
      if is_home()
        - options.format = 'page/%d/#content-inner'
      !=paginator(options)
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021-05-01,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 暂时未有写美化更新的想法!!
  • 推荐文章增加文章描述
    • 遇到报错
    • 上下一篇文章增加文章描述
    领券
    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档