How to Set an Open Graph Image in Elementor

To set a specific Open Graph (OG) image for an Elementor page, open the page in Elementor, open Page Settings from the top bar, choose the Yoast SEO tab, then set the image under Social media appearance. Save or update the page and inspect its generated metadata. Elementor documents this control as part of its Yoast integration and says it is available to paid Yoast subscribers. Elementor’s Yoast integration instructions.

The Elementor Featured Image setting is useful page information, but Elementor’s documentation does not identify it as a direct OG image control. When you need a deliberate social preview image, use the explicit social appearance field if your setup provides it. Elementor Page Settings documentation.

1. Set the page’s social image in Elementor

1. In WordPress, open the page or post you want to share and select Edit with Elementor.
2. In the Elementor editor’s top bar, click the Page Settings icon.
3. Open the Yoast SEO tab.
4. Expand Social media appearance. Set the social image and, if needed, the social title and description. These settings are for the shared preview; they can differ from the page’s general title and content.
5. Save or update the page.
6. Check the published page’s HTML source for its Open Graph tags, then inspect the page with the preview/debugging tool for the social platform where you plan to share it.

Elementor’s integration guide says the Yoast social appearance controls include the preview image, title, and description. The names and location of controls can change between plugin versions, so if the tab or field is missing, check that guide against your installed Elementor and Yoast versions.

Choose an image that can be fetched

Use an image URL that is publicly reachable by the platform’s crawler. A file that requires a logged-in WordPress session, is blocked by access rules, or has been removed cannot serve as a reliable public preview image. After setting the field, verify the output in the page source rather than assuming that saving the editor produced the tag you intended.

2. Understand which image Yoast outputs

Open Graph metadata is a set of tags in the page’s HTML that describes the content of a shared URL. The image is normally exposed through an og:image tag. Yoast documents a selection order for regular content that makes the page-specific Facebook image the strongest explicit choice, followed by automatic image sources.

Priority	Yoast image source	What it means
1	User-defined Facebook image in the Yoast Social tab	Use this to deliberately choose the share image for this page.
2	Featured image	A useful fallback when no custom social image is set.
3	Prominent image from page content	Yoast may select an image from the page when higher-priority sources are absent.
4	Social default image in Search Appearance	A configured site-level fallback.
5	Site fallback or default social image	The final fallback depends on content type and configuration.

This order is from Yoast’s OpenGraph functional specification. It explains why changing only the Elementor featured image may not give you the exact social image you want: a different, page-specific social image can take priority, and automatic fallbacks depend on configuration.

Featured image versus Open Graph image

Elementor describes its Featured Image field as page information that represents the page. That is not the same as a documented promise that the field writes a specific og:image value. Yoast can use a featured image as a fallback, but its own documented hierarchy puts a user-defined social image first. For a page-specific result, set and verify the Yoast social image rather than relying solely on the Elementor Featured Image field.

3. Check the metadata after saving

Inspect the public page rather than the editor canvas. The relevant output should include one effective og:image value as well as the expected social title and description. Themes, SEO plugins, page caches, and server-side rendering can affect the final HTML.

1. Open the published URL in a private browser window where you are not signed into WordPress.
2. Use the browser’s page source or developer tools to find og:image, og:title, and og:description.
3. Confirm that the image URL points to the file you selected and that the tag appears in the rendered document’s source.
4. Use the destination platform’s sharing preview or debugger to check what that platform reads for the URL.
5. If source HTML is stale, clear the relevant WordPress or hosting cache and reload the public page before investigating the social platform.

Metadata inspection confirms what your site currently publishes. It does not guarantee that every social platform will immediately replace an already cached preview. Cache behavior and refresh steps vary; the reviewed documentation does not establish a universal refresh procedure or timing.

4. If Open Graph tags are missing

Yoast says Open Graph output is enabled by default. If no OG tags appear in the public source, check its setting at WordPress Dashboard > Yoast SEO > Settings > Site features > Social sharing, enable Open Graph data, and save. The exact menu wording may differ by version. Follow Yoast’s Open Graph setup instructions for the installed version.

Also check whether another SEO or social plugin is emitting its own Open Graph tags. Yoast warns that duplicate Open Graph generators can lead social networks to show incorrect titles, descriptions, or images. Choose one plugin to own the OG output, or disable the duplicate output in the other plugin, then inspect the page source again.

5. Troubleshoot the wrong or missing preview image

Symptom	Likely cause	What to do
The preview uses an older or unexpected image	A page-level social image or a higher-priority Yoast fallback differs from the Elementor Featured Image.	Check the Yoast Social tab first, then review the documented image hierarchy and inspect the actual og:image value.
The Yoast panel has no social image field	The integration feature may not be available on the current plan or the editor/plugin interface has changed.	Elementor lists Social media appearance as available to paid Yoast subscribers. Confirm the subscription and consult the current integration guide.
No og:image appears in page source	Open Graph output may be disabled, the SEO plugin may not be active for the page, or the generated source may be stale.	Check Yoast’s Social sharing feature setting, confirm the page is public, clear applicable site caches, and reload the source.
Several OG image tags or inconsistent metadata appear	More than one plugin or theme component is generating Open Graph data.	Have one component own the tags. Disable duplicate OG output and inspect the public source again.
The source has the right image, but the social preview is wrong	The platform may be using a previously fetched preview, or it may not be able to fetch the image URL.	Check the destination platform’s current preview/debugging tools, verify the image is publicly reachable, and allow for platform-specific caching without assuming an immediate update.
The preview image is blank or unavailable	The image URL may be private, invalid, redirected unexpectedly, or inaccessible to the crawler.	Test the image URL while logged out, use a stable public media URL, and recheck the page’s OG tag.

6. Or skip the browser setup

When your job is to capture the rendered page as an image for QA, documentation, or a workflow, ScreenshotNeo is a website screenshot API and MCP server. It is separate from setting the page’s Open Graph metadata: use the Elementor and Yoast controls above to publish social tags; use a screenshot capture when you need a rendered image of the page.

One GET request returns an image or PDF. See the ScreenshotNeo API documentation for request options. This cURL example saves a WebP screenshot of a page:

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp

Cookie banners, newsletter popups, and chat widgets are removed before the shot. Bot checks, blank pages, failed loads, timeouts, and cache hits are never billed; response headers tell you the page verdict and billing status. An MCP server gives AI agents tools to take screenshots, get page information, and capture PDFs. The free plan includes 1,000 screenshots each month with no card; paid plans start at $5 for 3,000 shots.

Sign up free for 1,000 screenshots a month, with no card required.

7. Performance, reliability, and cost considerations

For OG setup itself, the important reliability check is the public page’s generated metadata and whether the chosen image can be fetched. Keep a stable image URL, make one plugin responsible for Open Graph output, and verify after publishing. Social platform caches are outside the WordPress editor’s control, so distinguish a correct tag in your page source from the platform’s stored preview.

For repeated visual checks, a browser-based capture has to load the page and wait for the content you care about. Large pages, delayed scripts, lazy-loaded images, and network variability can affect completion time. Capture only the page area needed when a full-page result is unnecessary; for repeatable checks, set an explicit wait condition that matches the page. ScreenshotNeo supports full-page capture with lazy images loaded, selector captures, delay or selector waits, caching with a chosen TTL, and async jobs with signed webhooks. These options help shape a capture workflow, but do not change the Open Graph tags on the site.

ScreenshotNeo bills only clean shots. Bot checks and CAPTCHAs, blank pages, timeouts, failed loads, and cache hits are not billed, and the response identifies verdict and billing status in headers. The plans are Free: 1,000 per month; Starter: $5 for 3,000; Growth: $15 for 15,000; Pro: $39 for 60,000; Scale: $99 for 250,000; Business: $249 for 1,000,000. Yearly billing gives two months free, and every feature is on every plan. Select volume based on your expected capture workload; no screenshot plan is needed just to configure Elementor’s OG metadata.

FAQ

Does Elementor’s Featured Image automatically set the OG image?

Elementor documents Featured Image as page information, not explicitly as an OG image field. Yoast may use the featured image as a fallback, but a custom social image takes priority.

Can I use a different image for social sharing than on the page?

Yes, when the Yoast Social media appearance control is available in your Elementor setup, set the page’s social image separately from its ordinary content images.

Why is the social image option missing?

Elementor’s current integration guide lists Social media appearance as a paid Yoast subscriber feature. Also check whether the installed interface differs from the current guide.

Will updating the image immediately fix old shares?

Not necessarily. Your site may publish the new tag while a platform continues to show a previously fetched preview. Check that platform’s current preview tools and caching behavior.

Sources

• Elementor: Configure page settings
• Elementor: Yoast SEO integration with Elementor
• Yoast: OpenGraph functional specification
• Yoast: How to add Facebook’s Open Graph meta tags