# Advanced Screenshot Element 🖼

## 🔗 Links

> [Demo](https://digitaleyedemo.bubbleapps.io/screenshotelementpro) | [Editor](https://bubble.io/page?name=screenshotelementpro\&id=digitaleyedemo\&tab=tabs-1)

> [Plugin page](https://bubble.io/plugin/screenshot-element-pro-1611438394170x673066697274163200)

> [Forum](https://forum.bubble.io/t/new-plugin-screenshot-element-pro/136632)

## ℹ️ Introduction

![](/files/-MXgDMNUKUpPgoM5r-Ci)

## 🔥 Features

* Capture a screenshot of a single element by its ID
* Capture the visible visible part of the page (as currently displayed in browser)
* Full Page capture
* Save screenshot in JPG or PNG 
* Generate URL (upload to Bubble filestorage)
* Download the screenshot
* Choose image compress quality

## 📚 Documentation

### ➡️ Screenshot of the the visible part of the screen:

1\. In Workflow choose "Generate Screenshot" action. Define the Filename, File Format, choose Screenshot Type "Screen" and Output

![](/files/-MXgEovJ_iQ3CExzwfbC)

### ➡️ **Screenshot of the entire page**

1\. In Workflow choose "Generate Screenshot" action. Define the Filename, File Format, choose Screenshot Type "Entire Page" and Output.

![](/files/-MXgExI0OvYPIGGHbgrz)

### ➡️ **Screenshot of an element by ID**

1\. Settings / General / Select "Expose the option to add an ID attribute to HTML elements"

![](/files/-MXgFBNYY48_Kf_jgC0Z)

2\. Define ID for an element you want to save

![](/files/-MXgFDUiuVnpotV8oxfN)

3\. In Workflow choose "Generate Screenshot" action. Define the Filename, File Format, choose Screenshot Type, Output and Element ID

![](/files/-MXgFGjs9x1RIVZbI7xY)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://bubble.digital-bird.com/plugins/screenshot-element-pro.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.