“GitHub Repos Octopress” is a plugin I made for Octopress to embed a GitHub repository, with basic information and a download button. It is based on the “GitHubReposWidget”.

The javascript file is containing the stylesheet, so there are very few files included. With a self-contained file you can also run it on your non-Octopress page. There are notes about that in the end.

I have setup the plugin to use a variable in the head of the post: githubrepos: true. That will load the javascript below the footer, which mean I can run the plugin one or more times in the post without render it when previewing (GitHub has a limit of 60 calls/hour).

Demo

Install

Move github_repos.rb your your plugins folder.

Move githubrepos.min.js to source/javascripts/githubrepos.min.js.

In _includes/custom/after_footer.html, add:

{% if page.githubrepos == true  %}
<script src="{{ root_url }}/javascripts/githubrepos.min.js" type="text/javascript"></script>
{% endif %}

Generate to pickup the plugin:

rake generate

Usage

{% githubrepo <githubuser>/<repository> %}

Example how to embed the “Spoon-Knife” repo:

{% githubrepo octocat/Spoon-Knife %}

To embed more repos, simpy add them:

{% githubrepo name/repo-name-foo %}
{% githubrepo name/repo-name-bar %}

In your post header, add:

githubrepos: true

Example:

---
layout: post
title: "Just a test"
githubrepos: true
---

That will load the javascript in the footer.

Use without Octopress

If you don’t have Octopress, you can still use it as a normal javascript plugin/widget

Example how to embed the “Spoon-Knife” repo:

<div class="github-widget" data-repo="octocat/Spoon-Knife"></div>

To embed more repos, simpy add them:

<div class="github-widget" data-repo="name/repo-name-foo"></div>
<div class="github-widget" data-repo="name/repo-name-bar"></div>

At the and of your page, add the script:

<script type="text/javascript" src="/path/to/githubrepos.min.js"></script>

Screenshot