视频加载失败

相册页面配置

869 字
4 分钟
相册页面配置
2025-01-23
Hexo
Hexo
/
安知鱼
浏览量加载中...

相册页面配置#

  1. 前往你的 Hexo 博客的根目录

  2. 在 Hexo 博客根目录 [blog]下打开终端，输入

Terminal window
hexo new page album

  1. 你会找到 source/album/index.md 这个文件

  2. 修改这个文件： 记得添加 type: "album"

---
title: 相册集
date: 2022-10-23 15:57:51
aside: false
top_img: false
type: "album"
---
  1. 主题配置文件中开启menu中我的和相册集的注释，注意缩进！！！
menu:
# 文章:
#   隧道: /archives/ || icon-box-archive
#   分类: /categories/ || icon-shapes
#   标签: /tags/ || icon-tags


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


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


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

新建文件[blog]\source\_data\album.yml,没有_data文件夹的话也请自己新建。打开[blog]\source\_data\album.yml，输入：

- class_name: 世界各地夕阳与风景
    path_name: /wordScenery
    type: 2
    description: 因为到不了世界各地，所以请网友们发来了各地的夕阳与风景🌇。
    cover: https://upload-bbs.miyoushe.com/upload/2025/06/13/125766904/2cf2b6aea07bba089d0d17c4fea72d1b_5366629137934368264.png
    top_background: https://bu.dusays.com/2023/06/30/649e546ada7dd.webp
    rowHeight: 220
    limit: 10
    lazyload: true
    btnLazyload: false
    url: false
    top_link: /album
    top_btn_text: 返回
    album_list:
        - date: 2022/10/26 01:00:00
        content: 湘潭的一角。
        address: 湖南湘潭
        from: 再吃一口就减肥
        image:
            - https://bu.dusays.com/2023/04/09/64329399db122.webp
        - date: 2022-10-25
        content: 洛阳暴雨后的天空。
        address: 河南洛阳
        from: 紫菜卷
        image:
            - https://bu.dusays.com/2023/04/09/64329399db122.webp
            - https://bu.dusays.com/2023/04/09/64329399db2e1.webp


- class_name: 我的日常
    path_name: /dailyPhoto
    type: 1
    description: 这里存放的是有关我自己的一些沙雕生活与有趣的事情。
    top_link: /album
    top_btn_text: 返回
    top_background: https://bu.dusays.com/2023/04/09/64329399cea5a.webp
    cover: https://bu.dusays.com/2023/04/09/64329399cea5a.webp
    album_list:
        - date: 2022-10-24
        content: 老妹的画
        image:
            - https://bu.dusays.com/2023/04/09/643293997b92b.jpeg
参数备选值/类型解释
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【必须】当前图片地址
Warning

注意示例数据中的图片不保证可用性。

由于相册页面需要很多的 page，所以在写数据的时候自行写入路径path_name，示例数据中有两个path_name，所以需要再创建两个页面

注意新建的页面必须与path_name一致。

Terminal window
hexo new page dailyPhoto
hexo new page wordScenery

你会找到 source/dailyPhoto/index.md 和source/wordScenery/index.md两个文件，这两个为相册集详情页

然后内容为以下内容, 需在详情页加上type: "album_detail"

---
title: 日常生活
date: 2022-10-23 15:57:51
aside: false
top_img: false
type: "album_detail"
---
---
title: 世界各地风景
date: 2022-10-23 15:57:51
aside: false
top_img: false
type: "album_detail"
---

远程加载json示例数据

[
  {
    "url": "https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/IMG_0556.jpg",
    "alt": "IMG_0556.jpg",
    "title": "这是title"
  },
  {
    "url": "https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/IMG_0472.jpg",
    "alt": "IMG_0472.jpg"
  },
  {
    "url": "https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/IMG_0453.jpg",
    "alt": ""
  },
  {
    "url": "https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/IMG_0931.jpg",
    "alt": ""
  }
]

相册页
相册页

相册页
相册页

相册页
相册页

支持与分享

如果这篇文章对你有帮助，欢迎分享给更多人或打赏支持！

打赏
相册页面配置
https://blog.huhaha.vip/posts/9389626e/
作者
小王的博客
发布于
2025-01-23
许可协议
CC BY-NC-SA 4.0
额外配置
分类页配置
相关文章智能推荐
1
404页面配置
Hexo如果能给我一个star那将是对我莫大的鼓励。使用这个主题之前，你应该明白它是一个 Hexo 主题，它的基本逻辑离不开 Hexo，关于如何新建分类，如何新建标签这些问题应该在使用之前就从互联网或官方文档了解详情 🔎。安知鱼主题 是基于 Hexo 的一款 简单、美丽 的主题，由 安知鱼 负责开发与维护。
2
关于页面配置
Hexo如果能给我一个star那将是对我莫大的鼓励。使用这个主题之前，你应该明白它是一个 Hexo 主题，它的基本逻辑离不开 Hexo，关于如何新建分类，如何新建标签这些问题应该在使用之前就从互联网或官方文档了解详情 🔎。安知鱼主题 是基于 Hexo 的一款 简单、美丽 的主题，由 安知鱼 负责开发与维护。
3
我的装备页面配置
Hexo如果能给我一个star那将是对我莫大的鼓励。使用这个主题之前，你应该明白它是一个 Hexo 主题，它的基本逻辑离不开 Hexo，关于如何新建分类，如何新建标签这些问题应该在使用之前就从互联网或官方文档了解详情 🔎。安知鱼主题 是基于 Hexo 的一款 简单、美丽 的主题，由 安知鱼 负责开发与维护。
4
朋友圈页面配置
Hexo如果能给我一个star那将是对我莫大的鼓励。使用这个主题之前，你应该明白它是一个 Hexo 主题，它的基本逻辑离不开 Hexo，关于如何新建分类，如何新建标签这些问题应该在使用之前就从互联网或官方文档了解详情 🔎。安知鱼主题 是基于 Hexo 的一款 简单、美丽 的主题，由 安知鱼 负责开发与维护。
5
追番页面配置
Hexo如果能给我一个star那将是对我莫大的鼓励。使用这个主题之前，你应该明白它是一个 Hexo 主题，它的基本逻辑离不开 Hexo，关于如何新建分类，如何新建标签这些问题应该在使用之前就从互联网或官方文档了解详情 🔎。安知鱼主题 是基于 Hexo 的一款 简单、美丽 的主题，由 安知鱼 负责开发与维护。
随机文章随机推荐

评论区

分享你的想法，与大家交流讨论

Profile Image of the Author
小王的博客
一个上了年纪的猿人.
分类
标签
更多
最新动态
站点统计
文章
209
分类
15
标签
161
总字数
478,322
运行时长
0 天
最后活动
0 天前
站点信息
构建平台
Vercel
博客版本
Firefly v6.16.7
文章许可
CC BY-NC-SA 4.0
© 2026小王的博客. All Rights Reserved.RSSSitemap
Powered byAstroFirefly
文章目录
1
相册页面配置