Make Yourself a Web Page Widget to Monitor Your Crypto Portfolio Value (Only Very Simple PHP /HTML Skill Required)

Photo is “Investment Growth” by Pictures of Money (Flickr, Creative Commons).

This article is purposefully super-simplistic, but I was thinking that there are probably a lot of people out there who are into crypto, have a web site somewhere, and would like to put up a private (or, hell, maybe public) page somewhere to display your crypto-portfolio value in real-time. Yet, you may not know how to code this up yourself.

This is massively easy to do by using the free Coinmarketcap API. When you add some styling to it, there’s no limit to how fancy you can make your portfolio widget, and/or how much extra math and calculations you can add to it.

For mine, I basically just did a little Bootstrappy table & have it set to output my own meager “portfolio.” On the page where I have it, it renders out like so:

Man, so easy now! I was getting sick of updating a spreadsheet with coin values whenever I wanted to know how ridiculously rich I’ve become. Hasn’t happened yet… lol. But, I’m having a good time.

All you need is a web site to screw around with — just any normal server that will run Wordpress, for example. In the sample code below, I’ve taken out the bootstrap stuff, so it should simply render a plain old HTML table. You’ll probably want to add custom classes or other cool stuff (e.g., making negative percentages red, and positive ones green).

To begin, you’re going to need to tell the code how much of each currency you own. I’ve used an array to hold that — called $myCoins in the code below. Hopefully, you can see how to customize that for yourself, using the symbols of your own currency, and putting in the balances where those go. Note that, anytime you buy more crypto, and/or change your holdings, you’ll need to update your balance in this $myCoins part of your script.

Anyway, here’s the basic code, and I’ll include some more comments below. :-)

$myCoins = array(
'BTC' => array ( 'balance' => 0.0093 ),
'ETH' => array ( 'balance' => 0.235724420 ),
'XRB' => array ( 'balance' => 2.524402070 ),
'MIOTA' => array ('balance' => 33.000000000 ),
'XRP' => array ( 'balance' => 49.000000000 ),
'XLM' => array ( 'balance' => 105.894000000 ),
'TRX' => array ( 'balance' => 599.400000000 )
// ok now hit the api...
$coinbasePublicAPI = '';
$coinData = file_get_contents($coinbasePublicAPI);
$coinData = json_decode($coinData, true);
echo '<table>';
echo '<tr>';
echo '<td>NAME</td>';
echo '<td>SYMBOL</td>';
echo '<td>PRICE</td>';
echo '<td>HOLDINGS</td>';
echo '<td>VALUE</td>';
echo '<td>1hr</td>';
echo '<td>24hr</td>';
echo '<td>7day</td>';
echo '</tr>';
$numCoinbaseCoins = sizeof ($coinData);
$portfolioValue = 0;
for ( $xx=0; $xx<$numCoinbaseCoins; $xx++) {
 // this part compares your coins to the data...
$thisCoinSymbol = $coinData[$xx]['symbol'];
 // if you have it, this var is true...
$coinHeld = array_key_exists($thisCoinSymbol, $myCoins);
 // comment the next line out & you will see ALL of the coins 
// returned (not just the ones you own):
if ( !$coinHeld ) { continue; }

echo '<tr>';

// name:
echo '<td>' . $coinData[$xx]['name'] .'</td>';

// symbol:
echo '<td>' . $thisCoinSymbol .'</td>';

// price:
$thisCoinPrice = $coinData[$xx]['price_usd'];
echo '<td>&#36;' . number_format($thisCoinPrice,2) .'</td>';

// holdings:
echo '<td>';
if ($coinHeld) {
$myBalance_units = $myCoins[$thisCoinSymbol]['balance'];
echo number_format($myBalance_units,10);
echo '</td>';

// track running total value of coins:
if ($coinHeld) {
$myBalance_USD = $myBalance_units * $thisCoinPrice;
$portfolioValue += $myBalance_USD;
 // value: 
echo '<td>&#36;'. number_format($myBalance_USD,2) .'</td>';
 // 1h market change:
echo '<td>' . $coinData[$xx]['percent_change_1h'] .'%</td>';
 // 24h market change:
echo '<td>' . $coinData[$xx]['percent_change_24h'] .'%</td>';
 // 7d market change:
echo '<td>' . $coinData[$xx]['percent_change_7d'] .'%</td>';

echo '</tr>';

echo '<tr>';
 echo '<td colspan="4"><strong>TOTAL</strong></td>';
echo '<td colspan="4"><strong>&#36;' . number_format($portfolioValue,2) . '</strong></td>';
echo '</tr>';
echo '</table>';

… and that’s all you need. Just customize that initial $myCoins array, and it should render your table. In all likelihood, your portfolio is more impressive than mine, as I’m pretty new to all of this and am still kind of learning about crypto investing.


The above script hits the API. The API methods and other notes are here:

They ask that you hit the API no more than 10 times per minute, so, maybe don’t put this on a web site that gets crazy traffic 24/7.

The above routine hits the main API just once, and so it only pulls in the top 100 coins. If you’re investing in a coin that’s way down the list, you’ll need to customize the above script to iterate through multiple hits to the API, which can be done by adding a “start” parameter to the end of the URL, as in: You’d want to setup a loop on the API hit and build out a larger dataset from the results before parsing it all out to the screen.

OTOH, I suppose that, to get them ALL (I think they have about 1,500 coins on there), you would need to hit their API more than 10x, and so it’s not a good source for doing any huge development or projects. Apparently, they’re coming out with a paid API for stuff like that. See the site for details.

If you run Joomla or Wordpress, see another piece I’ve posted on how to run PHP in a module or widget.

Besides adding styling, etc., you may want to build out your coin listing to include richer information. For example, instead of the simple array I showed, maybe yours could look like:

$myCoins = array(
'BTC' => array ( 'balance' => 0.0093, 'wallet' => 'Coinbase', 'notes' => 'whatever', 'buy-in-price' => '8005.22' ),
'ETH' => array ( 'balance' => 0.235724420, 'wallet' => 'Trezor', 'notes' => 'whatever', 'buy-in-price' => '555.88' ),
'XRB' => array ( 'balance' => 2.524402070, 'wallet' => 'Binance', 'notes' => 'whatever', 'buy-in-price' => '1.25' ),
'MIOTA' => array ('balance' => 33.000000000, 'wallet' => 'GDAX', 'notes' => 'whatever', 'buy-in-price' => '0.25' ),
'XRP' => array ( 'balance' => 49.000000000, 'wallet' => 'Kucoin', 'notes' => 'whatever', 'buy-in-price' => '1.25' ),
'XLM' => array ( 'balance' => 105.894000000, 'wallet' => 'Paper wallet', 'notes' => 'whatever', 'buy-in-price' => '2.50' ),
'TRX' => array ( 'balance' => 599.400000000, 'wallet' => 'Bittrex', 'notes' => 'whatever', 'buy-in-price' => '0.054' )

… and then your widget or report could be much more exciting. I actually like the idea of a little database application to track the balances instead of having to update the code anytime your balance changes. But, to me, that’s about as easy as anything else, and it’s fast … and of course, my balance is rather pathetic. But, the idea is that you’re not limited to just storing coin balances; you can store other info there, too, and use that to calculate and/or display results on your widget or financial report, or whatever you’re building.

Simplistic, I know… but a bit of fun, and hopefully helpful to a few people who’d like to pull some data into their site. Enjoy. :-)

💰 About the Author: Jim Dee heads up Array Web Development, LLC in Portland, OR. He has coded numerous custom financial reporting and investment-oriented, math-intensive database applications. He’s the editor of “Web Designer | Web Developer” magazine and a contributor to many online publications. You can reach him at: Jim [at]

Feeling Crypto-Generous / Crypto-Thankful?
: 1Adsx754gGoiZgkRanLvBLDjBR6Ayb6MXQ
ETH: 0x4a7650D76548146A271eec939C0fb653dAC88A5E
LTC: LL68Gq69SkKECSn913qJqgjt3bJCZqfLC5