For more inclusive and accessible Internet.
- Add
jump-after-toc.jsto/static/js - Add
jump-after-toc.cssto/static/css - Use your preferred way to refer to these two files
- Add the following code directly under
<body>:
<section class="a11y-links">
<button class="a11y-links__link" tabindex="0" onclick="jumpAfterTOC()">Skip to main content</button>
</section>This is what I use (all reference files are in this repo):
In baseof.html, after <footer>, add:
{{ range .Site.Params.customJS }}
<script async src="{{ . | relURL }}"></script>
{{ end }}In the end of head.html, add:
{{ range .Site.Params.customCSS }}
<link rel="stylesheet" href="{{ . | relURL }}">
{{ end }}In config.yaml, under params, add:
params:
customCSS: ["/css/jump-after-toc.css"]
customJS: ["js/jump-after-toc.js"]
… (other params)