How to add an “improve this content” button to your GitHub Pages site
At the bottom of this page (and every other page on the site), you’ll notice a subtle plea to help improve the page’s content. That edit button is no dark magic. If you host your site on GitHub or GitHub Pages, collaborative content is simply a matter of linking to an easily predictable URL.
The difference between publishing with say, WordPress, and publishing using Jekyll and GitHub Pages is more than a choice of framework or platform. When you treat content as code, when you give prose the same respect that developers have for building mission-critical software, you suddenly unlock collaborative workflows whereby content can be transparently versioned, discussed, and improved. Like any other open source project, members of the public can see each line’s history, how it came to be, and propose improvements for the author to review.
If your site’s content is hosted on GitHub (either with Jekyll/GitHub Pages or something like wordpress-github-sync), it’s easy to provide readers with a link to submit changes. You simply need to add a vanilla HTML link to the following URL (if you’re using another framework, you’ll need to build the URL yourself):
https://github.com/{{ site.github.repository_nwo }}/edit/{{ site.branch }}/{{ page.path }}}
Luckily, GitHub Pages has a nice helper to build that URL automatically:
{% github_edit_link %}
Or, if you wanted the helper to build the link as well:
Please {% github_edit_link "help improve this article" %}.
Which would output something like:
Please <a href="http://github.com/benbalter/benbalter.github.com/edit/master/_posts/2015-09-13-github-pages-edit-button.md">help improve this article</a>.
If a user clicks the link, they’ll be prompted to login or signup for a GitHub account if they haven’t already, and will be provided with a web-based editor to edit the page’s content. From there, they simply click the big green “propose change” buttons, which will silently submit a pull request to your site on their behalf, no Git or GitHub knowledge necessary.
Give it a try by clicking the edit button below (suggested improvements to this post welcome), and I encourage you to follow these steps to add a “help improve this content” button to your own site.
If you enjoyed this post, you might also enjoy:
- 15 rules for communicating at GitHub
- Twelve tips for growing communities around your open source project
- Five best practices in open source: external engagement
- Using GitHub Pages to showcase your organization's open source efforts
- How to make a product great
- Why open source
- Why WordPress
- Copyright notices for open source projects
- Four characteristics of modern collaboration tools
- Everything an open source maintainer might need to know about open source licensing
- How I re-over-engineered my home network for privacy and security
Ben Balter is the Director of Hubber Enablement within the Office of the COO at GitHub, the world’s largest software development platform, ensuring all Hubbers can do their best (remote) work. Previously, he served as the Director of Technical Business Operations, and as Chief of Staff for Security, he managed the office of the Chief Security Officer, improving overall business effectiveness of the Security organization through portfolio management, strategy, planning, culture, and values. As a Staff Technical Program manager for Enterprise and Compliance, Ben managed GitHub’s on-premises and SaaS enterprise offerings, and as the Senior Product Manager overseeing the platform’s Trust and Safety efforts, Ben shipped more than 500 features in support of community management, privacy, compliance, content moderation, product security, platform health, and open source workflows to ensure the GitHub community and platform remained safe, secure, and welcoming for all software developers. Before joining GitHub’s Product team, Ben served as GitHub’s Government Evangelist, leading the efforts to encourage more than 2,000 government organizations across 75 countries to adopt open source philosophies for code, data, and policy development. More about the author →
This page is open source. Please help improve it.
Edit