ScreenshotNeo

BlogHow-to

How to Capture a Full-Page Screenshot of a Shopify Store with CaptureKit

Capture a public Shopify page with CaptureKit’s screenshot API. Set full_page=true, handle lazy loading, and save the result as an image or PDF.

By the ScreenshotNeo team4 October 20269 min read

To capture a public Shopify storefront page with CaptureKit, send its URL to GET https://api.capturekit.dev/v1/capture, authenticate with the x-api-key header, and set full_page=true. If the theme loads images or sections as the page scrolls, also set full_page_scroll=true. CaptureKit returns PNG by default and also documents JPEG, WebP, and PDF output. Inspect the artifact: a successful API response does not guarantee every Shopify theme section or third-party widget rendered as expected.

CaptureKit describes its endpoint as a “Browser-like Screenshot API” for webpage captures in its official API reference.

1. Choose the storefront URL

Use the intended public URL for the page you need to archive or review: a homepage, collection, or product page. The API takes a webpage URL as a query parameter. The available documentation does not establish whether password-protected stores, theme previews, Shopify preview tokens, or pages requiring session cookies can be captured. Do not assume those private pages are accessible; use a public page URL for this flow.

2. Create and protect an API key

  1. Create a CaptureKit account and issue an API key through the official dashboard workflow.
  2. Keep the key in a server-side environment variable or secret manager. Do not place it in browser JavaScript, a public repository, or a URL.
  3. Send it as the x-api-key request header. CaptureKit’s help center recommends verifying a key with /v1/usage before integrating an endpoint; consult the CaptureKit help center for the account and API key flow.

3. Make a full-page capture

This cURL request writes the response body to shopify-store.webp. The endpoint reference lists PNG as the default; the example explicitly asks for WebP.

export CAPTUREKIT_API_KEY='YOUR_API_KEY'

curl --fail-with-body --get 'https://api.capturekit.dev/v1/capture' \
  --header "x-api-key: ${CAPTUREKIT_API_KEY}" \
  --data-urlencode 'url=https://your-store.example/products/example-product' \
  --data-urlencode 'full_page=true' \
  --data-urlencode 'full_page_scroll=true' \
  --data-urlencode 'format=webp' \
  --output shopify-store.webp

Replace the example URL with the public Shopify URL. If the store uses a custom domain, use that canonical storefront URL. The request uses --data-urlencode so query strings and reserved characters in the target URL are encoded safely.

Python

Install the HTTP client with python -m pip install requests. This saves the response bytes after checking for an HTTP error.

import os
import requests

api_key = os.environ["CAPTUREKIT_API_KEY"]
endpoint = "https://api.capturekit.dev/v1/capture"
params = {
    "url": "https://your-store.example/products/example-product",
    "full_page": "true",
    "full_page_scroll": "true",
    "format": "webp",
}

response = requests.get(
    endpoint,
    headers={"x-api-key": api_key},
    params=params,
    timeout=120,
)
response.raise_for_status()

with open("shopify-store.webp", "wb") as image_file:
    image_file.write(response.content)

Use the response format you requested when choosing the output filename. If the API returns an error body, raise_for_status() surfaces the HTTP failure instead of saving that body as an image.

Node.js

This example uses the built-in fetch available in current Node.js versions. It URL-encodes the parameters and rejects non-success responses.

import { writeFile } from "node:fs/promises";

const params = new URLSearchParams({
  url: "https://your-store.example/products/example-product",
  full_page: "true",
  full_page_scroll: "true",
  format: "webp",
});

const response = await fetch(
  `https://api.capturekit.dev/v1/capture?${params}`,
  { headers: { "x-api-key": process.env.CAPTUREKIT_API_KEY } },
);

if (!response.ok) {
  throw new Error(`CaptureKit returned HTTP ${response.status}: ${await response.text()}`);
}

await writeFile("shopify-store.webp", Buffer.from(await response.arrayBuffer()));

4. Tune full-page behavior and output

The essential parameters are url and full_page=true. These documented optional settings address common Shopify storefront differences:

Parameter When to use it
full_page_scroll=true Scroll before capture to help trigger lazy-loaded sections and images. The documented default is false.
full_page_scroll_duration Set the scroll duration in milliseconds if the default timing is insufficient. The documented default is 400 ms; treat it as a starting point, not a guarantee for every theme.
format Choose png, jpeg, jpg, webp, or pdf. PNG is the documented default. Use a format suited to the destination and verify the returned content before processing.
wait_until Choose a documented browser wait condition: domcontentloaded, load, networkidle0, or networkidle2. Network-idle waits can be unsuitable for pages with ongoing requests.
delay Add a delay in seconds before capture when theme animations or delayed content need more time. The reference documents a 0–10 second range and a zero default.
wait_for_selector Wait for a specific element to appear, such as a product detail region. Pick a selector present on the target page.
viewport_width, viewport_height Set the browser viewport in pixels when the capture should represent a particular desktop layout. The documented default is 1280×1024.
device Emulate one of the documented device presets when you need a mobile or tablet layout. Available presets include iPhone, iPad, Pixel, Galaxy, Redmi, and Huawei models. Emulation is a preset, not proof of identical rendering on every physical device.
scale_factor Request a higher-resolution capture where needed. Check the resulting dimensions and file size in your workflow.
image_quality Set quality for supported JPEG and WebP output. The reference lists a default quality of 80.
selector Capture a specific page element instead of the full viewport. This is useful for a product panel or a section, but is not a substitute for a full-page capture.
remove_selectors Pass comma-separated selectors to hide page elements such as a known popup.
remove_cookie_banners, remove_ads Ask the service to remove cookie banners or ads before capture.
block_resources, block_urls Block resource types or matching URLs when appropriate. Blocking scripts, stylesheets, or images may make a storefront incomplete, so use selectively.
cache, cache_ttl Enable response caching and choose a TTL in seconds. The documented TTL range is 3,600–2,592,000 seconds. A cached capture can be stale after a theme or product update.
proxy Route via a supported HTTP, HTTPS, or SOCKS5 proxy when your use case requires it. The reference documents credentials in the proxy URL format; protect these secrets as carefully as API keys.
s3_url, s3_bucket, s3_access_key_id, s3_secret_key, s3_region, s3_object_key, storage_endpoint Use the documented S3 or S3-compatible storage settings when the capture should be uploaded to your storage destination. Keep storage credentials private and configure the endpoint only when required.

For example, this request adds a selector wait and a longer scroll interval while retaining full-page output:

curl --fail-with-body --get 'https://api.capturekit.dev/v1/capture' \
  --header "x-api-key: ${CAPTUREKIT_API_KEY}" \
  --data-urlencode 'url=https://your-store.example/collections/new-arrivals' \
  --data-urlencode 'full_page=true' \
  --data-urlencode 'full_page_scroll=true' \
  --data-urlencode 'full_page_scroll_duration=1200' \
  --data-urlencode 'wait_until=networkidle2' \
  --data-urlencode 'wait_for_selector=main' \
  --data-urlencode 'format=png' \
  --output collection.png

Use a wait strategy that matches the page: a widget that keeps polling may prevent a network-idle condition from becoming useful, while a selector wait can target the content you actually need. Avoid combining settings blindly; change one at a time and inspect the result.

5. Check the result against the live page

  1. Open the saved image or PDF and check the top, middle, and bottom of the page.
  2. Confirm that product imagery, collection cards, navigation, and any relevant app widgets appear as expected.
  3. If a section is absent, check whether it is lazy-loaded, delayed, or conditional on interaction. Try full-page scrolling, an appropriate delay, or a selector wait.
  4. For a mobile capture, check that the selected device or viewport produced the intended responsive layout.
  5. For a recurring capture job, record the requested URL, format, relevant parameters, timestamp, and HTTP status so you can compare changes and diagnose failures.

Public storefronts can still vary with geolocation, theme state, inventory, personalization, and third-party scripts. The documentation does not promise that a password-protected Shopify preview or every dynamic theme will work. Validate the output for the specific page you need.

6. Troubleshooting

Symptom or status Likely cause What to do
400 Bad Request A required or optional parameter is malformed or missing; the URL may also be incorrectly encoded. Check that url is a complete public URL, encode query parameters, and verify parameter spelling and values against the endpoint reference.
401 Unauthorized The API key is absent, invalid, inactive, or expired. Send the exact x-api-key header, check the key in the dashboard, and verify authentication through the documented usage endpoint.
402 Payment Required The subscription or available credit balance is insufficient. Review account balance and subscription status in the CaptureKit dashboard.
429 Too Many Requests The API key exceeded its rate quota. Reduce request concurrency or frequency, then retry according to your application’s backoff policy. Avoid an immediate tight retry loop.
500 Internal Server Error The service encountered an internal error. Retry with bounded backoff. If it continues, use CaptureKit API Logs and Analytics to inspect the request and investigate with the provider.
Image file contains an error message or is unreadable The client saved a non-success response as if it were an image, or the requested format and file extension do not match. Check the HTTP status before writing bytes, inspect the response content type/body, and align the extension with the requested format.
Bottom of the page is blank or sections are missing Lazy loading did not trigger, content rendered after capture, or the page requires an interaction. Enable full_page_scroll, adjust full_page_scroll_duration, add a suitable delay or selector wait, and inspect the page behavior. Some interactive content may not be capturable through this URL-based flow.
Capture is unexpectedly slow or never settles A page or third-party widget may keep network requests active, or the target is slow to load. Try a different wait_until condition, a targeted wait_for_selector, or a bounded delay. Avoid waiting for full network idle if the page continuously polls.
Private preview fails The page may require a password, preview token, or authenticated session. The cited CaptureKit materials do not establish support for these Shopify access modes. Use a public URL or confirm the supported authentication flow with CaptureKit; do not expose store credentials in a public request.

CaptureKit’s help center describes Analytics and API Logs as dashboard tools for usage monitoring and request debugging. Keep request records sufficient to identify the failing capture without logging API keys or other secrets.

7. Performance, reliability, and cost

  • Cost: the Capture endpoint documentation says one screenshot API call costs one credit. That is a per-call fact, not a plan price; check CaptureKit’s current account terms for plan pricing and credit limits.
  • Latency: full-page scrolling, long delays, device emulation, and waiting on network idle can add time. Use only the waits your page requires, and set a client-side timeout that accommodates the service’s capture duration.
  • File size: PDF and image outputs serve different downstream needs. WebP or JPEG quality settings can be useful where smaller image files matter; PNG is the documented default. Validate acceptable legibility and size for your archive or review workflow.
  • Freshness: caching can reduce repeated work, but it can return an older capture. Set cache behavior and TTL according to how often the Shopify page changes, and disable or bypass cached results when freshness is essential.
  • Reliability: inspect HTTP statuses, bound retries, and avoid retry storms on 429 or 500 responses. A 200 response still needs visual validation for missing lazy content or changed page layout.
  • Monitoring: use Analytics and API Logs to review usage and investigate individual requests. Do not include secret keys in logs or client-visible code.

Or skip the browser setup

ScreenshotNeo is a website screenshot API and MCP server. One GET request captures a public page; its documentation is at ScreenshotNeo docs.

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

ScreenshotNeo accepts cookie and consent banners like a visitor and removes 60+ known consent platforms, newsletter popups, and chat widgets before the shot; each step can be turned off. Bot checks, blank pages, failed loads, timeouts, and cache hits are never billed, and responses say which result occurred. Its MCP server lets AI agents use take_screenshot, get_page_info, and capture_pdf. The free plan includes 1,000 screenshots per month with no card; paid plans start at $5 for 3,000. Sign up free for ScreenshotNeo.

FAQ

Does full-page capture include content below the fold?

That is what full_page=true requests. For lazy-loaded content, also try full_page_scroll=true and verify the bottom of the result.

Can I capture a Shopify password page or theme preview?

The supplied CaptureKit documentation does not establish support for password-protected stores, preview URLs, or session-authenticated pages. This guide’s request is for a public storefront URL.

Can I get a PDF instead of an image?

Yes. The CaptureKit reference lists pdf as a supported format. Inspect the returned artifact and use a PDF-appropriate filename.

Is the CaptureKit Chrome extension the same workflow?

No. The similarly named Chrome Web Store extension is a browser add-on with interactive capture controls; this article covers the API documented at CaptureKit’s developer documentation.