diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/copy-pages.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/copy-pages.md index 4ef7a40711..de96950e04 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/copy-pages.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/copy-pages.md @@ -19,7 +19,7 @@ This guide explains how to duplicate pages within the current PDF using the Orga ## Prerequisites - EJ2 React PDF Viewer installed -- PDF Viewer injected with `PageOrganizer` module +- PDF Viewer with the `PageOrganizer` module injected ## Steps diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/events.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/events.md index 7156544b53..e1de89ce2b 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/events.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/events.md @@ -1,7 +1,7 @@ --- layout: post title: Organize Pages Events in PDF Viewer | Syncfusion -description: Learn how to organize pages Events in the React PDF viewer, including rotating, rearranging, inserting, deleting, and copying pages on mobile devices. +description: Learn how to organize pages events in the React PDF viewer, including rotating, rearranging, inserting, deleting, and copying pages on mobile devices. platform: document-processing control: PDF Viewer documentation: ug diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/extract-pages.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/extract-pages.md index 897bed455b..63872ee841 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/extract-pages.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/extract-pages.md @@ -1,7 +1,7 @@ --- layout: post title: Extract Pages in React PDF Viewer | Syncfusion -description: Learn here all about Extract Pages in Organize Pages in Syncfusion React PDF Viewer component of Syncfusion Essential JS 2 and more. +description: Learn how to extract pages in the Organize Pages panel of the Syncfusion React PDF Viewer component of Syncfusion Essential JS 2. platform: document-processing control: PDF Viewer documentation: ug @@ -57,7 +57,7 @@ You can control the Extract Pages experience via settings and invoke extraction Use the `canExtractPages` API to enable or disable the Extract Pages option. When set to `false`, the Extract Pages tool is disabled in the toolbar. The default value is `true`. -Use the following code snippet to enable or disable the Extract Pages option: +Use the following code snippet to enable the Extract Pages option: {% tabs %} {% highlight ts tabtitle="Standalone" %} diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/import-pages.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/import-pages.md index 2834aaff43..473ca66584 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/import-pages.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/import-pages.md @@ -44,7 +44,7 @@ This guide explains how to import pages from another PDF into the current docume ## Expected result -- Imported pages display as a single thumbnail in Organize Pages and are merged into the original PDF when saved or exported. +- Imported pages display as thumbnails in Organize Pages and are merged into the original PDF when saved or exported. ## Enable or disable Import Pages button diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/insert-blank-pages.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/insert-blank-pages.md index 3b5ab21e79..f9c85bb034 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/insert-blank-pages.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/insert-blank-pages.md @@ -65,4 +65,4 @@ To enable or disable the **Insert Pages** button in the page thumbnails, update - [Organize pages toolbar customization](./toolbar) - [Organize pages event reference](./events) - [Remove pages in Organize Pages](./remove-pages) -- [Reorder pages in Organize Pages](./remove-pages) \ No newline at end of file +- [Reorder pages in Organize Pages](./reorder-pages) \ No newline at end of file diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/mobile-view.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/mobile-view.md index 675e92688d..805a68ac3f 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/mobile-view.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/mobile-view.md @@ -8,7 +8,7 @@ documentation: ug domainurl: ##DomainURL## --- -# Organize Pages in Mobile PDF Viewer React +# Organize Pages in React Mobile PDF Viewer The PDF Viewer provides a mobile-responsive layout for the `Organize Pages` feature, optimized for touch interactions on small screens. The toolbar and navigation adapt to the device viewport so page-management controls remain accessible on phones and tablets. @@ -28,7 +28,7 @@ To perform actions on a page thumbnail, tap and hold (long-press) the thumbnail * **Select All**: Select all pages in the document. -![Context menu displaying page operations (rotate, insert, copy, delete, select all)](../images/Context-Menu-Page-Operations1.png) +![Context menu displaying page operations rotate insert copy delete select all](../images/Context-Menu-Page-Operations1.png) ## Rearranging Pages on Mobile diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/programmatic-support.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/programmatic-support.md index 5e981f2dda..430afcb0f8 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/programmatic-support.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/programmatic-support.md @@ -1,14 +1,14 @@ --- layout: post -title: Programmatic Support for Organize Pages in React PDF Viewer control | Syncfusion -description: Learn here all about Programmatic Support for Organize Pages in Syncfusion React PDF Viewer control of Syncfusion Essential JS 2 and more. +title: Programmatic Page Organization in React PDF Viewer | Syncfusion +description: Learn how to use the programmatic APIs for Organize Pages in the Syncfusion React PDF Viewer component of Syncfusion Essential JS 2. platform: document-processing control: PDF Viewer documentation: ug domainurl: ##DomainURL## --- -# Programmatic Support for Organize Pages in React PDF Viewer control +# Programmatic Support for Organize Pages in React PDF Viewer The PDF Viewer exposes programmatic APIs for organizing pages so applications can integrate page-management workflows (for example: enable/disable organizer, open/close the organizer, and customize behavior). This section documents the available properties, methods, and settings used to control the Organize Pages experience. diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/reorder-pages.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/reorder-pages.md index b8826fc7c5..fb5085cc45 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/reorder-pages.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/reorder-pages.md @@ -53,11 +53,11 @@ This guide describes how to rearrange pages in a PDF using the **Organize Pages* ## Enable or disable reorder option -To enable or disable the **Reorder pages** option in the Organize Pages, update the [`pageOrganizerSettings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/pageorganizersettings). See [Organize pages toolbar customization](./toolbar#enable-or-disable-the-rearrange-option) for the guidelines +To enable or disable the **Reorder pages** option in the Organize Pages, update the [`pageOrganizerSettings`] (https://ej2.syncfusion.com/react/documentation/api/pdfviewer/pageorganizersettings). See [Organize pages toolbar customization](./toolbar#enable-or-disable-the-rearrange-option) for the guidelines. ## Troubleshooting -- **Thumbnails won't move**: Confirm [`pageOrganizerSettings.canRearrange`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/pageorganizersettingsmodel#canrearrange) is is not set to `false`. +- **Thumbnails won't move**: Confirm [`pageOrganizerSettings.canRearrange`] (https://ej2.syncfusion.com/react/documentation/api/pdfviewer/pageorganizersettingsmodel#canrearrange) is not set to `false`. - **Changes not saved**: Verify [`serviceUrl`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer#serviceurl) (server) or [`resourceUrl`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer#resourceurl) (standalone) is configured correctly. ## Related topics diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/rotate-pages.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/rotate-pages.md index 0c9b2eeaa4..8ef8b8fe11 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/rotate-pages.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/rotate-pages.md @@ -61,7 +61,7 @@ This guide explains how to rotate individual or multiple pages using the **Organ ## Enable or disable Rotate Pages button -To enable or disable the **Rotate Pages** button in the Organize Pages toolbar, update the [`pageOrganizerSettings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/pageorganizersettings). See [Organize pages toolbar customization](./toolbar#enable-or-disable-the-rotate-option) for the guidelines +To enable or disable the **Rotate Pages** button in the Organize Pages toolbar, update the [`pageOrganizerSettings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/pageorganizersettings). See [Organize pages toolbar customization](./toolbar#enable-or-disable-the-rotate-option) for the guidelines. ## Troubleshooting @@ -70,5 +70,5 @@ To enable or disable the **Rotate Pages** button in the Organize Pages toolbar, ## Related topics -- [Organize page toolbar customization](./toolbar.md) +- [Organize page toolbar customization](./toolbar) - [Organize pages event reference](./events) diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/toolbar.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/toolbar.md index 0d172c9269..dbb378751b 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/toolbar.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/toolbar.md @@ -1,14 +1,14 @@ --- layout: post title: Organize Page Toolbar Customization in React | Syncfusion -description: Learn here all about Organize Page Toolbar Customization in Syncfusion React PDF Viewer control of Syncfusion Essential JS 2 and more. +description: Learn how to customize the Organize Pages toolbar in the Syncfusion React PDF Viewer component of Syncfusion Essential JS 2. platform: document-processing control: PDF Viewer documentation: ug domainurl: ##DomainURL## --- -# Organize page toolbar customization in React PDF Viewer control +# Organize page toolbar customization in React PDF Viewer The PDF Viewer lets applications customize the Organize Pages toolbar to enable or disable tools according to project requirements. Use the `pageOrganizerSettings` API to control each tool's interactivity and behavior. diff --git a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/zoom-pages.md b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/zoom-pages.md index 829dae0a25..4470ae401f 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/organize-pages/zoom-pages.md +++ b/Document-Processing/PDF/PDF-Viewer/react/organize-pages/zoom-pages.md @@ -46,9 +46,9 @@ This guide explains how to change the thumbnail zoom level in the **Organize Pag - Thumbnails resize interactively; larger thumbnails show more detail while smaller thumbnails allow viewing more pages at once. -## Show or hide Zoom Pages button +## Show or hide Zoom Pages slider -To enable or disable the **Zoom Pages** button in the Organize Pages toolbar, update the [`pageOrganizerSettings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/pageorganizersettings). See [Organize pages toolbar customization](./toolbar#show-or-hide-the-zoom-pages-option) for the guidelines +To enable or disable the **Zoom Pages** slider in the Organize Pages toolbar, update the [`pageOrganizerSettings`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/pageorganizersettings). See [Organize pages toolbar customization](./toolbar#show-or-hide-the-zoom-pages-option) for the guidelines. ## Troubleshooting diff --git a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-amazon-s3.md b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-amazon-s3.md index 266365b51d..ea35f42653 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-amazon-s3.md +++ b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-amazon-s3.md @@ -28,13 +28,13 @@ import * as AWS from 'aws-sdk'; 2. Configure the AWS SDK with the region, access key, and secret access key. This enables the application to interact with AWS services such as S3. -N> Replace **Your Region** with the actual Region of your AWS S3 account and **Your Access Key** with the actual Access Key of your AWS S3 account and **Your Security Access Key** with the actual Security Access Key of your AWS S3 account. +N> Replace **Your Region**, **Your Access Key**, and **Your Security Access Key** with the corresponding values from your AWS S3 account. ```typescript AWS.config.update({ - region: '**Your Region**', // Update this your region - accessKeyId: '*Your Access Key*', // Update this with your access key id - secretAccessKey: '*Your Security Access Key*', // Update this with your secret access key + region: '**Your Region**', // Update this with your region + accessKeyId: '**Your Access Key**', // Update this with your access key id + secretAccessKey: '**Your Security Access Key**', // Update this with your secret access key }); ``` @@ -159,7 +159,7 @@ public PdfViewerController(IWebHostEnvironment hostingEnvironment, IMemoryCache } ``` -5. Modify the [Download()](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/#download) method to save the downloaded PDF file to the AWS S3 bucket. +5. Modify the [Download()] (https://ej2.syncfusion.com/react/documentation/api/pdfviewer/#download) method to save the downloaded PDF file to the AWS S3 bucket. ```csharp @@ -217,7 +217,7 @@ N> Replace the placeholders with the appropriate AWS credentials and bucket name **Step 3:** Set the PDF Viewer properties in the React PDF Viewer component -Modify the [serviceUrl](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/#serviceurl) property of the PDF Viewer component with the accurate URL of the web service, replacing `https://localhost:44396/pdfviewer` with the actual server URL. Set the `documentPath` property to the desired PDF file name to load from AWS S3, and ensure that the document exists in the target bucket. +Modify the [serviceUrl] (https://ej2.syncfusion.com/react/documentation/api/pdfviewer/#serviceurl) property of the PDF Viewer component with the accurate URL of the web service, replacing `https://localhost:44396/pdfviewer` with the actual server URL. Set the `documentPath` property to the desired PDF file name to load from AWS S3, and ensure that the document exists in the target bucket. {% tabs %} {% highlight ts tabtitle="Standalone" %} diff --git a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-azure-active-directory.md b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-azure-active-directory.md index 14eac9c661..8fe3303465 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-azure-active-directory.md +++ b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-azure-active-directory.md @@ -1,6 +1,6 @@ --- layout: post -title: Save PDF files to Azure Active Directory (AAD) in React PDF Viewer | Syncfusion +title: Save PDF Files to Azure AD in React PDF Viewer | Syncfusion description: Learn how to load and save PDF files with Azure Active Directory (AAD) using the Syncfusion React PDF Viewer component and a server-backed web service. control: PDF Viewer platform: document-processing @@ -115,7 +115,7 @@ The React PDF Viewer component supports loading and saving PDF files using Azure ### Server-side code snippets ```cs string tenantId = "Provide the tenant id here"; -string clientId = "Provide the clientid here"; +string clientId = "Provide the client ID here"; string clientSecret = "Provide the client secret here"; string blobServiceEndpoint = "https://your-storage-account.blob.core.windows.net"; string containerName = "Provide the container name here"; diff --git a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-azure-blob-storage.md b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-azure-blob-storage.md index 2cf896d8b7..6d28d832a1 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-azure-blob-storage.md +++ b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-azure-blob-storage.md @@ -13,7 +13,7 @@ The React PDF Viewer component supports saving PDF files to Azure Blob Storage u ## Using Standalone PDF Viewer -Follow the steps below to save a PDF file to Azure Blob Storage from an React PDF Viewer. +Follow the steps below to save a PDF file to Azure Blob Storage from a React PDF Viewer. **Step 1:** Create a PDF Viewer sample in React @@ -99,7 +99,7 @@ function saveDocument() { } ``` -N> Install the Azure Storage Blob client package for browser use: `npm install @azure/storage-blob`. For server-side operations use `dotnet add package Azure.Storage.Blobs`. +N> Install the Azure Storage Blob client package for browser use: `npm install @azure/storage-blob`. For server-side operations use `dot net add package Azure.Storage.Blobs`. [View sample in GitHub](https://github.com/SyncfusionExamples/open-save-pdf-documents-in-azure-blob-storage/tree/master/Open%20and%20Save%20PDF%20in%20Azure%20Blob%20Storage%20using%20Standalone). @@ -140,7 +140,7 @@ public PdfViewerController(IConfiguration configuration, ILogger jsonObject) } }, "AllowedHosts": "*", - "connectionString": "*Your Connection string from Azure*", - "containerName": "*Your container name in Azure*" + "connectionString": "Your Connection string from Azure", + "containerName": "Your container name in Azure" } ``` @@ -197,7 +197,7 @@ N> Replace the placeholders with the actual Azure Storage connection string and **Step 3:** Set the PDF Viewer properties in the React PDF Viewer component -Modify the [serviceUrl](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/#serviceurl) property of the PDF Viewer component with the accurate URL of the web service, replacing `https://localhost:44396/pdfviewer` with the actual server URL. Set the `documentPath` property to the desired PDF file name to load from Azure Blob Storage, and ensure that the document exists in the target container. +Modify the [serviceUrl] (https://ej2.syncfusion.com/react/documentation/api/pdfviewer/#serviceurl) property of the PDF Viewer component with the accurate URL of the web service, replacing `https://localhost:44396/pdfviewer` with the actual server URL. Set the `documentPath` property to the desired PDF file name to load from Azure Blob Storage, and ensure that the document exists in the target container. {% tabs %} {% highlight ts tabtitle="Server-Backed" %} diff --git a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-box-cloud-file-storage.md b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-box-cloud-file-storage.md index a53f80cc2a..2b4b985f91 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-box-cloud-file-storage.md +++ b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-box-cloud-file-storage.md @@ -13,7 +13,7 @@ The React PDF Viewer component supports saving PDF files to Box cloud file stora **Step 1:** Set up a Box developer account and create a Box application -To access Box storage programmatically, you'll need a developer account with Box. Go to the [Box Developer Console](https://developer.box.com/), sign in or create a new account, and then create a new Box application. This application will provide you with the necessary credentials Client ID and Client Secret to authenticate and access Box APIs. Before accessing files, you need to authenticate your application to access your Box account. Box API supports `OAuth 2.0 authentication` for this purpose. +To access Box storage programmatically, you'll need a developer account with Box. Go to the [Box Developer Console](https://developer.box.com/), sign in or create a new account, and then create a new Box application. This application will provide you with the necessary credentials (Client ID and Client Secret) to authenticate and access Box APIs. Before accessing files, you need to authenticate your application to access your Box account. Box API supports `OAuth 2.0 authentication` for this purpose. **Step 2:** Create a PDF Viewer sample in React @@ -55,7 +55,7 @@ public PdfViewerController(IWebHostEnvironment hostingEnvironment, IMemoryCache } ``` -5. Modify the [Download()](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/#download) method to save the downloaded PDF file to the Box cloud storage folder. +5. Modify the [Download()] (https://ej2.syncfusion.com/react/documentation/api/pdfviewer/#download) method to save the downloaded PDF file to the Box cloud storage folder. ```csharp [HttpPost("Download")] @@ -150,7 +150,7 @@ root.render(); ``` {% endraw %} -N> Install the Box .NET SDK in the web service project: `dotnet add package Box.V2`. +N> Install the Box .NET SDK in the web service project: `dot net add package Box.V2`. N> Replace `PDF_Succinctly.pdf` with the actual document name to load from Box cloud storage. Pass the document name from the Box folder to the `documentPath` property of the `React PDF Viewer` component. diff --git a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-dropbox-cloud-file-storage.md b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-dropbox-cloud-file-storage.md index e673e1ac9a..a3ccbacfb2 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-dropbox-cloud-file-storage.md +++ b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-dropbox-cloud-file-storage.md @@ -7,7 +7,7 @@ platform: document-processing documentation: ug --- -# Save PDF files to Dropbox cloud storage +# Save PDF Files to Dropbox from React PDF Viewer The React PDF Viewer component supports saving PDF files to Dropbox using either the standalone or server-backed configuration. The following steps demonstrate both approaches. @@ -107,7 +107,7 @@ N> Install the `dropbox` package in the React project before running the sample: ## Using server-backed PDF Viewer -To save a PDF file to Dropbox cloud file storage, you can follow the steps below +To save a PDF file to Dropbox cloud file storage, you can follow the steps below: **Step 1:** Create a Dropbox API app diff --git a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-google-cloud-storage.md b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-google-cloud-storage.md index c044b0b88c..5e88d70265 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-google-cloud-storage.md +++ b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-google-cloud-storage.md @@ -1,13 +1,13 @@ --- layout: post -title: Save PDF files to Google Cloud Storage in React PDF Viewer | Syncfusion +title: Save PDF Files to Google Cloud Storage | Syncfusion description: Learn how to save PDF files to Google Cloud Storage using the Syncfusion React PDF Viewer component with a server-backed web service. control: PDF Viewer platform: document-processing documentation: ug --- -# Save PDF files to Google Cloud Storage +# Store PDF Files in Google Cloud Storage To save a PDF file to Google Cloud Storage, follow the steps below. @@ -15,7 +15,7 @@ To save a PDF file to Google Cloud Storage, follow the steps below. Follow the Syncfusion getting-started instructions for the React PDF Viewer: [React PDF Viewer getting started](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/react/getting-started). This sets up the basic PDF Viewer application structure. -**Step 2:** Modify the `PdfViewerController.cs` File in the Web Service Project +**Step 2:** Modify the `PdfViewerController.cs` file in the web service project 1. Create a web service project in .NET Core 3.0 or above. Refer to the Syncfusion knowledge base article on creating a PDF Viewer web service: [Create a PDF Viewer web service in .NET Core 3.0 and above](https://www.syncfusion.com/kb/11063/how-to-create-pdf-viewer-web-service-in-net-core-3-0-and-above). @@ -108,7 +108,7 @@ N> Replace **path/to/service-account-key.json** with the actual file path to the **Step 3:** Set the PDF Viewer properties in the React PDF Viewer component -Modify the [serviceUrl](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/#serviceurl) property of the PDF Viewer component with the accurate URL of the web service, replacing `https://localhost:44396/pdfviewer` with the actual server URL. Set the `documentPath` property to the desired PDF file name to load from Google Cloud Storage, and ensure that the document exists in the target bucket. +Modify the [serviceUrl] (https://ej2.syncfusion.com/react/documentation/api/pdfviewer/#serviceurl) property of the PDF Viewer component with the accurate URL of the web service, replacing `https://localhost:44396/pdfviewer` with the actual server URL. Set the `documentPath` property to the desired PDF file name to load from Google Cloud Storage, and ensure that the document exists in the target bucket. {% raw %} diff --git a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-google-drive.md b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-google-drive.md index 99d635dbf9..091343e482 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-google-drive.md +++ b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-google-drive.md @@ -1,13 +1,13 @@ --- layout: post -title: Save PDF files to Google Drive in React PDF Viewer | Syncfusion +title: Save PDF Files to Google Cloud Storage | Syncfusion description: Learn how to save PDF files to Google Drive using the Syncfusion React PDF Viewer component with a server-backed web service. control: PDF Viewer platform: document-processing documentation: ug --- -# Save PDF files to Google Drive +# Save PDF Documents to Google Drive Storage This article describes how to save a PDF file to Google Drive from the React PDF Viewer using a server-side web service. Follow the steps below. @@ -136,7 +136,7 @@ N> Use a valid `client_id` from the JSON file to authenticate with the Google Dr **Step 4:** Set the PDF Viewer properties in the React PDF Viewer component -Update the `serviceUrl` property of the PDF Viewer component to the web service URL, replacing `https://localhost:44396/pdfviewer` with the actual server endpoint. Set the `documentPath` property to the PDF file name that exists in the configured Google Drive folder. +Update the `serviceUrl` property of the PDF Viewer component to the web service URL, replacing `https://localhost:44396/pdfviewer` with the actual server endpoint. Set the `documentPath` property to the PDF file name that the web service will load into the viewer. When the user triggers a download, the modified `Download()` method uploads this file to the configured Google Drive folder. {% raw %} diff --git a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-one-drive.md b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-one-drive.md index 5d3869e474..d26107e57c 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-one-drive.md +++ b/Document-Processing/PDF/PDF-Viewer/react/save-pdf-file/to-one-drive.md @@ -7,7 +7,7 @@ platform: document-processing documentation: ug --- -# Save PDF files to OneDrive +# Store PDF Files in OneDrive This article describes how to save a PDF file to OneDrive from the React PDF Viewer using a server-side web service. Follow the steps below. @@ -17,7 +17,7 @@ Create a Microsoft Graph API application, and obtain the application (client) ID **Step 2:** Create a PDF Viewer sample in React -Create a simple PDF Viewer sample in React by following the PDF Viewer for React [getting started](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/react/getting-started) guide. This establishes the application structure required for the integration +Create a simple PDF Viewer sample in React by following the PDF Viewer for React [getting started](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/react/getting-started) guide. This establishes the application structure required for the integration. **Step 3:** Modify the `PdfViewerController.cs` file in the web service project diff --git a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/annotation-toolbar.md b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/annotation-toolbar.md index 60553f1188..5d03157e5f 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/annotation-toolbar.md +++ b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/annotation-toolbar.md @@ -132,4 +132,4 @@ export default function App() { ## Related topics - [Customize form designer toolbar](./form-designer-toolbar) -- [customize primary toolbar](./primary-toolbar) \ No newline at end of file +- [Customize primary toolbar](./primary-toolbar) \ No newline at end of file diff --git a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/custom-toolbar.md b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/custom-toolbar.md index 2e8a38c9ce..3eb0b04a63 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/custom-toolbar.md +++ b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/custom-toolbar.md @@ -1,7 +1,7 @@ --- layout: post title: Create a custom toolbar in React PDF Viewer Component | Syncfusion -description: Learn here all about custom toolbar in Syncfusion React PDF Viewer component of Syncfusion Essential JS 2 and more. +description: Learn how to create and customize a toolbar in the Syncfusion React PDF Viewer, including adding commands and modifying built-in tools. control: PDF Viewer platform: document-processing documentation: ug @@ -163,7 +163,7 @@ import { RouteComponentProps } from 'react-router'; **Step 4: Hide the default toolbar of the PDF Viewer.** -Hide the default toolbar using `enableToolbar` and `enableThumbnail` properties: +Hide the default toolbar using the `enableToolbar` property: {% tabs %} {% highlight js tabtitle="Standalone" %} @@ -545,4 +545,4 @@ Sample: [https://document.syncfusion.com/demos/pdf-viewer/react/#/tailwind3/pdfv ## See also -* [Feature Modules](./feature-module) \ No newline at end of file +* [Primary toolbar](./primary-toolbar) \ No newline at end of file diff --git a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/form-designer-toolbar.md b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/form-designer-toolbar.md index 246d0a031f..60ff1082d4 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/form-designer-toolbar.md +++ b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/form-designer-toolbar.md @@ -25,7 +25,7 @@ This guide shows how to show or hide the form designer toolbar, and how to confi ### 1. Show or hide Form Designer toolbar at initialization -Set the [`isFormDesignerToolbarVisible`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer#isformdesignertoolbarvisible) property on PDF Viewer instance to `true` or `false` to control initial visibility. +Set the [`isFormDesignerToolbarVisible`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer#isformdesignertoolbarvisible) property to `true` or `false` to control initial visibility. {% tabs %} {% highlight ts tabtitle="App.tsx" %} @@ -52,7 +52,7 @@ export default function App() { ### 2. Show or hide form designer toolbar at runtime -Use the [`isFormDesignerToolbarVisible`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer#isformdesignertoolbarvisible) API on the viewer's instance on a custom method to toggle form designer visibility at runtime. +Use the [`isFormDesignerToolbarVisible`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer#isformdesignertoolbarvisible) property on the viewer's instance to toggle form designer visibility at runtime. {% highlight ts %} {% raw %} diff --git a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/mobile-toolbar.md b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/mobile-toolbar.md index c20611bbf9..bb9fcd03e7 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/mobile-toolbar.md +++ b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/mobile-toolbar.md @@ -1,6 +1,6 @@ --- layout: post -title: Customize mobile Toolbar in React PDF Viewer | Syncfusion +title: Customize mobile toolbar in React PDF Viewer | Syncfusion description: Learn how to customize the toolbar for mobile devices in the Syncfusion React PdfViewer and ensure smooth touch interactions. platform: document-processing control: PDF Viewer @@ -8,7 +8,7 @@ documentation: ug domainurl: ##DomainURL## --- -# Customize mobile toolbar in React PdfViewer +# Customize mobile toolbar in React PDF Viewer ## Overview diff --git a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/overview.md b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/overview.md index 83cc05ee2e..0ab8ccfd05 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/overview.md +++ b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/overview.md @@ -1,14 +1,14 @@ --- layout: post title: Toolbar in React PDF Viewer component | Syncfusion -description: Learn here about various toolbars in Syncfusion React PDF Viewer component of Syncfusion Essential JS 2 and more. +description: Learn about the various toolbars available in the Syncfusion React PDF Viewer and how they help users access key PDF features. control: PDF Viewer platform: document-processing documentation: ug domainurl: ##DomainURL## --- -# Toolbar overview in React PDF Viewer +# Toolbar in React PDF Viewer ## Overview @@ -16,7 +16,7 @@ This page provides a concise reference describing the toolbars available in the **Scope**: covers available toolbars and their functions. -## List of Available Toolbars +## List of available toolbars - [Primary toolbar](#primary-toolbar) - [Annotation toolbar](#annotation-toolbar) diff --git a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/primary-toolbar.md b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/primary-toolbar.md index 81b31c321c..28cad0a11e 100644 --- a/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/primary-toolbar.md +++ b/Document-Processing/PDF/PDF-Viewer/react/toolbar-customization/primary-toolbar.md @@ -8,7 +8,7 @@ documentation: ug domainurl: ##DomainURL## --- -# Customize Primary Toolbar in React PDF Viewer +# Customize the Primary Toolbar in React PDF Viewer ## Overview @@ -73,7 +73,7 @@ Provide the [`toolbarItems`](https://ej2.syncfusion.com/react/documentation/api/ ### 4. Add a custom primary toolbar item -Add a custom item by including an object in [`toolbarItems`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/toolbarsettings#toolbaritems) and handling its action via [`toolbarClick`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer#toolbarclick). The following example shows adding a simple custom button at initialization. +Add a custom item by including an object in [`toolbarItems`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer/toolbarsettings#toolbaritems) and handling its action via [`toolbarClick`](https://ej2.syncfusion.com/react/documentation/api/pdfviewer#toolbarclick). The following example shows adding a simple custom button at initialization and wiring its `toolbarClick` handler. {% highlight ts %} {% raw %}