Screenshotlayer custom CSS injection: hide cookie banners before capture

Screenshotlayer advertises custom CSS injection for screenshots. To hide a cookie banner, identify its actual element on the target site, write a narrowly scoped CSS rule that hides it, pass that stylesheet using Screenshotlayer’s currently documented CSS request format, then inspect the returned image. There is no universal cookie-banner selector, and the public material reviewed here does not provide a complete request example or establish a parameter name. Do not guess the parameter: check the current Screenshotlayer product information and API documentation before making the request.

1. Identify the banner on the target page

Consent interfaces are site-specific. A banner may be a fixed bottom bar, a centered modal, or a panel injected after the initial page load. Its markup and class names may also differ between desktop and mobile.

1. Open the target page in a browser at the viewport you intend to capture.
2. Use the browser’s developer tools to inspect the banner and find a stable selector for the element you want to omit.
3. Check whether the banner contains other content you need, such as a useful navigation panel. Prefer the smallest element that removes only the consent UI.
4. Repeat at relevant viewport sizes. Responsive layouts may use different elements or selectors.

A CSS rule might look like .consent-dialog { display: none !important; }, but that selector is only an example. Use the selector observed on the target page; it is not a universal rule.

2. Write and pass targeted CSS

Keep the rule specific to the site and the consent element. A broad rule such as div { display: none; } can hide page content as well as the banner. Screenshotlayer describes its CSS feature as injecting a user-provided stylesheet appended as a URL. The reviewed public material does not specify the API parameter name, exact URL format, or encoding rules, so use the current documentation for those details rather than relying on an invented request.

/* Example only: replace this selector with the target site's actual banner selector. */
.consent-dialog {
  display: none !important;
}

Once you have the documented CSS parameter and request syntax, include your stylesheet as required by that documentation. If the service expects a stylesheet URL, make it reachable to the capture service and verify any access restrictions. Encode request values according to the documented format; CSS characters and URL query separators can otherwise be interpreted as part of the request.

3. Configure viewport, timing, and cache

Screenshotlayer advertises viewport control, full-height captures, thumbnail width, and a capture delay. Set the viewport to match the layout you are checking, and choose a delay appropriate for pages that render the consent interface asynchronously. A delay is a configuration aid, not a guarantee that every script or interface has finished loading.

The Screenshotlayer FAQ states that the default screenshot cache TTL is 2,592,000 seconds (30 days) and that a lower custom TTL is available. When you change CSS and compare results, account for caching: the image may reflect an earlier request. Use the current documented cache or refresh controls when validating a change.

4. Inspect the result

Review the returned image rather than assuming that a successful API response means the selector worked. Check that the banner is gone, the content beneath it is visible, and no unrelated page element disappeared. Inspect both desktop and mobile captures if both matter.

Hiding a consent panel in an image changes the screenshot’s appearance only. It does not establish that consent was recorded or change the target site’s underlying behavior.

Options and practical edge cases

Concern	What to do
Selector changes	Inspect the current markup and update the rule when the site changes its consent interface.
Multiple consent elements	Target each confirmed element individually; avoid broad selectors that could hide unrelated UI.
Responsive markup	Capture at each relevant viewport and check whether a separate mobile selector is needed.
Late insertion	Use the available capture delay where appropriate, then verify the output. The delay does not guarantee readiness.
Unexpected old image	Check the stated 30-day default cache and consult current refresh or custom TTL options.
Output format	The official FAQ lists PNG, JPEG, and GIF. Confirm the current request syntax and plan details in Screenshotlayer’s documentation.
Access	Screenshotlayer requires an access key for API requests. Keep it out of public client-side code.
Commercial use	The pricing page describes the free plan as non-commercial; check current plan terms for the intended use.

Troubleshooting

Symptom	Likely cause	Fix
The banner remains visible	The selector does not match the live element, CSS was not passed in the documented format, or the banner appeared after the capture.	Inspect the rendered page, confirm the documented CSS parameter and stylesheet URL, and adjust capture delay if needed.
Page content is missing	The selector is too broad or matches a parent container that also holds useful content.	Target the smallest banner element and inspect the page hierarchy before changing the rule.
The new rule seems ignored	A cached screenshot may be returned, or the site may have changed its markup.	Use documented cache refresh or TTL controls and re-check the selector against the current page.
API request is rejected	The access key may be missing or invalid, or request syntax may not match the current API documentation.	Confirm the key and consult the live API reference for required parameters and encoding.
Desktop works but mobile does not	The mobile layout may use a different banner element or selector.	Inspect and capture the mobile viewport separately, then add a rule for its actual markup.
Result differs between captures	Asynchronous page behavior, timing, or caching can affect the captured state.	Keep viewport and timing consistent, review cache settings, and inspect each returned image.

Performance, reliability, and cost considerations

CSS injection avoids changing the target website, but it depends on knowing the current markup and supplying the stylesheet in the format Screenshotlayer documents. A capture delay can help with late-loading UI, while caching can reduce repeated work but also make CSS changes harder to validate. Screenshotlayer’s FAQ states a default cache lifetime of 30 days; check the current service documentation for request and refresh controls.

An access key is required. The pricing page describes the free plan as non-commercial and paid plans as offering commercial use; confirm the current terms and price before using the service commercially. The materials reviewed do not establish a universal success rate or timing guarantee.

Or skip the browser setup

ScreenshotNeo is a website screenshot API and MCP server. Its one-call API can capture a page without setting up a browser or maintaining a site-specific CSS stylesheet:

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)
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}`);

ScreenshotNeo removes cookie banners, popups, and chat widgets before the shot; bot checks, blank pages, and failed loads are never billed; its MCP server lets AI agents take screenshots; and 1,000 screenshots a month are free with no card, with paid plans starting at $5 for 3,000. See the ScreenshotNeo API documentation and request options. Sign up for 1,000 free screenshots a month with no card.

FAQ

Can one CSS selector hide cookie banners on every website?

No. Banner markup varies by site and can change over time, so inspect each target and use its actual selector.

Does hiding the banner mean the site has accepted cookies?

No. It only affects the captured appearance; it does not record consent.

What image formats does Screenshotlayer list?

Its FAQ lists PNG, JPEG, and GIF. Check the live documentation for the current request format and options.

How long can a cached Screenshotlayer image remain?

The FAQ states a default TTL of 2,592,000 seconds, or 30 days. A lower custom TTL is available according to that FAQ.

Sources

• Screenshotlayer product page — custom CSS injection and capture options.
• Screenshotlayer FAQ and API information — access key, formats, cache TTL, and related details. Confirm current request syntax in the live documentation.
• Screenshotlayer pricing — plan terms, including the free plan’s non-commercial label.