> For the complete documentation index, see [llms.txt](https://docs.apryse.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.apryse.com/web/page-manipulation/thumbnails-controls.md).

# Thumbnail Controls

Learn how to efficiently manage pages in your WebViewer with thumbnail controls, including selecting, deleting, rotating, reordering, merging documents, and more. Optimize your workflow now! The Aprys

The left side panel has a thumbnail tab that can be used to perform a number of different page operations.

![](https://3532544125-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX9YnTSKIHvV7m0A36LbO%2Fuploads%2Fgit-blob-9915ea356fc8907f05f84f8f7269e7b28406b815%2Fa80b636d82c45191ba82ac2481f09de4b0669d24-358x856.png?alt=media)

{% hint style="info" %}
The `thumbnailControl` and `documentControl` elements in the above image were introduced in version 6.3.1. These controls can be disabled using the [disableElements](https://sdk.apryse.com/api/web/UI.html#.disableElements) API or passing it into WebViewer constructor options. See the[ hiding element guide](/web/ui-customization/hiding-elements.md) for more detail.
{% endhint %}

## Selecting multiple pages

Users can hold the "CTRL" or "Command" key and click on a thumbnail to select it. The text input near the bottom of the thumbnail panel can also be used to select pages. After pages are selected, the controls at the bottom of the thumbnail panel can be used to delete or extract the currently selected pages.

This feature can be disabled by using the [disableFeatures](https://sdk.apryse.com/api/web/UI.html#.disableFeatures) API to disable the `ThumbnailMultiselect` feature.

{% tabs %}
{% tab title="JavaScript (SDK v8.0+)" %}
{% code lineNumbers="true" %}

```js
WebViewer({
  ... // other options
}, viewerElement)
  .then(instance => {
    instance.UI.disableFeatures([instance.Feature.ThumbnailMultiselect]);
  });
```

{% endcode %}

[WebViewer.enableFeatures](https://sdk.apryse.com/api/web/UI.html#.enableFeatures) [WebViewer.disableFeatures](https://sdk.apryse.com/api/web/UI.html#.disableFeatures)
{% endtab %}

{% tab title="JavaScript (SDK v6.0+)" %}
{% code lineNumbers="true" %}

```js
WebViewer({
  ... // other options
}, viewerElement)
  .then(instance => {
    instance.disableFeatures([instance.Feature.ThumbnailMultiselect]);
  });
```

{% endcode %}

[WebViewer.enableFeatures](https://sdk.apryse.com/api/web/UI.html#.enableFeatures) [WebViewer.disableFeatures](https://sdk.apryse.com/api/web/UI.html#.disableFeatures)
{% endtab %}
{% endtabs %}

## Rotating pages

The current page can be rotated using the buttons below the thumbnail.

## Deleting pages

The current pages can be deleted using the button below the thumbnail. There is also a button at the bottom of the thumbnail panel that can be used to delete the currently selected pages.

{% hint style="info" %}
The [disableElements](https://sdk.apryse.com/api/web/UI.html#.disableElements) API can be used to hide the `thumbnailControl` to prevent users from deleting or rotating the current page.
{% endhint %}

## Reordering pages

Users can drag and drop each of the thumbnails to move a page. Users can also drag and drop multiple selected pages to move them all at once.

This feature can be disabled by using the [disableFeatures](https://sdk.apryse.com/api/web/UI.html#.disableFeatures) API to disable the `ThumbnailReordering` feature.

## Merging documents

Simply drag and drop a document into the thumbnail panel to merge a new document into the currently opened document.

![](https://3532544125-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX9YnTSKIHvV7m0A36LbO%2Fuploads%2Fgit-blob-1360ad6b8e6dadf9dc14b8103dd255e9236e800d%2F2daff3075750e7f9b6950dd503561a545c9fa287-867x488.gif?alt=media)

This feature can be disabled by using the [disableFeatures](https://sdk.apryse.com/api/web/UI.html#.disableFeatures) API to disable the `ThumbnailMerging` feature.

## Merging from another WebViewer

It is possible to merge pages from one instance of WebViewer into another using the thumbnail panel. Users can drag and drop one or more pages from the thumbnail panel of one instance of WebViewer into another.

Unlike other features, this feature is disabled by default for performance. This feature can be enabled by using [enableFeatures](https://sdk.apryse.com/api/web/UI.html#.enableFeatures) API to enable the `MultipleViewerMerging` feature.

{% hint style="warning" %}
**Please Note!**

Enabling this feature will impact performance since WebViewer will have to extract the currently selected page's data.
{% endhint %}

Below is an example of pages being moved between instances of WebViewer.

![](https://3532544125-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX9YnTSKIHvV7m0A36LbO%2Fuploads%2Fgit-blob-12ebd89d95e4d9de6f13c5b6e257ddc703ed4f48%2Ff4af9c9bb2869252f75f8bd1ec4cd9a76f27da77-1181x481.gif?alt=media)

You can also check-out a ready-to-go sample for a [dropzone implementation](https://github.com/ApryseSDK/webviewer-document-merge/).

## Getting the selected pages programmatically

You can get the selected pages by using [getSelectedThumbnailPageNumbers](https://sdk.apryse.com/api/web/UI.ThumbnailsPanel.html#.getSelectedPageNumbers__anchor). To select pages programmatically use [selectThumbnailPages](https://sdk.apryse.com/api/web/UI.ThumbnailsPanel.html#.selectPages__anchor).


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://docs.apryse.com/web/page-manipulation/thumbnails-controls.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.