> 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/salesforce/page-manipulation/thumbnails-controls.md).

# Thumbnail Controls

Learn how to efficiently manage pages in your document with the thumbnail panel in WebViewer. Rotate, delete, reorder, merge pages and more with ease. Optimize your document workflow now! Salesforce W

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

![](https://306473577-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FfmJo9lQOEYOFBgOyFp26%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://306473577-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FfmJo9lQOEYOFBgOyFp26%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://306473577-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FfmJo9lQOEYOFBgOyFp26%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.html#.getSelectedThumbnailPageNumbers). To select pages programmatically use [selectThumbnailPages](https://sdk.apryse.com/api/web/UI.html#selectThumbnailPages).


---

# 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 by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

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

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.