Guides
SupportStatus

Widget Embed Guide

How to easily add staking and DeFi to your application

Overview

The Blockdaemon Earn Widget lets you offer staking and DeFi lending in your application via a hosted widget, without building protocol integrations or on-chain logic in-house. Blockdaemon deploys the widget on a per-client basis and connects directly to the Blockdaemon Earn Stack.​

The purpose of this guide is to support the evaluation and integration of the widget into your staging or production environments.​

Supported Features

The Blockdaemon Earn Widget currently supports the following functionality:​

  • Staking: Ethereum (via StakeWise vaults) and Solana (native delegation with validator selection, unstaking, and reward claiming).
  • DeFi lending: Aave on Ethereum, Base, Arbitrum, Optimism; Morpho and additional chains are planned.
  • Swaps: Configurable per deployment via chain allow/block lists (commonly Ethereum, Base, Arbitrum, Optimism, Kaia).

Implementation Checklist

When preparing to go live, typical steps include:​

  • Widget Deployment: Confirm your https://<client-slug>.widget.blockdaemon.com deployment and target environment (staging vs production).
  • Embedding the Widget: Embed and size the iframe appropriately within your UI.
  • Configuration Model: Align features configuration with your product scope (staking, DeFi, swaps) and regulatory requirements.
  • Appearance & Branding: Configure appearance to meet brand, theme, locale, and currency guidelines.
  • Wallet Integration Modes: Select wallet mode (internal vs external) and, for external mode, implement the postMessage integration contract.
  • Validate transaction flows, balances, and lifecycle (connect / transact / disconnect) in your staging environment.

Widget Deployment

Each customer receives a dedicated widget instance hosted at:

https://<client-slug>.widget.blockdaemon.com

Blockdaemon manages the deployment lifecycle, upgrades, and configuration of the widget instance. A client-specific slug will be provided as part of your implementation onboarding.​

Embedding the Widget

To embed the widget, add the iframe to the relevant view or component in your application:​

<iframe
  src="https://<client-slug>.widget.blockdaemon.com?embed=true"
  id="blockdaemon-widget"
  title="Blockdaemon Earn Widget"
  allow="clipboard-write"
  style="width: 100%; height: 100%;">
</iframe>

Consider the following when embedding:​

  • embed=true activates PostMessage communication mode. Required for external wallet and external balance integration.
  • Sizing: The widget supports two sizing modes via appearance.sizingMode.
    • Fixed mode: Use fixed mode when you want a predictable, static widget footprint. The numeric sizing limits require a width between 375 and 1000 and a height between 480 and 1200.
    • Responsive mode: Use the responsive mode when the widget should adapt to the host layout. In this mode, the widget requires a minimum width of 375px and a minimum height of 480px.
    📘

    Recommended Usage