Merge pull request #1474 from syncfusion-content/983650-2

Moorthy-K · web-flow · commit e96bbd08a25a · 2025-09-26T17:34:58.000+05:30
983650-2: Added Blazor UG correction in PDF library
diff --git a/Document-Processing/PDF/PDF-Library/NET/tabcontent-support/Create-PDF-document-in-Blazor-MaUI-VS-Code.md b/Document-Processing/PDF/PDF-Library/NET/tabcontent-support/Create-PDF-document-in-Blazor-MaUI-VS-Code.md
@@ -1,29 +1,26 @@
 **Prerequisites**:
 
-* Install .NET SDK: Ensure that you have the .NET SDK installed on your system. You can download it from the [.NET Downloads page](https://dotnet.microsoft.com/en-us/download).
-* Install Visual Studio Code: Download and install Visual Studio Code from the [official website](https://code.visualstudio.com/download).
-* Install C# Extension for VS Code: Open Visual Studio Code, go to the Extensions view (Ctrl+Shift+X), and search for 'C#'. Install the official [C# extension provided by Microsoft](https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csharp).
-
-
+* **.NET 8 SDK**: Ensure you have .NET 8 or newer installed from [.NET Downloads](https://dotnet.microsoft.com/en-us/download)
+* **Visual Studio Code**: Install from [official site](https://code.visualstudio.com/download)
+* **C# Extension**: Install the [C# extension](https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csharp) in VS Code
 
 Step 1: Open the terminal (Ctrl+` ) and run the following command to create a new Blazor Server application
 
-   ```
-   dotnet new maui-blazor -n CreatePdfBlazorMaUIApp
-   ```
-Step 2: Replace ****CreatePdfBlazorMaUIApp** with your desired project name.
+```
+dotnet new maui-blazor -n CreatePdfBlazorMaUIApp
+```
 
-Step 3: Navigate to the project directory using the following command
+Step 2: Navigate to the project directory using the following command
 
-   ```
-   cd CreatePdfBlazorMaUIApp
-   ```
-Step 4: Use the following command in the terminal to add the  [Syncfusion.PDF.NET](https://www.nuget.org/packages/Syncfusion.pdf.Net) package to your project.
+```
+cd CreatePdfBlazorMaUIApp
+```
+Step 3: Use the following command in the terminal to add the [Syncfusion.PDF.NET](https://www.nuget.org/packages/Syncfusion.pdf.Net) package to your project.
 
-   ```
-   dotnet add package Syncfusion.Pdf.Net
-   ```
-Step 5: Next, include the following namespaces in the ``_Imports.razor`` file.
+```
+dotnet add package Syncfusion.Pdf.Net
+```
+Step 4: Include necessary namespaces in `_Imports.razor` file.
 
 {% tabs %}
 {% highlight c# tabtitle="C#" %}
@@ -38,7 +35,7 @@ Step 5: Next, include the following namespaces in the ``_Imports.razor`` file.
 
 {% endtabs %}
 
-Step 6: Create a button in the ``Weather.razor`` using the following code.
+Step 5: Create a button in ``Weather.razor`` using the following code.
 
 {% tabs %}
 
@@ -50,7 +47,7 @@ Step 6: Create a button in the ``Weather.razor`` using the following code.
 
 {% endtabs %}
 
-Step 7: Define the ``@ExportToPdf`` click function on ``Weather.razor`` file.
+Step 6: Define the `@ExportToPdf` click function on `Weather.razor` file.
 
 The [PdfDocument](https://help.syncfusion.com/cr/file-formats/Syncfusion.Pdf.PdfDocument.html) object represents an entire PDF document that is being created and add a [PdfPage](https://help.syncfusion.com/cr/file-formats/Syncfusion.Pdf.PdfPage.html) to it. The [PdfTextElement](https://help.syncfusion.com/cr/file-formats/Syncfusion.Pdf.Graphics.PdfTextElement.html) is used to add text in a PDF document and which provides the layout result of the added text by using the location of the next element that decides to prevent content overlapping. The [PdfGrid](https://help.syncfusion.com/cr/file-formats/Syncfusion.Pdf.Grid.PdfGrid.html) allows you to create table by entering data manually or from an external data source.
 
@@ -109,18 +106,18 @@ The [PdfDocument](https://help.syncfusion.com/cr/file-formats/Syncfusion.Pdf.Pdf
 
 {% endtabs %}
 
-Step 8: Build the project.
+Step 7: Build the project.
 
 Run the following command in terminal to build the project.
 
-   ```
-   dotnet build
-   ```
+```
+dotnet build
+```
 
-Step 9: Run the project.
+Step 8: Run the project.
 
-Run the following command in terminal to build the project.
+Run the following command in terminal to run the application.
 
-   ```
-   dotnet run
-   ```
+```
+dotnet run
+```
diff --git a/Document-Processing/PDF/PDF-Library/NET/tabcontent-support/Create-PDF-document-in-Blazor-MaUI-Visual-studio.md b/Document-Processing/PDF/PDF-Library/NET/tabcontent-support/Create-PDF-document-in-Blazor-MaUI-Visual-studio.md
@@ -1,15 +1,15 @@
 **Prerequisites**:
 
-* Install .NET SDK: Ensure that you have the .NET SDK installed on your system. You can download it from the [.NET Downloads page](https://dotnet.microsoft.com/en-us/download).
-* Install Visual Studio: Download and install Visual Studio Code from the [official website](https://code.visualstudio.com/download).
+*   **Install .NET SDK**: Ensure that you have the .NET SDK installed on your system. You can download it from the [.NET Downloads page](https://dotnet.microsoft.com/en-us/download).
+*   **Install Visual Studio**: Download and install Visual Studio. For this example, we'll use Visual Studio 2022. You can download it from the [official Visual Studio website](https://visualstudio.microsoft.com/downloads/).
 
-Step 1: Create a new project by choosing `.NET MAUI Blazor Hybrid and Web App` template in Visual Studio.
+Step 1: Create a new .NET MAUI Blazor Hybrid project in Visual Studio
 ![Blazor client project creation step1](Create-PDF-Blazor/Maui-web-app.png)
 
 Step 2: Install the [Syncfusion.PDF.NET](https://www.nuget.org/packages/Syncfusion.pdf.Net) NuGet package as a reference to your Blazor application from [NuGet.org](https://www.nuget.org).
 ![Blazor WASM NuGet package installation](Create-PDF-Blazor/Blazor_server_NuGet_Net.png)
 
-Step 3: Next, include the following namespaces in the ``_Imports.razor`` file.
+Step 3: Include necessary namespaces in `_Imports.razor` file.
 
 {% tabs %}
 
@@ -25,7 +25,7 @@ Step 3: Next, include the following namespaces in the ``_Imports.razor`` file.
 
 {% endtabs %}
 
-Step 4: Create a button in the ``Weather.razor`` using the following code.
+Step 4: Create a button in `Weather.razor` using the following code.
 
 {% tabs %}
 
@@ -98,8 +98,8 @@ The [PdfDocument](https://help.syncfusion.com/cr/file-formats/Syncfusion.Pdf.Pdf
 
 Step 6: Build the project.
 
-Click on Build > Build Solution or press Ctrl + Shift + B to build the project.
+Click on Build > Build Solution or press `Ctrl + Shift + B` to build the project.
 
 Step 7: Run the project.
 
-Click the Start button (green arrow) or press F5 to run the app.
+Click the `Start` button (green arrow) or press `F5` to run the app.
diff --git a/Document-Processing/PDF/PDF-Library/NET/tabcontent-support/Create-PDF-document-in-Blazor-WASM-JetBrains.md b/Document-Processing/PDF/PDF-Library/NET/tabcontent-support/Create-PDF-document-in-Blazor-WASM-JetBrains.md
@@ -3,35 +3,34 @@
 * JetBrains Rider.
 * Install .NET 8 SDK or later.
 
-Step 1. Open JetBrains Rider and create a new Blazor WASM app project.
-* Launch JetBrains Rider.
-* Click new solution on the welcome screen.
+Step 1: Create a new Blazor WebAssembly App project in JetBrains Rider.
 
 ![Launch JetBrains Rider](JetBrains_Images/Launch-JetBrains-Rider.png)
 
-* In the new Solution dialog, select Project Type as Web.
-* Enter a project name and specify the location.
-* Choose template as **Blazor WebAssembly Standalone App**.
-* Select the target framework (e.g., .NET 8.0, .NET 9.0).
-* Click create.
+In the **New Solution** dialog:
+*   Select **Web** as the **Project Type**.
+*   Enter a **Solution name** (e.g., `CreatePdfBlazorWasmApp`) and specify the **Location**.
+*   Choose **Blazor WebAssembly Standalone App** as the template.
+*   Select the target framework (e.g., .NET 8.0).
+*   Click **Create**.
 
 ![Launch JetBrains Rider](JetBrains_Images/create-blazor-wasm-application.png)
 
 Step 2: Install the NuGet package from [NuGet.org](https://www.nuget.org/).
 * Click the NuGet icon in the Rider toolbar and type [Syncfusion.Pdf.Net.Core](https://www.nuget.org/packages/Syncfusion.Pdf.Net.Core) in the search bar.
-* Ensure that "nuget.org" is selected as the package source.
-* Select the latest Syncfusion.Pdf.Net.Core NuGet package from the list.
-* Click the + (Add) button to add the package.
+* Ensure that `nuget.org` is selected as the package source.
+* Select the latest `Syncfusion.Pdf.Net.Core` NuGet package from the list.
+* Click the **Add** button (or the `+` icon) to add the package.
 
 ![Select the Syncfusion.Pdf.Net.Core package](JetBrains_Images/Core-Package.png)
 
-* Click the Install button to complete the installation.
+* Click the **Install** button to complete the installation.
 
 ![Install the package](JetBrains_Images/Install-Core-BlazorWeb-Package.png)
 
-N> Starting with v16.2.0.x, if you reference Syncfusion<sup>&reg;</sup> assemblies from trial setup or from the NuGet feed, you also have to add "Syncfusion.Licensing" assembly reference and include a license key in your projects. Please refer to this [link](https://help.syncfusion.com/common/essential-studio/licensing/overview) to know about registering Syncfusion<sup>&reg;</sup> license key in your application to use our components.
+N> Starting with v16.2.0.x, if referencing Syncfusion<sup>&reg;</sup> assemblies from trial setup or from the NuGet feed, add "Syncfusion.Licensing" assembly reference and include a license key in projects. Refer to this [link](https://help.syncfusion.com/common/essential-studio/licensing/overview) to learn about registering Syncfusion<sup>&reg;</sup> license key in applications to use the components.
 
-Step 5: Next, include the following namespaces in that  ``FetchData.razor`` file.
+Step 3: Include necessary namespaces in `FetchData.razor` file.
 
 {% tabs %}
 {% highlight c# tabtitle="C#" %}
@@ -46,15 +45,15 @@ Step 5: Next, include the following namespaces in that  ``FetchData.razor`` file
 {% endhighlight %}
 {% endtabs %}
 
-Step 6: Create a button in the ``FetchData.razor`` using the following code.
+Step 4: Create a button in `FetchData.razor` using the following code.
 
 {% tabs %}
 {% highlight CSHTML %}
 <button class="btn btn-primary" @onclick="@ExportToPdf">Export to PDF</button>
 {% endhighlight %}
 {% endtabs %}
 
-Step 7: Define the ``@ExportToPdf`` click function on ``FetchData.razor`` file.
+Step 5: Define the `@ExportToPdf` click function on `FetchData.razor` file.
 
 The [PdfDocument](https://help.syncfusion.com/cr/document-processing/Syncfusion.Pdf.PdfDocument.html) object represents an entire PDF document that is being created and add a [PdfPage](https://help.syncfusion.com/cr/document-processing/Syncfusion.Pdf.PdfPage.html) to it. The [PdfTextElement](https://help.syncfusion.com/cr/document-processing/Syncfusion.Pdf.Graphics.PdfTextElement.html) is used to add text in a PDF document and which provides the layout result of the added text by using the location of the next element that decides to prevent content overlapping. The [PdfGrid](https://help.syncfusion.com/cr/document-processing/Syncfusion.Pdf.Grid.PdfGrid.html) allows you to create table by entering data manually or from an external data sources. 
  
@@ -108,7 +107,7 @@ JS.SaveAs("Sample.pdf", memoryStream.ToArray());
 {% endhighlight %}
 {% endtabs %}
 
-Step 8: Create a class file with ``FileUtil`` name and add the following code to invoke the JavaScript action to download the file in the browser.
+Step 6: Create a class file with ``FileUtil`` name and add the following code to invoke the JavaScript action to download the file in the browser.
 
 {% tabs %}
 
@@ -127,7 +126,7 @@ public static class FileUtil
 
 {% endtabs %}
 
-Step 9: Add the following JavaScript function in the ``index.html`` available under the ``wwwroot`` folder.
+Step 7: Add the following JavaScript function in the ``index.html`` available under the ``wwwroot`` folder.
 
 {% tabs %}
 
@@ -160,10 +159,10 @@ Step 9: Add the following JavaScript function in the ``index.html`` available un
 
 {% endtabs %}
 
-Step 10: Build the project.
+Step 8: Build the project.
 
 Click the **Build** button in the toolbar or press <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>B</kbd> to build the project.
 
-Step 11: Run the project.
+Step 9: Run the project.
 
-Click the **Run** button (green arrow) in the toolbar or press <kbd>F5</kbd> to run the app.
+Click the **Run** button (green arrow) in the toolbar or press <kbd>F5</kbd> to run the application.
diff --git a/Document-Processing/PDF/PDF-Library/NET/tabcontent-support/Create-PDF-document-in-Blazor-WASM-VS-Code.md b/Document-Processing/PDF/PDF-Library/NET/tabcontent-support/Create-PDF-document-in-Blazor-WASM-VS-Code.md
@@ -1,29 +1,26 @@
 **Prerequisites**:
 
-* Install .NET SDK: Ensure that you have the .NET SDK installed on your system. You can download it from the [.NET Downloads page](https://dotnet.microsoft.com/en-us/download).
-* Install Visual Studio Code: Download and install Visual Studio Code from the [official website](https://code.visualstudio.com/download).
-* Install C# Extension for VS Code: Open Visual Studio Code, go to the Extensions view (Ctrl+Shift+X), and search for 'C#'. Install the official [C# extension provided by Microsoft](https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csharp).
+* **.NET 8 SDK**: Ensure you have .NET 8 or newer installed from [.NET Downloads](https://dotnet.microsoft.com/en-us/download)
+* **Visual Studio Code**: Install from [official site](https://code.visualstudio.com/download)
+* **C# Extension**: Install the [C# extension](https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csharp) in VS Code
 
-
-
-Step 1: Open the terminal (Ctrl+` ) and run the following command to create a new Blazor Server application
+Step 1: Open the terminal (Ctrl+`) and run the following command to create a new Blazor Server application
 
 ```
 dotnet new blazorwasm -o CreatePdfBlazorWASMApp
 ```
-Step 2: Replace ****CreatePdfBlazorWASMApp** with your desired project name.
 
-Step 3: Navigate to the project directory using the following command
+Step 2: Navigate to the project directory using the following command
 
 ```
 cd CreatePdfBlazorWASMApp
 ```
-Step 4: Use the following command in the terminal to add the [Syncfusion.Pdf.Net.Core](https://www.nuget.org/packages/Syncfusion.pdf.Net.Core) package to your project.
+Step 3: Use the following command in the terminal to add the [Syncfusion.Pdf.Net.Core](https://www.nuget.org/packages/Syncfusion.pdf.Net.Core) package to your project.
 
 ```
 dotnet add package Syncfusion.Pdf.Net.Core
 ```
-Step 5: Create a new cs file named **ExportService.cs** under **Data** folder and include the following namespaces in the file.
+Step 4: Create a new cs file named **ExportService.cs** under **Data** folder and include the following namespaces in the file.
 
 {% tabs %}
 {% highlight c# tabtitle="C#" %}
@@ -36,9 +33,9 @@ using Syncfusion.Drawing;
 {% endhighlight %}
 {% endtabs %}
 
-Step 6: The [PdfDocument](https://help.syncfusion.com/cr/document-processing/Syncfusion.Pdf.PdfDocument.html) object represents an entire PDF document that is being created. The [PdfTextElement](https://help.syncfusion.com/cr/document-processing/Syncfusion.Pdf.Graphics.PdfTextElement.html) is used to add text in a PDF document and which provides the layout result of the added text by using the location of the next element that decides to prevent content overlapping. The [PdfGrid](https://help.syncfusion.com/cr/document-processing/Syncfusion.Pdf.Grid.PdfGrid.html) allows you to create table by entering data manually or from an external data sources. 
+Step 5: The [PdfDocument](https://help.syncfusion.com/cr/document-processing/Syncfusion.Pdf.PdfDocument.html) object represents an entire PDF document that is being created. The [PdfTextElement](https://help.syncfusion.com/cr/document-processing/Syncfusion.Pdf.Graphics.PdfTextElement.html) is used to add text in a PDF document and which provides the layout result of the added text by using the location of the next element that decides to prevent content overlapping. The [PdfGrid](https://help.syncfusion.com/cr/document-processing/Syncfusion.Pdf.Grid.PdfGrid.html) allows you to create table by entering data manually or from an external data sources. 
 
-Add the following code sample in ``ExportService`` class which illustrates how to create a simple PDF document using ``PdfTextElement`` and ``PdfGrid``. 
+Add the following code sample in `ExportService` class which illustrates how to create a simple PDF document using `PdfTextElement` and `PdfGrid`. 
 
 {% tabs %}
 {% highlight c# tabtitle="C#" %}
@@ -97,7 +94,7 @@ public static MemoryStream CreatePdf(WeatherForecast[] forecasts)
 {% endhighlight %}
 {% endtabs %}
 
-Register your service in the ``ConfigureServices`` method available in the ``Startup.cs`` class as follows.
+Register service in the `ConfigureServices` method available in the `Startup.cs` class as follows.
 
 {% tabs %}
 {% highlight c# tabtitle="C#" %}
@@ -111,7 +108,7 @@ public void ConfigureServices(IServiceCollection services)
 {% endhighlight %}
 {% endtabs %}
 
-Step 7: Inject ``ExportService`` in-to ``FetchData.razor`` using the following code.
+Step 6: Inject `ExportService` into `FetchData.razor` using the following code.
 
 {% tabs %}
 {% highlight CSHTML %}
@@ -123,15 +120,15 @@ Step 7: Inject ``ExportService`` in-to ``FetchData.razor`` using the following c
 {% endhighlight %}
 {% endtabs %}
 
-Create a button in the ``FetchData.razor`` using the following code.
+Create a button in the `FetchData.razor` using the following code.
 
 {% tabs %}
 {% highlight CSHTML %}
 <button class="btn btn-primary" @onclick="@ExportToPdf">Export to PDF</button>
 {% endhighlight %}
 {% endtabs %}
 
-Add the ``ExportToPdf`` method in ``FetchData.razor`` page to call the export service.
+Add the `ExportToPdf` method in `FetchData.razor` page to call the export service.
 
 {% tabs %}
 {% highlight c# tabtitle="C#" %}
@@ -148,7 +145,7 @@ Add the ``ExportToPdf`` method in ``FetchData.razor`` page to call the export se
 {% endhighlight %}
 {% endtabs %}
 
-Step 8: Create a class file with  ``FileUtil`` name and add the following code to invoke the JavaScript action to download the file in the browser.
+Step 7: Create a class file with `FileUtil` name and add the following code to invoke the JavaScript action to download the file in the browser.
 
 {% tabs %}
 
@@ -167,7 +164,7 @@ public static class FileUtil
 
 {% endtabs %}
 
-Step 9: Add the following JavaScript function in the  ``_Host.cshtml`` available under the ``Pages`` folder.
+Step 8: Add the following JavaScript function in the `_Host.cshtml` available under the `Pages` folder.
 
 {% tabs %}
 
@@ -200,18 +197,16 @@ Step 9: Add the following JavaScript function in the  ``_Host.cshtml`` available
 
 {% endtabs %}
 
-Step 10: Build the project.
-
-    Run the following command in terminal to build the project.
-
-    ```
-    dotnet build
-    ```
+Step 9: Build the project.
+Run the following command in terminal to build the project.
 
-12. Run the project:
+```
+dotnet build
+```
 
-    Run the following command in terminal to run the project.
+Step 10: Run the project.
+Run the following command in terminal to run the application.
 
-    ```
-    dotnet run
+```
+dotnet run
 ```
diff --git a/Document-Processing/PDF/PDF-Library/NET/tabcontent-support/Create-PDF-document-in-Blazor-WASM-Visual-studio.md b/Document-Processing/PDF/PDF-Library/NET/tabcontent-support/Create-PDF-document-in-Blazor-WASM-Visual-studio.md
