Get started with Open Frames

By following the steps you will enhance your Frame with the necessary metadata for Open Frames compatibility, according to this standard. Let's dive in!

HTML

<meta property="of:accepts:xmtp" content="vNext" />

OnChainKit

export const metadata: Metadata = {
  title: /*Your frame metadata*/,
  description: /*Your frame metadata*/,
  openGraph: {/*Your frame metadata*/},
  other: {
    ...frameMetadata,
    'of:accepts:xmtp': 'vNext', // Ensure this line is added or updated
  },
};

For comprehensive guidance on integrating Open Frames with OnChainKit, refer to the official documentation.

FramesJS

const handleRequest = frames(async (ctx) => {
  return {
    // ...
    accepts: [
      {
        id: 'farcaster',
        version: 'vNext',
      },
      {
        id: 'xmtp',
        version: 'vNext',
      },
    ],
  };
});

For comprehensive guidance on integrating Open Frames with Framesjs, refer to the official documentation.

Frog

Currently, Frog does not officially support Open Frames. However, a temporary solution can be found in this discussion regarding making Frog compatible.

Next steps

• To add your Frame to the Compatible Frames section, fork the Awesome-Open-Frames Repo, clone it, update the README.md with your Frame, commit and push your changes, then submit a pull request.
• To submit your Frame, access any XMTP app from the Compatible Applications, connect your Ethereum wallet, and send a DM to hi.xmtp.eth with a link to your Frame, indicating its addition to the Compatible Frames section.