RailsでGithubリポジトリへのリンクを表示する

RailsでGithubリポジトリへのリンクを表示する

Railsでも自身のGithubリポジトリへのリンクを表示して、ダウンロードしてもらうなどのケースが度々見られます。その際にGithubリポジトリへのリンクを綺麗に表示させるには、「GitHub-jQuery-Repo-Widget」を使用します。GitHub-jQuery-Repo-WidgetはGithubへのリンクを美しく表示してくれるプラグインです。このプラグインをRailsで用いるには以下の手順で行います。

1. ファイルをダウンロードする。

こちらよりzipファイルをダウンロードします。zipファイルは画面右下のDownload ZIPからダウンロードすることができます。

2. jquery.githubRepoWidget.min.jsを移動する。

zipファイル解凍後は、フォルダ内のjquery.githubRepoWidget.min.jsを自身のRailsアプリ内のapp/assets/javascripts以下に移動します。

3. リポジトリリンクを表示するviewにタグを追加する。

リポジトリのリンクを表示したいviewに以下のタグを追加します。

<div class="github-widget" data-repo="junki929/brand-size-search"></div>

data-repoに表示したいユーザ名/リポジトリを設定します。上記の場合だと、junki929のbrand-size-searchが表示されます。


以上で完了です。タグを追加した箇所に以下のリポジトリへのリンクが表示されます。

GitHub-jQuery-Repo-Widgetを使用することによって非常に簡単かつ綺麗にリポジトリへのリンクを表示させることができました。