安装AnZhiYu主题

在博客根目录里安装测试版

1
git clone -b dev https://github.com/anzhiyu-c/hexo-theme-anzhiyu.git themes/anzhiyu

升级主题
在主题目录下，运行代码：

1
git pull

此方法只支持 Hexo 5.0.0 以上版本
通过 npm 安装并不会在 themes 里生成主题文件夹，而是在 node_modules 里生成

1
npm i hexo-theme-anzhiyu

升级主题
在Hexo根目录下，运行代码：

1
npm update hexo-theme-anzhiyu

使用主题

修改 hexo 配置文件_config.yml，把主题改为anzhiyu

安装 pug 和 stylus 渲染插件

1
npm install hexo-renderer-pug hexo-renderer-stylus --save

修改配置

在博客根目录运行

1
cp -rf ./themes/anzhiyu/_config.yml ./_config.anzhiyu.yml

复制/themes/anzhiyu/_config.yml文件到hexo根目录，并重命名为_config.anzhiyu.yml
_config.anzhiyu.yml中的配置优先级大于_config.yml

标签页面配置

  • 在博客根目录打开终端，输入
    1
    hexo new page tags
  • 进入[blog]/source/tags/index.md文件
  • 添加type: "tags"
    1
    2
    3
    4
    5
    6
    7
    ---
    title: 标签
    date: 2021-04-06 12:01:51
    type: "tags"
    comments: false
    top_img: false
    ---
    参数 解释
    type 【必须】页面类型，必须为 tags
    comments 【可选】是否显示评论
    top_img 【可选】是否显示顶部图
    orderby 【可选】排序方式 ：random/name/length
    order 【可选】排序次序： 1, asc for ascending; -1, desc for descending

分类页面配置

  • 在博客根目录打开终端，输入
    1
    hexo new page categories
  • 进入[blog]/source/tags/index.md文件
  • 修改该文件
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    ---
    title: 分类
    date: 2022-02-23 17:56:00
    aside: false
    top_img: false
    ---

    <style>
      #libCategories .card-wrap:hover .card-info:after {
        width: 300%;
      }
    </style>
    <link rel="stylesheet" type="text/css" href="https://npm.elemecdn.com/js-heo@1.0.11/3dCard/no3d.css">

    <div id='libCategories'>
    <div id="lib-cards" class="container">

    <a href='javascript:void(0);' onClick='pjax.loadUrl("/categories/前端/")'>
    <card data-image="https://image.anheyu.com/useruploads/108/2023/05/06/6456600ac04e0.webp">
    <h1 slot="header">前端</h1>
    <p slot="content">前端学习之路</p>
    </card>
    </a>

    <a href='javascript:void(0);' onClick='pjax.loadUrl("/categories/生活日常/")'>
      <card data-image="https://image.anheyu.com/useruploads/108/2023/05/06/64565f59636df.jpg">
        <h1 slot="header">生活日常</h1>
        <p slot="content">记录生活中的趣事</p>
      </card>
    </a>

    <a href='javascript:void(0);' onClick='pjax.loadUrl("/categories/游戏/")'>
      <card data-image="https://image.anheyu.com/useruploads/108/2023/05/06/64565efface02.webp">
        <h1 slot="header">游戏</h1>
        <p slot="content">记录游戏里的旅程</p>
      </card>
    </a>

    </div>
    </div>

    <script src='https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/vue/2.6.14/vue.min.js' data-pjax></script>

    <script type="text/javascript" src="https://cdn1.tianli0.top/npm/js-heo@1.0.11/3dCard/no3d.js" data-pjax></script>

闲言碎语界面配置

  • 在博客根目录打开终端，输入
    1
    hexo new page essay
  • 进入[blog]/source/essay/index.md文件
  • 添加type: "essay"
    1
    2
    3
    4
    5
    6
    7
    8
    ---
    title: 即刻短文
    date: 2020-07-22 22:06:17
    comments: true
    aside: false
    top_img: false
    type: essay
    ---
  • 在[blog]/source/_data中新建essay.yml文件，没有这个文件夹的请新建
  • 添加以下代码
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    - title: 即刻短文
      subTitle: 咸鱼的日常生活
      tips: 随时随地，分享生活
      buttonText: 关于我
      buttonLink: /about/
      limit: 30
      home_essay: true
      top_background: https://img01.anheyu.com/useruploads/108/2023/04/02/64285e4a2b8db.png
      essay_list:
        - content: 和朋友出去永旺玩了，然而并不开心，我并不理解为何他们全把我当钱包
          date: 2023/05/02
          image:
            - https://img01.anheyu.com/useruploads/108/2023/07/09/64aac4bcc587c.jpg
          address: 广州市
  • 打开[blog]/_config.anzhiyu.yml，在菜单menu配置中开启关于和闲言碎语，注意缩进
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    menu:
      # 文章:
      #   隧道: /archives/ || anzhiyu-icon-box-archive
      #   分类: /categories/ || anzhiyu-icon-shapes
      #   标签: /tags/ || anzhiyu-icon-tags

      # 友链:
      #   友人帐: /link/ || anzhiyu-icon-link
      #   朋友圈: /fcircle/ || anzhiyu-icon-artstation
      #   留言板: /comments/ || anzhiyu-icon-envelope

      # 我的:
      #   音乐馆: /music/?id=8606486756&server=tencent || anzhiyu-icon-music
      #   追番页: /bangumis/ || anzhiyu-icon-bilibili
      #   相册集: /album/ || anzhiyu-icon-images
      #   小空调: /air-conditioner/ || anzhiyu-icon-fan

      关于:
        #   关于本人: /about/ || anzhiyu-icon-paper-plane
        闲言碎语: /essay/ || anzhiyu-icon-lightbulb
        #   随便逛逛: javascript:toRandomPost() || anzhiyu-icon-shoe-prints1
  • 在[blog]/_config.anzhiyu.yml中开启essay.enable，背景自行设置
    1
    2
    3
    4
    # 即刻页面配置
    essay:
      enable: true
      top_background:

友情链接页面配置

  • 在博客根目录打开终端，输入
    1
    hexo new page link
  • 进入[blog]/source/link/index.md文件
  • 添加type: "link"
    1
    2
    3
    4
    5
    ---
    title: link
    date: 2023-04-14 18:28:05
    type: 'link'
    ---
  • 在[blog]/source/_data中新建link.yml文件，没有这个文件夹的请新建
  • 添加以下代码
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    - class_name: 推荐博客
      flink_style: flexcard
      link_list:
        - name: 辰风Blog
          link: https://chenfengyyds.github.io/
          avatar: https://image.anheyu.com/useruploads/108/2023/03/12/640dac11413b0.png
          descr: 超电磁炮永世长存
          siteshot: https://image.anheyu.com/useruploads/108/2023/04/01/642844c1ea151.png

    - class_name: 小伙伴
      class_desc: 那些人，那些事
      flink_style: anzhiyu
      link_list:
        - name: 王同学的blog
          link: http://www.wxz666.icu/
          avatar: https://image.anheyu.com/useruploads/108/2023/04/15/643ab91cafdbc.webp
          descr: 须知少年凌云志，曾许人间第一流
          siteshot:
    会有两种效果，可选值flexcard和anzhiyu
    当友链数目超过50以后会触发与博主共同进步板块，可以自行配置hundredSuffix: "!w120"，该参数可以解决共同进步板块头像质量问题，配置后共同进步板块的头像会添加该后缀
    1
    flink_style: flexcard || anzhiyu
  • 打开[blog]/_config.anzhiyu.yml，在菜单menu配置中开启友链和友人帐，注意缩进
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    menu:
      # 文章:
      #   隧道: /archives/ || anzhiyu-icon-box-archive
      #   分类: /categories/ || anzhiyu-icon-shapes
      #   标签: /tags/ || anzhiyu-icon-tags

      友链:
        友人帐: /link/ || anzhiyu-icon-link
      #   朋友圈: /fcircle/ || anzhiyu-icon-artstation
      #   留言板: /comments/ || anzhiyu-icon-envelope

      # 我的:
      #   音乐馆: /music/?id=8606486756&server=tencent || anzhiyu-icon-music
      #   追番页: /bangumis/ || anzhiyu-icon-bilibili
      #   相册集: /album/ || anzhiyu-icon-images
      #   小空调: /air-conditioner/ || anzhiyu-icon-fan

      关于:
        #   关于本人: /about/ || anzhiyu-icon-paper-plane
        闲言碎语: /essay/ || anzhiyu-icon-lightbulb
        #   随便逛逛: javascript:toRandomPost() || anzhiyu-icon-shoe-prints1

关于界面配置

  • 在博客根目录打开终端，输入
    1
    hexo new page about
  • 进入[blog]/source/about/index.md文件
  • 添加type: "about"
    1
    2
    3
    4
    5
    6
    7
    8
    9
    ---
    title: 关于
    date: 2021-03-30 15:57:51
    aside: false
    top_img: false
    background: "#f8f9fe"
    comments: false
    type: "about"
    ---
  • 打开[blog]/_config.anzhiyu.yml，在菜单menu配置中开启关于和关于本人，注意缩进
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    - class_name: 关于页
      subtitle: 超电磁炮永世长存⚡
      avatarImg: https://image.anheyu.com/useruploads/108/2023/03/12/640dac11413b0.png
      name: 辰风
      description: 是一名 学生、视频创作者、博主
      aboutsiteTips:
        tips: 追求
        title1: 源于
        title2: 热爱而去 感受
        word:
          - 学习
          - 生活
          - 程序
          - 游戏
      helloAbout: Hello there!
      skillsTips:
        tips: 技能
        title: 开启创造力
      careers:
        tips: 生涯
        title: 无限进步
        item:
          - EDU,学生
        img: https://image.anheyu.com/useruploads/108/2023/04/01/64284cb001cf7.png
      statistic:
        link: /archives
        text: 文章隧道
        cover: https://image.anheyu.com/useruploads/108/2023/05/03/64521704ae1cf.jpg
      map:
        title: 我现在住在
        StrengthenTitle: 中国，广州市
        background: https://image.anheyu.com/useruploads/108/2023/04/02/6428d498546ab.png
        backgroundDark: https://image.anheyu.com/useruploads/108/2023/04/02/6428d522b0fbd.png
      selfInfo:
        selfInfoTips1: 生于
        selfInfoContentYear: 2008
        selfInfoTips2: 南沙鱼窝头第二中学
        selfInfoContent2: 普通学生
        selfInfoTips3: 现在职业
        selfInfoContent3: 初二学生👨‍🎓
      personalities:
        author_name: 执政官
        personality_type: ESFJ-A
        photo_url: https://image.anheyu.com/useruploads/108/2023/03/12/640dac11413b0.png
        personality_img: https://npm.elemecdn.com/anzhiyu-blog@2.0.8/img/svg/ESFJ-A.svg
        name_url: https://www.16personalities.com/ch/esfj-%E4%BA%BA%E6%A0%BC
      maxim:
        maxim_tips: 座右铭
        maxim_top: 此生无悔入二次元
        maxim_bottom: 来世还做纸片人
      buff:
        buff_tips: 特长
        buff_top: 脑回路新奇的 蝙蝠
        buff_bottom: 二次元指数 MAX
      game:
        game_tips: 爱好游戏
        game_title: 原神
        game_uid: "UID: 243727124"
        game_bg: https://image.anheyu.com/useruploads/108/2023/04/28/644ba21051aa6.webp
      comic:
        comic_tips: 爱好番剧
        comic_title: 追番
        comic_list:
          - name: 孤独摇滚
            href: https://www.bilibili.com/bangumi/media/md28339735
            cover: https://image.anheyu.com/useruploads/108/2023/04/01/64284a0f28bff.webp
          - name: 刀剑神域
            href: https://www.bilibili.com/bangumi/media/md24755609
            cover: https://image.anheyu.com/useruploads/108/2023/04/01/64284a52d085c.webp
          - name: 紫罗兰永恒花园
            href: https://www.bilibili.com/bangumi/media/md8892/
            cover: https://image.anheyu.com/useruploads/0/2023/04/22/6443b6d607e83.webp
          - name: Re0:从零开始的异世界生活
            href: https://www.bilibili.com/bangumi/media/md4026
            cover: https://image.anheyu.com/useruploads/108/2023/04/01/64284abf6c131.webp
          - name: 某科学的超电磁炮
            href: https://www.bilibili.com/bangumi/media/md425
            cover: https://image.anheyu.com/useruploads/108/2023/04/01/64284b2915f3c.webp
      like:
        like_tips: 关注偏好
        like_title: 数码科技
        like_bg: https://image.anheyu.com/useruploads/108/2023/04/01/64284b3e55b56.webp
        like_bottom: 手机、电脑软硬件
      music:
        music_tips: 音乐偏好
        music_title: 日语，流行，动漫OP/ED
        music_bg: https://image.anheyu.com/useruploads/108/2023/04/01/64284bbb9cf6c.jpg
        music_link: /music
      reward_list:
        - name: 依古比古
          amount: 5
          datatime: 2023-03-05
        - name: 枫
          amount: 10.06
          datatime: 2023-05-14

      extra: true
    参数/值/解释
    参数备选值/类型解释
    class_name关于页【必须】页面类
    subtitlestring【必须】副标题
    avatarImgurl【必须】头像链接
    namestring【必须】作者名称
    descriptionstring【必须】描述
    aboutsiteTipsobject【必须】站点关于提示相关配置
    aboutsiteTips.tipsstring【必须】站点关于提示性文字
    aboutsiteTips.title1string【必须】站点关于标题文字 1
    aboutsiteTips.title2string【必须】站点关于标题文字 2
    aboutsiteTips.wordlist【必须】站点关于标题滚动文字
    helloAboutstring【必须】hello 文字
    skillsTipsobject【必须】技能相关配置
    skillsTips.tipsstring【必须】技能提示文字
    skillsTips.titlestring【必须】技能标题
    careersobject【必须】生涯相关配置
    careers.tipsstring【必须】生涯提示性文字
    careers.titlestring【必须】生涯标题
    careers.itemlist【必须】生涯 item
    careers.imgstring【必须】生涯图片
    statisticobject【必须】统计数据相关配置
    statistic.linkurl【必须】统计数据按钮前往链接
    statistic.texturl【必须】统计数据背景图
    statistic.coverstring【必须】统计数据按钮文字
    mapobject【必须】地图相关配置
    map.titlestring【必须】地图标题
    map.StrengthenTitlestring【必须】地图大标题
    map.backgroundurl【必须】地图亮色模式背景
    map.backgroundDarkurl【必须】地图暗色模式背景
    selfInfoobject【必须】作者相关信息配置
    selfInfo.selfInfoTips1string【必须】作者相关提示文字 1
    selfInfo.selfInfoContentYearnumber【必须】作者生日年份
    selfInfo.selfInfoTips2string【必须】作者相关提示文字 2
    selfInfo.selfInfoContent2string【必须】作者相关内容 2
    selfInfo.selfInfoTips3string【必须】作者相关提示文字 3
    selfInfo.selfInfoContent3string【必须】作者相关内容 3
    personalitiesobject【必须】作者性格相关配置
    personalities.author_namestring【必须】作者性格名称
    personalities.personality_typestring【必须】作者性格类型
    personalities.photo_urlurl【必须】作者自拍图片
    personalities.personality_imgurl【必须】作者性格表述图片
    personalities.name_urlurl【必须】点击性格跳转到链接
    maximobject【必须】座右铭相关配置
    maxim.maxim_tipsstring【必须】座右铭相关提示文字
    maxim.maxim_topstring【必须】座右铭相关顶部文字
    maxim.maxim_bottomstring【必须】座右铭相关底部文字
    buffobject【必须】特长相关配置
    buff.buff_tipsstring【必须】特长相关提示文字
    buff.buff_topstring【必须】特长相关顶部文字
    buff.buff_bottomstring【必须】特长相关底部文字
    gameobject【必须】爱好游戏相关配置
    game.game_tipsstring【必须】爱好游戏提示文字
    game.game_titlestring【必须】爱好游戏标题
    game.game_uidstring【必须】爱好游戏 uid
    game.game_bgurl【必须】爱好游戏背景
    comicobject【必须】追番相关配置，需要 5 条数据
    comic.comic_tipsstring【必须】追番相关提示文字
    comic.comic_titlestring【必须】追番相关标题
    comic.comic_listlist【必须】追番相关列表
    comic.comic_list.namestring【必须】追番 item 名称
    comic.comic_list.hrefurl【必须】追番 item 链接
    comic.comic_list.coverurl【必须】追番 item 的 cover
    likeobject【必须】关注偏好相关配置
    like.like_tipsstring【必须】关注偏好配置提示文字
    like.like_titlestring【必须】关注偏好配置标题
    like.like_bgurl【必须】关注偏好配置背景
    like.like_bottomstring【必须】关注偏好配置底部文字
    musicobject【必须】音乐偏好相关配置
    music.music_tipsstring【必须】音乐偏好提示性文字
    music.music_titlestring【必须】音乐偏好标题
    music.music_bgurl【必须】音乐偏好背景
    music.music_linkurl【必须】音乐偏好按钮链接
    reward_listobject【可选】打赏相关配置，如果不配置将没有打赏模块
    reward_list.namestring【必须】打赏 item 名称
    reward_list.amountnumber【必须】打赏 item 金额
    reward_list.datatimeDate【必须】打赏 item 时间
    reward_list.suffixstring/元【可选】打赏 item 后缀（默认元）
    extraboolean/false【必须】开发字段，表示额外模块内容可通过修改[blog]/themes/anzhiyu/layout/includes/anzhiyu/about-extra.pug自行开发，修改为 true 后会引入该 pug 内容。
  • 在[blog]/_config.anzhiyu.yml中开启LA.enable
    1
    2
    3
    4
    5
    # 51a统计配置
    LA:
      enable: true
      ck:
      LingQueMonitorID:
    如何获取ck和LingQueMonitorID
    • 进入51A统计官网，注册账号并登录 https://v6.51.la/
    • 进入51A应用管理面板 https://v6.51.la/user/application
    • 点击添加应用统计并填写好信息添加，应用名称随便填，统计域名就是你博客的域名，域名强匹配开启，行业类型随便选
    • 添加统计之后点击配置
    • 开启数据挂件功能
    • 在配置界面进入参数设置界面，点击统计代码→手动安装（通用）
    • 找到需要用的参数并复制，ck和LingQueMonitorID均一致

配置相册页面

  • 在博客根目录打开终端，输入
    1
    hexo new page album
  • 进入[blog]/source/tags/index.md文件
  • 修改该文件
    1
    2
    3
    4
    5
    6
    7
    ---
    title: 相册集
    date: 2022-10-23 15:57:51
    aside: false
    top_img: false
    type: "album"
    ---
  • 打开[blog]/_config.anzhiyu.yml，在菜单menu配置中开启相册，注意缩进
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    menu:
      # 文章:
      #   隧道: /archives/ || anzhiyu-icon-box-archive
      #   分类: /categories/ || anzhiyu-icon-shapes
      #   标签: /tags/ || anzhiyu-icon-tags

      # 友链:
      #   友人帐: /link/ || anzhiyu-icon-link
      #   朋友圈: /fcircle/ || anzhiyu-icon-artstation
      #   留言板: /comments/ || anzhiyu-icon-envelope

      我的:
      #   音乐馆: /music/?id=8606486756&server=tencent || anzhiyu-icon-music
      #   追番页: /bangumis/ || anzhiyu-icon-bilibili
        相册集: /album/ || anzhiyu-icon-images
      #   小空调: /air-conditioner/ || anzhiyu-icon-fan

      # 关于:
      #   关于本人: /about/ || anzhiyu-icon-paper-plane
      #   闲言碎语: /essay/ || anzhiyu-icon-lightbulb
      #   随便逛逛: javascript:toRandomPost() || anzhiyu-icon-shoe-prints1
  • 在[blog]/source/_data中新建albun.yml文件，没有这个文件夹的请新建
    添加以下代码
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    - class_name: 世界各地夕阳与风景
      path_name: /wordScenery
      type: 2
      description: 因为到不了世界各地，所以请网友们发来了各地的夕阳与风景🌇
      cover: https://image.anheyu.com/useruploads/108/2023/04/21/6442919bcc04e.jpg
      rowHeight: 220
      limit: 10
      lazyload: true
      btnLazyload: false
      url: false
      album_list:
        - date: 2022/10/31 06:30:00
          content: 傍晚时的天空
          address: 广东广州
          from: 依古比古
          image:
            - https://image.anheyu.com/useruploads/108/2023/04/05/642d29cbb3a23.jpg

    - class_name: 我的日常
      path_name: /dailyPhoto
      type: 1
      description: 这里存放的是有关我自己的一些沙雕生活与有趣的事情
      cover: https://image.anheyu.com/useruploads/108/2023/05/03/6451c2011fc5b.jpg
      album_list:
        - date: 2023/4/9 10:30:00
          content: 二刷铃芽之旅
          address: 广东南沙
          from: 辰风
          image:
            - https://image.anheyu.com/useruploads/108/2023/05/26/6470b849de414.jpg

    - class_name: 奇思妙想
      path_name: /fantasy
      type: 2
      description: 这里存放的是我的一些想象
      cover: https://image.anheyu.com/useruploads/108/2023/04/21/64429566d4a98.png
      rowHeight: 220
      limit: 10
      lazyload: true
      btnLazyload: false
      url: false
      album_list:
        - date: 2022/7/3 14:30:00
          content: 和虹夏去到沙滩玩力，虹夏可爱捏❤
          address: 广东恩平
          from: 辰风
          image:
            - https://image.anheyu.com/useruploads/108/2023/04/21/644295f4b8e76.png
    参数/值/解释
    参数备选值/类型解释
    class_namestring【必须】页面类
    path_nameurl【必须】当前相册路径
    typenumber【必须】当前相册页面样式类型
    descriptionstring【必须】当前相册描述
    coverurl【必须】当前相册 cover 图片
    rowHeightnumber【可选】仅当 type 为 2 时有效，当前相册 rowHeight
    limitnumber【可选】仅当 type 为 2 时有效，当前相册 一次懒加载的数量
    lazyloadboolean【可选】仅当 type 为 2 时有效，当前相册 lazyload 是否开启懒加载，默认懒加载为滚动懒加载，type 为 1 时懒加载不可关闭
    btnLazyloadboolean【可选】仅当 type 为 2 且 lazyload 开启 时有效，当前相册 lazyload 懒加载的方式，默认为滚动懒加载，开启本选项后为按钮点击懒加载
    album_listlist【必须】当前相册内图片列表
    urlurl【可选】仅当 type 为 2 时有效，可以加载远程的 json 数据
    album_list.datedate【必须】当前图片创建时间
    album_list.contentstring【必须】当前图片描述内容
    album_list.imagelist【必须】当前图片集，可以多张
    album_list.fromstring【可选】当前图片的创建人，未填写则不显示
    album_list.addressstring【必须】当前图片地址
  • 由于相册页面需要很多的 page，所以在写数据的时候自行写入路径path_name，示例数据中有两个path_name，所以需要再创建两个页面
    1
    2
    hexo new page dailyPhoto
    hexo new page wordScenery
  • [blog]/source/dailyPhoto/index.md和[blog]/source/wordScenery/index.md为相册集详细页
    分别添加以下内容
    1
    2
    3
    4
    5
    6
    7
    ---
    title: 日常生活
    date: 2022-10-23 15:57:51
    aside: false
    top_img: false
    type: "album_detail"
    ---
    1
    2
    3
    4
    5
    6
    7
    ---
    title: 日常生活
    date: 2022-10-23 15:57:51
    aside: false
    top_img: false
    type: "album_detail"
    ---
    远程加载json示例数据
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    [
      {
        "url": "https://cdn.chuqis.com/gh/jerryc127/CDN/img/IMG_0556.jpg",
        "alt": "IMG_0556.jpg",
        "title": "这是title"
      },
      {
        "url": "https://cdn.chuqis.com/gh/jerryc127/CDN/img/IMG_0472.jpg",
        "alt": "IMG_0472.jpg"
      },
      {
        "url": "https://cdn.chuqis.com/gh/jerryc127/CDN/img/IMG_0453.jpg",
        "alt": ""
      },
      {
        "url": "https://cdn.chuqis.com/gh/jerryc127/CDN/img/IMG_0931.jpg",
        "alt": ""
      }
    ]

朋友圈页面配置

后端部署

原项目
原项目文档：https://github.com/Rock-Candy-Tea/hexo-circle-of-friends
原项目文档：https://fcircle-doc.yyyzyyyz.cn/
博主教程
https://chenfengblog.eu.org/posts/5ca5.html

  • 在博客根目录打开终端，输入
    1
    hexo new page fcircle
  • 打开[blog]/source/fcircle/index.md
  • 添加type: 'fcircle'
    1
    2
    3
    4
    5
    6
    7
    8
    ---
    title: 朋友圈
    date: 2022-11-21 17:06:17
    comments: false
    aside: false
    top_img: false
    type: "fcircle"
    ---
  • 主题配置文件中开启menu中友链和朋友圈的注释，导航栏朋友圈，注意缩进！！！
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    menu:
      # 文章:
      #   隧道: /archives/ || anzhiyu-icon-box-archive
      #   分类: /categories/ || anzhiyu-icon-shapes
      #   标签: /tags/ || anzhiyu-icon-tags

      友链:
        #   友人帐: /link/ || anzhiyu-icon-link
        朋友圈: /fcircle/ || anzhiyu-icon-artstation
        #   留言板: /comments/ || anzhiyu-icon-envelope

      # 我的:
      #   音乐馆: /music/ || anzhiyu-icon-music
      #   追番页: /bangumis/ || anzhiyu-icon-bilibili
      #   相册集: /album/ || anzhiyu-icon-images
      #   小空调: /air-conditioner/ || anzhiyu-icon-fan

      关于:
        #   关于本人: /about/ || anzhiyu-icon-paper-plane
        闲言碎语: /essay/ || anzhiyu-icon-lightbulb
        #   随便逛逛: javascript:toRandomPost() || anzhiyu-icon-shoe-prints1
  • 在[blog]/_config.anzhiyu.yml中开启friends_vue.enable，自行设置朋友圈后端地址和顶部模块背景，注意缩进！
    1
    2
    3
    4
    5
    6
    # 朋友圈配置
    friends_vue:
      enable: true
      vue_js: /js/fcircle.js
      apiurl: https://friend.chenfengblog.eu.org/ # 朋友圈后端地址
      top_background: https://image.anheyu.com/useruploads/108/2023/04/02/64285e4a2b8db.png
    参数 备选值/类型 解释
    enable boolean 【必须】是否启用
    vue_js url 【必须】朋友圈前端构建后的url
    apiurl string 【必须】朋友圈后端url
    top_background url 【可选】朋友圈顶部背景图