> ## Documentation Index
> Fetch the complete documentation index at: https://dev.writer.com/llms.txt
> Use this file to discover all available pages before exploring further.

# IFrame

A component to embed an external resource in an iframe.

<img src="https://mintcdn.com/writer/mFPGVlLcGxKIh_Y1/framework/public/components/iframe.png?fit=max&auto=format&n=mFPGVlLcGxKIh_Y1&q=85&s=f4aba06e4441d3099c6af3e1f2f54328" width="1220" height="641" data-path="framework/public/components/iframe.png" />

## Fields

<table className="componentFields">
  <thead>
    <th>Name</th>
    <th>Type</th>
    <th class="desc">Description</th>
    <th>Options</th>
  </thead>

  <tbody>
    <tr>
      <td>Source</td>
      <td>Text</td>
      <td>A valid URL</td>

      <td>
        <span>-</span>
      </td>
    </tr>

    <tr>
      <td>Referrer Policy</td>
      <td>Text</td>
      <td>Define which referrer is sent when fetching the resource</td>

      <td>
        <ol>
          <li>no-referrer</li>

          <li>no-referrer-when-downgrade</li>

          <li>origin</li>

          <li>origin-when-cross-origin</li>

          <li>same-origin</li>

          <li>strict-origin</li>

          <li>strict-origin-when-cross-origin</li>

          <li>unsafe-url</li>
        </ol>
      </td>
    </tr>

    <tr>
      <td>Separator</td>
      <td>Color</td>
      <td>-</td>

      <td>
        <span>-</span>
      </td>
    </tr>

    <tr>
      <td>Custom CSS classes</td>
      <td>Text</td>
      <td>CSS classes, separated by spaces. You can define classes in custom stylesheets.</td>

      <td>
        <span>-</span>
      </td>
    </tr>
  </tbody>
</table>

## Events

<AccordionGroup>
  <Accordion title="wf-load" icon="code">
    Fires when the resource has successfully loaded.

    ```python theme={null}
    def load_handler(state):

    # Sets status message when resource is loaded

    state["status"] = "Page loaded"
    ```
  </Accordion>
</AccordionGroup>

<events />