diff --git a/aspnet-core/Autocomplete/Appearance-and-Styling.md b/aspnet-core/Autocomplete/Appearance-and-Styling.md
index ab366dbb..ab6dbcd0 100644
--- a/aspnet-core/Autocomplete/Appearance-and-Styling.md
+++ b/aspnet-core/Autocomplete/Appearance-and-Styling.md
@@ -1,13 +1,13 @@
 ---
 layout: post
 title: Appearance and Styling | AutoComplete  | ASP.NET Core | Syncfusion
-description: appearance and styling
+description: Learn here about appearance and styling in ASP.NET Core AutoComplete Control, its elements, and more.
 platform: aspnet-core
 control: AutoComplete
 documentation: ug
 ---
 
-# Appearance and Styling
+# Appearance and Styling in ASP.NET Core AutoComplete
 
 ## Adjusting AutoComplete size
 
@@ -40,7 +40,7 @@ The following image is the output for AutoComplete textbox with customized dimen
 
 
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img1.png)
+![ASP.NET Core AutoComplete define height and weight](Appearance-and-Styling_images/Appearance-and-Styling_img1.png)
 
 AutoComplete with Customized dimensions
 {:.caption}
@@ -76,7 +76,7 @@ The following image is the output for AutoComplete when ShowRoundedCorner is set
 
 
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img2.png)
+![ASP.NET Core AutoComplete rounded corner](Appearance-and-Styling_images/Appearance-and-Styling_img2.png)
 
 AutoComplete with Rounded corners
 {:.caption}
@@ -106,7 +106,7 @@ The following image is the output for AutoComplete when WatermarkText is defined
 
 
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img3.png)
+![ASP.NET Core AutoComplete watermark text](Appearance-and-Styling_images/Appearance-and-Styling_img3.png)
 
 AutoComplete loaded with watermark text
 {:.caption}
@@ -140,7 +140,7 @@ The following image is the output for AutoComplete, after configuring the height
 
 
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img4.png)
+![ASP.NET Core AutoComplete popup panel](Appearance-and-Styling_images/Appearance-and-Styling_img4.png)
 
 AutoComplete PopUp panel with configured dimensions
 {:.caption}
@@ -259,7 +259,7 @@ The following steps allow you to configure CssClass for an AutoComplete textbox.
 
 The following image is of an AutoComplete textbox configured based on CSS class.
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img5.png)
+![ASP.NET Core AutoComplete css class](Appearance-and-Styling_images/Appearance-and-Styling_img5.png)
 
 AutoComplete widget configured with CSS class
 {:.caption}
diff --git a/aspnet-core/Autocomplete/Data-Binding.md b/aspnet-core/Autocomplete/Data-Binding.md
index a4cca4cf..5138c969 100644
--- a/aspnet-core/Autocomplete/Data-Binding.md
+++ b/aspnet-core/Autocomplete/Data-Binding.md
@@ -1,13 +1,13 @@
 ---
 layout: post
 title: Data Binding | AutoComplete | ASP.NET Core | Syncfusion
-description: data-binding
+description: Learn here about data binding in Syncfusion Essential ASP.NET Core AutoComplete Control, its elements, and more.
 platform: aspnet-core
 control: AutoComplete
 documentation: ug
 ---
 
-# Data-Binding
+# Data Binding in ASP.NET Core AutoComplete
 
 In order to render the AutoComplete control, the data needs to be bound to it in a proper way. The following sub-properties provide a way to bind either the local or remote data to the AutoComplete widget by binding the appropriate data fields to the corresponding options.
 
diff --git a/aspnet-core/CircularGauge/Legend.md b/aspnet-core/CircularGauge/Legend.md
index 1c861b8c..3014767e 100644
--- a/aspnet-core/CircularGauge/Legend.md
+++ b/aspnet-core/CircularGauge/Legend.md
@@ -1,13 +1,13 @@
 ---
 layout: post
 title: Legend | CircularGauge | ASP.NET Core| Syncfusion
-description:  legend
+description: Learn here about Legend in Syncfusion Essential ASP.NET Core CircularGauge Control, its elements, and more.
 platform: aspnet-core
 control: CircularGauge
 documentation: ug
 ---
 
-# Legend
+# Legend in ASP.NET Core CircularGauge
 
 The legend contains the list of the ranges that appear in the circular gauge  
 
@@ -23,7 +23,7 @@ By default, the legend  the legend will not be displayed in the circular gauge.
 
 {% endhighlight %}
 
-![](Legend_images/Legend_img1.png)
+![ASP.NET Core CircularGauge legend visibility](Legend_images/Legend_img1.png)
 
 
 [Click](http://ng2jq.syncfusion.com/#/circulargauge/legend) here to view the online demo sample for legend .
@@ -75,7 +75,7 @@ By using the `position` property, you can position the legend at *left*, *right*
 
 {% endhighlight  %}
 
-![](Legend_images/Legend_img2.png)
+![ASP.NET Core CircularGauge legend fill](Legend_images/Legend_img2.png)
 
 ### Legend Alignment
 
@@ -89,7 +89,7 @@ You can align the legend to the *center*, *far* or *near* based on its position
 
 {% endhighlight %}
 
-![](Legend_images/Legend_img3.png)
+![ASP.NET Core CircularGauge legend alignment`](Legend_images/Legend_img3.png)
 
 ## Customization
 
@@ -105,7 +105,7 @@ To change the legend item, shape, you have to specify the desired shape in the `
 
 {% endhighlight %}
 
-![](Legend_images/Legend_img4.png)
+![ASP.NET Core CircularGauge legend shape](Legend_images/Legend_img4.png)
 
 
 ### Legend Item Size and Border
@@ -124,7 +124,7 @@ You can change the size of the legend items by using the `width` and `height` pr
 
 {% endhighlight %}
 
-![](Legend_images/Legend_img5.png)
+![ASP.NET Core CircularGauge legend item size](Legend_images/Legend_img5.png)
 
 ### Legend size
 
@@ -140,7 +140,7 @@ You can change the default legend size by using the `size` property of the legen
 
 {% endhighlight %}
 
-![](Legend_images/Legend_img6.png)
+![ASP.NET Core CircularGauge size](Legend_images/Legend_img6.png)
 
 
 ### Legend Item Padding
@@ -157,7 +157,7 @@ You can control the spacing between the legend items by using the `item-padding`
 
 {% endhighlight %}
 
-![](Legend_images/Legend_img7.png)
+![ASP.NET Core CircularGauge item padding](Legend_images/Legend_img7.png)
 
 ### Legend border
 
@@ -174,7 +174,7 @@ You can customize the legend border by using the `border` option in the legend.
 
 {% endhighlight %}
 
-![](Legend_images/Legend_img8.png)
+![ASP.NET Core CircularGauge border](Legend_images/Legend_img8.png)
 
 ### Font of the legend text
 
@@ -191,7 +191,7 @@ The font of the legend item text can be customized by using the `font` property
 {% endhighlight %}
 
 
-![](Legend_images/Legend_img9.png)
+![ASP.NET Core CircularGauge events](Legend_images/Legend_img9.png)
 
 ## Events
 
diff --git a/aspnet-core/CircularGauge/Ranges-and-Frames.md b/aspnet-core/CircularGauge/Ranges-and-Frames.md
index 0a83fc22..01d756e8 100644
--- a/aspnet-core/CircularGauge/Ranges-and-Frames.md
+++ b/aspnet-core/CircularGauge/Ranges-and-Frames.md
@@ -1,13 +1,13 @@
 ---
 layout: post
-title: Ranges and Frames | CircularGauge |  Syncfusion
-description:  ranges and frames
+title: Ranges and Frames in ASP.NET Core CircularGauge Control |  Syncfusion
+description: Learn here about ranges and frames in Syncfusion Essential ASP.NET Core CircularGauge Control, its elements, and more.
 platform: aspnet-core
 control: CircularGauge
 documentation: ug
 ---
 
-#  Ranges and Frames
+# Ranges and Frames in ASP.NET Core CircularGauge
 
 Ranges are used to specify or group the scale values. By using ranges, you can describe the values in the pointers. 
 
@@ -55,7 +55,7 @@ Range collection is directly added to the scale object. Refer the following code
 
 Execute the above code to render the following output.
 
-![](Ranges-and-Frames_images/Ranges-and-Frames_img1.png)
+![ASP.NET Core CircularGauge range and frame](Ranges-and-Frames_images/Ranges-and-Frames_img1.png)
 
 Circular Gauge with customized ranges with startValues and endValues
 {:.caption}
@@ -84,7 +84,7 @@ placement="@RangePlacement.Far">
 
 Execute the above code to render the following output.
 
-![](Ranges-and-Frames_images/Ranges-and-Frames_img2.png)
+![ASP.NET Core CircularGauge color and border](Ranges-and-Frames_images/Ranges-and-Frames_img2.png)
 
 Circular Gauge with customized range colors and borders
 {:.caption}
@@ -118,7 +118,7 @@ Execute the above code to render the following output.
 
 
 
-![](Ranges-and-Frames_images/Ranges-and-Frames_img3.png)
+![ASP.NET Core CircularGauge position the ranges](Ranges-and-Frames_images/Ranges-and-Frames_img3.png)
 
 Circular Gauge with customized ranges
 {:.caption}
@@ -152,7 +152,7 @@ placement="@RangePlacement.Far">
 
 Execute the above code to render the following output.
 
-![](Ranges-and-Frames_images/Ranges-and-Frames_img4.png)
+![ASP.NET Core CircularGauge multiple ranges](Ranges-and-Frames_images/Ranges-and-Frames_img4.png)
 
 Circular Gauge with multiple ranges
 {:.caption}
@@ -185,7 +185,7 @@ half-circle-frame-start-angle="205" half-circle-frame-end-angle="335"></e-frame>
 
 Execute the above code to render the following output.
 
-![](Ranges-and-Frames_images/Ranges-and-Frames_img5.png)
+![ASP.NET Core CircularGauge frames](Ranges-and-Frames_images/Ranges-and-Frames_img5.png)
 
 Circular Gauge with multiple ranges
 {:.caption}
diff --git a/aspnet-core/ColorPicker/Appearance-and-Styling.md b/aspnet-core/ColorPicker/Appearance-and-Styling.md
index 8dfc5104..900c55f4 100644
--- a/aspnet-core/ColorPicker/Appearance-and-Styling.md
+++ b/aspnet-core/ColorPicker/Appearance-and-Styling.md
@@ -1,13 +1,13 @@
 ---
 layout: post
 title: Appearance and Styling | ColorPicker  | ASP.NET Core | Syncfusion
-description: appearance and styling
+description: Learn here about appearance and styling in ASP.NET Core ColorPicker Control, its elements, and more.
 platform: aspnet-core
 control: ColorPicker
 documentation: ug
 ---
 
-# Appearance and Styling
+# Appearance and Styling in ASP.NET Core ColorPicker
 
 ## modelType
 
@@ -67,7 +67,7 @@ N> To render the ColorPicker Control you can use either Razor or Tag helper code
 
 The following screenshot displays the output of the above code example.
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img1.png)
+![ASP.NET Core ColorPicker appearance](Appearance-and-Styling_images/Appearance-and-Styling_img1.png)
 
 ColorPicker rendered with Palette Model
 {:.caption}
@@ -190,7 +190,7 @@ PresetType(PresetsType.CandyCrush)</td></tr>
 
 The following screenshot displays the output of the above code example.
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img2.png)
+![ASP.NET Core ColorPicker styling](Appearance-and-Styling_images/Appearance-and-Styling_img2.png)
 
 ColorPicker with Presets
 {:.caption}
@@ -227,7 +227,7 @@ The CustomPalette property is a dependent property of Palette and ModelType prop
 
 The following screenshot displays the output of the above code example.
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img3.png)
+![ASP.NET Core ColorPicker customized color](Appearance-and-Styling_images/Appearance-and-Styling_img3.png)
 
 ColorPicker with Customized Colors
 {:.caption}
@@ -263,7 +263,7 @@ The following steps explain you how to get the ColorPicker popup in DisplayInlin
 
 The following screenshot displays the output of the above code example.
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img4.png)
+![ASP.NET Core ColorPicker display inline](Appearance-and-Styling_images/Appearance-and-Styling_img4.png)
 
 ColorPicker in Display Inline
 {:.caption}
@@ -352,7 +352,7 @@ N> jQuery.easing external dependency has been removed from version 14.3.0.49 onw
 
 The following screenshot displays the output of the above code example.
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img5.png)
+![ASP.NET Core ColorPicker theme](Appearance-and-Styling_images/Appearance-and-Styling_img5.png)
 
 ColorPicker with Theme Support
 {:.caption}
@@ -415,7 +415,7 @@ Using this property you can override the existing styles under the theme style s
 {% endhighlight  %}
 The following screenshot displays the output of above steps.
 
-![](Appearance-and-Styling_images/Appearance-and-Styling_img6.png)
+![ASP.NET Core ColorPicker custom theme](Appearance-and-Styling_images/Appearance-and-Styling_img6.png)
 
 ColorPicker with Custom Theme
 {:.caption}
diff --git a/aspnet-core/ProgressBar/Enabling-the-ProgressBar.md b/aspnet-core/ProgressBar/Enabling-the-ProgressBar.md
index 6d0e04c3..46ec380d 100644
--- a/aspnet-core/ProgressBar/Enabling-the-ProgressBar.md
+++ b/aspnet-core/ProgressBar/Enabling-the-ProgressBar.md
@@ -1,13 +1,13 @@
 ---
 layout: post
 title: Enabling the ProgressBar | Progress Bar | ASP.NET Core | Syncfusion
-description: enabling the progressbar
+description: Learn here about enabling the progressbar in Syncfusion Essential ASP.NET Core Progress Bar Control, its elements, and more.
 platform: aspnet-core
 control: Progress Bar
 documentation: ug
 ---
 
-## Enabling the ProgressBar
+# Enabling the ProgressBar in ASP.NET Core
 
 The ProgressBar is enabled by using the ‘Enabled’ Property. When this property is set to ‘false’, it disables the ProgressBar widget. By default, ‘Enabled’ property is set to ‘true’ in the ProgressBar widget.
 
@@ -25,7 +25,7 @@ The following steps explain how to disable the ProgressBar widget when ‘Enable
 
 The following screenshot displays the output for the above code.
 
-![](Enabling-the-ProgressBar_images/Enabling-the-ProgressBar_img1.png)
+![ASP.NET Core Progress Bar enable](Enabling-the-ProgressBar_images/Enabling-the-ProgressBar_img1.png)
 
 Disabled Progress Bar
 {:.caption}
\ No newline at end of file
diff --git a/aspnet-core/TreeGrid/Searching.md b/aspnet-core/TreeGrid/Searching.md
index 896a53be..70d16f39 100644
--- a/aspnet-core/TreeGrid/Searching.md
+++ b/aspnet-core/TreeGrid/Searching.md
@@ -1,13 +1,13 @@
 ---
 layout: post
 title: Searching | TreeGrid | ASP.NET Core | Syncfusion
-description: Searching
+description: Learn here about Searching in Syncfusion Essential ASP.NET Core TreeGrid Control, its elements, and more.
 platform: aspnet-core
 control: TreeGrid
 documentation: ug
 ---
 
-## Searching
+# Searching in ASP.NET Core TreeGrid
 
 The TreeGrid control has an option to search its content using toolbar search box. The toolbar search box can be enabled by using the `ToolbarSettings.ToolbarItems` property. The following code example explains how to integrate search textbox in toolbar.
 
@@ -34,7 +34,7 @@ public partial class TreeGridController : Controller
 {% endhighlight %}
 
 The below screenshot shows TreeGrid search with `plan` key word.
-![](Searching_images/Searching_img1.png)
+![ASP.NET Core TreeGrid searching](Searching_images/Searching_img1.png)
 
 ## Search Hierarchy Modes
 
@@ -62,6 +62,6 @@ The following code example shows how to set the `SearchHierarchyMode` in the tre
 {% endhighlight %}
 
 The following image depicts the output of the previous code example.
-![](Searching_images/SearchHierarchyModes_img1.png)
+![ASP.NET Core TreeGrid search hierarchy mode](Searching_images/SearchHierarchyModes_img1.png)
 
 The above screenshot shows Tree Grid with `child` search mode.