> For the complete documentation index, see [llms.txt](https://docs.customiframe.com/llms.txt).
> Use it to discover all available pages before exploring further.

# Auto-Refresh iFrame

Automatically reload any embedded iFrame at a set interval in Elementor and Gutenberg using the Custom iFrame WordPress plugin.


## Overview

Custom iFrame Auto-Refresh reloads any embedded iFrame at a set interval you define in seconds. Use it to keep live content current without requiring visitors to reload the page.

Custom iFrame is a WordPress plugin by CoderzStudio that embeds 100+ external sources in Elementor and Gutenberg without writing any code.

Auto-Refresh is a free feature. No Pro plan required.

## Requirements

- [Custom iFrame plugin installed and active](/getting-started/installation)
- WordPress with Elementor or the Gutenberg block editor

## When to Use Auto-Refresh

Auto-Refresh is useful whenever the embedded content updates in real time:

- Live scoreboards and sports results
- Financial data or stock tickers
- Live weather widgets
- Real-time dashboards or analytics
- Live event feeds and notice boards

Do not use Auto-Refresh for static content like PDFs, videos, or forms. Reloading those has no benefit and adds unnecessary server load.

## How to Enable Auto-Refresh

### In Elementor

<Steps>
  <Step title="Open your page in Elementor" icon="layout" title-type="p">
    Go to the page with the Custom iFrame widget. Click **Edit with Elementor**.
  </Step>
  <Step title="Select the Custom iFrame widget" icon="mouse-pointer" title-type="p">
    Click the widget to open its settings.
  </Step>
  <Step title="Set the Refresh Interval" icon="refresh-cw" title-type="p">
    In the **Content** tab, find **Refresh Interval (seconds)**. Enter the number of seconds between each reload. For example, enter `30` to reload every 30 seconds.
  </Step>
  <Step title="Publish" icon="check" title-type="p">
    Click **Update** or **Publish**. The iFrame reloads automatically on the live page.
  </Step>
</Steps>

### In Gutenberg

<Steps>
  <Step title="Open your page in the block editor" icon="layout" title-type="p">
    Go to the page with the Custom iFrame block. Click **Edit**.
  </Step>
  <Step title="Select the Custom iFrame block" icon="mouse-pointer" title-type="p">
    Click the block to open its settings in the right panel.
  </Step>
  <Step title="Set the Refresh Interval" icon="refresh-cw" title-type="p">
    In the block settings panel, find **Refresh Interval (Seconds)**. Enter the number of seconds between each reload.
  </Step>
  <Step title="Publish" icon="check" title-type="p">
    Click **Update** or **Publish**. The iFrame reloads at the set interval on the live page.
  </Step>
</Steps>

<Callout kind="success">
  Auto-Refresh is active. The iFrame reloads every set number of seconds on the live page.
</Callout>

## Choosing a Refresh Interval

| Content type | Suggested interval |
|---|---|
| Live sports scores | 30–60 seconds |
| Weather widget | 300 seconds (5 minutes) |
| Financial data | 60–120 seconds |
| Live dashboard | 30–120 seconds |
| News feed | 300–600 seconds |

<Callout kind="alert">
  Do not set an interval below 10 seconds. Very short intervals cause excessive reload requests that can slow your page and add unnecessary load on the embedded server.
</Callout>

## How to Disable Auto-Refresh

Set the **Refresh Interval** field to `0` or leave it blank. The iFrame stops reloading and stays static.

## FAQ

<ExpandableGroup>
  <Expandable title="Does Auto-Refresh reload the entire page?" default-open="false">
    No. Auto-Refresh reloads only the iFrame, not the whole WordPress page. Visitors see the embed update without any page flash or scroll reset.
  </Expandable>
  <Expandable title="Does Auto-Refresh work while the tab is in the background?" default-open="false">
    Most browsers pause JavaScript timers for background tabs. Auto-Refresh may slow down or pause when the tab is not active. It resumes when the visitor returns to the tab.
  </Expandable>
  <Expandable title="Can I set a different refresh interval for each embed?" default-open="false">
    Yes. Each Custom iFrame widget or block has its own Refresh Interval setting. Set different values for each embed independently.
  </Expandable>
  <Expandable title="Does Auto-Refresh work with lazy-loaded iFrames?" default-open="false">
    Yes. The refresh timer starts after the iFrame loads. If Smart Load (Lazy Load) is enabled, the timer begins once the embed enters the viewport.
  </Expandable>
</ExpandableGroup>

---

## Related Guides

- [Auto-Refresh in Gutenberg](/gutenberg/advanced/iframe-auto-refresh)
- [Set Up Custom iFrame in Elementor](/getting-started/elementor-setup)
- [Set Up Custom iFrame in Gutenberg](/getting-started/gutenberg-setup)
- [Lazy Loading (Smart Load)](/features/lazy-loading)
- [iFrame Not Showing](/troubleshooting/iframe-not-showing)
