Skip to main content

🧩 Install BTC Widget

🧱 Step 1: Full Widget Code​

Copy and paste the full widget block before the closing </body> tag of your homepage.

The widget includes three core parts:

  1. <style> — CSS styles for position and animation
  2. <div id="btc-widget-container"> — Placeholder for the widget iframe
  3. <script> — Optional JavaScript for smooth animations

🧠 Step 2: Code Breakdown​

<style>
#btc-widget-container {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
  transition: opacity 0.4s ease, transform 0.4s ease;
  opacity: 0;
  transform: translateY(20px);
}
#btc-widget-container.visible {
  opacity: 1;
  transform: translateY(0);
}
</style>

<div id="btc-widget-container">
  <iframe
    src="https://reservebtc.io/btc-widget.html?btc=YOUR_BTC_ADDRESS&site=https://yourdomain.com"
    width="300"
    height="400"
    style="border:none;border-radius:12px;overflow:hidden;"
    loading="lazy"
  ></iframe>
</div>

<script>
  window.addEventListener('DOMContentLoaded', function () {
    setTimeout(() => {
      const widget = document.getElementById('btc-widget-container');
      widget.classList.add('visible');
    }, 500);
  });
</script>

📍 Step 3: Where to Place It​

✅ Place at the end of your main HTML layout or homepage

✅ Preferably before </body> tag

✅ For global use, insert into your base layout/footer

❌ Avoid placing inside modals, popups, or other iframes

⚠️ Step 4: Common Conflicts​

  • CSS resets: Ensure the iframe is not unintentionally hidden.
  • Click listeners: Wrap the JS logic if your site already uses global document.onclick.
  • Lazy loading: Always keep loading="lazy" on the iframe.

🔐 Step 5: Domain Protection​

Widgets only work when embedded on the verified domain:

✅ Client domain: https://client-website.com
✅ Embedded on: https://client-website.com  ➝ Widget loads ✅
❌ Embedded on: https://other.com           ➝ Widget blocked ❌

Important: The ?site= parameter must match your verified domain exactly.

📌 Step 6: Required vs Optional​

ElementRequired?Notes
<style>✅Required for layout/animation
<iframe>✅Core visual component
<script>🔄 RecommendedEnables smooth appearance transition

✅ Final Summary​

  • Zero-custody. Fully verifiable Bitcoin proof.
  • Lightweight, secure, and easy to integrate.
  • Requires no backend — works with any static site.

Proof-of-Reserve, visible in seconds.