Farcaster: Frame builder icon

Farcaster: Frame builder

Generates Framecaster HTML with meta tags for provided frame parameters

Overview

This node generates an HTML frame embedded with meta tags based on the provided parameters, specifically designed for use with Framecaster and optionally conforming to the Open Frames specification. It is useful for creating rich, metadata-enhanced HTML frames that can be used in social media previews, web embeds, or decentralized applications requiring structured frame data.

Common scenarios include:

  • Creating shareable frames with images and interactive buttons.
  • Embedding custom metadata into HTML templates for enhanced integration with platforms supporting Framecaster or Open Frames standards.
  • Generating dynamic HTML content with configurable buttons and state information for decentralized apps or signature packet receivers.

Example: A user wants to create a frame with a specific image, several action buttons (like linking to a URL or triggering a mint operation), and embed this into a custom HTML template that includes additional meta tags for compatibility with Open Frames-enabled platforms.

Properties

Name Meaning
Image URL of the frame image to be embedded as meta tags.
Open Frames Support Boolean flag to include additional meta tags conforming to the Open Frames specification. When enabled, extra tags prefixed with of: are added alongside Framecaster tags.
Buttons Collection of buttons to include in the frame. Each button has:
- Label: Text shown on the button.
- Action: One of Link, Mint, Post, Redirect, Transaction.
- Action Target: Optional target string.
- Post URL: Custom URL for post actions.
Additional Fields Collection of optional fields:
- Aspect Ratio: Image aspect ratio, either "1.91:1" or "1:1".
- Input: Label for a text input field.
- Callback URL: Endpoint URL for receiving signature packets.
- State: JSON string representing state passed to the frame server.
- HTML Template: Base HTML template where meta tags will be embedded.
- Custom Meta: Additional custom meta tags as name-value pairs.
- Version: Frame version string (default "vNext").

Output

The node outputs a single JSON object with one property:

  • html: A string containing the serialized HTML document. This HTML includes the original template with <meta> tags injected into the <head> section according to the provided parameters. The meta tags cover frame version, image URL, aspect ratio, buttons, input labels, state, callback URLs, and any custom meta tags.

No binary data output is produced by this node.

Dependencies

  • Uses the jsdom library to parse and manipulate the HTML template DOM structure.
  • No external API calls or services are required.
  • Requires no special credentials but expects valid URLs and JSON strings as inputs where applicable.

Troubleshooting

  • Invalid or empty image URL: Since the image URL is required, providing an invalid or empty string may result in incomplete or incorrect meta tags. Ensure the URL is valid and accessible.
  • Malformed JSON in State field: The state property expects a JSON string. Invalid JSON will cause errors or unexpected behavior. Validate JSON syntax before input.
  • Empty or malformed HTML template: The HTML template must be a valid HTML document string. Improper templates might lead to failure in injecting meta tags or malformed output.
  • Button configuration issues: Each button requires a label and a valid action. Missing these may cause incomplete meta tag generation.
  • Open Frames toggle mismatch: If Open Frames support is enabled but the consuming platform does not support it, some meta tags may be ignored or cause confusion.

Links and References

Discussion