Remove Elements

Removing unwanted elements from the page before capturing a screenshot is a common use case for image collateral in a knowledge base. Elements such as cookie banners, support bubbles, in-app adverts, call-outs, and features that are not relevant to the content you are trying to capture and can be distracting to the reader.

The screenshot API endpoint allows you to either hide or remove an element by using steps.

You can either use the removeElement or the hideElement step to remove an element before taking a screenshot.

Example 1: Hides an element

{
    "elementSelector": [
        "body"
    ],
    "deviceScaleFactor": 1,
    "responseType": "queue",
    "steps": [
        {
            "type": "navigate",
            "url": "https://example.org"
        },
        {
            "type": "hideElement",
            "selectors": [
                "body > div > h1",
                "xpath//html/body/div/header"
            ]
        }
    ]
}

Example 2: Removes an element

{
    "elementSelector": [
        "body"
    ],
    "deviceScaleFactor": 1,
    "responseType": "queue",
    "steps": [
        {
            "type": "navigate",
            "url": "https://example.org"
        },
        {
            "type": "removeElement",
            "selectors": [
                "body > div > h1"
            ]
        }
    ]
}