You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何用Markdown在Hugo中创建根路径首页(非首页文章)

解决Hugo根路径首页自定义内容的问题

我来给你几个实用的解决办法,完美匹配你的需求:

方法一:直接在模板里写Markdown并渲染

你可以利用Hugo的{{ .RenderString }}函数,在自定义的layouts/index.html里直接写Markdown内容,它会自动帮你转换成HTML。修改后的模板代码如下:

{{ define "main" }}
  {{ partial "header.html" . }}
  <section class="main">
    {{ .RenderString }}
    # 我的自定义首页标题
    这是一段**加粗显示**的正文内容,还能轻松添加列表:
    - 首页特色功能1
    - 首页特色功能2
    甚至可以插入图片或者链接,完全用Markdown语法就行!
  </section>
  {{ partial "footer.html" . }}
{{ end }}

这个方法的好处是快速直接,不用额外创建文件,适合内容不多的首页。

方法二:用单独的Markdown文件管理首页内容(推荐)

如果你想把内容和模板分离,编辑起来更方便,那可以在content目录下创建_index.md(注意是下划线开头的文件名!),这个文件对应的就是根路径的首页,不会生成/home路径的页面。

首先创建content/_index.md,内容示例:

---
title: "我的首页"
draft: false
---

# 欢迎来到我的网站
这里是用Markdown写的首页内容,**排版自由**,还能添加各种格式:

- 最新文章推荐
- 关于我
- 联系方式

然后修改你的layouts/index.html,只需要读取这个文件的解析后内容就行:

{{ define "main" }}
  {{ partial "header.html" . }}
  <section class="main">
    {{ .Content }}
  </section>
  {{ partial "footer.html" . }}
{{ end }}

这样每次修改首页内容,只需要编辑_index.md,不用碰模板文件,维护起来更省心,也是Hugo推荐的首页内容管理方式。

方法三:用Shortcode复用内容(适合需要重复使用的场景)

如果这段首页内容你还想在其他地方复用,那可以用Shortcode。先在layouts/shortcodes目录下创建home-content.html,里面写你的内容(可以是Markdown或者HTML):

# 首页标题
这是复用的**首页内容**,支持Markdown语法

然后在layouts/index.html里调用这个Shortcode:

{{ define "main" }}
  {{ partial "header.html" . }}
  <section class="main">
    {{< home-content >}}
  </section>
  {{ partial "footer.html" . }}
{{ end }}

不过这个方法相对前两个有点繁琐,除非有复用需求,否则没必要特意用它。

另外要提醒你,你用的hugo-nuo主题,自定义layouts/index.html确实会覆盖主题的默认首页模板,所以上面的方法都能正常生效。

内容的提问来源于stack exchange,提问作者Michael

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.27 07:23:39