GitHub Buttons Web Component

Showcase your GitHub success with GitHub star buttons, follower buttons & more.

A web component made by @MarketingPipeline. Source code is available on GitHub. Licensed MIT.


Contents

Example and Usage

How to use GitHub Buttons:

include this script in your HTML document.

<script src="https://cdn.jsdelivr.net/gh/MarketingPipeline/GitHub-Buttons-Web-Component/version/1.0.0/src/github-buttons-wc.js" defer></script>

How to show Star Button

<github-button repo="MarketingPipeline/Markdown-Tag"></github-button>

How to show Watch Button

<github-button type="watch" repo="MarketingPipeline/Markdown-Tag"></github-button>

How to show Fork Button

<github-button type="fork" repo="MarketingPipeline/Markdown-Tag"></github-button>

How to show Followers Button

<github-button type="followers" repo="MarketingPipeline"></github-button>

How to show Sponsor Button

<github-button type="sponsor" repo="MarketingPipeline"></github-button>  

How to show Pull Requests Button

<github-button type="pulls" repo="MarketingPipeline/Markdown-Tag"></github-button>

How to show Issues Button

<github-button type="issues" repo="MarketingPipeline/Markdown-Tag"></github-button>

How to show Custom Button

<github-button type="custom" text="Custom Button Text"></github-button>  

Options

Attribute Meaning Default Required
repo Your GitHub username + repo or GitHub Profile (Not Required For Custom Button) Undefined Yes
type The type of button to show Star Count No
icon The icon to use in the button GitHub Icon No
href The href / link for the button Defined by Type No
new-window If True, button link will open in a new window False No
text Text to show (Custom Button's Have No Default Text) Defined by Type No