Nutella Peanut-Butter Marshmallow

github-profile-card

2.0.1 • Public • Published

GitHub Profile Card

Widget shows your GitHub profile directly on your website!
Show your current projects — always up to date.

Live demo and configuration

Screenshot

Main features

  • Top languages statistics
  • Last updated repositories
  • Configurable in HTML
  • Copy-Paste installation
  • No jQuery and any other libraries required

Quick install

Include script and style inside of your <head> tag:

<link rel="stylesheet" href="http://github-profile.com/dist/gh-profile-card.min.css" />
<script type="text/javascript" src="http://github-profile.com/dist/gh-profile-card.min.js"></script>

Include HTML code anywhere you would like to place widget:

<div id="github-card"
     data-username="YOUR_GITHUB_USERNAME">
</div>

Great! Widget will autoload. We're done here.

Download

With bower

bower install github-profile-card

With npm

npm install github-profile-card --save

Main files are in /dist/ directory.

Advanced configuration

Configure widget in HTML:

<div id="github-card"
     data-username="YOUR_GITHUB_USERNAME"
     data-max-repos="3"
     data-sort-by="stars"
     data-header-text="Most starred repositories">
</div>

For special usages, it is possible to configure widget(s) in JavaScript. You have to use different template than #github-card.

var widget = new GitHubCard({
    username: 'YOUR_GITHUB_USERNAME'
    template: '#github-card-demo',
    sortBy: 'stars',
    reposHeaderText: 'Most starred',
    maxRepos: 5
});

widget.init();

Configuration options

HTML option (data- prefix) JavaScript option Type Default Details
username username string GitHub profile username
template string #github-card DOM selector of your widget in HTML
sort-by sortBy stars, updateTime stars Repositories sorting method
max-repos maxRepos int 5 Amount of listed repositories. 0 disables section
header-text headerText string Most starred repositories Text label above repositories list

Changelog

I love feedback, send me one!

Remember no other libraries required. It's like gluten free 😉

gluten-free

install

npm i github-profile-card

Downloadsweekly downloads

1

version

2.0.1

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability