A New Blog, Part 11

404 Page in Hexo for GitHub Pages

Provide an error page automatically when resource not found

As this blog is a static one, generated by Hexo and hostet at GitHub, the page which was shown, when a user enters an Url which points to nowhere, was the default GitHub 404 page.

GitHub 404 Page

Not optimal and should be solved by an own Hexo page, because GitHub Pages allows you to deliver a custom 404 page by creating simply a 404.html in the root of the website.

As you can create separate pages in Hexo, this is done quickly by:

1
hexo new page "404"

It generates a new folder named 404 in your source folder, where a index.md is placed. In this file you can enter the text as Markdown you want to show to the user, in case of a 404 error (page not found) occurs.

On generating the static files by hexo generate, a subfolder 404 with a index.html will be created, which doesn’t really work with GitHub Pages, because it needs a 404.htm in the root.

You can fix this, by defining the permalink in the Frontmatter of your page:

1
2
3
4
---
title: 404
permalink: /404.html
---

Example … click here: https://kiko.io/no-page-here

Related

Comments