30

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?

Jack Taylor
  • 5,588
  • 19
  • 35
maximusdooku
  • 5,242
  • 10
  • 54
  • 94
  • 1
    Have you set the theme in your `config.toml` file? Is the theme name in your `config.toml` the same has the folder name you have in the `themes/` folder? It might help if you post the contents of your `config.toml` file here. – Jack Taylor Apr 22 '17 at 07:41
  • I had the same problem and it was all about the template – jediz Apr 29 '17 at 09:22

5 Answers5

25

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.
surfmuggle
  • 5,527
  • 7
  • 48
  • 77
jediz
  • 4,459
  • 5
  • 36
  • 41
  • 1
    Yes, this sounds like the cause. @maximumdooku What theme are you using? It probably needs fixing on GitHub, so if you let us know then someone can fix it for you. – Jack Taylor Apr 30 '17 at 00:44
10

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
bhar1red
  • 440
  • 3
  • 10
6

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.

surfmuggle
  • 5,527
  • 7
  • 48
  • 77
5

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
Seyed Morteza Mousavi
  • 6,855
  • 8
  • 43
  • 69
  • if you already cloned your repo but not the submodules, use the command `git submodule update --init` – netotz Feb 22 '22 at 20:20
0

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.

Arun Ramachandran
  • 1,270
  • 5
  • 23
  • 36