Make it easy for users to share your mini app in feeds and increase reach with compelling, dynamic embeds.

​
What you’ll learn

By the end of this guide, you’ll know how to:
  • Add share entry points in your Base Mini App and from the Base app directory
  • Understand how embeds are generated when your app is shared
  • Create both static and dynamic embeds that drive engagement
  • Implement determined and truly dynamic metadata for personalised sharing
  • Debug and test your embeds before launch
  • Use MiniKit’s built-in metadata generation to save development time

​
How users share your mini app

Users can share your mini app in two main ways:

​
From inside your mini app

Add a “Share this mini app” button that copies the shareable link and guides users to post it in the feed.

​
From the Base app directory

Users can click Share from your app’s detail view.
Share button in Base app

Share button in the Base app UI

When a user pastes your app link in a feed (Base feed, Warpcast, Twitter, etc.), the platform fetches your Open Graph (OG) metadata to build an embed.

​
How embeds work

When a platform sees your URL, it sends a request to your app and reads the <meta> tags in your HTML. Example: 
<meta name="fc:frame" content='{
  "version":"next",
  "imageUrl":"https://your-app.com/embed-image",
  "button":{
    "title":"Play Now",
    "action":{
      "type":"launch_frame",
      "name":"Your App",
      "url":"https://your-app.com"
    }
  }
}' />
Your embed includes:
  • Image – Main visual hook (3:2 aspect ratio recommended)
  • Title + description – The quick pitch for your app
  • CTA button – The direct action users can take

​
Static vs. dynamic embeds

Static OG embedDynamic OG embed

Static vs. dynamic embed examples

​
Static embeds

Same image and title for every share. Great for consistent branding, but less personalised.

​
Dynamic embeds

OG data changes based on the URL or parameters. More engaging and relevant to the user’s action.

​
Types of dynamic metadata

There are two main approaches:

​
Determined dynamic metadata

Predefined outcomes mapped to specific URLs. Example: A personality quiz with fixed results. 
/generate/blossom
/generate/bubbles
/generate/buttercup
Each URL returns a unique embed image and text.

​
On-demand generated metadata

Generated in real time for each share. Example: A dashboard app showing the user’s current stats. 
/generate/user/123
Backend fetches latest data and generates a custom OG image.

​
How dynamic metadata works

​
The flow

  1. User shares link – e.g. https://my-mini-app.com/generate/blossom
  2. Parent app fetches metadata – Sends request to your server
  3. Your route processes params – /generate/:character detects “blossom”
  4. Server generates OG data – Creates and returns SVG or image
  5. Embed appears in feed – User sees personalised preview

​
Implementation tips

Use Vercel OG Image Generation for fast, serverless image rendering.

​
Using MiniKit for embeds

If you’re building with MiniKit, the metadata setup is handled for you in layout.tsx or layout.ts: 
export async function generateMetadata(): Promise<Metadata> {
  const URL = process.env.NEXT_PUBLIC_URL;
  return {
    title: process.env.NEXT_PUBLIC_ONCHAINKIT_PROJECT_NAME,
    description: "Generated by `create-onchain --mini`, a Next.js template for MiniKit",
    other: {
      "fc:frame": JSON.stringify({
        version: "next",
        imageUrl: process.env.NEXT_PUBLIC_APP_HERO_IMAGE,
        button: {
          title: `Launch ${process.env.NEXT_PUBLIC_ONCHAINKIT_PROJECT_NAME}`,
          action: {
            type: "launch_frame",
            name: process.env.NEXT_PUBLIC_ONCHAINKIT_PROJECT_NAME,
            url: URL,
            splashImageUrl: process.env.NEXT_PUBLIC_SPLASH_IMAGE,
            splashBackgroundColor: process.env.NEXT_PUBLIC_SPLASH_BACKGROUND_COLOR,
          },
        },
      }),
    },
  };
}
You can customise imageUrl, title, and button for different pages or features.

​
Debugging embeds

If your embed isn’t rendering correctly:

​
Debug tools

​
Common issues

  • Ensure server returns correct metadata for both static and dynamic routes
  • Review caching headers — too aggressive can delay updates
Review caching headers — too aggressive caching can delay embed updates when you make changes.

​
Next steps

  • Add fc:frame metadata to your shareable pages
  • Decide between static, determined dynamic, or On-demand generated metadata dynamic embeds
  • Test across platforms before launch
  • Integrate sharing prompts into onboarding and achievement flows