ScreenshotNeo

BlogHow-to

How to screenshot product pages that show prices only after selecting a variant

Select the exact product option, wait for its price to update, then capture both together. Here’s how to make the result clear and useful.

By the ScreenshotNeo team4 October 20268 min read

To screenshot a product price that appears only after you choose a variant, select the exact size, color, or other option first. Wait until the page shows that selection and its price, then capture the product name, selected option, and price together. Variant selectors can update product details dynamically without reloading the page, so make sure the visible price corresponds to the option you chose before taking the screenshot. Shopify’s variant guidance describes updating the product media and price when a new variant is selected; Google Search Central also documents product pages where variant selection changes details such as price and availability.

1. Select the variant and capture its price

  1. Open the product listing in a browser and scroll to its product details.
  2. Choose the precise variant you need, such as a size, color, or model. If the seller or purchase option affects the displayed amount, select that too.
  3. Wait for the page to finish updating. Check that the selected option is visibly indicated and that the price has appeared or changed. Some pages update in place; others load a separate page.
  4. Frame the capture so the product identity, selected variant, and corresponding price are all legible. Include a price label or seller when it is needed to interpret the amount.
  5. Capture the visible screen, or use a full-page or scrolling capture if the details do not fit together. If your device has no full-page capture, save overlapping screenshots while keeping the same zoom and moving down the page in small steps.

Keep unrelated notifications and personal details out of the frame where practical. The screenshot records what the page displayed at that moment; it does not guarantee that the price or availability will remain the same.

2. Capture on a computer or phone

Use the built-in screenshot control for your device. Common shortcuts include:

Device Common capture control Notes
Windows Windows + Shift + S Select a region around the product details. Save the capture if prompted.
Mac Shift + Command + 4 Drag over the product name, selected option, and price.
iPhone Side button + Volume Up On models with a Home button, use Home + Side button.
Android Power + Volume Down Controls can vary by device maker and OS version.

Shortcuts and full-page capture availability can vary by device and software version. If a shortcut differs, check the current screenshot instructions for your specific device. For a long page, look for a scrolling or full-page option after taking the initial capture. If none is available, take multiple overlapping screenshots and preserve their order.

3. Make the screenshot easy to interpret

  • Show the chosen option. A visible selection state helps distinguish the price from other sizes or colors.
  • Keep the price with its context. Include a currency symbol and any relevant price label, seller, or purchase option.
  • Keep the product identifiable. Include its name or image so the screenshot can be tied to the correct listing.
  • Wait for dynamic updates. A click may change the variant without a page reload. Confirm the price has updated before capturing.
  • Use one image if it stays legible. If the important details are far apart, use full-page capture or a short sequence of overlapping images rather than shrinking everything until it is unreadable.

Prices can differ by variant. Shopify’s platform guidance describes updating price and product media when a variant changes, and Wix documents per-variant prices and an optional price range for products with differently priced options. These are implementation examples; they do not establish how any particular retailer handles its listing. See Wix’s product option and pricing guidance.

4. Capture variant pages with code

For a page you are authorized to access, browser automation can select an option and save the rendered page after the price updates. The example below uses Playwright for Python. It assumes the page has a button or other element with an accessible name matching the desired variant, and a price element identifiable by a CSS selector. Replace the URL, accessible name, and selector with values from the page. Install Playwright and its Chromium browser first with python -m pip install playwright and python -m playwright install chromium.

import asyncio
from pathlib import Path
from playwright.async_api import async_playwright

URL = "https://example.com/products/example"
VARIANT_NAME = "Blue, Large"  # Accessible name of the exact option
PRICE_SELECTOR = "[data-testid='product-price']"  # Adapt to the page

async def main():
    async with async_playwright() as p:
        browser = await p.chromium.launch(headless=True)
        page = await browser.new_page(viewport={"width": 1440, "height": 1100}, device_scale_factor=1)
        await page.goto(URL, wait_until="domcontentloaded", timeout=60000)

        # Click the exact option. For a native select, use page.select_option instead.
        await page.get_by_role("button", name=VARIANT_NAME).click()
        price = page.locator(PRICE_SELECTOR)
        await price.wait_for(state="visible", timeout=15000)
        await page.wait_for_load_state("networkidle", timeout=10000)

        # Capture the product region when possible; use full_page=True for long pages.
        await page.screenshot(path="variant-price.png", full_page=True)
        print("Selected option:", VARIANT_NAME)
        print("Displayed price:", (await price.inner_text()).strip())
        await browser.close()

asyncio.run(main())

Some shops keep analytics or other requests active, so networkidle may time out even after the price is ready. In that case, wait for the specific price or selected-option state, then take the screenshot without requiring network idle. For a native HTML select, replace the click with await page.locator("select[name='variant']").select_option(label=VARIANT_NAME). Use the page’s actual selector and option value.

cURL, Python, and Node.js with ScreenshotNeo

A regular HTTP screenshot request does not itself choose a product variant. The page must already display the desired state, or you need to supply suitable interaction logic using browser automation. ScreenshotNeo supports custom JavaScript and click-before-capture options; consult the ScreenshotNeo API documentation for the current parameter names and usage. The simple calls below capture a URL as it is rendered, so use a page state that already reflects the option you want.

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

r = requests.get(
    "https://api.screenshotneo.com/v1/shot",
    params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"},
    timeout=90,
)
r.raise_for_status()
open("shot.webp", "wb").write(r.content)
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
await import('node:fs/promises').then(fs => fs.writeFile('shot.webp', Buffer.from(await res.arrayBuffer())));

These examples use the supplied sample target. Replace it with the product page URL you need. Keep API keys private; do not put them in a public webpage or commit them to a repository.

5. Troubleshooting

Problem Likely cause What to do
The price is missing The variant has not been selected, or the page is still updating. Select the option again if needed, then wait for the price element to appear and verify the selected state.
The screenshot shows the previous price The capture happened before the dynamic update completed. Wait for the displayed price text or selected variant to change, rather than relying only on a fixed delay.
Several prices are visible The page shows a range, comparison price, subscription price, or multiple sellers. Include the selected variant and relevant price label or seller in the capture so the amount is unambiguous.
Variant selection navigates away The store uses a separate page or URL for each variant. Wait for navigation to finish, then confirm the destination page identifies the intended option and price.
A full-page capture omits content Images or product details may load only as the page is scrolled. Scroll through the relevant content before capturing, or use sequential overlapping screenshots.
Automation cannot find the option The accessible name or selector differs from the example. Inspect the rendered page, use the option’s actual accessible name or locator, and account for custom controls.
Automation times out waiting for network idle Persistent analytics or streaming requests keep the network active. Wait for the price or selected-state element instead, then capture.

6. Performance, reliability, and cost

A manual screenshot is usually the simplest approach for a one-off record. Browser automation adds setup and must handle each store’s selectors, loading behavior, and variant controls. Waiting for a specific visible price is generally more reliable than guessing a delay; a timeout should leave enough room for slow page loads, while still producing a clear error if the expected price never appears.

For repeated captures, save the product URL, selected variant, capture time, and screenshot together so the image can be interpreted later. Treat the image as a time-specific record, since a listing’s price and availability may change. Browser automation costs include the machine or service running the browser and the engineering time to maintain page-specific selectors. ScreenshotNeo’s plans are Free for 1,000 shots per month, Starter $5 for 3,000, Growth $15 for 15,000, Pro $39 for 60,000, Scale $99 for 250,000, and Business $249 for 1,000,000; yearly billing gives two months free. Every feature is available on every plan. Its billing rules say bot checks/CAPTCHAs, blank pages, timeouts, failed loads, and cache hits cost nothing, and responses identify page verdict and billing status in headers.

7. Or skip the browser setup

ScreenshotNeo is a website screenshot API and MCP server. For a page already in the desired variant state, one GET request returns a screenshot; the service also supports custom JavaScript and click-before-capture options for interaction workflows. Cookie banners, newsletter popups, and chat widgets are removed before capture, with each cleanup step configurable. Bot checks, blank pages, and failed loads are never billed. An MCP server lets AI agents use screenshot tools, and 1,000 screenshots per month are free with no card; paid plans start at $5 for 3,000.

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

See the API docs for request options. Sign up for 1,000 free screenshots a month, with no card required.

8. FAQ

Why does the price appear only after I select a size or color?

Some product pages display variant-specific information only after a choice is made. Store implementations differ, and a visible price range may be used when options have different prices.

Should I capture the whole page?

Only if the relevant details do not fit in a legible single view. Prefer one clear image when possible; otherwise use a full-page capture or overlapping sequential captures.

Does the screenshot prove what the product costs now?

It records what was displayed when captured. Prices, sellers, and availability may change later.