Add "edit this page" link

[noxilixon]

This resolves #132

[github-actions]

This is a link to a preview of the website from this Pull Request: https://freifunk.dev/edit-git/.

[Noki]

I like the functionality, but we should not make this a <a href>-link that could be discovered and followed by search engines. I propose that we mask this link e.g. by using a span with an onclick event and a data attribute:

<span class="px-2" 
      data-url="{{ $Site.Params.editURL }}{{ replace .Dir "\\" "/" }}{{ .LogicalName }}" 
      onclick="window.open(this.getAttribute('data-url'), '_blank');">
    {{"Edit this page"}}
</span>

[nicolasberens]

the onlick is dirts and might not work with opening in a new tab or with javascript deactivated.

Wouldn't a rel=”nofollow” suffice?

[Noki]

the onlick is dirts and might not work with opening in a new tab or with javascript deactivated.

Without JavaScript the Freifunk website does not fully work either (e.g. language switcher) and editing at GitHub also requires JavaScript. Without it the content and edit form is not even visible.

Wouldn't a rel=”nofollow” suffice?

The idea behind masking the link is to reduce the number of outgoing links and prevent PageRank from beeing assigned to those links so the remaining internal links will be stronger. nofollow does not do that. With nofollow there will still be PageRank assigned to the links but the PageRank will not be passed on to the target pages. Compared to masking the links nofollow would therefore weaken the site.

We can however just use JavaScript to create the link so it will only become visible when it would also be usable:

<span id="edit-page-link" class="px-2" 
      data-url="{{ $Site.Params.editURL }}{{ replace .Dir "\\" "/" }}{{ .LogicalName }}">
</span>
<script>
document.addEventListener("DOMContentLoaded", function() {
    var editLink = document.getElementById('edit-page-link');
    if (editLink) {
        var url = editLink.getAttribute('data-url');
        editLink.innerText = "Edit this page";
        editLink.onclick = function() {
            window.open(url, '_blank');
        };
    }
});
</script>