Bitcoin.com
Download

Bitcoin Widgets

Embed widgets on your website

Widget Examples

Scroll to the bottom of the page for installation instructions. Box shadows can be disabled with the bw-noshadow="true" option (see the first price chart example below)

Bitcoin Cash (BCH) Price Chart Widget

<div class="btcwdgt-chart" bw-cash="true" bw-noshadow="true"></div>
<div class="btcwdgt-chart" bw-cash="true" bw-theme="light"></div>

Simple Bitcoin Cash (BCH) Price Widget

<div class="btcwdgt-price" bw-cash="true"></div>
<div class="btcwdgt-price" bw-cash="true" bw-theme="light" bw-cur="jpy"></div>
<div class="btcwdgt-price" bw-cash="true" bw-theme="light"></div>
<div class="btcwdgt-price" bw-cash="true" bw-theme="light" bw-cur="eur"></div>

News Headlines Widget

<div class="btcwdgt-news" bw-cur="usd"></div>
<div class="btcwdgt-news" bw-cur="eur" bw-theme="light"></div>
<div class="btcwdgt-news" bw-entries="10"></div>
<div class="btcwdgt-news" bw-entries="3" bw-theme="light"></div>

Forum Topics Widget

<div class="btcwdgt-forum"></div>
<div class="btcwdgt-forum" bw-theme="light"></div>
<div class="btcwdgt-forum" bw-entries="10"></div>

News Ticker

<div class="btcwdgt-news-ticker"></div>
<div class="btcwdgt-news-ticker" bw-theme="light"></div>

Bitcoin.com Mining Pool Hash Rate

<div class="btcwdgt-pool"></div>
<div class="btcwdgt-pool" bw-theme="light"></div>

Step 1

Place a simple bit of code in the HTML of your website in each location where you want a widget. You may place multiple widgets on the same page with one <b>div</b> per widget. Code for each widget type is shown at right.

Customize

Widgets may be customized by placing additional attributes in the <b>div</b> element.<br />Control the number of items displayed with <b>bw-entries="N"</b> (1-10)<br />Use a different color scheme for the widget with <b>bw-theme="X"</b>. Possible values are "light", "dark".<br />To enable Bitcoin Cash (BCH) price information, add bw-cash="true"

<!-- Bitcoin Cash (BTC) Price Chart Widget -->
<div bw-cash="true" class="btcwdgt-chart"></div>

<!-- Bitcoin (BTC) Price Chart Widget -->
<div class="btcwdgt-chart"></div>

<!-- Active Forum Topics Widget -->
<div class="btcwdgt-forum"></div>

<!-- News Stories Widget -->
<div class="btcwdgt-news"></div>

<!-- News Ticker Widget -->
<div class="btcwdgt-news-ticker"></div>

<!-- Simple Price Widget -->
<div class="btcwdgt-price" bw-cur="usd"></div>

<!-- Bitcoin.com Mining Pool Hash Rate -->
<div class="btcwdgt-pool"></div>

Step 2

Copy-Paste the script code on the right anywhere within your webpage HTML. Even if you have multiple widgets, you only need to include the code once.

<script>
  (function(b,i,t,C,O,I,N) {
    window.addEventListener('load',function() {
      if(b.getElementById(C))return;
      I=b.createElement(i),N=b.getElementsByTagName(i)[0];
      I.src=t;I.id=C;N.parentNode.insertBefore(I, N);
    },false)
  })(document,'script','https://widgets.bitcoin.com/widget.js','btcwdgt');
</script>

Bitcoin.com in your inbox

A weekly rundown of the news that matters, plus educational resources and updates on products & services that support economic freedom