Fix GitHub Pages deployment with correct path prefix

Configures Eleventy to use the /qmk_userspace/ path prefix for GitHub Pages
deployment since the site is hosted at nelstrom.github.io/qmk_userspace/
instead of the root domain.

Changes:
- Add pathPrefix: "/qmk_userspace/" to .eleventy.js config
- Update all href and src attributes to use Eleventy's url filter
- Navigation links: / becomes {{ '/' | url }}
- CSS link: /public/css/theme.css becomes {{ '/public/css/theme.css' | url }}
- SVG paths: Use url filter for SVG diagram references
- Keymap links: Dynamically build paths with url filter

This ensures all assets and links work correctly when deployed to GitHub Pages
under a subdirectory path.
This commit is contained in:
Drew Neil 2026-01-04 23:07:46 +00:00
commit 4d8d98e866
4 changed files with 8 additions and 7 deletions

View file

@ -64,6 +64,7 @@ module.exports = function(eleventyConfig) {
},
templateFormats: ["njk", "md", "html"],
htmlTemplateEngine: "njk",
markdownTemplateEngine: "njk"
markdownTemplateEngine: "njk",
pathPrefix: "/qmk_userspace/"
};
};

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ title }} | QMK Keymap Documentation</title>
<link rel="stylesheet" href="/public/css/theme.css">
<link rel="stylesheet" href="{{ '/public/css/theme.css' | url }}">
<style>
* {
box-sizing: border-box;
@ -191,7 +191,7 @@
<header>
<h1>QMK Keymap Documentation</h1>
<nav>
<a href="/">Home</a>
<a href="{{ '/' | url }}">Home</a>
</nav>
</header>

View file

@ -15,7 +15,7 @@ title: Home
<h3>{{ keymap.keyboard }}</h3>
<p><strong>Keymap:</strong> {{ keymap.keymapName }}</p>
<a href="/keymaps/{{ keymap.id }}/index.html" class="button">View Keymap Documentation</a>
<a href="{{ ('/keymaps/' + keymap.id + '/') | url }}" class="button">View Keymap Documentation</a>
<div class="stats">
<p>

View file

@ -18,7 +18,7 @@ eleventyComputed:
<nav style="margin: 2rem 0;">
<a href="#diagrams" class="button">Layer Diagrams</a>
<a href="#symbols" class="button">Symbol Index</a>
<a href="/" class="button secondary">← Back to Home</a>
<a href="{{ '/' | url }}" class="button secondary">← Back to Home</a>
</nav>
<section id="diagrams" class="layer-diagrams">
@ -30,8 +30,8 @@ eleventyComputed:
{% set svgPath = keymap.svgPaths | find('name', layer.name) %}
{% if svgPath %}
<div class="svg-container">
<object data="{{ svgPath.path }}" type="image/svg+xml" style="width: 100%; max-width: 1200px;">
<img src="{{ svgPath.path }}" alt="{{ layer.name }} layer diagram" />
<object data="{{ svgPath.path | url }}" type="image/svg+xml" style="width: 100%; max-width: 1200px;">
<img src="{{ svgPath.path | url }}" alt="{{ layer.name }} layer diagram" />
</object>
</div>
{% else %}