How to Screenshot Product Pages with Bundle Pricing and Quantity Discounts
Capture bundle and quantity pricing clearly with Firefox or Chrome DevTools. Choose a full-page image for context or a focused crop for price evidence.
To screenshot a product page with bundle pricing or quantity discounts, first select the relevant product option and quantity, then verify that the displayed price and discount wording are visible. Use a full-page screenshot when you need surrounding page context or pricing details in multiple places; use a focused region when the pricing panel itself is the evidence. The exact controls and discount rules vary by retailer, so describe only the state the page actually displays.
This guide uses built-in Firefox and Chrome DevTools capture features. It does not assume that a discount appears after a particular quantity, sign-in, or checkout step.
1. Prepare the product page and verify the price state
- Open the product page and choose the relevant variant, bundle, pack size, or quantity if the page provides those controls.
- Wait for the page to update. Check the product name or option, selected quantity, displayed total, and any discount or unit-price wording you need to document.
- Make sure the relevant information is in the visible page state. If the page reveals a price only after another step, capture the state that is actually shown and label it accurately.
- Decide whether the image needs the rest of the page for context or whether a crop of the pricing panel will be clearer.
This is a practical workflow, not a claim about how any particular retailer calculates or reveals discounts.
2. Choose a full-page screenshot or a focused crop
| Capture | Choose it when | Check before sharing |
|---|---|---|
| Full page | The price is below the fold, several page sections explain the offer, or the image needs more context. | The full image is readable at the size where it will be viewed; long pages can shrink small pricing text. |
| Visible viewport | The entire relevant offer is already on screen and you want a quick capture. | The selected option and quantity are visible alongside the price. |
| Selected region or area | The pricing panel is the key evidence and a shorter image is easier to inspect. | The crop includes enough nearby product or offer context to identify what the price refers to. |
Firefox supports full-page, visible-area, selected-region, and automatically highlighted page-part captures. Chrome DevTools offers a screenshot of the current viewport and a full-size screenshot of the page. Mozilla’s Firefox screenshot instructions and Chrome DevTools device-mode documentation describe these options.
3. Capture in Firefox
- Right-click an empty part of the page and choose Take Screenshot. You can also use Ctrl+Shift+S on Windows or Linux, or Command+Shift+S on macOS.
- Choose the capture area: drag to select a region, click an automatically highlighted page part, choose Save full page, or choose Save visible.
- Choose Download to save an image, or Copy to put it on the clipboard. Press Esc to cancel.
- Open the resulting image and inspect the selected quantity and displayed price at its intended viewing size.
Firefox also supports keyboard movement and adjustment of the selection. Its documentation notes that moving the crosshair does not work on Wayland. See Mozilla Support’s full instructions for selection and keyboard details.
4. Capture in Chrome DevTools
Full page or current viewport
- Open DevTools and turn on the device toolbar if you need to inspect a narrower responsive layout.
- In the device toolbar, set a responsive width or choose a device preset. Re-check the product option and quantity at that width; responsive layouts can move controls or price text.
- Open the DevTools command menu with Ctrl+Shift+P on Windows/Linux/ChromeOS or Command+Shift+P on macOS. Type
screenshotand choose the relevant command, or use the device toolbar’s More options menu. - Choose Capture screenshot for the visible viewport or Capture a full size screenshot for the page, including content outside the viewport.
- Review the saved image for legibility and context.
Chrome device mode is a first-order approximation: it simulates a mobile viewport from a desktop computer and does not run the page on an actual phone. If the screenshot is meant to represent a real device, check the page on that device too. See Chrome’s device-mode guide.
Capture only the pricing area
- Open DevTools and press Ctrl+Shift+P on Windows/Linux/ChromeOS or Command+Shift+P on macOS.
- Type
screenshotand choose Capture area screenshot. - Drag around the price, selected quantity, discount wording, and enough nearby product context.
- Inspect the resulting image before sharing it.
Chrome documents the Command Menu and screenshot commands in its Command Menu documentation.
5. Make the capture useful as evidence
- Keep the selected quantity visible. A price without its corresponding quantity or bundle size can be ambiguous.
- Include the displayed total and discount language. Do not infer a discount from a struck-through price or calculate one unless the page itself supports that interpretation.
- Preserve enough identifying context. Include the product name, selected variant, or nearby offer label when possible.
- Check image readability. A very tall full-page image may make small text difficult to read. Use a focused crop as a companion when the price panel needs close inspection.
- Keep the capture faithful. Avoid editing out conditions or surrounding text that changes what the offer means.
Mozilla says Firefox Screenshots collects interaction events such as use of Copy or Save full page, and states that it does not collect the URL or details of the captured image. That statement applies to Firefox Screenshots as described in Mozilla’s documentation, not to screenshot tools generally.
6. Troubleshooting
| Problem | Likely cause | What to do |
|---|---|---|
| The screenshot shows the old price or quantity. | The page has not finished updating after a selection, or a control did not take effect. | Wait for the page to settle, verify the selected state on the page, and capture again. |
| The price is missing from a full-page capture. | The relevant section may not have rendered yet, or the content may require scrolling or interaction. | Scroll to the section and confirm it is rendered. If needed, capture that section separately and retain the relevant context. |
| The discount wording is too small to read. | A full-page image compresses a tall page into a small display. | Use a focused region or viewport capture of the price panel, or provide both a full-page context image and a readable detail crop. |
| Chrome’s mobile screenshot does not match a phone. | Device mode approximates a mobile view from a desktop environment. | Use device mode to capture a responsive layout, but verify on an actual phone if the exact device rendering matters. |
| Firefox’s selection crosshair will not move with arrow keys. | Mozilla documents a Wayland limitation for crosshair movement. | Use pointer selection or another supported capture choice; consult the Firefox instructions for keyboard behavior. |
| The image does not show what a price depends on. | The crop omitted the option, quantity, or offer context. | Capture a wider region or use a full-page image, then review the image as a reader would. |
7. Performance, reliability, and cost
For a one-off capture, browser tools avoid setting up a separate screenshot service. Full-page captures can produce tall images that are harder to inspect and may take longer to render on pages with deferred content; allow the page to settle and verify the saved result. A crop is smaller and easier to read, but can omit context. If you need repeatable captures across many URLs, a browser screenshot API can automate capture; confirm the selected state is actually represented in the returned page image rather than assuming the retailer applies a particular offer. Browser captures described here have no per-request API price; automation services can have their own usage and plan terms.
Or skip the browser setup
ScreenshotNeo is a website screenshot API and MCP server. A single GET request captures a URL as an image or PDF. For a public product page, use the following examples; replace the example URL with the page you are allowed to access. API details and options are in the ScreenshotNeo documentation.
cURL
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp
Python
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)
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}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
await import('node:fs/promises').then(({ writeFile }) => writeFile('shot.webp', Buffer.from(await res.arrayBuffer())));
These calls capture the page URL; they do not choose a bundle or quantity in the retailer’s interface. Make sure the target URL itself opens in the product state you intend to document.
- Cookie and consent banners, newsletter popups, and chat widgets are removed before the shot; each cleanup step can be turned off.
- Bot checks or CAPTCHAs, blank pages, timeouts, failed loads, and cache hits are not billed. The response identifies the page verdict and billing status in headers.
- An MCP server lets AI agents, including Claude, Cursor, and other MCP clients, use screenshot tools.
- 1,000 screenshots per month are free with no card; paid plans start at $5 for 3,000 screenshots.
Sign up for 1,000 free screenshots a month, with no card required.
Frequently asked questions
Can a screenshot prove that a quantity discount was available?
It can document what the page displayed in the captured state. It does not, by itself, establish eligibility, inventory, or whether the price would remain available at checkout.
Should I include browser chrome around the page?
For a clear record of page content, the browser’s built-in page screenshot is usually the relevant view. If the destination or capture time matters to your record, document that information separately rather than shrinking the pricing text to include unnecessary surroundings.
Can I copy a Firefox screenshot instead of downloading it?
Yes. Firefox’s screenshot panel offers both download and clipboard copy options, as described in Mozilla Support.


