How to screenshot product pages with subscription and one-time prices

To screenshot a product page that shows subscription and one-time prices clearly, select the exact product variant and purchase option first. Capture the displayed amount, currency, billing interval, and any introductory or renewal terms that affect what the customer pays. If both options do not fit legibly in one view, capture separate focused screenshots and label each one.

A screenshot records what the page showed at a particular time and state. It does not by itself establish that a price is still available later or that a saving claim is valid. Preserve the date, region or currency, variant, and selected plan when using the image as documentation.

1. Prepare the product page and selected state

Open the exact product page and select the relevant variant, such as size, color, or pack quantity.
Choose the subscription duration or delivery schedule you need to document. Do not assume the default selection is the intended plan; some implementations preselect a subscription option.
Record the subscription amount and how often it is charged. Include any per-delivery or unit price, prepaid total, signup fee, free trial, or expiration when the page displays it.
Look for an introductory price and a later renewal amount. If the renewal terms are shown elsewhere or only after selecting an option, capture that state too.
Switch to the one-time purchase option and confirm its displayed amount and currency. If the page shows both choices at once, verify that each is clearly labeled.

Shopify’s subscription UX guidance recommends making the subscription price and any savings against a one-time purchase clear. Its guidance also addresses compare-at pricing, unit pricing, prepaid per-delivery pricing, and subscription badges. These are Shopify implementation recommendations, not universal legal rules. WooCommerce describes subscription price as the charge for each billing period and supports schedules, signup fees, trials, and expiration. Preserve whichever of these details the product page actually shows.

2. Choose a capture that stays readable

Use a viewport screenshot if the product identity, selected purchase option, price, and relevant billing terms fit on screen at a readable size. If the information is spread through a long page, take a full-page screenshot or separate focused screenshots. Shrinking a very long page to fit one image can make prices and terms too small to inspect.

When a focused image does not show enough context, include the product name and the selected variant in another frame or in the filename and accompanying notes. Avoid cropping away a label that distinguishes recurring billing from a one-time charge.

Chrome DevTools: desktop viewport or full-page screenshot

Open the product page in Chrome and select the exact variant and purchase state.
Open DevTools with F12 or Ctrl+Shift+I on Windows/Linux, or Cmd+Option+I on macOS.
Open the DevTools command menu with Ctrl+Shift+P or Cmd+Shift+P.
Type screenshot and choose Capture screenshot for the current viewport, or Capture full size screenshot for the full page.
Inspect the saved image at normal size. Confirm the price, currency, selected state, billing cadence, and product context remain readable.

Chrome DevTools documents both viewport and full-size capture. Full-size capture includes content outside the viewport; the page may need to finish loading before the capture reflects lazy-loaded content.

iPhone: capture a full-page Safari webpage

Open the product page in Safari on iPhone and set the intended variant and purchase option.
Take a screenshot using the iPhone’s hardware-button method for your model.
Tap the screenshot preview, then choose Full Page if Safari offers it for that webpage.
Save or share the result and verify that the purchase selector and terms are large enough to read.

Apple documents full-page screenshots for content longer than the screen, including webpages in Safari. A full-page mobile image can be tall, so use a second focused image if the selected price and terms are difficult to read in the complete capture.

3. What the screenshot should preserve

Detail	What to check
Purchase type	The selected option is visibly one-time or recurring.
Amount and currency	The amount is legible and its currency is apparent from the page or capture context.
Billing cadence	For a subscription, the interval is visible, such as monthly or every three months.
Price timing	Introductory and later renewal amounts are both documented when the page shows a change.
Price basis	Preserve per-item, per-delivery, or prepaid-total details when shown.
Savings basis	Include the comparison price and conditions shown by the page; do not infer a saving from two amounts alone.
Variant and state	The size, color, plan, or other selection matches the price shown.
Context	The image identifies the product and retains enough page context to understand the selected state.

If the image is evidence for a support case, audit trail, or internal review, keep an unedited original. Add context in a filename or separate note rather than painting over, changing, or removing price terms. Record the capture date, device or browser, region or currency, variant, and selected plan.

4. Capture repeatably with a script or API

For occasional documentation, the browser workflows above are usually enough. For repeated captures, an API can request a viewport or full-page image without manually opening DevTools each time. A scripted capture does not automatically select a subscription option in the merchant’s page: first make sure the URL or page state reliably opens with the intended variant and selection. If interaction is required, use browser automation to select it before capture.

For a minimal DIY API example, use a screenshot endpoint that accepts a target URL and returns an image. Replace the example URL with the actual product URL and consult that provider’s documentation for its authentication and full-page parameters:

curl -G "SCREENSHOT_API_ENDPOINT" \
  --data-urlencode "url=https://shop.example/products/item" \
  -o product.png

SCREENSHOT_API_ENDPOINT is a placeholder, not a real URL. The provider’s API documentation determines the valid endpoint, credentials, output type, viewport, and full-page option. Do not put private API keys in a shared command history or public repository.

5. Or skip the browser setup

ScreenshotNeo is a website screenshot API and MCP server for developers. One GET request can return a PNG, JPEG, WebP, or PDF. For this page, use the product URL and then inspect the returned image to confirm the intended purchase state is visible. See the ScreenshotNeo API documentation for the available parameters.

cURL

curl -G "https://api.screenshotneo.com/v1/shot" \
  -d access_key=YOUR_API_KEY \
  --data-urlencode url=https://shop.example/products/item \
  -o shot.webp

Python

import requests

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

Node.js

const q = new URLSearchParams({
  access_key: 'YOUR_API_KEY',
  url: 'https://shop.example/products/item',
});
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
const bytes = new Uint8Array(await res.arrayBuffer());
await import('node:fs/promises').then(fs => fs.writeFile('shot.webp', bytes));

These examples capture the URL as it loads; they do not select the right size, subscription duration, or one-time option for you. For pages where the initial state is wrong, use ScreenshotNeo’s click-before-capture or custom JavaScript options to set the page state, then verify the resulting image. Full-page capture is available for long pages.

ScreenshotNeo removes cookie and consent banners, newsletter popups, and chat widgets before capture; each cleanup step can be turned off. Bot checks, blank pages, failed loads, timeouts, and cache hits are not billed, and responses include X-Page-Verdict and X-Billed headers. 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 a month with no card; paid plans start at $5 for 3,000 screenshots.

6. Reliability, performance, and cost

Keep the page state deterministic. A product page can choose a default plan, change prices after a selection, or use client-side rendering. Confirm that the capture shows the intended variant and option every time. If you automate selection, wait for the displayed price and billing text to update before capturing.
Wait for delayed content. Lazy-loaded images or prices rendered by page scripts may not appear immediately. A browser full-page capture or API capture can miss content that has not loaded. Scroll through the page or configure a suitable wait in an API or automation workflow, then inspect the result.
Prefer focused images for legibility. Full-page captures preserve context but can make the purchase details small. Use a viewport or element-focused shot for the selector, with a full-page image as supporting context if useful.
Make retries deliberate. If navigation times out, determine whether the page actually loaded before retrying. For automated runs, keep the source URL, capture time, selected state, and response status with the resulting file so duplicates and stale captures can be identified.
Budget for useful captures. Manual browser screenshots have no API-call charge. API pricing and what counts as a billable capture depend on the provider; check its current plan and billing rules. ScreenshotNeo’s stated plans are free for 1,000 per month, then Starter $5/3,000, Growth $15/15,000, Pro $39/60,000, Scale $99/250,000, and Business $249/1,000,000; yearly billing gives two months free. Every feature is on every plan.

7. Troubleshooting

Problem	Likely cause	Fix
The screenshot shows the wrong price	A different variant or purchase option was selected, or the page changed the price after load.	Reopen the page, explicitly select the intended variant and option, wait for the price to update, and capture again.
The page shows a subscription price but no interval	The cadence is below the fold, hidden in plan details, or omitted from the selected state.	Expand the relevant details and capture them. If the page does not display the interval, do not infer it; note that it was not visible.
The introductory amount is visible but renewal terms are not	Renewal details may appear in another section, tooltip, or checkout step.	Capture the page section that actually displays the later amount and label the captures as separate states. Do not imply the intro amount continues.
The full-page capture is blank or cuts off content	The page may still be rendering, or content may load only after scrolling.	Wait for load completion, scroll through the page to trigger lazy content, then capture again. Use focused screenshots if full-page capture remains unreliable.
The price text is too small to read	A very tall page was reduced to fit the image or the viewport is too wide.	Capture the selector and price at viewport scale, or make a second focused capture. Keep the full-page image only as context.
A pop-up covers the purchase selector	A newsletter, consent, or chat widget is covering the page.	Dismiss it using the page’s controls before a manual capture. With an API capture, use a cleanup feature if available, and verify that no relevant pricing information was removed with the overlay.
The saved image does not match the selected state	The selection was not persisted in the URL or the capture opened a fresh page with its default plan.	Automate the selection as part of capture, or use a shareable URL that preserves state if the store provides one. Inspect every output rather than assuming a successful request means a correct state.
An API request returns an error or non-image response	The endpoint, key, target URL, or provider-specific parameters may be invalid, or the target failed to load.	Check the provider’s docs, HTTP status, and response headers. Confirm the target URL works in a browser and distinguish an error response from image bytes before saving it as an image.

8. Frequently asked questions

Should I put subscription and one-time prices in one screenshot?

Yes, when both are visible and readable with their labels and billing terms. Otherwise, take separate images and identify the option shown in each.

Can a screenshot prove that the offer is still available?

No. It documents the page as captured. Include the capture date and context, and revisit the live page when current availability matters.

Should I include the checkout page?

Only if checkout is needed to document a term that the product page does not show. A checkout screenshot is a separate page state; label it clearly and avoid exposing personal or payment information.

Is the displayed saving always the right comparison?

Do not assume that. Preserve the page’s stated comparison and conditions, and avoid adding a savings calculation unless the page supports its basis.