--- title: "Hide print button in JavaScript PDF viewer toolbar | Nutrient" canonical_url: "https://www.nutrient.io/guides/web/user-interface/main-toolbar/print-button/" md_url: "https://www.nutrient.io/guides/web/user-interface/main-toolbar/print-button.md" last_updated: "2026-06-09T10:25:14.556Z" description: "Learn to hide the print button in the JavaScript PDF viewer toolbar. Customize printing options and manage print tasks programmatically with our API methods." --- # Customize the print button (hide/enable) in our JavaScript PDF viewer The print button is a toolbar button that allows users to print a PDF document displayed in our SDK. This guide covers both how to add additional custom buttons to abort printing, and how to customize the built-in printing button options. [Launch Demo](https://www.nutrient.io/demo/toolbar-customization/) In addition to using the standard print button from the main toolbar, printing can be managed programmatically via the API. We support two instance methods for starting and aborting a print task: - [`instance.print()`](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#print) - [`instance.abortPrint()`](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#abortPrint) For example, if you want to add a custom toolbar that would abort printing when clicked, you could do this the following way: ```js const item = { type: "custom", id: "abort-print", title: "Abort Printing", onPress: (event) => { instance.abortPrint(); } }; instance.setToolbarItems((items) => items.concat([item])); ``` Note that `abortPrint` is only available for the [`NutrientViewer.PrintMode.DOM`](https://www.nutrient.io/api/web/NutrientViewer.html#.PrintMode) mode. ## Print modes Our current solution supports two print options, so you can make the tradeoff that’s right for your use case. ## Choosing a print mode The available modes are: - `NutrientViewer.PrintMode.DOM` - `NutrientViewer.PrintMode.EXPORT_PDF` It’s possible to configure the `printMode` via the initial [configuration](https://www.nutrient.io/api/web/NutrientViewer.Configuration.html#printMode): ```js NutrientViewer.load({ printMode: NutrientViewer.PrintMode.EXPORT_PDF }); ``` It’s also possible to enforce a print mode when printing programmatically via the API: ```js instance.print(NutrientViewer.PrintMode.EXPORT_PDF); ``` ### NutrientViewer.PrintMode.DOM `NutrientViewer.PrintMode.DOM` is the default print mode for Nutrient Web SDK because of its reliability and cross-browser support. This method will render all pages of a PDF document in advance before it sends the results to the printer. It’s in all major browsers and won’t give your users access to the source PDF file. However, it’s CPU bound and memory usage scales with PDF size. ### NutrientViewer.PrintMode.EXPORT_PDF `NutrientViewer.PrintMode.EXPORT_PDF` is resource efficient and lets you avoid having to render every page in advance, which could balloon memory usage to multiple GBs on PDFs with more than 100 pages. Google Chrome and Microsoft Internet Explorer provide the APIs required to use the native renderer; meanwhile, as a fallback on other browsers, we generate and open a PDF in a new tab. This allows users to print the PDF in a native PDF reader which can, in contrast to browser-built implementations, talk directly to the connected printer. A drawback of this approach is that it might give users access to the source files. Below is an overview of all supported browsers and their behaviors. - **Google Chrome:** This browser is fully supported. Printing a PDF page will use the native renderer that’s part of the Chrome browser. - **Internet Explorer 11:** This browser is partially supported. To support printing, the [Windows Media Feature Pack](https://www.microsoft.com/en-us/download/details.aspx?id=48231) must be installed, which is the case on 99 percent of all Windows installations, unless you use the N or KN editions. If the Windows Media Feature Pack is installed, the browser will ask you to install the Adobe Reader PDF extension upon first use. With this extension enabled, printing works as expected and without opening a new tab. Internet Explorer 11 is no longer supported in our Web SDK [as of version 2022.5.](/blog/pspdfkit-web-2022-5-content-editor-and-measurement-tools/) Edge 18 is no longer supported in our Web SDK [as of version 2023.2.](/blog/pspdfkit-web-2023-2-comment-mentions-notifications/) - **Microsoft Edge**: This browser opens a new tab and uses the built-in WinRT PDF Renderer (`Windows.Data.Pdf`) library. Edge no longer supports ActiveX and thus doesn’t support third-party plugins such as Adobe Reader. - **Apple Safari**: This browser opens a new tab, which loads either Apple’s Preview PDF renderer or the Adobe Reader plugin, if installed. - **Mozilla Firefox**: This browser opens a new tab, which renders the PDF via Mozilla’s JavaScript PDF renderer, albeit slowly. Check out our [API reference](https://www.nutrient.io/api/web/) for more information. ## Enabling printing The [printing toolbar item](https://www.nutrient.io/api/web/NutrientViewer.html#.defaultToolbarItems) is enabled by default when the [`download` permission](https://www.nutrient.io/guides/document-engine/viewer/client-authentication/) is granted in the JSON Web Token (JWT) used for authentication. This permission is required so that the client can access the raw PDF document needed. The [printing toolbar item](https://www.nutrient.io/api/web/NutrientViewer.html#.defaultToolbarItems) is always enabled by default. ## Enabling and disabling printing via the JavaScript API It’s possible to enable or disable printing via our JavaScript API, which allows you to toggle the [NutrientViewer.ViewState.allowPrinting](https://www.nutrient.io/api/web/NutrientViewer.ViewState.html#allowPrinting) Boolean. Below is an example of how to disable printing: ```js instance.setViewState((state) => state.set("allowPrinting", false)); ``` The button will be marked as `disabled` in the main toolbar. Please refer to the [toolbar API](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#setToolbarItems) to find out how to remove the print button when it’s disabled. ## Hiding the print button You can remove the `print` button from the toolbar by getting the array of current toolbar items via [`instance.toolbaritems`](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#toolbarItems) and then filtering it and setting the new array: ```js const items = instance.toolbarItems; // Hide the toolbar item with the `type` "print" by removing it from the array of items. instance.setToolbarItems(items.filter((item) => item.type!== "print")); ``` --- ## Related pages - [Activate or deactivate tools in our viewer toolbar](/guides/web/customizing-the-interface/controlling-the-toolbar-via-api.md) - [Create a new tool in PDF viewer toolbar](/guides/web/user-interface/main-toolbar/create-a-new-tool.md) - [Configuring pager toolbar display behavior](/guides/web/user-interface/main-toolbar/pager-display.md) - [Customizing tools in the JavaScript PDF viewer toolbar](/guides/web/user-interface/main-toolbar/customize-existing-tools.md) - [Customize dropdown navigation in the viewer toolbar](/guides/web/user-interface/main-toolbar/dropdown-groups.md) - [Customizing download/export buttons in our JavaScript PDF viewer](/guides/web/user-interface/main-toolbar/download-export-button.md) - [Hiding the toolbar in our JavaScript PDF viewer](/guides/web/user-interface/main-toolbar/hide-the-toolbar.md) - [Adjust the placement of the toolbar in our viewer](/guides/web/user-interface/main-toolbar/placement.md) - [Adding page labels to navigation in our viewer](/guides/web/features/navigation-page-labels.md) - [Rearrange tools in our viewer toolbar](/guides/web/user-interface/main-toolbar/rearrange.md) - [Removing a tool from the toolbar in our JavaScript viewer](/guides/web/customizing-the-interface/customizing-the-toolbar.md) - [Customizing responsive navigation in our viewer toolbar](/guides/web/user-interface/main-toolbar/responsive-groups.md)