diff --git a/Document-Processing/Word/Word-Processor/angular/getting-started.md b/Document-Processing/Word/Word-Processor/angular/getting-started.md
index c90328de1d..337ce656d5 100644
--- a/Document-Processing/Word/Word-Processor/angular/getting-started.md
+++ b/Document-Processing/Word/Word-Processor/angular/getting-started.md
@@ -1,70 +1,32 @@
 ---
 layout: post
-title: Getting started with Angular Document editor component | Syncfusion
-description: Checkout and learn about Getting started with Angular Document editor component of Syncfusion Essential JS 2 and more details.
+title: Getting Started with Angular DOCX Editor | Syncfusion
+description: Learn how to create a DOCX Editor in an Angular application using the Syncfusion® Document Editor control to create, edit, and view Word documents.
 platform: document-processing
 control: Getting started 
 documentation: ug
 domainurl: ##DomainURL##
 ---
 
-# Getting started with Angular Document editor component
+# Getting Started with Angular DOCX Editor
 
-This section explains the steps to create a Word document editor within your application and demonstrates the basic usage of the Document editor component.
+Syncfusion® DOCX Editor (Document Editor) enables you to create, edit, view, and print Word documents in web applications. This section guides you through the steps to get started and create a DOCX Editor in an Angular application. 
 
-To get started quickly with Document editor component using CLI, you can check the video below.
+## Steps to create an Angular DOCX Editor
 
-{% youtube "https://www.youtube.com/watch?v=UHdjjR_BbQY" %}
-
-## Prerequisites
-
-[System requirements for Syncfusion<sup style="font-size:70%">&reg;</sup> Angular Document editor](https://ej2.syncfusion.com/angular/documentation/system-requirement)
-
-## Dependencies
-
-The list of dependencies required to use the Document editor component in your application is given below:
-
-```javascript
-|-- @syncfusion/ej2-angular-documenteditor
-    |-- @syncfusion/ej2-angular-base
-    |-- @syncfusion/ej2-documenteditor
-    |-- @syncfusion/ej2-base
-    |-- @syncfusion/ej2-buttons
-    |-- @syncfusion/ej2-compression
-    |-- @syncfusion/ej2-data
-    |-- @syncfusion/ej2-dropdowns
-    |-- @syncfusion/ej2-file-utils
-    |-- @syncfusion/ej2-inputs
-    |-- @syncfusion/ej2-lists
-    |-- @syncfusion/ej2-navigations
-    |-- @syncfusion/ej2-popups
-    |-- @syncfusion/ej2-splitbuttons
-    |-- @syncfusion/ej2-charts
-```
-
-### Server-side dependencies
-
-The Document editor component requires server-side interactions for the following operations:
-
-* [Open file formats other than SFDT](./import#convert-word-documents-into-sfdt)
-* [Paste with formatting](./clipboard#paste-with-formatting)
-* [Restrict editing](./document-management)
-* [Spell check](./spell-check)
-* [Save as file formats other than SFDT and DOCX](./saving-documents/server-side-export)
+### Prerequisites
 
->Note: If you don't require the above functionalities, you can deploy the component as a pure client-side solution without any server-side interactions.
-
-For detailed information about server-side dependencies, refer to the [Web Services Overview](./web-services-overview) page.
+[System requirements for Syncfusion<sup style="font-size:70%">&reg;</sup> Angular Document Editor](https://ej2.syncfusion.com/angular/documentation/system-requirement)
 
-## Setup Angular environment
+### Setup Angular environment
 
 You can use [Angular CLI](https://github.com/angular/angular-cli) to set up your Angular applications. To install Angular CLI, use the following command:
 
 ```bash
-npm install -g @angular/cli@16.0.1
+npm install -g @angular/cli
 ```
 
-## Create an Angular application
+### Create an Angular application
 
 Start a new Angular application using the Angular CLI command below:
 
@@ -72,11 +34,19 @@ Start a new Angular application using the Angular CLI command below:
 ng new my-app
 ```
 
-This command will prompt you for a few settings for the new project, such as whether to add Angular routing and which stylesheet format to use.
+This command will prompt you to configure settings like enabling Angular routing and choosing a stylesheet format.
 
 ![Initial_setup](images/Initial-setup.png)
 
-By default, it will create a CSS-based application.
+In this guide, CSS is selected as the stylesheet format.
+
+During project setup, when prompted for the Server-side rendering (SSR) option, choose the appropriate configuration.
+
+![Server Side Rendering setup](images/Server-Side-Rendering-setup.png)
+
+Select the required AI tool or 'none' if you do not need any AI tool.
+
+![AI tools](images/AI-tools.png)
 
 Next, navigate to the created project folder:
 
@@ -84,19 +54,17 @@ Next, navigate to the created project folder:
 cd my-app
 ```
 
-## Adding Syncfusion<sup style="font-size:70%">&reg;</sup> Document editor package
+### Install the Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor packages
 
-All available Essential<sup style="font-size:70%">&reg;</sup> JS 2 packages are published in the [`npmjs.com`](https://www.npmjs.com/~syncfusionorg) registry.
+The Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor package is available in the public npm registry and can be installed directly from [`npmjs.com`](https://www.npmjs.com/~syncfusionorg).
 
-To install the Document editor component, use the following command:
+To install the Document Editor component, use the following command:
 
 ```bash
 npm install @syncfusion/ej2-angular-documenteditor --save
 ```
 
->Note: The `--save` flag instructs npm to include the Document editor package inside the dependencies section of the `package.json` file.
-
-## Adding CSS reference
+### Add CSS reference
 
 The following CSS files are available in the `node_modules/@syncfusion` package folder. Reference these styles in the `src/styles.css` file using the following code:
 
@@ -112,60 +80,50 @@ The following CSS files are available in the `node_modules/@syncfusion` package
 @import '../node_modules/@syncfusion/ej2-angular-documenteditor/styles/material.css';
 ```
 
-## Choosing a component
-
-* **DocumentEditorContainer**: A complete solution with a predefined toolbar, properties pane, and status bar for comprehensive document editing
-* **DocumentEditor**: A customizable component where you build the UI according to your specific requirements
-
->Note: Starting from version `v19.3.0.x`, the text size measurement accuracy has been optimized to match Microsoft Word pagination for most documents. This improvement is enabled by default. You can [disable it to retain the pagination behavior of older versions](./how-to/disable-optimized-text-measuring) if needed.
-
-### DocumentEditorContainer component
-
-The DocumentEditorContainer is a predefined component that wraps the DocumentEditor, toolbar, properties pane, and status bar into a single component. The toolbar and properties pane allow users to view and modify documents through public APIs available in the DocumentEditor.
+### Add the Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor component
 
-#### Adding DocumentEditorContainer component
-
-Modify the template in the `src/app/app.component.ts` file to render the DocumentEditorContainer component. Add the Angular DocumentEditorContainer using the `<ejs-documenteditorcontainer>` selector in the template section of the `app.component.ts` file:
+Modify the template in the `src/app/app.ts` file to render the Document Editor component. Add the Angular Document Editor by using the <ejs-documenteditorcontainer> selector in the template section of the app.ts file.
 
 ```typescript
-import { DocumentEditorContainerModule } from '@syncfusion/ej2-angular-documenteditor';
-import { Component, OnInit } from '@angular/core';
-import { ToolbarService } from '@syncfusion/ej2-angular-documenteditor';
+import { Component } from '@angular/core';
+import {
+  DocumentEditorContainerModule,
+  ToolbarService
+} from '@syncfusion/ej2-angular-documenteditor';
 
 @Component({
-    imports: [        
-        DocumentEditorContainerModule
-    ],
-    standalone: true,
-    selector: 'app-root',
-    template: `<ejs-documenteditorcontainer 
-                   serviceUrl="https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/" 
-                   height="600px" 
-                   style="display:block" 
-                   [enableToolbar]=true>
-               </ejs-documenteditorcontainer>`,
-    providers: [ToolbarService]
+  selector: 'app-root',
+  standalone: true,
+  imports: [DocumentEditorContainerModule],
+  providers: [ToolbarService],
+  template: `
+    <!-- Use the following service URL only for demo purposes -->
+    <ejs-documenteditorcontainer
+      serviceUrl="https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/"
+      height="600px"
+      style="display: block"
+      [enableToolbar]="true">
+    </ejs-documenteditorcontainer>
+  `
 })
-export class AppComponent implements OnInit {
-    ngOnInit(): void {
-    }
-}
+export class App {}
 ```
 
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` used in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, host your own web service with the required server configurations. Refer to the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or use the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service.
+> The hosted Web API URL is for demo and evaluation purposes only. For production, host your own web service using the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server).
 
-#### Run the DocumentEditorContainer application
+### Run the application
 
-The project is configured to compile and run the application in a browser. Use the following command to run the application:
+Run the application using the following command:
 
 ```bash
 ng serve --open
 ```
+Open http://localhost:4200 in your browser to run the application.
 
-The DocumentEditorContainer output will be displayed as follows:
+The Document Editor is displayed as shown below.
 
 {% tabs %}
-{% highlight ts tabtitle="app.component.ts" %}
+{% highlight ts tabtitle="app.ts" %}
 {% include code-snippet/document-editor/angular/document-editor-container-cs2/src/app.component.ts %}
 {% endhighlight %}
 
@@ -176,131 +134,22 @@ The DocumentEditorContainer output will be displayed as follows:
   
 {% previewsample "/document-processing/samples/document-editor/angular/document-editor-container-cs2" %}
 
+## Video tutorial
 
->Note: If you see a license banner when running your application, you need to obtain a license key and register it within the application to use Syncfusion components. For more information on how to obtain and register a license key, refer to the [Licensing overview](https://ej2.syncfusion.com/angular/documentation/licensing/overview) page.
-
-### DocumentEditor component
-
-The DocumentEditor component is used to create, view, and edit Word documents. With this component, you can customize the UI options based on your requirements to modify documents.
-
-#### Adding DocumentEditor component
+To get started quickly with the Document Editor component using CLI, you can check the video below.
 
-Modify the template in the `src/app/app.component.ts` file to render the DocumentEditor component. Add the Angular DocumentEditor using the `<ejs-documenteditor>` selector in the template section of the `app.component.ts` file:
-
-```typescript
-import { DocumentEditorModule } from '@syncfusion/ej2-angular-documenteditor';
-import { Component, OnInit } from '@angular/core';
-import { 
-    PrintService, 
-    SfdtExportService, 
-    WordExportService, 
-    TextExportService, 
-    SelectionService, 
-    SearchService, 
-    EditorService, 
-    ImageResizerService, 
-    EditorHistoryService, 
-    ContextMenuService, 
-    OptionsPaneService, 
-    HyperlinkDialogService, 
-    TableDialogService, 
-    BookmarkDialogService, 
-    TableOfContentsDialogService, 
-    PageSetupDialogService, 
-    StyleDialogService, 
-    ListDialogService, 
-    ParagraphDialogService, 
-    BulletsAndNumberingDialogService, 
-    FontDialogService, 
-    TablePropertiesDialogService, 
-    BordersAndShadingDialogService, 
-    TableOptionsDialogService, 
-    CellOptionsDialogService, 
-    StylesDialogService 
-} from '@syncfusion/ej2-angular-documenteditor';
-
-@Component({
-    imports: [        
-        DocumentEditorModule
-    ],
-    standalone: true,
-    selector: 'app-root',
-    template: `<ejs-documenteditor 
-                   id="container" 
-                   height="330px" 
-                   serviceUrl="https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/" 
-                   [isReadOnly]=false 
-                   [enablePrint]=true 
-                   [enableSelection]=true 
-                   [enableEditor]=true 
-                   [enableEditorHistory]=true 
-                   [enableContextMenu]=true 
-                   [enableSearch]=true 
-                   [enableOptionsPane]=true>
-               </ejs-documenteditor>`,
-    providers: [
-        PrintService, 
-        SfdtExportService, 
-        WordExportService, 
-        TextExportService, 
-        SelectionService, 
-        SearchService, 
-        EditorService, 
-        ImageResizerService, 
-        EditorHistoryService, 
-        ContextMenuService, 
-        OptionsPaneService, 
-        HyperlinkDialogService, 
-        TableDialogService, 
-        BookmarkDialogService, 
-        TableOfContentsDialogService, 
-        PageSetupDialogService, 
-        StyleDialogService, 
-        ListDialogService, 
-        ParagraphDialogService, 
-        BulletsAndNumberingDialogService, 
-        FontDialogService, 
-        TablePropertiesDialogService, 
-        BordersAndShadingDialogService, 
-        TableOptionsDialogService, 
-        CellOptionsDialogService, 
-        StylesDialogService
-    ]
-})
-export class AppComponent implements OnInit {
-    ngOnInit(): void {
-    }
-}
-```
-
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` used in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, host your own web service with the required server configurations. Refer to the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or use the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service.
-
-#### Run the DocumentEditor application
-
-Use the following command to compile and run the application in a browser:
-
-```bash
-ng serve --open
-```
+{% youtube "https://www.youtube.com/watch?v=UHdjjR_BbQY" %}
 
-The DocumentEditor output will be displayed as follows:
+## Server-side dependencies
 
-{% tabs %}
-{% highlight ts tabtitle="app.component.ts" %}
-{% include code-snippet/document-editor/angular/getting-started-cs1/src/app.component.ts %}
-{% endhighlight %}
+The Document Editor component requires server-side interactions for the following operations:
 
-{% highlight ts tabtitle="main.ts" %}
-{% include code-snippet/document-editor/angular/getting-started-cs1/src/main.ts %}
-{% endhighlight %}
-{% endtabs %}
-  
-{% previewsample "/document-processing/samples/document-editor/angular/getting-started-cs1" %}
+* Open file formats other than SFDT
+* Paste with formatting
+* Restrict editing
+* Spell check
+* Save as file formats other than SFDT and DOCX
 
-## Frequently Asked Questions
+>Note: If you don't require the above functionalities, you can deploy the component as a pure client-side solution without any server-side interactions.
 
-* [How to localize the Document editor container](./global-local)
-* [How to load a document by default](./how-to/open-default-document)
-* [How to customize the toolbar](./how-to/customize-tool-bar)
-* [How to resize the Document editor component](./how-to/resize-document-editor)
-* [How to add a save button to the DocumentEditorContainer toolbar](./how-to/add-save-button-in-toolbar)
\ No newline at end of file
+For detailed information about server-side dependencies, refer to the [Web Services Overview](./web-services-overview) page.
diff --git a/Document-Processing/Word/Word-Processor/angular/images/AI-tools.png b/Document-Processing/Word/Word-Processor/angular/images/AI-tools.png
new file mode 100644
index 0000000000..7e2cdf171f
Binary files /dev/null and b/Document-Processing/Word/Word-Processor/angular/images/AI-tools.png differ
diff --git a/Document-Processing/Word/Word-Processor/angular/images/Initial-setup.png b/Document-Processing/Word/Word-Processor/angular/images/Initial-setup.png
index b116d7dda0..1c7bd9ec70 100644
Binary files a/Document-Processing/Word/Word-Processor/angular/images/Initial-setup.png and b/Document-Processing/Word/Word-Processor/angular/images/Initial-setup.png differ
diff --git a/Document-Processing/Word/Word-Processor/angular/images/Server-Side-Rendering-setup.png b/Document-Processing/Word/Word-Processor/angular/images/Server-Side-Rendering-setup.png
new file mode 100644
index 0000000000..a654588d44
Binary files /dev/null and b/Document-Processing/Word/Word-Processor/angular/images/Server-Side-Rendering-setup.png differ
diff --git a/Document-Processing/Word/Word-Processor/javascript-es5/getting-started.md b/Document-Processing/Word/Word-Processor/javascript-es5/getting-started.md
index 51c65bfcc8..f94da30a82 100644
--- a/Document-Processing/Word/Word-Processor/javascript-es5/getting-started.md
+++ b/Document-Processing/Word/Word-Processor/javascript-es5/getting-started.md
@@ -1,16 +1,17 @@
 ---
 layout: post
-title: Getting started with JavaScript (ES5) Document editor | Syncfusion
-description: Checkout and learn about Getting started with JavaScript (ES5) Document editor control of Syncfusion Essential JS 2 and more details.
+title: Getting Started with JavaScript (ES5) DOCX Editor | Syncfusion
+description: Learn how to create a DOCX Editor in a JavaScript application using the Syncfusion® Document Editor control to create, edit, and view Word documents.
 platform: document-processing
 control: Getting started 
 documentation: ug
 domainurl: ##DomainURL##
 ---
 
-# Getting started with JavaScript (ES5) Document editor control
+# Getting Started with JavaScript (ES5) Document Editor
+
+Syncfusion® DOCX Editor (Document Editor) enables you to create, edit, view, and print Word documents in web applications. This section guides you through the steps to get started and create a DOCX Editor in a JavaScript (ES5) application.
 
-The Essential<sup style="font-size:70%">&reg;</sup> JS 2 for JavaScript (global script) is an ES5 formatted pure JavaScript framework designed for compatibility with modern web browsers without requiring build tools.
 
 ## Component Initialization
 
@@ -82,74 +83,8 @@ This approach downloads and hosts the required files locally, providing better c
 <body>
 </body>
 </html>
-```
-**Step 5:** Now, add the `Div` element and initiate the **Essential<sup style="font-size:70%">&reg;</sup> JS 2 DocumentEditor** component in the `index.html` by using following code
-
-```html
-<!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
-    <title>Essential JS 2 Document editor</title>
-    <!-- EJ2 Document editor dependent material theme -->
-    <link href="resources/base/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="resources/buttons/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="resources/inputs/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="resources/popups/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="resources/lists/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="resources/navigations/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="resources/splitbuttons/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="resources/dropdowns/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <!-- EJ2 DocumentEditor material theme -->
-    <link href="resources/documenteditor/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-
-    <!-- EJ2 Document editor dependent scripts -->
-    <script src="resources/scripts/ej2-base.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-data.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-svg-base.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-file-utils.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-compression.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-pdf-export.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-buttons.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-popups.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-splitbuttons.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-inputs.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-lists.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-navigations.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-dropdowns.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-calendars.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-charts.min.js" type="text/javascript"></script>
-    <script src="resources/scripts/ej2-office-chart.min.js" type="text/javascript"></script>
-    <!-- EJ2 Document editor script -->
-    <script src="resources/scripts/ej2-documenteditor.min.js" type="text/javascript"></script>
-</head>
-<body>
-    <!-- Element which is going to render -->
-    <div id='DocumentEditor'></div>
-    <script>
-        // Initialize DocumentEditor component
-        var documenteditor = new ej.documenteditor.DocumentEditor({ 
-            isReadOnly: false, 
-            serviceUrl: 'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/' 
-        });
-
-        documenteditor.acceptTab = true;
-
-        // Enable all the built-in modules
-        documenteditor.enableAllModules();
-        documenteditor.pageOutline = '#E0E0E0';
-
-        // Document editor control rendering
-        documenteditor.appendTo('#DocumentEditor');
-    </script>
-</body>
-</html>
-```
-
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` used in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, host your own web service with the required server configurations. Refer to the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or use the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service.
-
-**Step 6:** Now, run the `index.html` in web browser, it will render the **Essential<sup style="font-size:70%">&reg;</sup> JS 2 DocumentEditor** component.
 
-**Step 7:** To render DocumentEditorContainer component, add the `Div` element and initiate the **Essential<sup style="font-size:70%">&reg;</sup> JS 2 DocumentEditorContainer** component in the `index.html` by using following code
+**Step 5:** To render DocumentEditorContainer component, add the `Div` element and initiate the **Essential<sup style="font-size:70%">&reg;</sup> JS 2 DocumentEditorContainer** component in the `index.html` by using following code
 
 ```html
 <!DOCTYPE html>
@@ -206,7 +141,8 @@ This approach downloads and hosts the required files locally, providing better c
 </html>
 ```
 
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
+> The hosted Web API URL is for demo and evaluation purposes only. For production, host your own web service using the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server).
+
 
 Now, run the `index.html` in web browser, it will render the **Essential<sup style="font-size:70%">&reg;</sup> JS 2 DocumentEditorContainer** component.
 
@@ -228,76 +164,7 @@ This approach uses Content Delivery Network (CDN) links to reference the require
 >
 > Styles: [`https://cdn.syncfusion.com/ej2/32.1.19/ej2-documenteditor/styles/material.css`](https://cdn.syncfusion.com/ej2/32.1.19/ej2-documenteditor/styles/material.css)
 
-**Step 3:** Create a HTML page (index.html) in `app` location and add the CDN link references. Now, add the `Div` element and initiate the **Essential<sup style="font-size:70%">&reg;</sup> JS 2 DocumentEditor** component in the index.html by using following code.
-
-```html
-<!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
-    <title>Essential JS 2 Document editor</title>
-    <!-- EJ2 Document editor dependent theme -->
-    <link href="https://cdn.syncfusion.com/ej2/ej2-base/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="https://cdn.syncfusion.com/ej2/ej2-buttons/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="https://cdn.syncfusion.com/ej2/ej2-inputs/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="https://cdn.syncfusion.com/ej2/ej2-popups/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="https://cdn.syncfusion.com/ej2/ej2-lists/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="https://cdn.syncfusion.com/ej2/ej2-navigations/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="https://cdn.syncfusion.com/ej2/ej2-splitbuttons/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <link href="https://cdn.syncfusion.com/ej2/ej2-dropdowns/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-    <!-- EJ2 Document editor theme -->
-    <link href="https://cdn.syncfusion.com/ej2/ej2-documenteditor/styles/material.css" rel="stylesheet" type="text/css" rel='nofollow' />
-
-    <!-- EJ2 Document editor dependent scripts -->
-    <script src="https://cdn.syncfusion.com/ej2/ej2-base/dist/global/ej2-base.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-data/dist/global/ej2-data.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-svg-base/dist/global/ej2-svg-base.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-file-utils/dist/global/ej2-file-utils.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-compression/dist/global/ej2-compression.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-pdf-export/dist/global/ej2-pdf-export.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-buttons/dist/global/ej2-buttons.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-popups/dist/global/ej2-popups.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-splitbuttons/dist/global/ej2-splitbuttons.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-inputs/dist/global/ej2-inputs.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-lists/dist/global/ej2-lists.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-navigations/dist/global/ej2-navigations.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-dropdowns/dist/global/ej2-dropdowns.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-calendars/dist/global/ej2-calendars.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-charts/dist/global/ej2-charts.min.js" type="text/javascript"></script>
-    <script src="https://cdn.syncfusion.com/ej2/ej2-office-chart/dist/global/ej2-office-chart.min.js" type="text/javascript"></script>
-    <!-- EJ2 Document editor script -->
-    <script src="https://cdn.syncfusion.com/ej2/ej2-documenteditor/dist/global/ej2-documenteditor.min.js" type="text/javascript"></script>
-</head>
-<body>
-    <!-- Element which is going to render -->
-    <div id='DocumentEditor' style='height:350px'></div>
-    <script>
-        // Initialize DocumentEditor component
-        var documenteditor = new ej.documenteditor.DocumentEditor({ 
-            height: '370px', 
-            isReadOnly: false, 
-            serviceUrl: 'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/' 
-        });
-
-        documenteditor.acceptTab = true;
-        
-        // Enable all the built-in modules
-        documenteditor.enableAllModules();
-
-        // Set page border color
-        documenteditor.pageOutline = '#E0E0E0';
-
-        // Document editor control rendering
-        documenteditor.appendTo('#DocumentEditor');
-    </script>
-</body>
-</html>
-```
-
-{% previewsample "/document-processing/code-snippet/document-editor/javascript-es5/es5-getting-started-cs1" %}
-
-**Step 4:** Now, run the `index.html` in web browser, it will render the **Essential<sup style="font-size:70%">&reg;</sup> JS 2 DocumentEditor** component.
-
-**Step 5:** To render DocumentEditorContainer component, add the `Div` element and initiate the **Essential<sup style="font-size:70%">&reg;</sup> JS 2 DocumentEditorContainer** component in the index.html by using following code.
+**Step 5:** Create a HTML page (index.html) in `app` location and add the CDN link references. Now add the `Div` element and initiate the **Essential<sup style="font-size:70%">&reg;</sup> JS 2 DocumentEditorContainer** component in the index.html by using following code.
 
 ```html
 <!DOCTYPE html>
@@ -364,26 +231,12 @@ Now, run the `index.html` in web browser, it will render the **Essential<sup sty
 
 The Document editor component requires server-side interactions for the following operations:
 
-* [Open file formats other than SFDT](./import#convert-word-documents-into-sfdt)
-* [Paste with formatting](./clipboard#paste-with-formatting)
-* [Restrict editing](./document-management)
-* [Spell check](./spell-check)
-* [Save as file formats other than SFDT and DOCX](./saving-documents/server-side-export)
+* Open file formats other than SFDT
+* Paste with formatting
+* Restrict editing
+* Spell check
+* Save as file formats other than SFDT and DOCX
 
 >Note: If you don't require the above functionalities, you can deploy the component as a pure client-side solution without any server-side interactions.
 
-### Configuring web services
-
-Refer to the [example from GitHub](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) to configure the web service and set the [serviceUrl](https://ej2.syncfusion.com/javascript/documentation/api/document-editor-container#serviceurl).
-
-Syncfusion provides a predefined [Word Processor server Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) targeting ASP.NET Core 2.1 framework. You can directly pull this Docker image and deploy it on a server. You can also create your own Docker image by customizing the existing [Docker project from GitHub](https://github.com/SyncfusionExamples/Word-Processor-Server-Docker).
-
->Note: Starting from version `v19.3.0.x`, the accuracy of text size measurements has been optimized to match Microsoft Word pagination for most documents. This improvement is enabled by default. You can [disable it to retain the pagination behavior of older versions](./how-to/disable-optimized-text-measuring) if needed.
-
-## Frequently Asked Questions
-
-* [How to localize the Document editor container](./global-local)
-* [How to load a document by default](./how-to/open-default-document)
-* [How to customize the toolbar](./how-to/customize-tool-bar)
-* [How to resize the Document editor component](./how-to/resize-document-editor)
-* [How to add a save button to the DocumentEditorContainer toolbar](./how-to/add-save-button-in-toolbar)
\ No newline at end of file
+For detailed information about server-side dependencies, refer to the [Web Services Overview](./web-services-overview) page.
\ No newline at end of file
diff --git a/Document-Processing/Word/Word-Processor/javascript-es6/getting-started.md b/Document-Processing/Word/Word-Processor/javascript-es6/getting-started.md
index fdec477217..c4555aed32 100644
--- a/Document-Processing/Word/Word-Processor/javascript-es6/getting-started.md
+++ b/Document-Processing/Word/Word-Processor/javascript-es6/getting-started.md
@@ -1,54 +1,20 @@
 ---
 layout: post
-title: Getting started with JavaScript (ES6) Document editor | Syncfusion
-description: Checkout and learn about Getting started with JavaScript (ES6) Document editor control of Syncfusion Essential JS 2 and more details.
+title: Getting Started with JavaScript (ES6) DOCX Editor | Syncfusion
+description: Learn how to create a DOCX Editor in a TypeScript application using the Syncfusion® Document Editor control to create, edit, and view Word documents.
 platform: document-processing
 control: Getting started 
 documentation: ug
 domainurl: ##DomainURL##
 ---
 
-# Getting started with JavaScript (ES6) Document editor control
+# Getting Started with JavaScript (ES6) DOCX Editor
 
-This section briefly explains how to create a simple **Document editor** component and configure its available functionalities in TypeScript, using Essential<sup style="font-size:70%">&reg;</sup> JS 2 [quickstart](https://github.com/SyncfusionExamples/ej2-quickstart-webpack-) seed repository.
+Syncfusion® DOCX Editor (Document Editor) enables you to create, edit, view, and print Word documents in web applications. This section guides you through the steps to get started and create a DOCX Editor in a TypeScript application. 
 
-> This application uses the latest version of [webpack-cli](https://webpack.js.org/api/cli#commands) integrated with `webpack.config.js` configuration. For more information about webpack and its features, refer to the [webpack documentation](https://webpack.js.org/guides/getting-started/).
+## Steps to create an JavaScript (ES6) DOCX Editor
 
-## Dependencies
-
-The following list shows the minimum dependencies required to use the Document Editor:
-
-```javascript
-|-- @syncfusion/ej2-documenteditor
-    |-- @syncfusion/ej2-base
-    |-- @syncfusion/ej2-buttons
-    |-- @syncfusion/ej2-calendars
-    |-- @syncfusion/ej2-compression
-    |-- @syncfusion/ej2-dropdowns
-    |-- @syncfusion/ej2-file-utils
-    |-- @syncfusion/ej2-inputs
-    |-- @syncfusion/ej2-navigations
-    |-- @syncfusion/ej2-office-chart
-        |-- @syncfusion/ej2-charts
-    |-- @syncfusion/ej2-popups
-    |-- @syncfusion/ej2-splitbuttons
-```
-
-### Server-side dependencies
-
-The Document editor component requires server-side interactions for the following operations:
-
-* [Open file formats other than SFDT](./import#convert-word-documents-into-sfdt)
-* [Paste with formatting](./clipboard#paste-with-formatting)
-* [Restrict editing](./document-management)
-* [Spell check](./spell-check)
-* [Save as file formats other than SFDT and DOCX](./saving-documents/server-side-export)
-
->Note: If you don't require the above functionalities, you can deploy the component as a pure client-side solution without any server-side interactions.
-
-For detailed information about server-side dependencies, refer to the [Web Services Overview](./web-services-overview) page.
-
-## Set up development environment
+### Set up development environment
 
 Open the command prompt from the required directory and run the following command to clone the Syncfusion<sup style="font-size:70%">&reg;</sup> JavaScript (Essential<sup style="font-size:70%">&reg;</sup> JS 2) quickstart project from [GitHub](https://github.com/SyncfusionExamples/ej2-quickstart-webpack-):
 
@@ -70,9 +36,9 @@ cd ej2-quickstart
 {% endhighlight %}
 {% endtabs %}
 
-## Add Syncfusion<sup style="font-size:70%">&reg;</sup> JavaScript packages
+### Install the Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor packages
 
-Syncfusion<sup style="font-size:70%">&reg;</sup> JavaScript (Essential<sup style="font-size:70%">&reg;</sup> JS 2) packages are available on the [npmjs.com](https://www.npmjs.com/~syncfusionorg) public registry. You can install all Syncfusion<sup style="font-size:70%">&reg;</sup> JavaScript (Essential<sup style="font-size:70%">&reg;</sup> JS 2) controls in a single [@syncfusion/ej2](https://www.npmjs.com/package/@syncfusion/ej2) package or individual packages for each control.
+The Syncfusion<sup style="font-size:70%">&reg;</sup> DOCX Editor package is available in the public npm registry and can be installed directly from [`npmjs.com`](https://www.npmjs.com/~syncfusionorg).
 
 The quickstart application is preconfigured with the dependent [@syncfusion/ej2](https://www.npmjs.com/package/@syncfusion/ej2) package in the `~/package.json` file. Use the following command to install the dependent npm packages:
 
@@ -84,7 +50,7 @@ npm install
 {% endhighlight %}
 {% endtabs %}
 
-## Import the Syncfusion<sup style="font-size:70%">&reg;</sup> CSS styles
+### Add CSS reference
 
 Syncfusion<sup style="font-size:70%">&reg;</sup> JavaScript controls come with [built-in themes](https://ej2.syncfusion.com/documentation/appearance/theme), which are available in the installed packages. It's easy to adapt the Syncfusion<sup style="font-size:70%">&reg;</sup> JavaScript controls to match the style of your application by referring to one of the built-in themes.
 
@@ -98,107 +64,10 @@ The quickstart application is preconfigured to use the `Material` theme in the `
 {% endhighlight %}
 {% endtabs %}
 
->Note: To learn more about built-in themes and CSS reference for individual controls, refer to the [themes](https://ej2.syncfusion.com/documentation/appearance/theme) section.
-
-## Adding component
-
-You can add either the DocumentEditorContainer component with predefined toolbar and properties pane options or the DocumentEditor component with customizable options.
-
->Note: Starting from version `v19.3.0.x`, the accuracy of text size measurements has been optimized to match Microsoft Word pagination for most documents. This improvement is enabled by default. You can [disable it to retain the pagination behavior of older versions](./how-to/disable-optimized-text-measuring) if needed.
-
-### Document editor component
-
-The Document editor component is used to create, view, and edit Word documents. With this component, you can customize the UI options based on your requirements to modify documents.
-
-#### Adding Document editor component
-
-You can start adding the Essential<sup style="font-size:70%">&reg;</sup> JS 2 Document editor component to the application. Add the DocumentEditor component in the `app.ts` and `index.html` files using the following code.
-
-Place the following code in the `app.ts` file:
-
-{% tabs %}
-{% highlight ts tabtitle="app.ts" %}
-
-import { DocumentEditor } from '@syncfusion/ej2-documenteditor';
-
-// Initialize Document editor component
-let documenteditor: DocumentEditor = new DocumentEditor({ 
-    isReadOnly: false, 
-    height: '370px', 
-    serviceUrl: 'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/' 
-});
-
-// Enable all built-in modules
-documenteditor.enableAllModules();
-
-// Render the Document editor component
-documenteditor.appendTo('#DocumentEditor');
-
-{% endhighlight %}
-{% endtabs %}
-
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` used in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, host your own web service with the required server configurations. Refer to the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or use the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service.
-
-Add an HTML div element to act as the DocumentEditor element in the `index.html` file:
-
-{% tabs %}
-{% highlight html tabtitle="index.html" %}
-
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-    <title>Essential JS 2 Document editor</title>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
-    <meta name="description" content="Essential JS 2" />
-    <meta name="author" content="Syncfusion" />
-    <link rel="shortcut icon" href="resources/favicon.ico" />
-    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
-</head>
-
-<body>
-    <!-- Element which will render as DocumentEditor -->
-    <div id="DocumentEditor"></div>
-</body>
-
-</html>
-
-{% endhighlight %}
-{% endtabs %}
-
-#### Run the Document editor application
 
-The quickstart project is configured to compile and run the application in the browser. Use the following command to run the application:
+## Add the Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor component
 
-{% tabs %}
-{% highlight bash tabtitle="NPM" %}
-
-npm start
-
-{% endhighlight %}
-{% endtabs %}
-
-The Document editor output will be displayed as follows:
-
-{% tabs %}
-{% highlight ts tabtitle="index.ts" %}
-{% include code-snippet/document-editor/javascript-es6/getting-started-cs1/index.ts %}
-{% endhighlight %}
-{% highlight html tabtitle="index.html" %}
-{% include code-snippet/document-editor/javascript-es6/getting-started-cs1/index.html %}
-{% endhighlight %}
-{% endtabs %}
-          
-{% previewsample "/document-processing/code-snippet/document-editor/javascript-es6/getting-started-cs1" %}
-
-### Document editor Container component
-
-The DocumentEditorContainer is a predefined component that wraps the DocumentEditor, toolbar, properties pane, and status bar into a single component. The toolbar and properties pane allow users to view and modify documents through public APIs available in the DocumentEditor.
-
-#### Adding Document editor Container component
-
-You can start adding the Essential<sup style="font-size:70%">&reg;</sup> JS 2 documenteditor container component to the application. Add the DocumentEditorContainer component in the `app.ts` and `index.html` files using the following code.
+You can start adding the Essential<sup style="font-size:70%">&reg;</sup> JS 2 Document Editor component to the application. Add the Document Editor in the `app.ts` and `index.html` files using the following code.
 
 Place the following code in the `app.ts` file:
 
@@ -212,7 +81,8 @@ DocumentEditorContainer.Inject(Toolbar);
 let documenteditor: DocumentEditorContainer = new DocumentEditorContainer({ 
     enableToolbar: true, 
     height: '390px', 
-    serviceUrl: 'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/' 
+    // Use the following service URL only for demo purposes
+    serviceUrl: 'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/'
 });
 
 documenteditor.appendTo('#DocumentEditor');
@@ -220,9 +90,9 @@ documenteditor.appendTo('#DocumentEditor');
 {% endhighlight %}
 {% endtabs %}
 
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` used in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, host your own web service with the required server configurations. Refer to the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or use the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service.
+> The hosted Web API URL is for demo and evaluation purposes only. For production, host your own web service using the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server).
 
-Add an HTML div element to act as the DocumentEditorContainer element in the `index.html` file:
+Add an HTML div element to act as the Document Editor element in the `index.html` file:
 
 {% tabs %}
 {% highlight html tabtitle="index.html" %}
@@ -250,9 +120,9 @@ Add an HTML div element to act as the DocumentEditorContainer element in the `in
 {% endhighlight %}
 {% endtabs %}
 
-#### Run the Document editor Container application
+### Run the application
 
-The quickstart project is configured to compile and run the application in the browser. Use the following command to run the application:
+Run the application using the following command:
 
 {% tabs %}
 {% highlight bash tabtitle="NPM" %}
@@ -262,7 +132,7 @@ npm start
 {% endhighlight %}
 {% endtabs %}
 
-The DocumentEditorContainer output will be displayed as follows:
+The Document Editor is displayed as shown below.
 
 {% tabs %}
 {% highlight ts tabtitle="index.ts" %}
@@ -275,10 +145,16 @@ The DocumentEditorContainer output will be displayed as follows:
           
 {% previewsample "/document-processing/code-snippet/document-editor/javascript-es6/getting-started-cs2" %}
 
-## Frequently Asked Questions
+## Server-side dependencies
+
+The Document Editor component requires server-side interactions for the following operations:
+
+* Open file formats other than SFDT
+* Paste with formatting
+* Restrict editing
+* Spell check
+* Save as file formats other than SFDT and DOCX
+
+>Note: If you don't require the above functionalities, you can deploy the component as a pure client-side solution without any server-side interactions.
 
-* [How to localize the Document editor container](./global-local)
-* [How to load a document by default](./how-to/open-default-document)
-* [How to customize the toolbar](./how-to/customize-tool-bar)
-* [How to resize the Document editor component](./how-to/resize-document-editor)
-* [How to add a save button to the DocumentEditorContainer toolbar](./how-to/add-save-button-in-toolbar)
\ No newline at end of file
+For detailed information about server-side dependencies, refer to the [Web Services Overview](./web-services-overview) page.
\ No newline at end of file
diff --git a/Document-Processing/Word/Word-Processor/vue/getting-started-vue-3.md b/Document-Processing/Word/Word-Processor/vue/getting-started-vue-3.md
index d9df5c6de7..a4d8868a2a 100644
--- a/Document-Processing/Word/Word-Processor/vue/getting-started-vue-3.md
+++ b/Document-Processing/Word/Word-Processor/vue/getting-started-vue-3.md
@@ -1,14 +1,16 @@
 ---
 layout: post
-title: Getting started vue 3 with Vue Document editor component | Syncfusion
-description: Check out and learn about Getting started vue 3 with Vue Document editor component of Syncfusion Essential JS 2 and more details.
+title: Getting Started Vue 3 with Vue DOCX Editor | Syncfusion
+description: Learn how to create a DOCX Editor in a Vue application using the Syncfusion® Document Editor control to create and edit Word documents.
 control: Getting started vue 3 
 platform: document-processing
 documentation: ug
 domainurl: ##DomainURL##
 ---
 
-# Getting Started with Syncfusion® Document editor Component in Vue 3
+# Getting Started with Vue DOCX Editor Component in Vue 3
+
+Syncfusion® DOCX Editor (Document Editor) enables you to create, edit, view, and print Word documents in web applications. This section guides you through the steps to get started and create a DOCX Editor in a Vue application.
 
 This article provides a step-by-step guide for setting up a [Vite](https://vitejs.dev/) project with a JavaScript environment and integrating the Syncfusion<sup style="font-size:70%">&reg;</sup> Vue Document editor component using the [Composition API](https://vuejs.org/guide/introduction.html#composition-api) / [Options API](https://vuejs.org/guide/introduction.html#options-api).
 
@@ -20,6 +22,20 @@ The `Options API` is the traditional way of writing Vue.js components, where the
 
 [System requirements for Syncfusion<sup style="font-size:70%">&reg;</sup> Vue UI components](https://ej2.syncfusion.com/vue/documentation/system-requirements)
 
+## Server side dependencies
+
+The Document Editor component requires server-side interactions for the following operations:
+
+* Open file formats other than SFDT
+* Paste with formatting
+* Restrict editing
+* Spell check
+* Save as file formats other than SFDT and DOCX
+
+>Note: If these features are not required, the component can be deployed as a client-side solution without server-side interactions.
+
+To know about server-side dependencies, please refer this [page](./web-services-overview).
+
 ## Set up the Vite project
 
 A recommended approach for beginning with Vue is to scaffold a project using [Vite](https://vitejs.dev/). To create a new Vite project, use one of the commands that are specific to either NPM or Yarn.
@@ -78,14 +94,11 @@ or
 cd my-project
 yarn install
 ```
+## Install the Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor packages
 
-Now that `my-project` is ready to run with default settings, let's add Syncfusion<sup style="font-size:70%">&reg;</sup> components to the project.
+The Syncfusion<sup style="font-size:70%">&reg;</sup> DOCX Editor package is available in the public npm registry and can be installed directly from [`npmjs.com`](https://www.npmjs.com/~syncfusionorg).
 
-## Add Syncfusion<sup style="font-size:70%">&reg;</sup> Vue packages
-
-Syncfusion<sup style="font-size:70%">&reg;</sup> Vue component packages are available at [npmjs.com](https://www.npmjs.com/search?q=ej2-vue). To use Syncfusion<sup style="font-size:70%">&reg;</sup> Vue components in the project, install the corresponding npm package.
-
-This article uses the [Vue Document editor component](https://www.syncfusion.com/vue-components/vue-word-processor) as an example. To use the Vue Document editor component in the project, the `@syncfusion/ej2-vue-documenteditor` package needs to be installed using the following command:
+To install the Document editor component, use the following command:
 
 ```bash
   npm install @syncfusion/ej2-vue-documenteditor --save
@@ -97,7 +110,7 @@ or
 yarn add @syncfusion/ej2-vue-documenteditor
 ```
 
-## Import Syncfusion<sup style="font-size:70%">&reg;</sup> CSS styles
+## Adding CSS reference
 
 You can import themes for the Syncfusion<sup style="font-size:70%">&reg;</sup> Vue component in various ways, such as using CSS or SASS styles from npm packages, CDN, [CRG](https://ej2.syncfusion.com/javascript/documentation/common/custom-resource-generator) and [Theme Studio](https://ej2.syncfusion.com/vue/documentation/appearance/theme-studio). Refer to [themes topic](https://ej2.syncfusion.com/vue/documentation/appearance/theme) to know more about built-in themes and different ways to refer to themes in a Vue project.
 
@@ -121,190 +134,7 @@ In this article, `Material` theme is applied using CSS styles, which are availab
 {% endhighlight %}
 {% endtabs %}
 
-> Document editor has different themes, please refer to [supported themes](https://ej2.syncfusion.com/vue/documentation/appearance/theme) section.
-
-## Adding Component
-
-> Starting from `v19.3.0.x`, we have optimized the accuracy of text size measurements such as to match Microsoft Word pagination for most Word documents. This improvement is included as default behavior along with an optional API [to disable it and retain the document pagination behavior of older versions](./how-to/disable-optimized-text-measuring).
-
-### Adding DocumentEditor component in the application
-
-Document editor Component is used to create, view and edit word documents. In this, you can customize the UI options based on your requirements to modify the document.
-
-You have completed all the necessary configurations needed for rendering the Syncfusion<sup style="font-size:70%">&reg;</sup> Vue component. Now, you are going to add the Document editor component using following steps.
-
-Follow the below steps to add the Vue Document editor component using `Composition API` or `Options API`:
-
-**Step 1:** First, import and register the DocumentEditor component and its child directives in the `script` section of the **src/App.vue** file. If you are using the `Composition API`, you should add the `setup` attribute to the `script` tag to indicate that Vue will be using the `Composition API`.
-
-{% tabs %}
-{% highlight html tabtitle="Composition API (~/src/App.vue)" %}
-
-<script setup>
-import { DocumentEditorComponent as EjsDocumenteditor, Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog } from '@syncfusion/ej2-vue-documenteditor';
-</script>
-
-{% endhighlight %}
-{% highlight html tabtitle="Options API (~/src/App.vue)" %}
-
-<script>
-import { DocumentEditorComponent, Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog } from '@syncfusion/ej2-vue-documenteditor';
-</script>
-
-{% endhighlight %}
-{% endtabs %}
-
-**Step 2:** Add the component definition in `template` section.
-
-{% tabs %}
-{% highlight html tabtitle="~/src/App.vue" %}
-
-<template>
-  <ejs-documenteditor :serviceUrl='serviceUrl' :isReadOnly='false' :enablePrint='true' :enableSfdtExport='true' :enableSelection='true' :enableContextMenu='true' :enableSearch='true' :enableOptionsPane='true' :enableWordExport='true' :enableTextExport='true' :enableEditor='true' :enableImageResizer='true' :enableEditorHistory='true' :enableHyperlinkDialog='true' :enableTableDialog='true' :enableBookmarkDialog='true' :enableTableOfContentsDialog='true' :enablePageSetupDialog='true' :enableStyleDialog='true' :enableListDialog='true' :enableParagraphDialog='true' :enableFontDialog='true' :enableTablePropertiesDialog='true' :enableBordersAndShadingDialog='true' :enableTableOptionsDialog='true'> </ejs-documenteditor>
-</template>
-
-{% endhighlight %}
-{% endtabs %}
-
-**Step 3:** Declare the bound properties `serviceUrl` in the `script` section.
-
-{% tabs %}
-{% highlight html tabtitle="Composition API (~/src/App.vue)" %}
-
-<script>
-  import { provide } from 'vue';
-  import { DocumentEditorComponent as EjsDocumenteditor, Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog } from '@syncfusion/ej2-vue-documenteditor';
-
-  const serviceUrl = 'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/';
-  const documenteditor = null;
-
-  provide('DocumentEditor', [Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog]);
-</script>
-
-{% endhighlight %}
-{% highlight html tabtitle="Options API (~/src/App.vue)" %}
-
-<script>
-  import { DocumentEditorComponent, Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog } from '@syncfusion/ej2-vue-documenteditor';
-
-  //Component registeration
-  export default {
-    name: 'App',
-    components: {
-      // Declaring component
-      'ejs-documenteditor' : DocumentEditorComponent
-    },
-    data () {
-      return {
-        serviceUrl:'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/'
-      };
-    },
-    provide: {
-        DocumentEditor: [Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog]
-    }
-  }
-</script>
-
-{% endhighlight %}
-{% endtabs %}
-
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
-
-**Step 4:** Summarizing the above steps, update the `src/App.vue` file with following code.
-
-{% tabs %}
-{% highlight html tabtitle="Composition API (~/src/App.vue)" %}
-
-<template>
-  <ejs-documenteditor :serviceUrl='serviceUrl' :isReadOnly='false' :enablePrint='true' :enableSfdtExport='true' :enableSelection='true' :enableContextMenu='true' :enableSearch='true' :enableOptionsPane='true' :enableWordExport='true' :enableTextExport='true' :enableEditor='true' :enableImageResizer='true' :enableEditorHistory='true' :enableHyperlinkDialog='true' :enableTableDialog='true' :enableBookmarkDialog='true' :enableTableOfContentsDialog='true' :enablePageSetupDialog='true' :enableStyleDialog='true' :enableListDialog='true' :enableParagraphDialog='true' :enableFontDialog='true' :enableTablePropertiesDialog='true' :enableBordersAndShadingDialog='true' :enableTableOptionsDialog='true'> </ejs-documenteditor>
-</template>
-
-<script setup>
-  import { provide } from 'vue';
-  import { DocumentEditorComponent as EjsDocumenteditor, Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog } from '@syncfusion/ej2-vue-documenteditor';
-
-  const serviceUrl = 'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/';
-  const documenteditor = null;
-
-  provide('DocumentEditor', [Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog]);
-</script>
-
-<style>
-  @import '../node_modules/@syncfusion/ej2-base/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-buttons/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-inputs/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-popups/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-lists/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-navigations/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-dropdowns/styles/material.css';
-  @import "../node_modules/@syncfusion/ej2-vue-documenteditor/styles/material.css";
-</style>
-
-{% endhighlight %}
-{% highlight html tabtitle="Options API (~/src/App.vue)" %}
-
-<template>
-  <ejs-documenteditor :serviceUrl='serviceUrl' :isReadOnly='false' :enablePrint='true' :enableSfdtExport='true' :enableSelection='true' :enableContextMenu='true' :enableSearch='true' :enableOptionsPane='true' :enableWordExport='true' :enableTextExport='true' :enableEditor='true' :enableImageResizer='true' :enableEditorHistory='true' :enableHyperlinkDialog='true' :enableTableDialog='true' :enableBookmarkDialog='true' :enableTableOfContentsDialog='true' :enablePageSetupDialog='true' :enableStyleDialog='true' :enableListDialog='true' :enableParagraphDialog='true' :enableFontDialog='true' :enableTablePropertiesDialog='true' :enableBordersAndShadingDialog='true' :enableTableOptionsDialog='true'> </ejs-documenteditor>
-</template>
-
-<script>
-  import { DocumentEditorComponent, Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog } from '@syncfusion/ej2-vue-documenteditor';
-
-  //Component registeration
-  export default {
-    name: 'App',
-    components: {
-      // Declaring component
-      'ejs-documenteditor' : DocumentEditorComponent
-    },
-    data () {
-      return {
-        serviceUrl:'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/'
-      };
-    },
-    provide: {
-        DocumentEditor: [Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog]
-    }
-  }
-</script>
-
-<style>
-  @import '../node_modules/@syncfusion/ej2-base/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-buttons/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-inputs/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-popups/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-lists/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-navigations/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css';
-  @import '../node_modules/@syncfusion/ej2-dropdowns/styles/material.css';
-  @import "../node_modules/@syncfusion/ej2-vue-documenteditor/styles/material.css";
-</style>
-
-{% endhighlight %}
-{% endtabs %}
-
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
-
-#### Running the DocumentEditor application
-
-Run the application using the following command.
-
-```bash
-npm run dev
-```
-
-or
-
-```bash
-yarn run dev
-```
-
-The output will appear as follows:
-
-![Output](./images/vue3-documenteditor-demo.png)
-
-### Adding DocumentEditorContainer component in the application
+## Add the Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor component
 
 Document editor Container Component is also used to create, view and edit word document. But here, you can use predefined toolbar and properties pane to view and modify word document.
 
@@ -385,7 +215,6 @@ Follow the below steps to add the Vue DocumentEditorContainer component using `C
 {% endhighlight %}
 {% endtabs %}
 
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
 
 **Step 4:** Summarizing the above steps, update the `src/App.vue` file with following code.
 
@@ -461,11 +290,11 @@ Follow the below steps to add the Vue DocumentEditorContainer component using `C
 {% endhighlight %}
 {% endtabs %}
 
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
+> The hosted Web API URL is for demo and evaluation purposes only. For production, host your own web service using the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server).
 
-#### Running the DocumentEditorContainer application
+## Run the application
 
-Run the application using the following command.
+Run the application using the following command:
 
 ```bash
 npm run dev
diff --git a/Document-Processing/Word/Word-Processor/vue/getting-started.md b/Document-Processing/Word/Word-Processor/vue/getting-started.md
index cc86783613..32f02f0f99 100644
--- a/Document-Processing/Word/Word-Processor/vue/getting-started.md
+++ b/Document-Processing/Word/Word-Processor/vue/getting-started.md
@@ -1,60 +1,25 @@
 ---
 layout: post
-title: Getting started with Vue Document editor component | Syncfusion
-description: Checkout and learn about Getting started with Vue Document editor component of Syncfusion Essential JS 2 and more details.
-control: Getting started 
+title: Getting Started with Vue DOCX Editor | Syncfusion
+description: Learn how to create a DOCX Editor in a Vue application using the Syncfusion® Document Editor control to create, edit, and view Word documents.
 platform: document-processing
+control: Getting started 
 documentation: ug
 domainurl: ##DomainURL##
 ---
 
-# Getting Started with the Vue DocumentEditor Component in Vue 2
+# Getting Started with Vue DOCX Editor in Vue 2
 
-To get started quickly with the Vue DocumentEditor component, view the getting-started video: https://www.syncfusion.com/tutorial-videos/vue/word-processor?title=getting-started-with-the-vue-word-processor
+Syncfusion® DOCX Editor (Document Editor) enables you to create, edit, view, and print Word documents in web applications. This section guides you through the steps to get started and create a DOCX Editor in a Vue application.
 
-This article provides a step-by-step guide for setting up a Vue 2 project using [Vue-CLI](https://cli.vuejs.org/) and integrating the Syncfusion<sup style="font-size:70%">&reg;</sup> Vue Document Editor component
+## Steps to create a Vue DOCX Editor
 
-## Prerequisites
+### Prerequisites
 
 [System requirements for Syncfusion<sup style="font-size:70%">&reg;</sup> Vue UI components](https://ej2.syncfusion.com/vue/documentation/system-requirements)
 
-## Dependencies
-
-The list of dependencies required to use the Document Editor component in your application is given below:
-
-```javascript
-|-- @syncfusion/ej2-vue-documenteditor
-|-- @syncfusion/ej2-vue-base
-    |-- @syncfusion/ej2-documenteditor
-    |-- @syncfusion/ej2-base
-    |-- @syncfusion/ej2-buttons
-    |-- @syncfusion/ej2-compression
-    |-- @syncfusion/ej2-data
-    |-- @syncfusion/ej2-dropdowns
-    |-- @syncfusion/ej2-file-utils
-    |-- @syncfusion/ej2-inputs
-    |-- @syncfusion/ej2-lists
-    |-- @syncfusion/ej2-navigations
-    |-- @syncfusion/ej2-popups
-    |-- @syncfusion/ej2-splitbuttons
-    |-- @syncfusion/ej2-charts
-```
-
-### Server side dependencies
-
-The Document Editor component requires server-side interactions for the following operations:
-
-* [Open file formats other than SFDT](./import#convert-word-documents-into-sfdt)
-* [Paste with formatting](./clipboard#paste-with-formatting)
-* [Restrict editing](./document-management)
-* [Spell check](./spell-check)
-* [Save as file formats other than SFDT and DOCX](./saving-documents/server-side-export)
-
->Note: If these features are not required, the component can be deployed as a client-side solution without server-side interactions.
-
-To know about server-side dependencies, please refer this [page](./web-services-overview).
 
-## Setting up the Vue 2 project
+### Setting up the Vue 2 project
 
 To generate a Vue 2 project using Vue-CLI, use the [vue create](https://cli.vuejs.org#getting-started) command. Follow these steps to install Vue CLI and create a new project:
 Using npm (global Vue CLI):
@@ -81,11 +46,12 @@ When creating a new project, choose the option `Vue 2` from the menu.
 
 Once the `quickstart` project is set up with default settings, proceed to add Syncfusion<sup style="font-size:70%">&reg;</sup> components to the project.
 
-## Add Syncfusion<sup style="font-size:70%">&reg;</sup> Vue packages
 
-Syncfusion<sup style="font-size:70%">&reg;</sup> packages are available at [`npmjs.com`](https://www.npmjs.com/search?q=ej2-vue). To use Vue components, install the required npm package.
+### Install the Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor packages
 
-This article uses the [Vue Document editor component](https://www.syncfusion.com/vue-components/vue-wysiwyg-document-editor) as an example. Install the `@syncfusion/ej2-vue-documenteditor` package by running the following command:
+The Syncfusion<sup style="font-size:70%">&reg;</sup> DOCX Editor package is available in the public npm registry and can be installed directly from [`npmjs.com`](https://www.npmjs.com/~syncfusionorg).
+
+To install the Document Editor component, use the following command:
 
 ```bash
 npm install @syncfusion/ej2-vue-documenteditor --save
@@ -97,181 +63,89 @@ or
 yarn add @syncfusion/ej2-vue-documenteditor
 ```
 
-## Import Syncfusion<sup style="font-size:70%">&reg;</sup> CSS styles
+### Add CSS reference
 
 You can import themes for the Syncfusion<sup style="font-size:70%">&reg;</sup> Vue component in various ways, such as using CSS or SASS styles from npm packages, CDN, [CRG](https://ej2.syncfusion.com/javascript/documentation/common/custom-resource-generator) and [Theme Studio](https://ej2.syncfusion.com/vue/documentation/appearance/theme-studio). Refer to [themes topic](https://ej2.syncfusion.com/vue/documentation/appearance/theme) to know more about built-in themes and different ways to refer to themes in a Vue project.
 
-In this article, the `Material` theme is applied using CSS styles, which are available in installed packages. The necessary `Material` CSS styles for the Document editor component and its dependents were imported into the `<style>` section of **src/App.vue** file.
-
-```
-@import '../node_modules/@syncfusion/ej2-base/styles/material.css';
-@import '../node_modules/@syncfusion/ej2-buttons/styles/material.css';
-@import '../node_modules/@syncfusion/ej2-inputs/styles/material.css';
-@import '../node_modules/@syncfusion/ej2-popups/styles/material.css';
-@import '../node_modules/@syncfusion/ej2-lists/styles/material.css';
-@import '../node_modules/@syncfusion/ej2-navigations/styles/material.css';
-@import '../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css';
-@import '../node_modules/@syncfusion/ej2-dropdowns/styles/material.css';
-@import "../node_modules/@syncfusion/ej2-documenteditor/styles/material.css";
-```
-
-> Document editor has different themes, please refer to [Supported themes](https://ej2.syncfusion.com/vue/documentation/appearance/theme) section.
-
-## Add Syncfusion<sup style="font-size:70%">&reg;</sup> Vue component
-
-You can add `DocumentEditorContainer` component with predefined toolbar and properties pane options or `DocumentEditor` component with customize options.
-
-> Starting from `v19.3.0.x`, we have optimized the accuracy of text size measurements such as to match Microsoft Word pagination for most Word documents. This improvement is included as default behavior along with an optional API [to disable it and retain the document pagination behavior of older versions](./how-to/disable-optimized-text-measuring).
-
-### DocumentEditor Component
-
-Document editor Component is used to create,  view and edit word documents. In this, you can customize the UI options based on your requirements to modify the document.
-
-#### Registering DocumentEditor Component
-
-You can register the Document editor component in your application by using the `Vue.use()`.
-
-Refer to the code example given below.
-
-```ts
-import { DocumentEditorPlugin } from '@syncfusion/ej2-vue-documenteditor';
-
-Vue.use(DocumentEditorPlugin);
+In this article, the `Material` theme is applied using CSS styles, which are available in installed packages. The necessary `Material` CSS styles for the Document Editor component and its dependents were imported into the `<style>` section of **src/App.vue** file.
+
+```css
+@import '../../node_modules/@syncfusion/ej2-base/styles/material.css';
+@import '../../node_modules/@syncfusion/ej2-buttons/styles/material.css';
+@import '../../node_modules/@syncfusion/ej2-inputs/styles/material.css';
+@import '../../node_modules/@syncfusion/ej2-popups/styles/material.css';
+@import '../../node_modules/@syncfusion/ej2-lists/styles/material.css';
+@import '../../node_modules/@syncfusion/ej2-navigations/styles/material.css';
+@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css';
+@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/material.css';
+@import "../../node_modules/@syncfusion/ej2-documenteditor/styles/material.css";
 ```
 
-> Registering `DocumentEditorPlugin` in vue, will register the Document Editor component along with its required child directives globally.
+### Add the Syncfusion<sup style="font-size:70%">&reg;</sup> Document Editor component
 
-#### Adding DocumentEditor Component
-
-Add the Vue Document editor by using `<ejs-documenteditor>` selector in `<template>` section of the `App.vue` file.
+Modify the template in the `src/App.vue` file to render the Document Editor component. Add the Vue Document Editor by using the `<ejs-documenteditorcontainer>` selector in `<template>` section of the `App.vue` file.
 
 ```
 <template>
     <div id="app">
-          <ejs-documenteditor :serviceUrl='serviceUrl' :isReadOnly='false' :enablePrint='true' :enableSfdtExport='true' :enableSelection='true' :enableContextMenu='true' :enableSearch='true' :enableOptionsPane='true' :enableWordExport='true' :enableTextExport='true' :enableEditor='true' :enableImageResizer='true' :enableEditorHistory='true' :enableHyperlinkDialog='true' :enableTableDialog='true' :enableBookmarkDialog='true' :enableTableOfContentsDialog='true' :enablePageSetupDialog='true' :enableStyleDialog='true' :enableListDialog='true' :enableParagraphDialog='true' :enableFontDialog='true' :enableTablePropertiesDialog='true' :enableBordersAndShadingDialog='true' :enableTableOptionsDialog='true' height="370px"> </ejs-documenteditor>
+        <ejs-documenteditorcontainer height="590px" :serviceUrl='serviceUrl' :enableToolbar='true'> </ejs-documenteditorcontainer>
     </div>
 </template>
 
 <script>
-  import Vue from 'vue';
-  import { DocumentEditorPlugin, DocumentEditorComponent, Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog } from '@syncfusion/ej2-vue-documenteditor';
-  Vue.use(DocumentEditorPlugin);
+  import { DocumentEditorContainerComponent,Toolbar } from '@syncfusion/ej2-vue-documenteditor';
   export default {
-    data () {
-      return {
-        serviceUrl:'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/'
-      },
-      provide: {
-        //Inject require modules.
-        DocumentEditor: [Print, SfdtExport, WordExport, TextExport, Selection, Search, Editor, ImageResizer, EditorHistory, ContextMenu, OptionsPane, HyperlinkDialog, TableDialog, BookmarkDialog, TableOfContentsDialog, PageSetupDialog, StyleDialog, ListDialog, ParagraphDialog, BulletsAndNumberingDialog, FontDialog, TablePropertiesDialog, BordersAndShadingDialog, TableOptionsDialog, CellOptionsDialog, StylesDialog]
-      }
-    }
+  name: "App",
+  components: {
+    "ejs-documenteditorcontainer": DocumentEditorContainerComponent
+  },
+  data() {
+    // Use the following service URL only for demo purposes
+    return { serviceUrl: 'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/' }
+  },
+  provide: {
+    //Inject require modules.
+    DocumentEditorContainer: [Toolbar]
   }
+}
 </script>
 ```
+> The hosted Web API URL is for demo and evaluation purposes only. For production, host your own web service using the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or the [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server).
 
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
+### Run the application
 
-> The Document editor requires server-side interactions for the following operations:
->
-> * Paste with formatting
-> * Restrict editing
-> * Spell check
->
-> Refer to this [link](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) to configure the web service and set the [serviceUrl](https://ej2.syncfusion.com/vue/documentation/api/document-editor#serviceurl).
-
-#### Run the DocumentEditor application
-
-The Vue Document editor application is configured to compile and run the application in a browser. Use the following command to run the application.
+Run the application using the following command:
 
 ```bash
-npm run dev
+npm run serve
 ```
 
-Output will be displayed as follows.
+The Document Editor is displayed as shown below.
 
 {% tabs %}
 {% highlight html tabtitle="app.vue" %}
-{% include code-snippet/document-editor/vue/getting-started-cs2/app.vue %}
+{% include code-snippet/document-editor/vue/getting-started-cs3/app.vue %}
 {% endhighlight %}
 {% endtabs %}
         
-{% previewsample "/document-processing/code-snippet/document-editor/vue/getting-started-cs2" %}
-
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
-
-### DocumentEditorContainer Component
-
-DocumentEditorContainer Component is also used to create, view and edit word document. But here, you can use predefined toolbar and properties pane to view and modify word document.
-
-#### Registering DocumentEditorContainer Component
-
-You can register the DocumentEditorContainer component in your application by using the `Vue.use()`.
-
-Refer to the code example given below.
-
-```ts
-import { DocumentEditorContainerPlugin } from '@syncfusion/ej2-vue-documenteditor';
-
-Vue.use(DocumentEditorContainerPlugin);
-```
-
-> Registering `DocumentEditorContainerPlugin` in vue, will register the DocumentEditorContainer component along with its required child directives globally.
-
-#### Adding DocumentEditorContainer Component
-
-Add the Vue DocumentEditorContainer by using `<ejs-documenteditorcontainer>` selector in `<template>` section of the `App.vue` file.
-
-```
-<template>
-    <div id="app">
-        <ejs-documenteditorcontainer height="590px" :serviceUrl='serviceUrl' :enableToolbar='true'> </ejs-documenteditorcontainer>
-    </div>
-</template>
-
-<script>
-  import Vue from 'vue';
-  import { DocumentEditorContainerPlugin, DocumentEditorContainerComponent,Toolbar } from '@syncfusion/ej2-vue-documenteditor';
-
-  Vue.use(DocumentEditorContainerPlugin);
-  export default {
-    data(){
-      return { serviceUrl:'https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/' }
-    },
-    provide: {
-      //Inject require modules.
-      DocumentEditorContainer: [Toolbar]
-    }
-  }
-</script>
-```
-
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
+{% previewsample "/document-processing/code-snippet/document-editor/vue/getting-started-cs3" %}
 
-#### Run the DocumentEditorContainer application
+## Video tutorial
 
-The Vue DocumentEditorContainer application is configured to compile and run the application in a browser. Use the following command to run the application.
+To get started quickly with the Document Editor component using CLI, you can check the video below.
 
-```bash
-npm run dev
-```
+{% youtube "https://www.syncfusion.com/tutorial-videos/vue/word-processor?title=getting-started-with-the-vue-word-processor" %}
 
-DocumentEditorContainer output will be displayed as follows.
+## Server side dependencies
 
-{% tabs %}
-{% highlight html tabtitle="app.vue" %}
-{% include code-snippet/document-editor/vue/getting-started-cs3/app.vue %}
-{% endhighlight %}
-{% endtabs %}
-        
-{% previewsample "/document-processing/code-snippet/document-editor/vue/getting-started-cs3" %}
+The Document Editor component requires server-side interactions for the following operations:
 
-> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
+* Open file formats other than SFDT
+* Paste with formatting
+* Restrict editing
+* Spell check
+* Save as file formats other than SFDT and DOCX
 
-## Frequently Asked Questions
+>Note: If you don't require the above functionalities, you can deploy the component as a pure client-side solution without any server-side interactions.
 
-* [How to localize the Document editor container](./global-local).
-* [How to load the document by default](./how-to/open-default-document).
-* [How to customize tool bar](./how-to/customize-tool-bar).
-* [How to resize Document editor component](./how-to/resize-document-editor).
-* [How to add a save button to the DocumentEditorContainer component toolbar](./how-to/add-save-button-in-toolbar)
\ No newline at end of file
+For detailed information about server-side dependencies, refer to the [Web Services Overview](./web-services-overview) page.