Accusoft PDF Viewer Documentation

v3.11.158639

How To Configure the UI

This guide explains how to configure the viewer UI to include only the features you want.

Prerequisites

Configuring the UI requires a Professional license. You can evaluate Professional features by setting licenseKey to 'eval' when creating the viewer.

Directions

To configure the UI, use the allowedControls option when calling create:

(async () => {
  // Create the viewer
  window.myViewer = await PdfViewerControl.create({
    container: document.getElementById('myContainer'),

    // URL or Uint8Array for a PDF
    sourceDocument: YOUR_SOURCE_DOCUMENT

    // Use a Professional license key or the value 'eval'
    licenseKey: 'YOUR_LICENSE_KEY',

    // Specify the UI controls to include or exclude
    allowedControls: {
      // These are included by default; you can remove by setting to `false`
      fullScreenToggle: true,
      nextAndPreviousPageButtons: true,
      pageNumberAndCount: true,
      printing: true,
      search: true,
      thumbnails: true,
      zoomInAndOutButtons: true,

      // These are removed by default; you can include by setting to `true`
      ellipseTool: false,
      freehandDrawingTool: false,
      freehandSignatureTool: false,
      lineTool: false,
      rectangleTool: false,
      textHighlightTool: false
    }
  });
})();

For more information about what each of these options mean, see the API reference for create.

Examples

  • Disable printing and full screen mode:

    (async () => {
      window.myViewer = await PdfViewerControl.create({
        container: document.getElementById('myContainer'),
        sourceDocument: YOUR_SOURCE_DOCUMENT
        licenseKey: 'YOUR_LICENSE_KEY', // or 'eval'
        allowedControls: {
          printing: false,
          fullScreenToggle: false
        }
      });
    })();
  • Adding the line tool and removing search:

    (async () => {
      window.myViewer = await PdfViewerControl.create({
        container: document.getElementById('myContainer'),
        sourceDocument: YOUR_SOURCE_DOCUMENT
        licenseKey: 'YOUR_LICENSE_KEY', // or 'eval'
        allowedControls: {
          lineTool: true,
          search: false
        }
      });
    })();

Related

© 2022 Accusoft Corporation. All rights reserved.