While the GlueX Widget is primarily designed as a modular web component for direct integration into popular frontend frameworks (React, Next.js, Gatsby, Vue, etc), it can also be effectively embedded into any web application as an <iframe>. This method offers broad compatibility and isolation, making it a versatile option for diverse development environments This guide will walk you through the process of setting up, configuring and customizing the GlueX Widget when delivered via an iframe

​
Why Use the iFrame?

Choosing to integrate the GlueX Widget via an iframe offers distinct advantages, particularly for certain project types and architectural needs:
  • Compatibility: The iframe method is highly universal. If your frontend framework is not directly supported by our web component guides (eg: Angular or vanilla projects without a build step), using an iframe allows you to integrate the widget into virtually any web application
  • Simplicity: Embedding an iframe is a straightforward HTML task. It typically requires minimal code and doesn’t introduce additional external dependencies or complex build configurations to your main application
  • Isolation: The widget runs within its own isolated browse context. This minimizes potential conflicts with your existing application’s styles, scripts and global variables, providing a sandboxed environment for the widget’s functionality. This can be beneficial for security and maintaining application stability

​
Integration

(coming soon)

​
Configuration

(coming soon)

​
Customization

(coming soon)

​
Key Consideration

(coming soon)

​
Best Practices

(coming soon)