Sharing Your Mini App

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

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.

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 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

• Use the Farcaster Frame Debugger
• Check OG tags with Meta Tags Inspector

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