CODEWITHSUNDEEP
hugo
AJcodez
AJcodez

Reputation: 34236

How to add a new hugo static page?

From the "getting started" section it seems this should work, but it doesn't.

hugo new site my-site
hugo new privacy.md
hugo server --watch --includeDrafts

curl -L localhost:1313/privacy/index.html
# 404 page not found
curl -L localhost:1313/privacy.html
# 404 page not found
curl -L localhost:1313/privacy/
# 404 page not found

How can I add a new page?

Upvotes: 46

Views: 69698

Answers (5)

bep
bep

Reputation: 1737

Just tested OK with this on Hugo 0.13:

hugo new site my-site
cd my-site
hugo new privacy.md
hugo server -w -D
curl -L localhost:1313/privacy/

Note: You have to either use a theme or provide your own layout template to get something more than a blank page. And of course, some Markdown in privacy.md would also make it even nicer.

See http://gohugo.io/overview/introduction for up-to-date documentation.

Upvotes: 25

Vidhya
Vidhya

Reputation: 371

Make you have some default frontmatter set in archetypes/default.md

# archetypes/default.md
+++
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
draft: true
+++

And the single layout in layouts/_default/single.html to render some variable or content

# tags to render markdown content
<h1>{{ .Title }}</h1>
<p>{{ .Content }}</p>
<span>{{ .Params.date }}</span>

Now type hugo new privacy.md which will create a new page on the following directory in content/privacy.md

Upvotes: 4

Michael
Michael

Reputation: 325

Take "About" as example:

# will create content/about.md
hugo new about.md

Edit about.md and add the last 2 lines, the metadata/front matter looks like:

title: "About"
date: 2019-03-26
menu: "main"
weight: 50

That should work.

Upvotes: 3

Balkrishna
Balkrishna

Reputation: 3063

I had a similar requirement, to add static page (aboutus in this case). Following steps did the trick,

  • Created an empty file content/aboutus/_index.md
  • Created aboutus.html page layouts/section/aboutus.html

Upvotes: 14

revelt
revelt

Reputation: 2420

This is the best tutorial how to create static "landing pages" on Hugo: https://discuss.gohugo.io/t/creating-static-content-that-uses-partials/265/19?u=royston

Basically, you create .md in /content/ with type: "page" in front matter, then create custom layout for it, for example layout: "simple-static" in front matter, then create the layout template in themes/<name>/layouts/page/, for example, simple-static.html. Then, use all partials as usual, and call content from original .md file using {{ .Content }}.

All my static (landing) pages are using this method.

By the way, I'm not using hugo new, I just clone .md file or copy a template into /content/ and open it using my iA Writer text editor. But I'm not using Hugo server either, adapted npm-build-boilerplate is running the server and builds.

Upvotes: 47

Related Questions