htmlgithubgithub-pages

How to Remove `.html` Extension from URLs on a Static Site Hosted on GitHub Pages?


Having a static website on GitHub Pages with a custom domain, and I am looking for URL structure help. I want my URLs to eliminate .html extension. For instance, I want example.com/example.html to be accessed as example.com/example.

Here is the explanation of my setup and limitations:

1.Custom Domain: I use my own domain not the default .github.io and I do not think it may affect the URL structure.

2.No .htaccess Support: GitHub Pages do not support .htaccess files and I encounter errors when I try using one.

3.No Jekyll: I have developed the site without Jekyll and prefer not changing to that because of code changes issues and impact on SEO.

4.Multiple subcategories: The site has many subcategories so just renaming folders will not work.

Therefore what are best practices or techniques to remove an html extension from URLs in GitHub Pages without compromising SEO or drastically changing my existing setup?

Using .htaccess Files: I attempted to use .htaccess files for URL rewriting but ran into errors. Since GitHub Pages does not support .htaccess, this approach is not viable. Modifying File Names: I considered renaming files and folders to remove .html, but this approach is impractical due to the site's complex structure with multiple subcategories. GitHub Pages Configuration: I explored GitHub Pages settings and configuration options, but found no support for URL rewriting or removing .html extensions directly. Custom Domain Setup: I checked my custom domain setup to ensure it was not interfering with URL structure but confirmed it is not the source of the problem. Given these constraints and the approaches I’ve already tried, what are the best practices or methods to remove the .html extension from URLs on GitHub Pages without compromising SEO or requiring major changes to my existing setup?

ive also tried using https://rsp.github.io/gh-pages-no-extension/, but it no longer works for me. For instance, https://rsp.github.io/gh-pages-no-extension/test1 works, but https://rsp.github.io/gh-pages-no-extension/index does not, whereas https://rsp.github.io/gh-pages-no-extension/index.html does. This indicates that while some parts of the resource work, others do not.


Solution

  • The simplest method, which doesn't require any configuration changes or the use of Jekyll, is to simply link to your pages without the .html extension in your HTML files. For instance, if you have about.html, you would link to it as <a href="/about">About</a>. GitHub Pages will automatically serve about.html when someone visits /about. This method works because GitHub Pages inherently supports serving HTML files without the extension in the URL, provided the file exists.