Showcase any GitHub repo's success with these two simple, static buttons featuring dynamic watch and fork counts.
CSS JavaScript HTML
Switch branches/tags
Nothing to show
Clone or download
Pull request Compare This branch is 7 commits ahead, 73 commits behind mdo:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
.gitignore
README.md
bootstrap.min.css
btn.css
btn.js
btn.min.css
btn.min.js
github-icons-2x.png
github-icons.png
gulpfile.js
index.html
page.css

README.md

UNOFFICIAL GITHUB BUTTONS

Showcase your GitHub (repo's) success with these three simple, static buttons featuring dynamic watch, fork and follower counts and a link to your GitHub repo or profile page.

This is a fork of the Mark Otto's work : http://ghbtns.com

To get started, checkout http://onigoetz.ch/github-buttons!

Usage

The difference of this fork and the original one is that the fork doesn't use iframes with the following advantages:

  • You don't have to calculate the width of your iframe
  • Better loading time, the JS/CSS is only loaded once
  • The data:image is only parsed once
  • when you show multiple buttons for the same repository (for example stars and forks) the jsonp request is made only once

These buttons are hosted via GitHub Pages, meaning all you need to do is include an JS/CSS file and start to use them right in your code.

	<link href="//onigoetz.ch/github-buttons/btn.min.css" rel=stylesheet>
	<script src="//onigoetz.ch/github-buttons/btn.min.js" async></script>
	<span class="github-btn" data-type=BUTTONTYPE data-user=USERNAME data-repo=REPONAME></span>

Requirements

data-user
GitHub username that owns the repo

data-repo
GitHub repository to pull the forks and watchers counts

data-type
Type of button to show: watch or fork or follow

Optional

data-count
Show the optional watchers or forks count: none by default or true

Button size

There are two sizes available, if normal and big, if you want it big, add the github-btn-large class to the button

Examples

Basic Watch button

	<span class="github-btn" data-type=watch data-user=onigoetz data-repo=github-buttons></span>

Basic Fork button

	<span class="github-btn" data-type=fork data-user=onigoetz data-repo=github-buttons></span>

Basic Follow button

	<span class="github-btn" data-type=follow data-user=onigoetz></span>

Watch with count

	<span class="github-btn" data-type=watch data-user=onigoetz data-repo=github-buttons data-count=true></span>

Fork with count

	<span class="github-btn" data-type=fork data-user=onigoetz data-repo=github-buttons data-count=true></span>

Follow with count

	<span class="github-btn" data-type=follow data-user=onigoetz data-repo=github-buttons data-count=true></span>

Large Watch button with count

	<span class="github-btn github-btn-large" data-type=watch data-user=onigoetz data-repo=github-buttons data-count=true></span>

Bug tracker

Have a bug? Please create an issue here on GitHub at https://github.com/onigoetz/github-buttons/issues.

Authors

Mark Otto - Creator

Stéphane Goetz - Iframe remover

Copyright and license

Copyright 2011 Mark Otto.

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this work except in compliance with the License. You may obtain a copy of the License in the LICENSE file, or at:

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.