CODEWITHSUNDEEP
hugo
maximusdooku
maximusdooku

Reputation: 5522

Why is Hugo serving blank pages?

I am building a personal website using Hugo Static Page Generator, but when I do hugo serve, I am no longer seeing a page, but simply a blank page at localhost:1313.

I deleted everything and did a fresh install. But still, Hugo is serving blank pages.

In the blank page, I see the Favicon of the previous site draft I had, even though I deleted everything from the previous theme. I cleared the browser in Chrome and tried a different browser too, but it's still not working.

Not sure what information I can provide, as there are no error messages. How can I fix this?

Upvotes: 31

Views: 18391

Answers (5)

Arun Ramachandran
Arun Ramachandran

Reputation: 1372

It could be potentially an issue with the config.toml in the Hugo project directory.

I recently ran into a similar issue where I was seeing only a blank page while trying to create a custom theme with the Hugo and all you have to do is tell Hugo where to find your initial HTML page to render on the browser.

If you are trying to install a theme OR creating a custom theme, go to config.toml in the base directory and specify the theme name as given below:

theme = "${theme_name}"

If you are using the default/custom theme, the theme name will be same as the folder name under themes folder in the project directory.

Upvotes: 0

Seyed Morteza Mousavi
Seyed Morteza Mousavi

Reputation: 6963

I had the same problem when I cloned my blog from Github but didn't include themes submodules. Including submodules solved my problem:

git clone --recurse-submodules https://github.com/username/your-blog

Upvotes: 5

jediz
jediz

Reputation: 4717

The problem is likely to be the theme - it is either missing or broken. Hugo does not come with any default/fallback theme if you fail to provide a working one.

Debugging guide:

  1. Check the themes folder, and follow the quickstart.
  2. Try using another, simpler theme.
  3. It may only be a question of configuring the theme, you may read the hugo theme documentation too.

Upvotes: 29

surfmuggle
surfmuggle

Reputation: 5944

I ran into the same issue after following the hugo getting-started / quickstart guide but instead of using an existing theme i created a very basic theme:

  1. Install hugo i picked install hugo on windows
  2. Create a New Site hugo new site quickstart
  3. Add a Theme
    • cloning a theme (for example the ananke-theme ) is easier <-- this is what the quickstart does and what i left out
    • instead you can create a theme with hugo new theme [your-theme-name] which adds a theme skeleton inside your site-folder for example C:\Hugo\Sites\example.com (see the screenshot)
  4. Add Some Content hugo new posts/my-first-post.md
  5. Start the server hugo server -D --watch --verbose

Hugo_myFirstTheme_files_folders

After you created a theme files and folders should be under Sites/example.com/themes/your-theme-name/. Since most of the generated files are (nearly) empty you have to edit a few of them before the quickstart sample is working.

Based on develop a Theme for Hugo i edited /themes/your-theme-name/layouts/index.html 

<!DOCTYPE html>
<html> <body>    
    {{ range first 10 .Data.Pages }}        
         <h1>{{ .Title }}</h1>
         <div>{{- .Content -}}</div>
    {{ end }}      
</body> </html>

Basic information about hugo taken from develop a Theme for Hugo

  • Hugo configuration files (TOML, YAML or JSON) are located in the root of your site
  • Hugo default: Markdown inside content/,
    • content files contain metadata (frontmatter) and text (/markdown) --> html to public/,
    • example frontmatter attributes: date, title, description, categories, tags

  • templates under themes/ (or layouts/)

    • three types of templates: single, list, partials
    • theme templates under /themes/your-theme-name/ and then under /layouts/ for index.html and under /layouts/_default/list.html and /layouts/_default/single.html

  • HTML files will be written to the public/ directory.

You may want to read the hugo theme documentation.

Upvotes: 7

bhar1red
bhar1red

Reputation: 469

Please verify your config.toml file points to right theme.

If following Quick start tutorial, you might have forgot to run

echo 'theme = "ananke"' >> config.toml

Upvotes: 10

Related Questions