hugo-teek is loading...

首页配置

最后更新于:

首页配置

docs目录下的index.mdREADME.md的 front matter 指定 home: true,就会为你的站点生成一个首页,示例:

 1---
 2home: true
 3# heroImage: /img/web.png
 4heroText: Evan's blog
 5tagline: Web前端技术博客,积跬步以至千里,致敬每个爱学习的你。
 6# actionText: 立刻进入 →
 7# actionLink: /web/
 8# bannerBg: auto # auto => 网格纹背景(有bodyBgImg时无背景),默认 | none => 无 | '大图地址' | background: 自定义背景样式       提示:如发现文本颜色不适应你的背景时可以到palette.styl修改$bannerTextColor变量
 9
10features: # 可选的
11  - title: 前端
12    details: JavaScript、ES6、Vue框架等前端技术
13    link: /web/ # 可选
14    imgUrl: /img/web.png # 可选
15  - title: 页面
16    details: html(5)/css(3),前端页面相关技术
17    link: /ui/
18    imgUrl: /img/ui.png
19  - title: 技术
20    details: 技术文档、教程、技巧、总结等文章
21    link: /technology/
22    imgUrl: /img/other.png
23
24# 文章列表显示方式: detailed 默认,显示详细版文章列表(包括作者、分类、标签、摘要、分页等)| simple => 显示简约版文章列表(仅标题和日期)| none 不显示文章列表
25# postList: detailed
26# simplePostListLength: 10 # 简约版文章列表显示的文章数量,默认10。(仅在postList设置为simple时生效)
27# hideRightBar: true # 是否隐藏右侧边栏 (v1.11.2+)
28---

一些字段还是沿用默认主题 (opens new window)的,这里只对修改的地方做一个补充。

bannerBg

  • 类型:string
  • 可选参数:
    • auto 自动背景,一般会显示网格纹背景,如果在config.js设置了bodyBgImg时则无背景
    • none 无背景
    • <大图地址>,如/img/bg.jpeg
    • background: <自定义背景样式>,如background: blue
  • 默认: auto

features

  • 类型:{title: string, details: string, link?: string, imgUrl?: string}[]

features是在banner栏显示的特性描述,主题添加了图片的展示和点击跳转的链接

  • features[index].link 当前feature跳转的链接,可选
  • features[index].imgUrl 当前feature的图片地址,可选

postList

  • 类型:'detailed' | 'simple' | 'none'
  • 可选参数:
    • detailed 显示详细版文章列表(包括标题、日期、作者、分类、标签、摘要、分页等)
    • simple 显示简约版文章列表(仅标题和日期)
    • none 不显示文章列表
  • 默认: detailed

首页内容中的文章列表显示方式

simplePostListLength v1.5.1 +

  • 类型:number
  • 默认: 10

简约版文章列表显示的文章数量,默认10。(仅在postList设置为simple时生效)

hideRightBar v1.11.2 +

  • 类型:boolean
  • 默认: false

是否隐藏右侧边栏

注意

原默认主题首页的footer字段已改到config.js文件里设置

推荐使用微信支付
微信支付二维码
推荐使用支付宝
支付宝二维码
最新文章

文档导航