How to create "Edit on Github" links, while disturbing the theme as little as possible?

support
1

Context: I’m making a collaborative polyglot multilingual programming cookbook.

What would be the least invasive way to add a dynamic link in the header or somewhere for most pages: along the lines of “edit this page” or “edit on GitHub”?

One hacky way to do it (what I’m doing now) is to create a shortcode and then add it as boilerplate to every page. But I’d actually like the link to appear up in a top nav or in a sidebar, or maybe in the top right page corner, etc. And of course, not have redundant code like that.

I recognize that I might need to do a little theme-specific overriding. Currently I’m using ananke, recommended by the tutorial.

2

You can do that with different ways, for example:

  • add a repository parameter in your config:
[params]
  repository = "https://github.com/group/repo"

You have to change both “group” and “repo” in this URL.

  • add this line in your template(s):
<a href="{{ .Site.Params.repository }}/edit/main/content/{{ .File.Path }}">Edit this page</a>

As you can see, /edit/main/ depend on GitHub and on the name of your main branch. And content is the folder of your content. You must tweak it to suit the template.

3

https://discourse.gohugo.io/t/hugo-v0-112-0-new-template-functions/44512

See the “practical example” about halfway down the page.

4

Ho very interesting!

5

Thanks! Hugo’s inspiring. Incredibly easy to use.

I’m making a radically multi-lingual open source book. AI for the rote labor of initial drafts, and then open source contributions over time to edit and improve it. So kind of a hybrid AI+Human endeavor.

And personally, I’ve always liked “cookbook”-style books the best.

6

Coming back to add a note that this is built in to the Hextra theme.

Page Edit Link