Githubリポジトリへのリンクを美しく表示する「GitHub jQuery Repo Widget」

widget
jQueryプラグインなどのソースコードをダウンロードしてもらう場合、自身のサーバにアーカイブを置くのではなく、Githubリポジトリからダウンロードしてもらうというケースが多く見られるようになってきました。

GitHub jQuery Repo Widget」は、そのGithubへのリンクを美しく表示させるjQueryプラグインです。

AD

実際の表示例

DEMO
同一ページ内に複数のウィジェットを表示させることもできます。

HTML

まずjQueryとgithubRepoWidget.jsをロードします。

次に、Githubリポジトリへのリンクを表示させたい箇所に以下のようにdivを配置します。
data-repo属性に「ユーザー名/レポジトリ名」の書式でリンクしたいレポジトリを記述します。

たったこれだけ!
div.github-widgetにwidthやmarginを指定してもレイアウトが崩れることなくきれいに表示されます。
自分のリポジトリへのリンクもきれいに見せることができていいですね。

WordPressプラグイン版もあるようです

このGitHub jQuery Repo Widgetに感銘を受けて作られた、WordPressプラグインへのリンクを美しく表示させることができる「WordPress jQuery Plugin Widget」というjQueryプラグインもあります。

WordPress Plugin Widget Demo
WordPressプラグインはレーティングが表示されます。

AD

Share

Commentsコメント

メールアドレスは公開されません。コメントは必ずご入力ください。

HTMLタグは使用できません。ソースコードを書き込みたい場合はCodetterGistCodePenなどのご利用が便利です。

コメントはまだありません。