Blog/Developer

Add a Live Gold Price Widget to WordPress

Add a free, configurable live gold price widget to WordPress with one iframe. Works in Gutenberg and Elementor, no API key, no plugin.

DeveloperUpdated July 16, 2026.md

If you run a finance blog, a dealer site, or a portfolio page on WordPress, you can add a live gold price without a plugin, an API key, or any PHP. The gold price widget configurator generates a single iframe for you. Paste it into a Custom HTML block or an Elementor HTML widget and it works.

Configure the widget

Go to goldprice.dev/widgets/gold-price. No signup and no API key are needed. Pick a currency, a unit (troy ounce or gram), a karat, a theme, and a language, and the page builds the matching iframe for you. Copy that snippet and use it in any of the install methods below.

If you skip the configurator and just want the defaults, this is the iframe it generates for USD, troy ounce, 24 karat, auto theme, and English:

<iframe src="https://goldprice.dev/embed/xau?currency=USD&unit=oz&karat=24&theme=auto&locale=en" title="Live gold price" width="360" height="190" loading="lazy" style="border:0;width:100%;max-width:360px" referrerpolicy="strict-origin-when-cross-origin"></iframe>

The widget refreshes on its own every 60 seconds. It is hosted by goldprice.dev, so no API key ever reaches your page source.

Install it with Gutenberg's Custom HTML block

  1. Open the post or page in the block editor.
  2. Add a Custom HTML block (search "Custom HTML" in the block inserter).
  3. Paste your iframe snippet into the block.
  4. Switch to Preview to confirm the card renders, then publish.

Self-hosted WordPress usually saves this correctly for an administrator. If you are logged in as an editor or contributor without the unfiltered_html capability, WordPress strips the <iframe> tag on save and the block goes blank. See WordPress's own Custom HTML block documentation for how that capability is assigned. The fix is to have an administrator paste the block, or to grant the role unfiltered_html.

Add it to a sidebar or template area

The same Custom HTML block works outside the post body. In Appearance → Widgets, add a Custom HTML widget to any sidebar or footer area and paste your iframe snippet. In a block theme, add the Custom HTML block to a template part, such as the sidebar or a page template, through the Site Editor. Either way, the widget renders wherever the block sits, refreshing on its own.

Install it with Elementor

  1. Edit the page with Elementor.
  2. Drag the HTML widget onto the page.
  3. Paste your iframe snippet into the HTML widget's code panel.
  4. Update the page.

Elementor's HTML widget renders raw markup directly, including iframes, without stripping anything. See Elementor's guide to the HTML widget for more on where it fits versus other embed options.

Widget options

The configurator sets these as query parameters on the iframe's src. An unrecognized value just falls back to the default, so a typo won't break the embed.

ParameterValuesDefaultWhat it does
currency31 options: USD, EUR, GBP, JPY, AUD, CAD, CHF, CNY, INR, IDR, and 21 moreUSDQuote currency for the displayed price
unitoz, gramozPrice per troy ounce or per gram
karat24, 22, 21, 20, 18, 16, 14, 1024Purity used when unit=gram
themeauto, light, darkautoLight, dark, or the visitor's system setting
localeen, ar, es, id, ja, ko, zhenLanguage and number formatting in the card

You rarely need to build this URL by hand. Set the options on the configurator and copy the iframe it generates.

If the widget doesn't show up

Blank space where the iframe should be, self-hosted WordPress. Almost always the unfiltered_html capability problem above: the block editor silently removed the tag on save. Re-add the block as an administrator, or check the saved post content in the editor's code view for a stripped iframe.

Nothing renders on WordPress.com. WordPress.com's free and lower-tier plans don't allow custom iframe embeds in the Custom HTML block; you need a plan with hosting features enabled. See WordPress.com's Custom HTML block support page for which plans qualify.

Widget loads but looks cut off. The card needs at least 320px of width and 190px of height. If your theme's sidebar or content column is narrower than that, place the widget in a full-width area instead of shrinking it.

When the API is the better choice

The iframe covers currency, unit, karat, theme, and language, but it is still a fixed card in a fixed layout. If you want the price inside your own component instead of an iframe, a design the theme options don't cover, or historical data for a chart of your own, use the raw API instead and build the display yourself. The gold price converter is a working example of what that looks like for currency and unit conversion.

License and attribution

The official iframe is free to embed on personal and commercial sites as long as it stays unmodified and its visible attribution stays intact. White-labeling it or presenting it as your own feed requires a separate Enterprise agreement. Raw API data used in your own product follows normal commercial licensing starting at the Pro plan. Full terms are in the Terms of Service and the attribution guide.

related guides

goldprice.dev

Live gold prices, historical OHLC, and multi-source aggregation — available via REST and SSE.