Hugo教程#5遍历页面

简介: 前面几期视频学习了一些布局和模板语法,其实`Hugo`的最终用法就是来写个人博客,需要遍历出所有的博客来呈现在网站的主页,Markdown文件都会创建一个页面,所以只需要把每个页面的地址遍历出来就行了

首发于Enaium的个人博客


引言

前面几期视频学习了一些布局和模板语法,其实Hugo的最终用法就是来写个人博客,需要遍历出所有的博客来呈现在网站的主页,Markdown文件都会创建一个页面,所以只需要把每个页面的地址遍历出来就行了

创建页面

首先在content/post创建多个页面,以此类推创建4个页面

# Post1

布局

因为要使用模板语法来遍历出这些页面,所以这里选择修改主页布局,使用with将当前目录改为/post,接着使用range来遍历.Pages,Title就是每个页面的标题,Permalink就是路径

{
  { with .Site.GetPage "/post" }}
    {
  { range .Pages }}
        <p><a href="{
    { .Permalink }}">{
  { .Title }}</a></p>
    {
  { end }}
{
  { end }}
目录
相关文章
|
2月前
|
自然语言处理 JavaScript 网络协议
简单使用vitepress快速搭建一个文档网站
VitePress 是一个静态站点生成器 (SSG),类似的项目有docsify、VuePress、hexo。用 Markdown 编写的内容生成可以轻松部署到任何地方的静态 HTML 页。
44 9
文本,vitepress的使用,vitepress的参考文档,自定义主页,从创建package之后的资料,底部命令的创建
文本,vitepress的使用,vitepress的参考文档,自定义主页,从创建package之后的资料,底部命令的创建
|
6月前
【最全最详细】publiccms其他常用代码片段(内容、站点)
【最全最详细】publiccms其他常用代码片段(内容、站点)
|
6月前
【最全最详细】publiccms常用的代码片段
【最全最详细】publiccms常用的代码片段
Hugo 网站优化(1): 渲染 Markdown 图片引用地址
搭建一个自己的博客系统, 优化图片展示, 让书写更简单
462 0
Hugo 网站优化(1): 渲染 Markdown 图片引用地址
|
JavaScript 前端开发
WebApi入门第二章(获取操作页面元素)
WebApi入门第二章(获取操作页面元素)
119 0
WebApi入门第二章(获取操作页面元素)
|
中间件 iOS开发
Axure实战12:创建一个GuidePage引导页示例
Axure实战12:创建一个GuidePage引导页示例
336 0
Axure实战12:创建一个GuidePage引导页示例
|
PHP
WordPress调用置顶文章代码教程
WordPress调用置顶文章是常用的调用代码,码笔记分享WordPress调用置顶文章代码: WP调用置顶文章代码 以下代码为调用5篇置顶文章: <?php $sticky = get_option('sticky_posts'); rsort( $sticky ); $sticky = arr...
1039 0