Skip to content

index.md

Latest commit

 

History

History
264 lines (183 loc) · 15.9 KB

index.md

File metadata and controls

264 lines (183 loc) · 15.9 KB
layout default
title Home

GitHub profile

Introduction (Unofficial)

Showcase your GitHub account's profile with GitHub offical page style.

Made by @joytou. Available on GitHub. Licensed Apache 2.

Contents

Usage

To use this, you just need to add an iframe element with src attribute,
or add div and script elements with attributes in your web page.
And others attributes in the iframe or div element depend on yourself.
(Warning: If you use div element, you must add an id attribute that id="gh-profile" to the div element.)

  • With iframe element:

<iframe src="https://github-profile.joytou.net/gh-profile.min/?user={/username}&amp;bio={/boolean}&amp;locations={/boolean}&amp;blog={/boolean}&amp;email={/boolean}&amp;company={/boolean}&amp;iframeid={/string}&amp;token_encode={/base64_encode_string}&quot;&gt;&lt;/iframe>

  • With div element:

<div id="gh-profile" user="{/username}" follow="{/boolean}" bio="{/boolean}" locations="{/boolean}" email="{/boolean}" blog="{/boolean}" company="{/boolean}" token_encode="{/base64_encode_string}"></div>
<script async defer src="https://github-profile.joytou.net/gh-profile.min.js&quot;&gt;&lt;/script>

Examples

Available options

Required Parameters

You must declare a value for each of the following parameters:

Option Description
user/org Pick one of two. GitHub username/organization that you own

Optional Parameters

The following parameters are not required. Add them as you wish.

Option Description
bio Show your account's bio record. none by default or true
locations Show your account's location record. none by default or true
blog Show your account's blog record. none by default or true
email Show your account's email record. none by default or true
company Show your account's company record. none by default or true
follow Show the Follow button. none by default or true
iframeid The id attribute of your current iframe element. For auto adaptiving page height.
(Warning: This attribute can only be used for iframe element, not for div element.)
token_encode Base64 encode string of your personal access token, for increasing the times of queries.
(Warning: If using an iframe, the encoded string need to follow the conversion rules below:
= => %3d
+ => %2b
/ => %2f )

Code and preview

Organization account


Warning: The encoded token you enter will be stored in the local device for auto-completion.
Show bio
Show location
Show blog
Show email
Show company
Show follow button
Auto adiust height for iframe
<iframe id="test_iframe" width="100%" height="240" allowtransparency="true" frameborder="0" scrolling="auto"></iframe> ------- With iframe element:
<textarea style="width:100%" id="iframecode" readOnly onclick="this.select()"><iframe src="https://github-profile.joytou.net/gh-profile.min/?user=joytou&bio=false&locations=false&blog=false&email=false&company=false&follow=false"></iframe></textarea> ------- With div element:
<textarea style="width:100%" id="divcode" readOnly onclick="this.select()">
</textarea><textarea style="width:100%" readOnly onclick="this.select()"><script async defer src="https://github-profile.joytou.net/gh-profile.min.js"></script></textarea> <script> function myFunction() { var x = document.getElementById("myInput").value; var org = document.getElementById("orgcheck").checked; var bio = document.getElementById("biocheck").checked; var location = document.getElementById("locationcheck").checked; var blog = document.getElementById("blogcheck").checked; var email = document.getElementById("emailcheck").checked; var company = document.getElementById("companycheck").checked; var follow = document.getElementById("followcheck").checked; var iframeid = document.getElementById("iframeidcheck").checked; var tokenencode = document.getElementById("inputtoken").value; document.getElementById("myInput").placeholder=(org?":organization":":user"); document.getElementById("test_iframe").src = "https://github-profile.joytou.net/gh-profile.min/?"+(org?"org":"user")+"=" + (x?x:"joytou")+"&bio="+bio+"&locations="+location+"&blog="+blog+"&email="+email+"&company="+company+"&follow="+follow+(iframeid?"&iframeid=test_iframe":"")+(tokenencode?"&token_encode="+encodeURIComponent(decodeURIComponent(tokenencode)):""); document.getElementById("iframecode").value="</iframe>"; document.getElementById("divcode").value="
"; } function storage_token() { myFunction(); if (typeof(Storage) !== "undefined") { localStorage.setItem("gh-profile_token_encode", document.getElementById("inputtoken").value); } } function read_token() { if (typeof(Storage) !== "undefined") { document.getElementById("inputtoken").value=localStorage.getItem("gh-profile_token_encode"); } myFunction(); } read_token(); </script>

Update

You can view the update log by clicking on View logs.

Open source

The unofficial GitHub-profile are available on GitHub for downloading, forking, or contributing.

View on GitHub

Contributing

Thanks for your interest in contributing! There are many ways to contribute to this project. Get started here.

Copyright and license

Copyright 2018 Joytou. Released under Apache 2.0.