Examples

Below, we'll go through many examples of customizing widget appearance to give the widget the best look and feel for your website.
Through the below examples and code, you will be able to customize the size, position, background, border, appearance and more facets of the widget.

Each example will contain a live working customized widget, with the code necessary to deploy the widget below. You can copy the code given and paste it anywhere in your website for the desired effect.

Sample #1: Default, Minimum Size


<iframe src="https://mooncryption.github.io/steem-price-widget/widget.html" width="320px" height="180px" frameBorder="0"></iframe>

Sample #2: Default, Comfortable Size



<iframe src="https://mooncryption.github.io/steem-price-widget/widget.html" width="400px" height="180px" frameBorder="0"></iframe>

Sample #3: Centered, Minimum Size



<center><iframe src="https://mooncryption.github.io/steem-price-widget/widget.html" width="320px" height="180px" frameBorder="0"></iframe></center>

Sample #4: Centered, Comfortable Size



<center><iframe src="https://mooncryption.github.io/steem-price-widget/widget.html" width="400px" height="180px" frameBorder="0"></iframe></center>

URL Parameters and Variables

Sample #5: No Border



<iframe src="https://mooncryption.github.io/steem-price-widget/widget.html?border=false" width="400px" height="180px" frameBorder="0"></iframe>

Sample #6: No Background



<iframe src="https://mooncryption.github.io/steem-price-widget/widget.html?background=false" width="400px" height="180px" frameBorder="0"></iframe>