Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

To change the picture on a WordPress homepage, first identify what owns it: an Image block, Cover block, page or template, site-wide background, classic-theme Customizer setting, or Elementor container. Open that owner, replace the image, adjust its crop or position, save, and check the public homepage at phone and desktop widths. The correct menu depends on how your homepage was built.

First identify which homepage you are editing

WordPress can show either a page you selected as the front page or a list of your latest posts. By default, WordPress displays the latest posts on the homepage. If you expected to edit a page but cannot find the visible image, check the display setting first.

  1. Open Settings → Reading.
  2. Under homepage display, see whether Your latest posts or A static page is selected.
  3. If it is static, note the page selected as Homepage. That is usually the page whose content you need to edit. A separate Posts page can be selected for your blog listing.
  4. Save any change, then open the public homepage in a new tab so you can compare the editor with the actual result.

The Customizer may also expose Homepage Settings, depending on the theme. A block theme instead uses the Site Editor described below.

Change an image in a block-theme homepage

Block themes can place homepage content in a template rather than in the page editor. Go to Appearance → Editor → Templates. Look for Front Page or Home. Open the template that controls the homepage and select the image or section you want to change. If the site uses a static page with a design different from other pages, the page and its template can both affect what visitors see.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Replace a normal Image block

  1. Open the homepage page or controlling template in the editor.
  2. Click the image. The block toolbar should appear.
  3. Choose Replace.
  4. Select an image from the Media Library or choose Upload to add a file from your computer.
  5. Use the block settings to set an alternative text description, link, dimensions, or alignment as needed.
  6. Click Save (or Update when editing a page), then view the public homepage.

If the image is also used as the page’s featured image, open the Image block’s More options menu and choose the featured-image command where available. Changing the image displayed in the page body and changing the featured image are separate actions unless the design is configured to use the featured image.

Replace a Cover block background

A Cover block is commonly used for a hero banner with text over an image. Select the Cover block, choose its media replacement control, and select or upload the new file. A Cover can use its own selected image or the page’s featured image as its background. Check which source it uses before changing the featured image, because changing one source may not affect a Cover that has its own background.

After replacing the image, adjust the Cover’s focal point and overlay if the subject is cut off or text no longer has enough contrast. The focal-point control determines which part remains visible as the block crops to its box.

Change a background on an individual block

Some supported blocks expose background controls in the right settings sidebar. Select the block, open the sidebar, and inspect the Styles tab for Background. Select the current image name, then choose another Media Library image or upload one. These controls change how the block is painted; they do not replace an unrelated Image block elsewhere on the page.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Change the whole site’s block-theme background

For a site-wide background, use Appearance → Editor → Styles → Background. This Styles route requires a block theme and WordPress 5.9 or later. Select the existing background image and choose a replacement from the Media Library or upload one, then save the Styles changes.

Background display settings explain many apparent failures:

  • Focal point: keeps the important subject in view when the image is cropped.
  • Cover: fills the available area, so some edges may be trimmed.
  • Contain: keeps the entire image visible, potentially leaving empty space.
  • Tile: repeats a smaller image across the background.

Change the image with a classic WordPress theme

Classic themes generally use the Customizer, but its panels are theme-dependent. Open Appearance → Customize and look for Background Image, Header Media, Hero, or a theme-specific homepage panel.

  1. Open the relevant image panel.
  2. Choose Change Image, select a Media Library file, or upload a new one.
  3. Use the available position, size, repeat, and scroll/fixed options to control the result.
  4. Click Publish.

If there is no Background Image panel, that is not necessarily an error: the theme may not support it, or the homepage image may be controlled by a page template, widget, or builder. Do not assume every classic theme offers the same controls.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Change a homepage background in Elementor

When Elementor controls the homepage, edit the page with Elementor and select the container that owns the background. Elementor’s current layouts use containers; older layouts use Sections.

  1. Open the homepage and click Edit with Elementor.
  2. Click the relevant Container (or legacy Section) to open its settings panel.
  3. Open Style → Background.
  4. Choose the image control, select a Media Library image, or upload a file.
  5. Set the background position, size, and repeat.
  6. Click Update, then inspect the public page.

Position choices such as center or top determine which part of an oversized image remains visible. A different position may be necessary on mobile because the container becomes narrower. Elementor’s exact labels can vary between container and legacy-section layouts.

When the replacement looks wrong

The old image is still visible

  • Confirm that you edited the page selected under Settings → Reading, not a similarly named draft.
  • Check Appearance → Editor → Templates for a Front Page or Home template that overlays the page content.
  • Inspect both the block background and any nested Image or Cover block.
  • Clear any site, plugin, browser, or CDN cache, then perform a hard refresh.

The image is cropped or the subject disappears

Adjust the Cover or background focal point, position, and size. Cover intentionally fills the box and crops overflow; Contain preserves the complete image but may not fill the space. Check the result at the actual mobile breakpoint instead of judging only from the editor canvas.

The background control is missing

You may be using a classic theme without Customizer background support, a block that does not expose background settings, or a page builder. Return to the ownership check and try the template, Customizer, or Elementor route that matches the site’s construction.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Text became hard to read

For a Cover or hero background, increase the overlay contrast, move the focal point away from the text, or choose an image with a quieter area behind the heading. Recheck keyboard focus and readability after changing the image.

The image changed in the editor but not for visitors

Make sure you saved the template, Styles panel, page, or Elementor document—not just the media upload. Open the public URL while logged out or in a private window to bypass editor previews and account-specific caching.

Quality, accessibility, and maintenance checks

  • Give a meaningful image alternative text when the image conveys information. Use empty alternative text for purely decorative backgrounds so assistive technology does not announce redundant content.
  • Keep important faces, products, and logos near the center or another safe focal area because responsive layouts crop differently.
  • Use the smallest practical file and an appropriate format. WordPress can serve common raster formats, while the theme or plugin may determine whether modern formats are generated.
  • Do not place essential wording only inside the bitmap; headings and calls to action should remain real text.
  • Review the homepage at desktop and narrow mobile widths, with browser zoom increased, before considering the change complete.
  • If you replace a file rather than editing its attachment, check old pages and templates that may still reference the original media item.

Or skip the browser setup

If your goal is to capture the finished homepage for documentation, QA, social previews, or an automated workflow, ScreenshotNeo returns a screenshot or PDF from one request. It is separate from changing the WordPress media itself, but it can verify what the public page actually renders after you save the new image.

With an API key, the cURL example is:

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

Replace the example URL with your public WordPress homepage. The ScreenshotNeo documentation lists the available parameters and response behavior.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Python:

import requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)

Node.js:

const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);

ScreenshotNeo accepts cookie and consent banners before capture and removes more than 60 known consent platforms, newsletter popups, and chat widgets; each step can be disabled. Bot checks or CAPTCHAs, blank pages, timeouts, failed loads, and cache hits are not billed, and response headers identify the page verdict and billing status. Its MCP server provides take_screenshot, get_page_info, and capture_pdf tools for Claude, Cursor, and other MCP clients. The free plan includes 1,000 screenshots per month with no card; paid plans start at $5 for 3,000 shots. Create a free ScreenshotNeo account.

Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

FAQ

Why can I edit the page but not the homepage image?

The visible image may belong to a Front Page or Home template, a site-wide background, a widget, or Elementor rather than the page body. Inspect the owning template or builder.

Does changing the featured image always change the homepage hero?

No. A Cover can be configured to use the featured image, but it can also have its own background. Verify the Cover’s selected source.

Can I use a background image on every WordPress theme?

No. Classic-theme Customizer panels are theme-dependent, and block-theme Styles controls require a block theme with WordPress 5.9 or later.

What’s actually slowing this PC down?

Pick the symptom - the matching free tool is one click away.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

What should I check after replacing a hero image?

Check the public page at desktop and mobile widths, confirm the focal point and text contrast, and verify that the saved template, Styles, page, or Elementor document—not merely the uploaded media—was published.

Frequently Asked Questions

Why can I edit the page but not the homepage image?

The visible image may belong to a Front Page or Home template, a site-wide background, a widget, or Elementor rather than the page body. Inspect the owning template or builder.

Does changing the featured image always change the homepage hero?

No. A Cover can be configured to use the featured image, but it can also have its own background. Verify the Cover’s selected source.

Can I use a background image on every WordPress theme?

No. Classic-theme Customizer panels are theme-dependent, and block-theme Styles controls require a block theme with WordPress 5.9 or later.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

What should I check after replacing a hero image?

Check the public page at desktop and mobile widths, confirm the focal point and text contrast, and verify that the saved template, Styles, page, or Elementor document—not merely the uploaded media—was published.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.