ScreenshotNeo

BlogHow-to

How to Take a Full-Page Screenshot of a Hindi Website in PHP

Capture a Hindi website from top to bottom in PHP with Playwright or Browsershot, and check that Devanagari text and dynamic content render correctly.

By the ScreenshotNeo team4 October 20268 min read

To capture a Hindi website from top to bottom in PHP, control a browser renderer and enable its full-page screenshot option. Playwright PHP uses fullPage => true; Spatie Browsershot uses fullPage(). Wait until the page has reached the state you want to capture, then inspect the output to make sure Devanagari text and content below the fold rendered correctly.

PHP does not render a modern website by itself here: the PHP library drives a browser engine. The two approaches below are documented options. Package APIs and installation requirements can change, so check the documentation for the version installed in your project before copying commands into production.

1. Choose a PHP browser renderer

Approach How capture works Consider it when
Playwright PHP Navigate a browser page, wait for a meaningful page state, then call screenshot() with fullPage. Your project already uses Playwright or you want to work with its browser automation API.
Spatie Browsershot Use a PHP interface to Puppeteer and headless Chrome, then call fullPage() before saving. Your project prefers Browsershot’s fluent PHP interface.

Both methods depend on a browser runtime that the PHP process can use. Check your package’s current installation requirements and confirm your deployment permits the browser process to start. The source material does not establish a universal PHP or operating-system compatibility matrix.

2. Capture with Playwright PHP

This is the documented capture pattern: navigate to the Hindi page and pass the full-page option to the screenshot method.

<?php

// $page is a Playwright PHP page created by your browser setup.
$page->goto('https://example.com/hi');

// Prefer a page-specific readiness check when content loads asynchronously.
// For example, wait for a heading or main-content selector used by the site.
$page->screenshot(__DIR__ . '/hindi-full.png', ['fullPage' => true]);

The snippet assumes $page has already been created. Browser launch and package setup depend on the Playwright PHP package version and your environment; use its current installation guide rather than assuming one universal setup command. The fullPage option requests the full scrollable page, rather than only the current viewport.

Do not treat navigation as proof that every part of a modern page is ready. If the site fills its main content asynchronously, wait for a meaningful locator or application-ready condition before calling screenshot(). Choose a condition that signals the content you need is present, such as the page’s main heading or results container.

3. Capture with Spatie Browsershot

Browsershot provides a PHP interface to Puppeteer. Its documented full-page pattern is:

<?php

use Spatie\Browsershot\Browsershot;

Browsershot::url('https://example.com/hi')
    ->fullPage()
    ->save(__DIR__ . '/hindi-full.png');

Install and configure Browsershot and its browser dependencies using the current documentation for the version in your project. This snippet shows the URL-to-image operation; it does not replace environment-specific setup. For pages whose content appears after navigation, configure an appropriate wait using the options documented for your installed version before saving.

JavaScript alerts, prompts, and confirmations can interrupt rendering and lead to an empty screenshot. If the target page can open dialogs, handle or suppress them in the capture flow as appropriate.

4. Make Hindi text and page content readable

  1. Use the page’s actual URL. Capture the same route and language variant that a visitor would open, including any required query parameters.
  2. Wait for the intended content. A screenshot records what the page looks like at that moment. If a Hindi article body, search result, or web font is still loading, the image may not represent the finished page.
  3. Inspect the image in the deployment environment. Check that Devanagari glyphs appear, vowel signs and conjuncts are shaped correctly, there are no tofu boxes, and the page continues below the initial viewport.
  4. Compare local and production output if they differ. Check which fonts are available to the browser runtime and whether required web fonts loaded before capture. This is practical browser-rendering guidance; the referenced documentation does not prescribe a specific Hindi font or server package.
  5. Review very long pages. Full-page images can be unwieldy. Confirm that a single tall image suits the downstream use, and consider whether the page’s length and image dimensions are manageable for your storage and viewer.

The browser documentation supports full-page capture and waiting for a chosen page state; it does not certify a particular Devanagari font setup. Verify the generated file using the same runtime image and fonts you will use in production.

5. Tune capture behavior for repeatable output

  • Wait for a meaningful state. Prefer a page-specific selector or application-ready condition over an arbitrary short delay when the site exposes one. A delay alone does not prove that content finished loading.
  • Control the rendering environment for comparisons. For visual regression work, keep the viewport, fonts, animations, browser version, and data consistent. Otherwise a pixel difference may reflect an environment change instead of a site change.
  • Choose the full-page behavior deliberately. Use full-page capture when the requirement is the entire scrollable page. If the page is exceptionally long, check the output dimensions and whether your image-processing or storage path can handle them.
  • Check dialogs and overlays. Resolve JavaScript dialogs that can stop rendering. If a consent banner or other overlay obscures the desired content, decide how the capture flow should handle it.
  • Keep the target stable. Pages with live data or changing content can produce different images across runs. For comparisons, control the page data and capture at the same meaningful state.

6. Troubleshoot common failures

Symptom Likely cause What to do
The image shows only the first screen. The full-page option was omitted or not applied by the installed API version. For Playwright, use the documented fullPage: true screenshot option. For Browsershot, call fullPage() before saving. Confirm the installed package version’s API.
Lower sections or dynamically loaded content are missing. The screenshot was taken before the page reached the intended state, or content loads only after scrolling or interaction. Wait for a page-specific content selector or readiness condition. If the site requires scrolling or interaction to reveal content, reproduce that behavior before capture using the package’s documented browser controls.
Hindi characters appear as boxes or look incorrectly shaped. The browser runtime may not have the needed glyphs or the page’s web font may not have loaded. Inspect the image in the production runtime, check available browser fonts, and confirm the page’s font requests completed before capture. The cited sources do not identify a universal Hindi font package.
The output is blank. Navigation or rendering may have failed, or a JavaScript dialog may have stopped Browsershot’s rendering. Check that the URL loads in the browser runtime, wait for the intended page state, and handle alerts, prompts, or confirmations where applicable.
The result differs between local and production. Browser version, viewport, fonts, animations, data, or runtime configuration differ. Align those inputs for repeatable output, then compare again. Check web-font loading and the browser’s available fonts for Hindi text.
Capture cannot start in deployment. The package’s browser dependency is missing, unavailable, or disallowed in the runtime. Follow the current package installation requirements and verify that the deployment environment permits the browser process. Compatibility depends on your package and environment.

7. Performance, reliability, and cost

A full-page capture asks the browser to render the page beyond the visible viewport, so very long pages can produce large images and take longer to process than a viewport-only capture. Use the smallest capture scope that meets the requirement, wait for the content you need rather than an unnecessarily long fixed delay, and account for browser startup and rendering in your job timeout.

For reliability, treat capture as a browser operation that can fail because the page did not load, content was not ready, a dialog interrupted rendering, or the runtime lacked a required dependency. Log the target URL, capture time, package/browser version, and failure details needed to reproduce the issue. For visual comparisons, keep rendering inputs consistent.

With local Playwright or Browsershot, account for the compute and operational cost of running the browser in your own environment. The cited sources do not provide a cost benchmark or universal resource estimate. A hosted API is an alternative when you do not want to operate the browser runtime yourself; compare its rendering behavior, data handling terms, and pricing for your use case.

8. Or skip the browser setup

ScreenshotNeo is a website screenshot API and MCP server. Its API can return a screenshot or PDF from one GET request. The call below requests a WebP screenshot of a Hindi page; see the ScreenshotNeo API documentation for the request options.

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

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

To request the full page, use the full-page option supported by the API; check the current parameter name and available options in the documentation. 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. The Free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000 shots. Sign up for 1,000 free screenshots a month, with no card required.

9. Frequently asked questions

Does full-page mean the browser stitches multiple screenshots?

The documented option captures the full scrollable page. The cited guides do not require you to implement a manual stitching loop.

Which option should I use for Hindi sites?

Neither documented approach guarantees a particular Devanagari font setup. Choose based on your project and runtime, then inspect the output in the environment where captures will run.

Can I use this for visual regression testing?

Yes, but make the rendering inputs consistent, including viewport, fonts, animations, browser version, and page data, so comparisons are meaningful.

Do I need to install a Hindi font?

The cited documentation does not establish that. First inspect the produced image and the fonts available to the browser runtime; add or configure fonts only if your page and environment require them.

Sources