diff --git a/_contentTemplates/chart/chart-tooltip-context-templates.md b/_contentTemplates/chart/chart-tooltip-context-templates.md
index 8174787d42..49c62da858 100644
--- a/_contentTemplates/chart/chart-tooltip-context-templates.md
+++ b/_contentTemplates/chart/chart-tooltip-context-templates.md
@@ -1,16 +1,16 @@
 #context-parameter-information
 * `FormattedValue` - maps to the default rendering of the tooltip, formatted as a string.
- * Use this when the chart's data is bound by [Independent Series Binding]({%slug components/chart/databind%}#independent-series-binding). You can parse this to a numerical value (`int`, `double`, etc.) in order to apply formatting. Otherwise, use the `DataItem` to get the value of the point.
+ * Use this when the chart's data is bound by [Independent Series Binding](slug://components/chart/databind#independent-series-binding). You can parse this to a numerical value (`int`, `double`, etc.) in order to apply formatting. Otherwise, use the `DataItem` to get the value of the point.
 
 * `DataItem` - provides the data model of the current series item. You need to cast it to the type from your datasource, which needs to be serializable. 
 
-    * If you are using a [Date Axis]({%slug components/chart/date-axis%}), the `DataItem` will contain the only the aggregated value in the corresponding y-value field, because it is a collection of more than one items. See the `Category` below for details.
+    * If you are using a [Date Axis](slug://components/chart/date-axis), the `DataItem` will contain the only the aggregated value in the corresponding y-value field, because it is a collection of more than one items. See the `Category` below for details.
 
-* `Category` - provides information on the category the data point is located in. You need to cast it to the type in your data source, for example `DateTime`, `string`, `int` or another type. The `Category` parameter is applicable to [Categorical Charts]({%slug components/chart/databind%}#series-types).
+* `Category` - provides information on the category the data point is located in. You need to cast it to the type in your data source, for example `DateTime`, `string`, `int` or another type. The `Category` parameter is applicable to [Categorical Charts](slug://components/chart/databind#series-types).
 
-    * When using a [Date Axis]({%slug components/chart/date-axis%}), you can use it, together with the `BaseUnit` value of the axis, to filter the data source and obtain the actual data items from the data source in case you want to provide extra information about them.
+    * When using a [Date Axis](slug://components/chart/date-axis), you can use it, together with the `BaseUnit` value of the axis, to filter the data source and obtain the actual data items from the data source in case you want to provide extra information about them.
 
-* `Percentage` - applicable to [Donut]({%slug components/chart/types/donut%}), [Pie]({%slug components/chart/types/pie%}) and [Stacked 100%]({%slug components/chart/stack%}#stack-100) Charts - the percentage value of the current data point from the whole.
+* `Percentage` - applicable to [Donut](slug://components/chart/types/donut), [Pie](slug://components/chart/types/pie) and [Stacked 100%](slug://components/chart/stack#stack-100) Charts - the percentage value of the current data point from the whole.
 
 * `SeriesIndex` - provides the index of the `<ChartSeries>` the data point belongs to.
 
diff --git a/_contentTemplates/chart/link-to-basics.md b/_contentTemplates/chart/link-to-basics.md
index 2082ebf532..b4c186615e 100644
--- a/_contentTemplates/chart/link-to-basics.md
+++ b/_contentTemplates/chart/link-to-basics.md
@@ -1,5 +1,5 @@
 #understand-basics-and-databinding-first
-This article assumes you are familiar with the [chart basics]({%slug components/chart/overview%}) and [data binding]({%slug components/chart/databind%}).
+This article assumes you are familiar with the [chart basics](slug://components/chart/overview) and [data binding](slug://components/chart/databind).
 #end
 
 #color-field-bar-column
@@ -109,9 +109,9 @@ You can render the lines between the points with different styles. The supported
 
 * `Normal`—This is the default style. It produces a straight line between data points.
 
-* `Step`—The style renders the connection between data points through vertical and horizontal lines. It is suitable for indicating that the value is constant between the changes. Supported for [categorical]({%slug components/chart/databind%}#series-types) types of [Line]({%slug components/chart/types/line%}) charts only, but not for scatter charts.
+* `Step`—The style renders the connection between data points through vertical and horizontal lines. It is suitable for indicating that the value is constant between the changes. Supported for [categorical](slug://components/chart/databind#series-types) types of [Line](slug://components/chart/types/line) charts only, but not for scatter charts.
 
-* `Smooth`—This style causes the Chart to display a fitted curve through data points. It is suitable when the data requires to be displayed with a curve, or when you wish to connect the points with smooth instead of straight lines. Not supported with [stacked]({%slug components/chart/stack%}) series with missing values.
+* `Smooth`—This style causes the Chart to display a fitted curve through data points. It is suitable when the data requires to be displayed with a curve, or when you wish to connect the points with smooth instead of straight lines. Not supported with [stacked](slug://components/chart/stack) series with missing values.
 
 #end
 
@@ -150,7 +150,7 @@ When configuring nested properties and child elements in your chart, the inner t
 
 #configurable-nested-chart-settings-categorical
 
-An example of this is the rotation the Labels of a [categorical]({%slug components/chart/databind%}#series-types) chart. You can use the
+An example of this is the rotation the Labels of a [categorical](slug://components/chart/databind#series-types) chart. You can use the
 
 `ChartCategoryAxes` > `ChartCategoryAxis` > `ChartCategoryAxisLabels` > `ChartCategoryAxisLabelsRotation` tag
 
@@ -162,7 +162,7 @@ This approach is not limited only to the Labels - it can be used with all tags t
 
 #configurable-nested-chart-settings-numerical
 
-For example, for [numerical]({%slug components/chart/databind%}#series-types) charts you can rotate the Labels for `ChartXAxes` or `ChartYAxes` depending on your application design needs and layout. This can be done through the
+For example, for [numerical](slug://components/chart/databind#series-types) charts you can rotate the Labels for `ChartXAxes` or `ChartYAxes` depending on your application design needs and layout. This can be done through the
 
 `ChartXAxes` > `ChartXAxis` > `ChartXAxisLabelsRotation` tag
 
@@ -174,7 +174,7 @@ This approach is not limited only to the Labels - it can be used with to all tag
 
 #configurable-nested-chart-settings-axis-free
 
-For example, for [axis-free]({%slug components/chart/databind%}#series-types) charts you can rotate their Labels, Title, Legend and others. Example for doing so is customizing the Chart Series Labels by using the parameters in the
+For example, for [axis-free](slug://components/chart/databind#series-types) charts you can rotate their Labels, Title, Legend and others. Example for doing so is customizing the Chart Series Labels by using the parameters in the
 
 `ChartSeriesItems` > `ChartSeries` > `ChartSeriesLabels` tag and its child tags.
 
diff --git a/_contentTemplates/common/click-events.md b/_contentTemplates/common/click-events.md
index 9a1c62ef39..fc31212afc 100644
--- a/_contentTemplates/common/click-events.md
+++ b/_contentTemplates/common/click-events.md
@@ -52,7 +52,7 @@ The `OnRowContextMenu` event fires when the user:
 * Right-clicks or taps-and-holds a data row;
 * Hits the context menu keyboard button while the row has focus. This scenario requires enabled keyboard navigation (`Navigable="true"`).
 
-Use `OnRowContextMenu` to [integrate the Context menu]({%slug contextmenu-integration%}#context-menu-for-a-grid-row) with the table rows.
+Use `OnRowContextMenu` to [integrate the Context menu](slug://contextmenu-integration#context-menu-for-a-grid-row) with the table rows.
 
 #end
 
diff --git a/_contentTemplates/common/dropdowns-virtualization.md b/_contentTemplates/common/dropdowns-virtualization.md
index 1fd0d33ea7..737c13b638 100644
--- a/_contentTemplates/common/dropdowns-virtualization.md
+++ b/_contentTemplates/common/dropdowns-virtualization.md
@@ -11,7 +11,7 @@ This section will explain the parameters and behaviors that are related to the v
 >caption To enable UI virtualization, you need to set the following parameters of the component:
 
 * `ScrollMode` - `Telerik.Blazor.DropDownScrollMode` - set it to `DropDownScrollMode.Virtual`. It defaults to the "regular" scrolling.
-* `Height` - `string` - [set the height]({%slug common-features/dimensions%}) in the nested **popup settings** tag of the component. It must **not** be a `null/empty` string.
+* `Height` - `string` - [set the height](slug://common-features/dimensions) in the nested **popup settings** tag of the component. It must **not** be a `null/empty` string.
 * `ItemHeight` - `decimal` - set it to the height each individual item will have in the dropdown. Make sure to accommodate the content your items will have and any item template.
 * `PageSize` - `int` - defines how many items will actually be rendered and reused. The value determines how many items are loaded on each scroll. The number of items must be large enough according to the `ItemHeight` and popup `Height`, so that there are more items than the dropdown so there is a scrollbar.
 
diff --git a/_contentTemplates/common/filtering.md b/_contentTemplates/common/filtering.md
index 8c3067d4e6..a9fbf257c2 100644
--- a/_contentTemplates/common/filtering.md
+++ b/_contentTemplates/common/filtering.md
@@ -4,8 +4,8 @@
 
 | Parameter | Type and Default Value | Description |
 | --- | --- | --- |
-| `DefaultFilterOperator` | `FilterOperator` | Sets the default filter operator in the column it is declared for. Accepts a member of the `FilterOperator` enum. The selected operator must be applicable for the specific data type. Check the supported options in the [Filter Operators]({%slug common-features-filter-operators%}) article.
-| `FilterOperators` | `List<FilterListOperator>` | Specifies the available operators. Must contain only [supported filter operators]({%slug common-features-filter-operators%}) for the specific data type. If not defined, the component will use a default list of available operators based on the field type.
+| `DefaultFilterOperator` | `FilterOperator` | Sets the default filter operator in the column it is declared for. Accepts a member of the `FilterOperator` enum. The selected operator must be applicable for the specific data type. Check the supported options in the [Filter Operators](slug://common-features-filter-operators) article.
+| `FilterOperators` | `List<FilterListOperator>` | Specifies the available operators. Must contain only [supported filter operators](slug://common-features-filter-operators) for the specific data type. If not defined, the component will use a default list of available operators based on the field type.
 | `ShowFilterCellButtons` | `bool` <br/> (`true`) | controls the visibility of the filter buttons
 #end
 
@@ -15,8 +15,8 @@
 
 | Parameter      | Type and Default Value | Description
 | ----------- | ----------- | -----------|
-| `DefaultFilterOperator` | `FilterOperator` | Sets the default filter operator in the column it is declared for. Accepts a member of the `FilterOperator` enum. The selected operator must be applicable for the specific data type Check the supported options in the [Filter Operators]({%slug common-features-filter-operators%}) article. The provided default filter operator will be applied for both filters in the menu.
-| `FilterOperators` | `List<FilterListOperator>` | Specifies the available operators. Must contain only [supported filter operators]({%slug common-features-filter-operators%}) for the specific data type. If not defined, the component will use a default list of available operators based on the field type.
+| `DefaultFilterOperator` | `FilterOperator` | Sets the default filter operator in the column it is declared for. Accepts a member of the `FilterOperator` enum. The selected operator must be applicable for the specific data type Check the supported options in the [Filter Operators](slug://common-features-filter-operators) article. The provided default filter operator will be applied for both filters in the menu.
+| `FilterOperators` | `List<FilterListOperator>` | Specifies the available operators. Must contain only [supported filter operators](slug://common-features-filter-operators) for the specific data type. If not defined, the component will use a default list of available operators based on the field type.
 #end
 
 #filter-debounce-delay-customization
diff --git a/_contentTemplates/common/form-validation.md b/_contentTemplates/common/form-validation.md
index b9d6f8cf51..a777752958 100644
--- a/_contentTemplates/common/form-validation.md
+++ b/_contentTemplates/common/form-validation.md
@@ -7,5 +7,5 @@ The Telerik Blazor validation tools let you match the style of your validation m
 #end
 
 #note-editcontext-formitem-template
-> When using the [Form `EditContext` parameter]({%slug form-overview%}#creating-blazor-form) together with [validation components]({%slug validation-tools-overview%}) or [Form item `<Template>`s]({%slug form-formitems-template%}), make sure to create the `EditContext` from the model instance, which is used by the validation components and inside the Form item templates. Otherwise, the Form will not update the correct object instance and validation will not work as expected.
+> When using the [Form `EditContext` parameter](slug://form-overview#creating-blazor-form) together with [validation components](slug://validation-tools-overview) or [Form item `<Template>`s](slug://form-formitems-template), make sure to create the `EditContext` from the model instance, which is used by the validation components and inside the Form item templates. Otherwise, the Form will not update the correct object instance and validation will not work as expected.
 #end
diff --git a/_contentTemplates/common/general-info.md b/_contentTemplates/common/general-info.md
index 7a4bdc6a37..804117c708 100644
--- a/_contentTemplates/common/general-info.md
+++ b/_contentTemplates/common/general-info.md
@@ -3,11 +3,11 @@
 #end
 
 #ensure-nuget-packge-for-upgrade
-Make sure that you have a NuGet feed source with the version you want to upgrade to. This is usually the [Telerik NuGet Feed]({%slug installation/nuget%}), but you can also use a local feed from [our MSI installer]({%slug installation/msi%}) or [ZIP archive]({%slug installation/zip%}).
+Make sure that you have a NuGet feed source with the version you want to upgrade to. This is usually the [Telerik NuGet Feed](slug://installation/nuget), but you can also use a local feed from [our MSI installer](slug://installation/msi) or [ZIP archive](slug://installation/zip).
 #end
 
 #date-format-per-culture
-The `Format` is culture-specific and the same format may produce different results depending on the culture. You can find more information and examples in the [Supported Date Formats]({%slug components/dateinput/supported-formats%}) article.
+The `Format` is culture-specific and the same format may produce different results depending on the culture. You can find more information and examples in the [Supported Date Formats](slug://components/dateinput/supported-formats) article.
 #end
 
 
@@ -15,7 +15,7 @@ The `Format` is culture-specific and the same format may produce different resul
 You can get the extension from:
 
 * The Visual Studio Marketplace (for [Visual Studio 2022 for Windows](https://marketplace.visualstudio.com/items?itemName=TelerikInc.ProgressTelerikBlazorVSExtensions) and [Visual Studio 2019 for Windows](https://marketplace.visualstudio.com/items?itemName=TelerikInc.TelerikBlazorVSExtensions)).
-* The [Telerik UI for Blazor automated installer]({%slug installation/msi%}) (for Windows and Mac).
+* The [Telerik UI for Blazor automated installer](slug://installation/msi) (for Windows and Mac).
 * Your [Telerik.com account](https://www.telerik.com/account/product-download?product=BLAZOR) (for Mac only). Download the `.mpack` file and use the "Install from file..." button on the Visual Studio Extensions dialog.
 
 > Our extention for Visual Studio for Mac will be discontinued in 2024 [after Visual Studio for Mac is discontinued](https://learn.microsoft.com/en-us/visualstudio/mac/what-happened-to-vs-for-mac).
@@ -33,7 +33,7 @@ You can get the extension from:
 
 
 #valuebind-vs-databind-link
-For details on Value Binding and Data Binding, and the differences between them, see the [Value Binding vs Data Binding]({%slug get-started-value-vs-data-binding%}) article.
+For details on Value Binding and Data Binding, and the differences between them, see the [Value Binding vs Data Binding](slug://get-started-value-vs-data-binding) article.
 #end
 
 
@@ -45,81 +45,81 @@ If you set the `ShouldRender` field of the event arguments to `true`, the compon
 #code-snippets-table
 | Code Snippet               | Component                                |
 |----------------------------|------------------------------------------|
-| tb-autocomplete            | [AutoComplete]({%slug autocomplete-overview%}) |
-| tb-autocomplete-filterable | [AutoComplete with Filtering]({%slug autocomplete-filter%}) |
-| tb-barcode                 | [Barcode]({%slug barcode-overview%})     |
-| tb-breadcrumb              | [Breadcrumb]({%slug breadcrumb-overview%}) |
-| tb-button                  | [Button]({%slug components/button/overview%}) |
-| tb-button-settings         | [Button with Appearance Settings]({%slug button-appearance%}) |
-| tb-calendar                | [Calendar]({%slug components/calendar/overview%}) |
-| tb-carousel                | [Carousel]({%slug carousel-overview%})   |
-| tb-checkbox                | [Checkbox]({%slug checkbox-overview%})   |
-| tb-checkbox-tristate       | [Checkbox in Indeterminate State]({%slug checkbox-indeterminate-state%}) |
-| tb-chunkprogressbar        | [ChunkProgressBar]({%slug chunkprogressbar-overview%}) |
-| tb-colorgradient           | [ColorGradient]({%slug colorgradient-overview%}) |
-| tb-colorpalette            | [ColorPalette]({%slug colorpalette-overview%})    |
-| tb-colorpicker             | [ColorPicker]({%slug colorpicker-overview%}) |
-| tb-combobox                | [ComboBox]({%slug components/combobox/overview%}) |
-| tb-combobox-filterable     | [ComboBox with Filtering]({%slug components/combobox/filter%}) |
-| tb-contextmenu             | [ContextMenu]({%slug contextmenu-overview%}) |
-| tb-dateintput              | [DateInput]({%slug components/dateinput/overview%}) |
-| tb-datepicker              | [DatePicker]({%slug components/datepicker/overview%}) |
-| tb-daterangepicker         | [DateRangePicker]({%slug daterangepicker-overview%}) |
-| tb-datetimepicker          | [Date-Time Picker]({%slug components/datetimepicker/overview%}) |
-| tb-dialog                  | [Dialog]({%slug dialog-overview%})       |
-| tb-drawer                  | [Drawer]({%slug drawer-overview%})       |
-| tb-dropdownlist            | [DropDownList]({%slug components/dropdownlist/overview%}) |
-| tb-dropdownlist-filterable | [DropDownList with Filtering]({%slug components/dropdownlist/filter%}) |
-| tb-editor                  | [Editor]({%slug editor-overview%})       |
-| tb-fileselect              | [FileSelect]({%slug fileselect-overview%}) |
-| tb-filter                  | [Filter]({%slug filter-overview%})       |
-| tb-flatcolorpicker         | [FlatColorPicker]({%slug flatcolorpicker-overview%}) |
-| tb-form                    | [Form]({%slug form-overview%})           |
-| tb-gantt                   | [Gantt]({%slug gantt-overview%})         |
-| tb-gantt-editable          | [Gantt with Editing]({%slug gantt-tree-editing%}) |
-| tb-ganttcolumn             | [Gantt - Databound Column]({%slug gantt-columns-bound%}) |
-| tb-grid                    | [Grid]({%slug grid-overview%})           |
-| tb-grid-editable           | [Grid with Editing]({%slug components/grid/editing/overview%}) |
-| tb-gridcolumn              | [Grid - Databound Column]({%slug components/grid/columns/bound%}) |
-| tb-gridcolumn-locked       | [Grid with Frozen Column]({%slug grid-columns-frozen%}) |
-| tb-gridlayout              | [GridLayout]({%slug gridlayout-overview%}) |
-| tb-listview                | [ListView]({%slug listview-overview%})   |
-| tb-listview-editable       | [ListView with Editing]({%slug listview-editing%}) |
-| tb-loader                  | [Loader]({%slug loader-overview%})       |
-| tb-loadercontainer         | [LoaderContainer]({%slug loadercontainer-overview%}) |
-| tb-maskedtextbox           | [Masked Textbox]({%slug maskedtextbox-overview%}) |
-| tb-menu                    | [Menu]({%slug components/menu/overview%}) |
-| tb-multiselect             | [MultiSelect]({%slug multiselect-overview%}) |
-| tb-multiselect-filterable  | [MultiSelect with Filtering]({%slug multiselect-filter%}) |
-| tb-numerictextbox          | [Numeric Textbox]({%slug components/numerictextbox/overview%}) |
-| tb-pager                   | [Pager]({%slug pager-overview%})         |
-| tb-panelbar                | [PanelBar]({%slug panelbar-overview%})   |
-| tb-progressbar             | [ProgressBar]({%slug progressbar-overview%}) |
-| tb-qrcode                  | [QRCode]({%slug qrcode-overview%})       |
-| tb-radiogroup              | [RadioGroup]({%slug radiogroup-overview%}) |
-| tb-rangeslider             | [RangeSlider]({%slug rangeslider-overview%}) |
-| tb-scheduler               | [Scheduler]({%slug scheduler-overview%}) |
-| tb-scheduler-editable      | [Scheduler with Editing]({%slug scheduler-appointments-edit%}) |
-| tb-slider                  | [Slider]({%slug slider-overview%})       |
-| tb-splitter                | [Splitter]({%slug splitter-overview%})   |
-| tb-stacklayout             | [StackLayout]({%slug stacklayout-overview%}) |
-| tb-stepper                 | [Stepper]({%slug stepper-overview%})     |
-| tb-switch                  | [Switch]({%slug switch-overview%})       |
-| tb-tabstrip                | [TabStrip]({%slug components/tabstrip/overview%}) |
-| tb-textarea                | [TextArea]({%slug textarea-overview%})   |
-| tb-textbox                 | [Textbox]({%slug components/textbox/overview%}) |
-| tb-tilelayout              | [TileLayout]({%slug tilelayout-overview%}) |
-| tb-timepicker              | [Time Picker]({%slug components/timepicker/overview%}) |
-| tb-togglebutton            | [ToggleButton]({%slug togglebutton-overview%}) |
-| tb-tooltip                 | [Tooltip]({%slug tooltip-overview%})     |
-| tb-treelist                | [TreeList]({%slug treelist-overview%})   |
-| tb-treeList-editable       | [TreeList with Editing]({%slug treelist-editing-overview%}) |
-| tb-treelistcolumn          | [TreeList - Databound Column]({%slug treelist-columns-bound%}) |
-| tb-treelistcolumn-locked   | [TreeList with Frozen Column]({%slug treelist-columns-frozen%}) |
-| tb-treeview                | [TreeView]({%slug treeview-overview%})   |
-| tb-upload                  | [Upload]({%slug upload-overview%})       |
-| tb-window                  | [Window]({%slug window-overview%}) |
-| tb-wizard                  | [Wizard]({%slug wizard-overview%})       |
+| tb-autocomplete            | [AutoComplete](slug://autocomplete-overview) |
+| tb-autocomplete-filterable | [AutoComplete with Filtering](slug://autocomplete-filter) |
+| tb-barcode                 | [Barcode](slug://barcode-overview)     |
+| tb-breadcrumb              | [Breadcrumb](slug://breadcrumb-overview) |
+| tb-button                  | [Button](slug://components/button/overview) |
+| tb-button-settings         | [Button with Appearance Settings](slug://button-appearance) |
+| tb-calendar                | [Calendar](slug://components/calendar/overview) |
+| tb-carousel                | [Carousel](slug://carousel-overview)   |
+| tb-checkbox                | [Checkbox](slug://checkbox-overview)   |
+| tb-checkbox-tristate       | [Checkbox in Indeterminate State](slug://checkbox-indeterminate-state) |
+| tb-chunkprogressbar        | [ChunkProgressBar](slug://chunkprogressbar-overview) |
+| tb-colorgradient           | [ColorGradient](slug://colorgradient-overview) |
+| tb-colorpalette            | [ColorPalette](slug://colorpalette-overview)    |
+| tb-colorpicker             | [ColorPicker](slug://colorpicker-overview) |
+| tb-combobox                | [ComboBox](slug://components/combobox/overview) |
+| tb-combobox-filterable     | [ComboBox with Filtering](slug://components/combobox/filter) |
+| tb-contextmenu             | [ContextMenu](slug://contextmenu-overview) |
+| tb-dateintput              | [DateInput](slug://components/dateinput/overview) |
+| tb-datepicker              | [DatePicker](slug://components/datepicker/overview) |
+| tb-daterangepicker         | [DateRangePicker](slug://daterangepicker-overview) |
+| tb-datetimepicker          | [Date-Time Picker](slug://components/datetimepicker/overview) |
+| tb-dialog                  | [Dialog](slug://dialog-overview)       |
+| tb-drawer                  | [Drawer](slug://drawer-overview)       |
+| tb-dropdownlist            | [DropDownList](slug://components/dropdownlist/overview) |
+| tb-dropdownlist-filterable | [DropDownList with Filtering](slug://components/dropdownlist/filter) |
+| tb-editor                  | [Editor](slug://editor-overview)       |
+| tb-fileselect              | [FileSelect](slug://fileselect-overview) |
+| tb-filter                  | [Filter](slug://filter-overview)       |
+| tb-flatcolorpicker         | [FlatColorPicker](slug://flatcolorpicker-overview) |
+| tb-form                    | [Form](slug://form-overview)           |
+| tb-gantt                   | [Gantt](slug://gantt-overview)         |
+| tb-gantt-editable          | [Gantt with Editing](slug://gantt-tree-editing) |
+| tb-ganttcolumn             | [Gantt - Databound Column](slug://gantt-columns-bound) |
+| tb-grid                    | [Grid](slug://grid-overview)           |
+| tb-grid-editable           | [Grid with Editing](slug://components/grid/editing/overview) |
+| tb-gridcolumn              | [Grid - Databound Column](slug://components/grid/columns/bound) |
+| tb-gridcolumn-locked       | [Grid with Frozen Column](slug://grid-columns-frozen) |
+| tb-gridlayout              | [GridLayout](slug://gridlayout-overview) |
+| tb-listview                | [ListView](slug://listview-overview)   |
+| tb-listview-editable       | [ListView with Editing](slug://listview-editing) |
+| tb-loader                  | [Loader](slug://loader-overview)       |
+| tb-loadercontainer         | [LoaderContainer](slug://loadercontainer-overview) |
+| tb-maskedtextbox           | [Masked Textbox](slug://maskedtextbox-overview) |
+| tb-menu                    | [Menu](slug://components/menu/overview) |
+| tb-multiselect             | [MultiSelect](slug://multiselect-overview) |
+| tb-multiselect-filterable  | [MultiSelect with Filtering](slug://multiselect-filter) |
+| tb-numerictextbox          | [Numeric Textbox](slug://components/numerictextbox/overview) |
+| tb-pager                   | [Pager](slug://pager-overview)         |
+| tb-panelbar                | [PanelBar](slug://panelbar-overview)   |
+| tb-progressbar             | [ProgressBar](slug://progressbar-overview) |
+| tb-qrcode                  | [QRCode](slug://qrcode-overview)       |
+| tb-radiogroup              | [RadioGroup](slug://radiogroup-overview) |
+| tb-rangeslider             | [RangeSlider](slug://rangeslider-overview) |
+| tb-scheduler               | [Scheduler](slug://scheduler-overview) |
+| tb-scheduler-editable      | [Scheduler with Editing](slug://scheduler-appointments-edit) |
+| tb-slider                  | [Slider](slug://slider-overview)       |
+| tb-splitter                | [Splitter](slug://splitter-overview)   |
+| tb-stacklayout             | [StackLayout](slug://stacklayout-overview) |
+| tb-stepper                 | [Stepper](slug://stepper-overview)     |
+| tb-switch                  | [Switch](slug://switch-overview)       |
+| tb-tabstrip                | [TabStrip](slug://components/tabstrip/overview) |
+| tb-textarea                | [TextArea](slug://textarea-overview)   |
+| tb-textbox                 | [Textbox](slug://components/textbox/overview) |
+| tb-tilelayout              | [TileLayout](slug://tilelayout-overview) |
+| tb-timepicker              | [Time Picker](slug://components/timepicker/overview) |
+| tb-togglebutton            | [ToggleButton](slug://togglebutton-overview) |
+| tb-tooltip                 | [Tooltip](slug://tooltip-overview)     |
+| tb-treelist                | [TreeList](slug://treelist-overview)   |
+| tb-treeList-editable       | [TreeList with Editing](slug://treelist-editing-overview) |
+| tb-treelistcolumn          | [TreeList - Databound Column](slug://treelist-columns-bound) |
+| tb-treelistcolumn-locked   | [TreeList with Frozen Column](slug://treelist-columns-frozen) |
+| tb-treeview                | [TreeView](slug://treeview-overview)   |
+| tb-upload                  | [Upload](slug://upload-overview)       |
+| tb-window                  | [Window](slug://window-overview) |
+| tb-wizard                  | [Wizard](slug://wizard-overview)       |
 #end
 
 
diff --git a/_contentTemplates/common/get-model-from-dropdowns.md b/_contentTemplates/common/get-model-from-dropdowns.md
index da6c8eaf53..a9ff618079 100644
--- a/_contentTemplates/common/get-model-from-dropdowns.md
+++ b/_contentTemplates/common/get-model-from-dropdowns.md
@@ -1,5 +1,5 @@
 #get-model-from-dropdowns
->tip If you are looking for more fields from the view-model that describes the dropdown items, not just the `Value`, see the [Get model from dropdown]({%slug dropdowns-get-model%}) KB article and the [OnChange](../events#onchange) event.
+>tip If you are looking for more fields from the view-model that describes the dropdown items, not just the `Value`, see the [Get model from dropdown](slug://dropdowns-get-model) KB article and the [OnChange](../events#onchange) event.
 >
 > You may also want to review/join the discussion and Vote for this request: <a href="https://www.telerik.com/forums/binding-dropdownlist-value-to-complex-model" target="_blank">Binding DropDownList Value to complex model</a>
 #end
diff --git a/_contentTemplates/common/get-started.md b/_contentTemplates/common/get-started.md
index 66ee5320fb..47d3ac5d69 100644
--- a/_contentTemplates/common/get-started.md
+++ b/_contentTemplates/common/get-started.md
@@ -1,21 +1,21 @@
 #prerequisites-tip
->tip This step-by-step tutorial starts with the basics and is suitable for first-time Blazor or Telerik component users. If you are already familiar with the Telerik NuGet source, components, and Blazor in general, you may prefer the [Telerik UI for Blazor Workflow Details]({%slug getting-started/what-you-need%}) article. It provides more setup options and suggests possible enhancements.
+>tip This step-by-step tutorial starts with the basics and is suitable for first-time Blazor or Telerik component users. If you are already familiar with the Telerik NuGet source, components, and Blazor in general, you may prefer the [Telerik UI for Blazor Workflow Details](slug://getting-started/what-you-need) article. It provides more setup options and suggests possible enhancements.
 
 #end
 
 #prerequisites-download
 
-* To successfully complete the steps in this tutorial, make sure you have an <a href="https://visualstudio.microsoft.com/vs/" target="_blank">up-to-date Visual Studio</a>, which is compatible with the .NET version of your choice. If you are not using Visual Studio, some of the steps require using the .NET CLI or editing files manually. In this case, also refer to the [Workflow Details tutorial]({%slug getting-started/what-you-need%}).
+* To successfully complete the steps in this tutorial, make sure you have an <a href="https://visualstudio.microsoft.com/vs/" target="_blank">up-to-date Visual Studio</a>, which is compatible with the .NET version of your choice. If you are not using Visual Studio, some of the steps require using the .NET CLI or editing files manually. In this case, also refer to the [Workflow Details tutorial](slug://getting-started/what-you-need).
 
-* To learn more about the compatibility of the Telerik UI for Blazor components with different browser and .NET versions, see the [system requirements]({%slug system-requirements%}).
+* To learn more about the compatibility of the Telerik UI for Blazor components with different browser and .NET versions, see the [system requirements](slug://system-requirements).
 
-* This online documentation covers the latest version of Telerik UI for Blazor, which is `{{site.uiForBlazorLatestVersion}}`. If needed, [download the offline PDF documentation]({%slug blazor-overview%}#learning-resources) for the required older product version.
+* This online documentation covers the latest version of Telerik UI for Blazor, which is `{{site.uiForBlazorLatestVersion}}`. If needed, [download the offline PDF documentation](slug://blazor-overview#learning-resources) for the required older product version.
 
 ## Step 0: Download Telerik UI for Blazor
 
 * If you have already purchased a Telerik UI for Blazor license, continue with the [next step and create a new project](#step-1-create-a-new-project).
 
-* If you are new to UI for Blazor and haven't purchased a license yet, you must <a href="https://www.telerik.com/download-trial-file/v2-b/ui-for-blazor" target="_blank">download and install the trial version</a> of the UI for Blazor components&mdash;this will activate your free trial and allow you to use the components. During the installation, select the **Set up Telerik NuGet package source** checkbox and the installer will configure the Telerik [online NuGet feed]({%slug installation/nuget%}) automatically. You will use this feed later in the tutorial. 
+* If you are new to UI for Blazor and haven't purchased a license yet, you must <a href="https://www.telerik.com/download-trial-file/v2-b/ui-for-blazor" target="_blank">download and install the trial version</a> of the UI for Blazor components&mdash;this will activate your free trial and allow you to use the components. During the installation, select the **Set up Telerik NuGet package source** checkbox and the installer will configure the Telerik [online NuGet feed](slug://installation/nuget) automatically. You will use this feed later in the tutorial. 
 
 >Trial users must complete the installation of the components. Otherwise their trial license will not activate and you cannot complete the tutorial successfully.
 
@@ -25,7 +25,7 @@
 #add-nuget-feed
 ## Step 2: Add the Telerik NuGet Feed to Visual Studio
 
-In this tutorial, you will use the [Telerik NuGet feed]({%slug installation/nuget%}) to download the UI for Blazor components. This NuGet feed is private and requires you to authenticate with your Telerik user name and password:
+In this tutorial, you will use the [Telerik NuGet feed](slug://installation/nuget) to download the UI for Blazor components. This NuGet feed is private and requires you to authenticate with your Telerik user name and password:
 
 1. In Visual Studio and go to **Tools** > **NuGet Package Manager** > **Package Manager Settings**.
 
@@ -39,7 +39,7 @@ In this tutorial, you will use the [Telerik NuGet feed]({%slug installation/nuge
 
 1. Whenever Visual Studio displays a dialog to enter credentials for `nuget.telerik.com`, use your Telerik account email and password.
 
->tip For alternative NuGet package download options, check the [Workflow article]({%slug getting-started/what-you-need%}). You can also [authenticate with `nuget.telerik.com` with an API key]({%slug installation/nuget%}#use-nuget-api-key).
+>tip For alternative NuGet package download options, check the [Workflow article](slug://getting-started/what-you-need). You can also [authenticate with `nuget.telerik.com` with an API key](slug://installation/nuget#use-nuget-api-key).
 
 #end
 
@@ -86,11 +86,11 @@ Well done! Now you have your first Telerik UI for Blazor component running in yo
 #next-steps-after-getting-started
 ## Next Steps
 
-* [Check the list of available components]({%slug blazor-overview%}#list-of-components).
+* [Check the list of available components](slug://blazor-overview#list-of-components).
 * [Explore the live Telerik UI for Blazor demos](https://demos.telerik.com/blazor-ui).
-* [Learn the data binding fundamentals for Telerik UI for Blazor components]({%slug common-features-data-binding-overview%}).
-* [Get started with the data Grid]({%slug grid-overview%}).
-* [Review the built-in themes or create custom ones]({%slug themes-overview%}).
+* [Learn the data binding fundamentals for Telerik UI for Blazor components](slug://common-features-data-binding-overview).
+* [Get started with the data Grid](slug://grid-overview).
+* [Review the built-in themes or create custom ones](slug://themes-overview).
 
 #end
 
@@ -100,7 +100,7 @@ Well done! Now you have your first Telerik UI for Blazor component running in yo
 
 
 #after-install
-Once you have the Telerik NuGet source set up, follow the instructions to [create a Telerik Blazor app]({%slug blazor-overview%}#getting-started).
+Once you have the Telerik NuGet source set up, follow the instructions to [create a Telerik Blazor app](slug://blazor-overview#getting-started).
 #end
 
 #setup-local-feed-vs
@@ -146,7 +146,7 @@ Add a `<TelerikRootComponent>` to the app layout file (by default, `MainLayout.r
 </TelerikRootComponent>
 ````
 
-You can learn more about the [`TelerikRootComponent` purpose and usage]({%slug rootcomponent-overview%}) in its dedicated documentation.
+You can learn more about the [`TelerikRootComponent` purpose and usage](slug://rootcomponent-overview) in its dedicated documentation.
 #end
 
 
diff --git a/_contentTemplates/common/grid-treelist-autogenerated-columns.md b/_contentTemplates/common/grid-treelist-autogenerated-columns.md
index 7e6ea30f96..d417671382 100644
--- a/_contentTemplates/common/grid-treelist-autogenerated-columns.md
+++ b/_contentTemplates/common/grid-treelist-autogenerated-columns.md
@@ -1,4 +1,4 @@
 #grid-treelist-autogenerated-columns-limitation
 When the component initializes, it expects to know what columns to render before the data comes.
-If the component is bound to a collection of dynamic objects (such as `Dictionary` or `ExpandoObject`), the component cannot know what columns to render, due to the nature of these objects. Therefore, the `AutoGenerateColumns` feature is not applicable in such scenarios. Columns must be declared explicitly or with a loop. Examples of such setups are available at [Binding Grid to ExpandoObject]({%slug grid-kb-binding-to-expando-object%}).
+If the component is bound to a collection of dynamic objects (such as `Dictionary` or `ExpandoObject`), the component cannot know what columns to render, due to the nature of these objects. Therefore, the `AutoGenerateColumns` feature is not applicable in such scenarios. Columns must be declared explicitly or with a loop. Examples of such setups are available at [Binding Grid to ExpandoObject](slug://grid-kb-binding-to-expando-object).
 #end
\ No newline at end of file
diff --git a/_contentTemplates/common/icons.md b/_contentTemplates/common/icons.md
index 74137ba8d8..e9a6ed7a14 100644
--- a/_contentTemplates/common/icons.md
+++ b/_contentTemplates/common/icons.md
@@ -1,6 +1,6 @@
 #font-icons-css-note
 
-> Make sure to [register `font-icons.css` if using Telerik font icons]({%slug common-features-icons%}#font-icon-stylesheet).
+> Make sure to [register `font-icons.css` if using Telerik font icons](slug://common-features-icons#font-icon-stylesheet).
 
 #end
 
diff --git a/_contentTemplates/common/inputs.md b/_contentTemplates/common/inputs.md
index 3626a1dae4..83936b5b4b 100644
--- a/_contentTemplates/common/inputs.md
+++ b/_contentTemplates/common/inputs.md
@@ -1,5 +1,5 @@
 #focus-kb
-Also check the dedicated KB article about [programmatic input component focusing]({%slug inputs-kb-focus%}), which provides more examples and tips.
+Also check the dedicated KB article about [programmatic input component focusing](slug://inputs-kb-focus), which provides more examples and tips.
 #end
 
 #edit-debouncedelay
@@ -11,11 +11,11 @@ Consider setting `DebounceDelay="0"` to the component inside the editor template
 #adornments
 ## Adornments
 
-The component allows you to add custom elements as prefixes and suffixes. [Read more about how to render custom adornments before and after the input element...]({%slug common-features/input-adornments%})
+The component allows you to add custom elements as prefixes and suffixes. [Read more about how to render custom adornments before and after the input element...](slug://common-features/input-adornments)
 #end
  
 #floating-label-and-preffix
-When using the [`PrefixTemplate`]({%slug common-features/input-adornments%}#adding-a-prefix-adornment) for a component wrapped in a [FloatingLabel]({%slug floatinglabel-overview%}), the label will overlap the prefix.
+When using the [`PrefixTemplate`](slug://common-features/input-adornments#adding-a-prefix-adornment) for a component wrapped in a [FloatingLabel](slug://floatinglabel-overview), the label will overlap the prefix.
 
 To ensure both the FloatingLabel and the prefix content are properly displayed, move the label with CSS:
 
diff --git a/_contentTemplates/common/navigation-components.md b/_contentTemplates/common/navigation-components.md
index eff90e53cd..df0dc8de01 100644
--- a/_contentTemplates/common/navigation-components.md
+++ b/_contentTemplates/common/navigation-components.md
@@ -13,6 +13,6 @@
 
 #default-fields-match-issues
 
-If your model field names match any of the default names, the component will try to use them. For example, a field called `Icon` will try to produce a Telerik icon out of those values and that may not be what you want. If you want to override such behaviors, you can set `IconField="someNonExistingField"`. You can read more about this [here]({%slug common-kb-custom-font-icons-fail%}). This also applies to other fields too. Another example would be a field called `Url` - in case you want to perform navigation yourself through templates, you may want to set `UrlField="someFakeField"` so that the component does not navigate on its own.
+If your model field names match any of the default names, the component will try to use them. For example, a field called `Icon` will try to produce a Telerik icon out of those values and that may not be what you want. If you want to override such behaviors, you can set `IconField="someNonExistingField"`. You can read more about this [here](slug://common-kb-custom-font-icons-fail). This also applies to other fields too. Another example would be a field called `Url` - in case you want to perform navigation yourself through templates, you may want to set `UrlField="someFakeField"` so that the component does not navigate on its own.
 
 #end
\ No newline at end of file
diff --git a/_contentTemplates/common/rebind-method.md b/_contentTemplates/common/rebind-method.md
index e92896381e..517e05da6f 100644
--- a/_contentTemplates/common/rebind-method.md
+++ b/_contentTemplates/common/rebind-method.md
@@ -1,5 +1,5 @@
 #intro
-You can refresh the data by invoking the [`Rebind` method]({%slug common-features-data-binding-overview%}#refresh-data). Use the component reference to call the `Rebind` method after you have made the data changes (for example adding, removing items). This is needed in case you are not using [Observable data](#observable-data) or [resetting the collection reference](#new-collection-reference). Calling `Rebind` will force the component process the available data anew to reflect the updates.
+You can refresh the data by invoking the [`Rebind` method](slug://common-features-data-binding-overview#refresh-data). Use the component reference to call the `Rebind` method after you have made the data changes (for example adding, removing items). This is needed in case you are not using [Observable data](#observable-data) or [resetting the collection reference](#new-collection-reference). Calling `Rebind` will force the component process the available data anew to reflect the updates.
 
 >caption Use the `Rebind` method to refresh the data.
 #end
\ No newline at end of file
diff --git a/_contentTemplates/date-inputs/general.md b/_contentTemplates/date-inputs/general.md
index d11374c765..adc5c8e9d9 100644
--- a/_contentTemplates/date-inputs/general.md
+++ b/_contentTemplates/date-inputs/general.md
@@ -26,19 +26,19 @@ By default, the value for all parameters is `null`, which applies the full forma
 #end
 
 #dateinput-typing-settings
-textbox is a [DateInput component]({%slug components/dateinput/overview%}), which provides various parameters to configure the keyboard typing experience. The settings are related to:
+textbox is a [DateInput component](slug://components/dateinput/overview), which provides various parameters to configure the keyboard typing experience. The settings are related to:
 
 * Caret placement;
 * Two-digit year values;
 * Automatic correction of invalid date segments.
 
-See the [DateInput keyboard documentation]({%slug dateinput-keyboard-typing%}) for details and examples. The same DateInput parameters with the same behavior exist for the
+See the [DateInput keyboard documentation](slug://dateinput-keyboard-typing) for details and examples. The same DateInput parameters with the same behavior exist for the
 #end
 
 #typing-parameters
 
 ### Typing User Experience
 
-The component provides multiple parameters, which control the [caret placement, two-digit year values and the auto-correct behavior of the textbox. See the **DateInput** documentation for details]({%slug dateinput-keyboard-typing%}).
+The component provides multiple parameters, which control the [caret placement, two-digit year values and the auto-correct behavior of the textbox. See the **DateInput** documentation for details](slug://dateinput-keyboard-typing).
 
 #end
diff --git a/_contentTemplates/dropdownbutton/notes.md b/_contentTemplates/dropdownbutton/notes.md
index 5f8c5becb4..1753dd91e8 100644
--- a/_contentTemplates/dropdownbutton/notes.md
+++ b/_contentTemplates/dropdownbutton/notes.md
@@ -1,7 +1,7 @@
 #dropdownbutton-splitbutton-comparison
 The DropDownButton and SplitButton components are similar. They both consist of a primary button and a dropdown element that holds additional action items. The major difference is the purpose of the primary button.
 
-* [DropDownButton]({%slug dropdownbutton-overview%})&mdash;The main purpose of the primary button is to open the popup with additional actions. The primary button exposes a separate [`OnClick` event]({%slug dropdownbutton-events%}), which can invoke a dedicated action. Clicking on the DropDownButton always opens the dropdown.
+* [DropDownButton](slug://dropdownbutton-overview)&mdash;The main purpose of the primary button is to open the popup with additional actions. The primary button exposes a separate [`OnClick` event](slug://dropdownbutton-events), which can invoke a dedicated action. Clicking on the DropDownButton always opens the dropdown.
 
-* [SplitButton]({%slug splitbutton-overview%})&mdash;The main element contains a primary button and a separate button for opening the dropdown. The purpose of the primary button is to [invoke a standalone action]({%slug splitbutton-events%}#onclick). Clicking on it does not open the dropdown. To open the popup with the additional actions, the user has to click the dedicated button with `caret-alt-down` icon. It is possible to [switch the primary and dropdown actions programmatically]({%slug splitbutton-kb-change-primary-action-onclick%}).
+* [SplitButton](slug://splitbutton-overview)&mdash;The main element contains a primary button and a separate button for opening the dropdown. The purpose of the primary button is to [invoke a standalone action](slug://splitbutton-events#onclick). Clicking on it does not open the dropdown. To open the popup with the additional actions, the user has to click the dedicated button with `caret-alt-down` icon. It is possible to [switch the primary and dropdown actions programmatically](slug://splitbutton-kb-change-primary-action-onclick).
 #end
\ No newline at end of file
diff --git a/_contentTemplates/dropdowns/adaptive-rendering.md b/_contentTemplates/dropdowns/adaptive-rendering.md
index 7d81bba92f..687e157f80 100644
--- a/_contentTemplates/dropdowns/adaptive-rendering.md
+++ b/_contentTemplates/dropdowns/adaptive-rendering.md
@@ -1,7 +1,7 @@
 #intro
-The component supports different popup rendering depending on the screen size. [Read more about the Adaptive Rendering functionality and how to enable it...]({%slug adaptive-rendering%})
+The component supports different popup rendering depending on the screen size. [Read more about the Adaptive Rendering functionality and how to enable it...](slug://adaptive-rendering)
 #end
 
 #value-changed
-> If [`AdaptiveRendering`]({%slug adaptive-rendering%}) is enabled, on small and medium devices `ValueChanged` will fire only when the user clicks the confirmation button in the action sheet.
+> If [`AdaptiveRendering`](slug://adaptive-rendering) is enabled, on small and medium devices `ValueChanged` will fire only when the user clicks the confirmation button in the action sheet.
 #end
\ No newline at end of file
diff --git a/_contentTemplates/dropdowns/features.md b/_contentTemplates/dropdowns/features.md
index bdb0e6634a..be1a941352 100644
--- a/_contentTemplates/dropdowns/features.md
+++ b/_contentTemplates/dropdowns/features.md
@@ -15,7 +15,7 @@ You can use the functionality of the built-in templates and customize the defaul
 #end
 
 #validation
-You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...]({%slug common-features/input-validation%}).
+You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...](slug://common-features/input-validation).
 #end
 
 #virtualization
@@ -25,7 +25,7 @@ By virtualizing the elements in the dropdown, you can use huge data sources with
 #styling
 | Parameter | Type | Description |
 | --- | --- | --- |
-| `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the component. Use it to [override the theme or apply custom styles]({%slug themes-override%}). |
+| `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the component. Use it to [override the theme or apply custom styles](slug://themes-override). |
 | `Width` | `string` | The width of the component. It will target both the dropdown and the main element if the dropdown has no specific width set. @[template](/_contentTemplates/inputs/inputs-width-template.md#inputs-width-information) |
 #end
 
@@ -43,7 +43,7 @@ By virtualizing the elements in the dropdown, you can use huge data sources with
 | `MaxWidth` | `string` | The maximum width of the popup. |
 | `Width` | `string` | The width of the popup. If you don't specify a value, the dropdown width will match the anchor element width which can help with responsive layouts and 100% widths. |
 
-The parameters that modify the popup dimensions (`Height`, `Width`, `MaxWidth`, etc.) expect [valid CSS values]({%slug common-features/dimensions%}). 
+The parameters that modify the popup dimensions (`Height`, `Width`, `MaxWidth`, etc.) expect [valid CSS values](slug://common-features/dimensions). 
 
 The `MinHeight` and `MaxHeight` have no effect if the `Height` is always within their range. The min and max values are useful only when the dropdown height is set to a relative unit or changes at runtime.
 
diff --git a/_contentTemplates/editor/general.md b/_contentTemplates/editor/general.md
index c464d4da0e..ff89eb509c 100644
--- a/_contentTemplates/editor/general.md
+++ b/_contentTemplates/editor/general.md
@@ -8,7 +8,7 @@ The application must sanitize the content before passing it to the Editor and, o
 
 This section applies only to Blazor **Server** apps. Blazor **WebAssembly** apps do not require additional configuration for the Editor to work with large content.
 
-Blazor **Server** apps use the **SignalR WebSocket** to send the Editor `Value` from the browser to the server .NET runtime and vice-versa. The default SignalR maximum message size is **32 KB**. To work with larger content (especially paste images as Base64 strings), [increase the max WebSocket message size for the Blazor application]({%slug common-kb-increase-signalr-max-message-size%}).
+Blazor **Server** apps use the **SignalR WebSocket** to send the Editor `Value` from the browser to the server .NET runtime and vice-versa. The default SignalR maximum message size is **32 KB**. To work with larger content (especially paste images as Base64 strings), [increase the max WebSocket message size for the Blazor application](slug://common-kb-increase-signalr-max-message-size).
 
 #end
 #prosemirror-schema-prerequisites
diff --git a/_contentTemplates/grid/built-in-dialogs.md b/_contentTemplates/grid/built-in-dialogs.md
index 0597d3b8bc..d0c3b8bbe0 100644
--- a/_contentTemplates/grid/built-in-dialogs.md
+++ b/_contentTemplates/grid/built-in-dialogs.md
@@ -1,11 +1,11 @@
 #delete-confirmation
 To customize the appearance and behavior of the delete confirmation dialog, use one of the following options:
 
-* [Localization]({%slug globalization-localization%}) - this approach is useful if you want to change just the text of the built-in delete confirmation dialog elements. It does not allow adding item details to the dialog text.
+* [Localization](slug://globalization-localization) - this approach is useful if you want to change just the text of the built-in delete confirmation dialog elements. It does not allow adding item details to the dialog text.
 
-* [Predefined dialogs (`DialogFactory`)]({%slug dialog-predefined%}#confirm) - this option is useful if you want to change the dialog text and include some details for the item the user tries to delete (for example, record name).
+* [Predefined dialogs (`DialogFactory`)](slug://dialog-predefined#confirm) - this option is useful if you want to change the dialog text and include some details for the item the user tries to delete (for example, record name).
 
-* [Dialog Component]({%slug dialog-overview%}) - this solution allows you to fully customize the rendering and appearance of the dialog. You may set the desired `ThemeColor` and add any content there, be that custom text, HTML elements or other components.
+* [Dialog Component](slug://dialog-overview) - this solution allows you to fully customize the rendering and appearance of the dialog. You may set the desired `ThemeColor` and add any content there, be that custom text, HTML elements or other components.
 
-[Read more about customizing the delete confirmation dialog...]({%slug grid-kb-customize-delete-confirmation-dialog%})
+[Read more about customizing the delete confirmation dialog...](slug://grid-kb-customize-delete-confirmation-dialog)
 #end
\ No newline at end of file
diff --git a/_contentTemplates/grid/common-link.md b/_contentTemplates/grid/common-link.md
index b762efad1d..949f52128f 100644
--- a/_contentTemplates/grid/common-link.md
+++ b/_contentTemplates/grid/common-link.md
@@ -110,7 +110,7 @@ You can use the standard C# formatting options, because the grid uses a `string.
 * The `CultureInfo.CurrentCulture` is used when rendering the formats, so if you need specific formats for specific users, you must set the culture of the app accordingly.
 
 
-* The `DisplayFormat` parameter defines the format that is used to render Numeric or DateTime values when the component initializes. As it is not applied in edit mode, the editor will display the default format of the field depending on the culture. In order to customize the format when editing, together with setting the `DisplayFormat` parameter, you can use Editor Template for [Grid]({%slug grid-templates-editor%}) or [TreeList]({%slug treelist-templates-editor%}).
+* The `DisplayFormat` parameter defines the format that is used to render Numeric or DateTime values when the component initializes. As it is not applied in edit mode, the editor will display the default format of the field depending on the culture. In order to customize the format when editing, together with setting the `DisplayFormat` parameter, you can use Editor Template for [Grid](slug://grid-templates-editor) or [TreeList](slug://treelist-templates-editor).
 #end
 
 
@@ -213,5 +213,5 @@ The keyboard navigation in the multi-column headers follows the functionality of
 #end
 
 #using-components-in-templates
-See specifics and example in this knowledge base article: [Using Components in Grid Templates]({%slug grid-kb-using-components-in-templates%}).
+See specifics and example in this knowledge base article: [Using Components in Grid Templates](slug://grid-kb-using-components-in-templates).
 #end
\ No newline at end of file
diff --git a/_contentTemplates/grid/state.md b/_contentTemplates/grid/state.md
index 45a6dcc18a..5df7698179 100644
--- a/_contentTemplates/grid/state.md
+++ b/_contentTemplates/grid/state.md
@@ -1,5 +1,5 @@
 #initial-state
->tip If you want to set an initial state to the Grid, use a similar snippet, but in the [`OnStateInit event`]({%slug grid-state%}#onstateinit)
+>tip If you want to set an initial state to the Grid, use a similar snippet, but in the [`OnStateInit event`](slug://grid-state#onstateinit)
 #end
 
 
diff --git a/_contentTemplates/inputs/inputs-width-template.md b/_contentTemplates/inputs/inputs-width-template.md
index 127b816add..879623aa08 100644
--- a/_contentTemplates/inputs/inputs-width-template.md
+++ b/_contentTemplates/inputs/inputs-width-template.md
@@ -1,3 +1,3 @@
 #inputs-width-information
-The default `Width` value is null, but the theme applies `100%`. Use the `Width` property or custom CSS to set another value [in any supported unit]({%slug common-features/dimensions%}).
+The default `Width` value is null, but the theme applies `100%`. Use the `Width` property or custom CSS to set another value [in any supported unit](slug://common-features/dimensions).
 #end
diff --git a/_contentTemplates/map/general.md b/_contentTemplates/map/general.md
index 6fdc791ffe..fa6c09dfe3 100644
--- a/_contentTemplates/map/general.md
+++ b/_contentTemplates/map/general.md
@@ -1,3 +1,3 @@
 #urltemplate-csp
-> The Map component provides two ways to define the `UrlTemplate` of tile layers and the `MapLayerMarkerSettings` `Template` of marker layers. See [Map Content Security Policy]({%slug components/map/overview%}#content-security-policy) for more information and comparison.
+> The Map component provides two ways to define the `UrlTemplate` of tile layers and the `MapLayerMarkerSettings` `Template` of marker layers. See [Map Content Security Policy](slug://components/map/overview#content-security-policy) for more information and comparison.
 #end
diff --git a/_contentTemplates/menu/basic-example.md b/_contentTemplates/menu/basic-example.md
index 964919ad37..a1b1567202 100644
--- a/_contentTemplates/menu/basic-example.md
+++ b/_contentTemplates/menu/basic-example.md
@@ -1,5 +1,5 @@
 #data-binding-basics-link
-Before continuing, make sure you are familiar with the [menu data binding basics]({%slug components/menu/data-binding/overview%}).
+Before continuing, make sure you are familiar with the [menu data binding basics](slug://components/menu/data-binding/overview).
 #end
 
 #has-children-behavior
@@ -7,5 +7,5 @@ If you set `HasChildren` to `false`, child items will not be rendered even if th
 #end
 
 #context-menudata-binding-basics-link
-Before continuing, make sure you are familiar with the [context menu data binding basics]({%slug contextmenu-data-binding-overview%}).
+Before continuing, make sure you are familiar with the [context menu data binding basics](slug://contextmenu-data-binding-overview).
 #end
diff --git a/_contentTemplates/slider/common.md b/_contentTemplates/slider/common.md
index 2679bd6e47..0ab6813246 100644
--- a/_contentTemplates/slider/common.md
+++ b/_contentTemplates/slider/common.md
@@ -2,7 +2,7 @@
 | Parameter    | Type  | Description |
 | ----------- | ----------- | -------|
 | `Class` | `string` | the CSS class that will be rendered on the main wrapping element of the slider.
-|`Width` | `stirng` | the width of the main element. In case you would like it to fit to a container you could set it to `100%` or other percent value depending on the application needs. You can read more in the [Dimensions]({%slug common-features/dimensions%}) article.
+|`Width` | `stirng` | the width of the main element. In case you would like it to fit to a container you could set it to `100%` or other percent value depending on the application needs. You can read more in the [Dimensions](slug://common-features/dimensions) article.
 #end
 
 #large-step
diff --git a/_contentTemplates/stockchart/chart-tooltip-context-templates.md b/_contentTemplates/stockchart/chart-tooltip-context-templates.md
index 8d10343b3e..39da98f061 100644
--- a/_contentTemplates/stockchart/chart-tooltip-context-templates.md
+++ b/_contentTemplates/stockchart/chart-tooltip-context-templates.md
@@ -1,7 +1,7 @@
 #context-parameter-information
 * `DataItem` - provides the data model of the current series item. You need to cast it to the type from your data source, which needs to be serializable.
-    * For [`OHLC`]({%slug stockchart-ohlc%}) and [`Candlestick`]({%slug stockchart-candlestick%}) chart types the `DataItem` will contain the information mapped to the `OpenField`, `CloseField`, `HighField` and `LowField` properties.
-    * For [`Line`]({%slug stockchart-line%}), [`Area`]({%slug stockchart-area%}) and [`Column`]({%slug stockchart-column%}) the `DataItem` will contain the information mapped to the `Field` properties.
+    * For [`OHLC`](slug://stockchart-ohlc) and [`Candlestick`](slug://stockchart-candlestick) chart types the `DataItem` will contain the information mapped to the `OpenField`, `CloseField`, `HighField` and `LowField` properties.
+    * For [`Line`](slug://stockchart-line), [`Area`](slug://stockchart-area) and [`Column`](slug://stockchart-column) the `DataItem` will contain the information mapped to the `Field` properties.
     * The `DataItem` will contain an aggregated value for the date, so in order to get it you can use the `Category` and parse it to `DateTime`.
 
 * `Category` - provides information on the category the data point is located in. Since the Stock Chart has a date X axis the `Category` should be cast to `DateTime`.
diff --git a/_contentTemplates/stockchart/link-to-basics.md b/_contentTemplates/stockchart/link-to-basics.md
index de669e1418..3ecf6dc54b 100644
--- a/_contentTemplates/stockchart/link-to-basics.md
+++ b/_contentTemplates/stockchart/link-to-basics.md
@@ -1,5 +1,5 @@
 #understand-basics-and-databinding-first
-This article assumes you are familiar with the [stock chart basics]({%slug stockchart-overview%}) and [data binding]({%slug stockchart-data-binding%}).
+This article assumes you are familiar with the [stock chart basics](slug://stockchart-overview) and [data binding](slug://stockchart-data-binding).
 #end
 
 
diff --git a/_contentTemplates/treelist/databinding.md b/_contentTemplates/treelist/databinding.md
index 0c75ff6fa4..d543e796e6 100644
--- a/_contentTemplates/treelist/databinding.md
+++ b/_contentTemplates/treelist/databinding.md
@@ -1,15 +1,15 @@
 #data-binding-modes
 
-* [Hierarchical data]({%slug treelist-data-binding-hierarchical-data%}) - separate collections of items and their child items. This is the default mode of the component. See the `Items` setting.
+* [Hierarchical data](slug://treelist-data-binding-hierarchical-data) - separate collections of items and their child items. This is the default mode of the component. See the `Items` setting.
 
-* [Flat data]({%slug treelist-data-binding-flat-data%}) - a single collection of items with defined parent-child relationships. See the `Id` and `ParentId` settings.
+* [Flat data](slug://treelist-data-binding-flat-data) - a single collection of items with defined parent-child relationships. See the `Id` and `ParentId` settings.
 
-In either mode, you can implement [Load on Demand]({%slug treelist-data-binding-load-on-demand%}) or lazy loading - that is, provide children to a node when it expands through an event. See the `HasChildren` setting and the `OnExpand` event.
+In either mode, you can implement [Load on Demand](slug://treelist-data-binding-load-on-demand) or lazy loading - that is, provide children to a node when it expands through an event. See the `HasChildren` setting and the `OnExpand` event.
 
-Finally, you can also [bind the TreeList to an interface]({%slug treelist-data-binding-interface%}), no matter if you are using flat data or hierarchical data.
+Finally, you can also [bind the TreeList to an interface](slug://treelist-data-binding-interface), no matter if you are using flat data or hierarchical data.
 #end
 
 
 #link-to-basics
-Before continuing, make sure you are familiar with the [treelist data binding basics]({%slug treelist-data-binding-overview%}).
+Before continuing, make sure you are familiar with the [treelist data binding basics](slug://treelist-data-binding-overview).
 #end
\ No newline at end of file
diff --git a/_contentTemplates/treelist/state.md b/_contentTemplates/treelist/state.md
index b1f599f180..257603ea19 100644
--- a/_contentTemplates/treelist/state.md
+++ b/_contentTemplates/treelist/state.md
@@ -1,5 +1,5 @@
 #initial-state
->tip If you want to set an initial state to the TreeList, use a similar snippet, but in the [`OnStateInit event`]({%slug treelist-state%}#set-default-initial-state)
+>tip If you want to set an initial state to the TreeList, use a similar snippet, but in the [`OnStateInit event`](slug://treelist-state#set-default-initial-state)
 #end
 
 
diff --git a/_contentTemplates/treeview/basic-example.md b/_contentTemplates/treeview/basic-example.md
index ccb5bdad90..1a25ae8a8a 100644
--- a/_contentTemplates/treeview/basic-example.md
+++ b/_contentTemplates/treeview/basic-example.md
@@ -100,6 +100,6 @@ Sample treeview bound to self-referencing flat data. Also uses the built-in icon
 #end
 
 #data-binding-basics-link
-Before continuing, make sure you are familiar with the [treeview data binding basics]({%slug components/treeview/data-binding/overview%}).
+Before continuing, make sure you are familiar with the [treeview data binding basics](slug://components/treeview/data-binding/overview).
 #end
 
diff --git a/_contentTemplates/upload/notes.md b/_contentTemplates/upload/notes.md
index 248071b86d..4266df3e49 100644
--- a/_contentTemplates/upload/notes.md
+++ b/_contentTemplates/upload/notes.md
@@ -15,7 +15,7 @@ The controller methods in this documentation do not implement security measures
 
 The FileSelect and Upload components are similar and even inter-changeable. The major difference is how they communicate with the server and this can determine which component to use.
 
-* The [**FileSelect**]({%slug fileselect-overview%}) is more suitable for **WebAssembly** apps if you want to receive and manipulate the file in the browser's .NET runtime. Uploading the file to a remote server is optional and depends on manual coding in the [`OnSelect` handler]({%slug fileselect-events%}#onselect). The benefit is that FileSelect allows full control over the upload process. In Blazor **Server** apps, the FileSelect uses the **SignalR WebSocket** and large file support (> 32KB) requires [`MaximumReceiveMessageSize` configuration]({%slug fileselect-overview%}#large-file-support).
-* The [**Upload**]({%slug upload-overview%}) uses the **HTTP protocol**. Prefer this component in Blazor **Server** and **WebAssembly** apps to directly send files to a remote endpoint, as HTTP is the usual way to do this. Large file support requires [different configurations]({%slug upload-overview%}#large-file-uploads), depending on the receiving web server.
+* The [**FileSelect**](slug://fileselect-overview) is more suitable for **WebAssembly** apps if you want to receive and manipulate the file in the browser's .NET runtime. Uploading the file to a remote server is optional and depends on manual coding in the [`OnSelect` handler](slug://fileselect-events#onselect). The benefit is that FileSelect allows full control over the upload process. In Blazor **Server** apps, the FileSelect uses the **SignalR WebSocket** and large file support (> 32KB) requires [`MaximumReceiveMessageSize` configuration](slug://fileselect-overview#large-file-support).
+* The [**Upload**](slug://upload-overview) uses the **HTTP protocol**. Prefer this component in Blazor **Server** and **WebAssembly** apps to directly send files to a remote endpoint, as HTTP is the usual way to do this. Large file support requires [different configurations](slug://upload-overview#large-file-uploads), depending on the receiving web server.
 
 #end
diff --git a/accessibility/compliance.md b/accessibility/compliance.md
index 8c764f8600..e6233f581a 100644
--- a/accessibility/compliance.md
+++ b/accessibility/compliance.md
@@ -23,9 +23,9 @@ The [Accessibility Conformance Report (ACR)](https://www.section508.gov/sell/acr
 
 The table below specifies the level of WCAG 2.2 compliance of each Telerik component for Blazor.
 
-* The *Keyboard Navigation* column links to component-specific online demos or keyboard shortcut lists. For general information on how the keyboard support works, see the [Keyboard Navigation]({%slug accessibility-overview%}#keyboard-navigation) section.
+* The *Keyboard Navigation* column links to component-specific online demos or keyboard shortcut lists. For general information on how the keyboard support works, see the [Keyboard Navigation](slug://accessibility-overview#keyboard-navigation) section.
 * The *Accessibility Documentation* column links to component-specific details and information about WAI-ARIA attributes.
-* For information about **Section 508** of the US Rehabilitation Act, the **European Accessibility Act** in the EU, or any other national accessibility legislation, see section [Legal and Technical Compliance]({%slug accessibility-overview%}#legal-and-technical-compliance).
+* For information about **Section 508** of the US Rehabilitation Act, the **European Accessibility Act** in the EU, or any other national accessibility legislation, see section [Legal and Technical Compliance](slug://accessibility-overview#legal-and-technical-compliance).
 
 Also check the [notes below the table](#accessibility-compliance-notes).
 
@@ -33,116 +33,116 @@ Also check the [notes below the table](#accessibility-compliance-notes).
 
 | Component | WCAG 2.2 | Keyboard Navigation | Accessibility Documentation |
 | --- | --- | --- | --- |
-| AIPrompt | AA | [Enhanced](https://demos.telerik.com/blazor-ui/aiprompt/overview) | [Documentation]({%slug aiprompt-wai-aria-support%}) |
+| AIPrompt | AA | [Enhanced](https://demos.telerik.com/blazor-ui/aiprompt/overview) | [Documentation](slug://aiprompt-wai-aria-support) |
 | AppBar | N/A | N/A | N/A |
 | ArcGauge | AA | N/A | N/A |
-| AutoComplete | AA | [Enhanced](https://demos.telerik.com/blazor-ui/autocomplete/keyboard-navigation) | [Documentation]({%slug autocomplete-wai-aria-support%}) |
+| AutoComplete | AA | [Enhanced](https://demos.telerik.com/blazor-ui/autocomplete/keyboard-navigation) | [Documentation](slug://autocomplete-wai-aria-support) |
 | Avatar | AA | N/A | N/A |
 | Badge | N/A | N/A | N/A |
 | Barcode | N/A | N/A | N/A |
-| Breadcrumb | AAA | [Enhanced](https://demos.telerik.com/blazor-ui/breadcrumb/keyboard-navigation) | [Documentation]({%slug breadcrumb-wai-aria-support%}) |
-| Button | AAA | [Standard](https://demos.telerik.com/blazor-ui/button/keyboard-navigation) | [Documentation]({%slug button-wai-aria-support%}) |
-| ButtonGroup | AAA | [Standard](https://demos.telerik.com/blazor-ui/buttongroup/keyboard-navigation) | [Documentation]({%slug buttongroup-wai-aria-support%}) |
-| Calendar | AAA | [Enhanced](https://demos.telerik.com/blazor-ui/calendar/keyboard-navigation) | [Documentation]({%slug calendar-wai-aria-support%}) |
-| Card | AA | N/A | [Documentation]({%slug card-wai-aria-support%}) |
-| Carousel | AA | [Enhanced](https://demos.telerik.com/blazor-ui/carousel/keyboard-navigation) | [Documentation]({%slug carousel-wai-aria-support%}) |
-| Chart | AA | [Enhanced](https://demos.telerik.com/blazor-ui/chart/keyboard-navigation) | [Documentation]({%slug chart-wai-aria-support %}) |
-| CheckBox | AA | [Standard](https://demos.telerik.com/blazor-ui/checkbox/overview) | [Documentation]({%slug checkbox-wai-aria-support%}) |
-| Chip | AA | [Enhanced](https://demos.telerik.com/blazor-ui/chip/keyboard-navigation) | [Documentation]({%slug chip-wai-aria-support%}) |
-| ChipList | AA | [Enhanced](https://demos.telerik.com/blazor-ui/chiplist/keyboard-navigation) | [Documentation]({%slug chiplist-wai-aria-support%}) |
-| ChunkProgressBar | AA | N/A | [Documentation]({%slug chunkprogressbar-wai-aria-support%}) |
+| Breadcrumb | AAA | [Enhanced](https://demos.telerik.com/blazor-ui/breadcrumb/keyboard-navigation) | [Documentation](slug://breadcrumb-wai-aria-support) |
+| Button | AAA | [Standard](https://demos.telerik.com/blazor-ui/button/keyboard-navigation) | [Documentation](slug://button-wai-aria-support) |
+| ButtonGroup | AAA | [Standard](https://demos.telerik.com/blazor-ui/buttongroup/keyboard-navigation) | [Documentation](slug://buttongroup-wai-aria-support) |
+| Calendar | AAA | [Enhanced](https://demos.telerik.com/blazor-ui/calendar/keyboard-navigation) | [Documentation](slug://calendar-wai-aria-support) |
+| Card | AA | N/A | [Documentation](slug://card-wai-aria-support) |
+| Carousel | AA | [Enhanced](https://demos.telerik.com/blazor-ui/carousel/keyboard-navigation) | [Documentation](slug://carousel-wai-aria-support) |
+| Chart | AA | [Enhanced](https://demos.telerik.com/blazor-ui/chart/keyboard-navigation) | [Documentation](slug://chart-wai-aria-support ) |
+| CheckBox | AA | [Standard](https://demos.telerik.com/blazor-ui/checkbox/overview) | [Documentation](slug://checkbox-wai-aria-support) |
+| Chip | AA | [Enhanced](https://demos.telerik.com/blazor-ui/chip/keyboard-navigation) | [Documentation](slug://chip-wai-aria-support) |
+| ChipList | AA | [Enhanced](https://demos.telerik.com/blazor-ui/chiplist/keyboard-navigation) | [Documentation](slug://chiplist-wai-aria-support) |
+| ChunkProgressBar | AA | N/A | [Documentation](slug://chunkprogressbar-wai-aria-support) |
 | CircularGauge | N/A | N/A | N/A |
-| ColorGradient | AA | [Enhanced](https://demos.telerik.com/blazor-ui/colorgradient/keyboard-navigation) | [Documentation]({%slug colorgradient-wai-aria-support%}) |
-| ColorPalette | AA | [Enhanced](https://demos.telerik.com/blazor-ui/colorpalette/keyboard-navigation) | [Documentation]({%slug colorpalette-wai-aria-support%}) |
-| ColorPicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/colorpicker/overview) <br /> Also see [ColorGradient](https://demos.telerik.com/blazor-ui/colorgradient/keyboard-navigation) and [ColorPalette](https://demos.telerik.com/blazor-ui/colorpalette/keyboard-navigation). | [Documentation]({%slug colorpicker-wai-aria-support%}) |
-| ComboBox | AA | [Enhanced](https://demos.telerik.com/blazor-ui/combobox/keyboard-navigation) | [Documentation]({%slug combobox-wai-aria-support%}) |
-| ContextMenu | AA | [Enhanced](https://demos.telerik.com/blazor-ui/contextmenu/keyboard-navigation) | [Documentation]({%slug contextmenu-wai-aria-support%}) |
-| DateInput | AA | [Enhanced](https://demos.telerik.com/blazor-ui/dateinput/keyboard-navigation) | [Documentation]({%slug dateinput-wai-aria-support%}) |
-| DatePicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/datepicker/keyboard-navigation) | [Documentation]({%slug datepicker-wai-aria-support%}) |
-| DateRangePicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/daterangepicker/keyboard-navigation) | [Documentation]({%slug daterangepicker-wai-aria-support%}) |
-| DateTimePicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/datetimepicker/keyboard-navigation) | [Documentation]({%slug datetimepicker-wai-aria-support%}) |
-| Dialog | AA | [Enhanced](https://demos.telerik.com/blazor-ui/drawer/keyboard-navigation) | [Documentation]({%slug dialog-wai-aria-support%}) |
-| Drawer | AA | [Enhanced](https://demos.telerik.com/blazor-ui/drawer/keyboard-navigation) | [Documentation]({%slug drawer-wai-aria-support%}) |
-| DropDownButton | AA | [Enhanced](https://demos.telerik.com/blazor-ui/dropdownbutton/keyboard-navigation) | [Documentation]({%slug dropdownbutton-wai-aria-support%}) |
-| DropDownList | AA | [Enhanced](https://demos.telerik.com/blazor-ui/dropdownlist/keyboard-navigation) | [Documentation]({%slug dropdownlist-wai-aria-support%}) |
+| ColorGradient | AA | [Enhanced](https://demos.telerik.com/blazor-ui/colorgradient/keyboard-navigation) | [Documentation](slug://colorgradient-wai-aria-support) |
+| ColorPalette | AA | [Enhanced](https://demos.telerik.com/blazor-ui/colorpalette/keyboard-navigation) | [Documentation](slug://colorpalette-wai-aria-support) |
+| ColorPicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/colorpicker/overview) <br /> Also see [ColorGradient](https://demos.telerik.com/blazor-ui/colorgradient/keyboard-navigation) and [ColorPalette](https://demos.telerik.com/blazor-ui/colorpalette/keyboard-navigation). | [Documentation](slug://colorpicker-wai-aria-support) |
+| ComboBox | AA | [Enhanced](https://demos.telerik.com/blazor-ui/combobox/keyboard-navigation) | [Documentation](slug://combobox-wai-aria-support) |
+| ContextMenu | AA | [Enhanced](https://demos.telerik.com/blazor-ui/contextmenu/keyboard-navigation) | [Documentation](slug://contextmenu-wai-aria-support) |
+| DateInput | AA | [Enhanced](https://demos.telerik.com/blazor-ui/dateinput/keyboard-navigation) | [Documentation](slug://dateinput-wai-aria-support) |
+| DatePicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/datepicker/keyboard-navigation) | [Documentation](slug://datepicker-wai-aria-support) |
+| DateRangePicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/daterangepicker/keyboard-navigation) | [Documentation](slug://daterangepicker-wai-aria-support) |
+| DateTimePicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/datetimepicker/keyboard-navigation) | [Documentation](slug://datetimepicker-wai-aria-support) |
+| Dialog | AA | [Enhanced](https://demos.telerik.com/blazor-ui/drawer/keyboard-navigation) | [Documentation](slug://dialog-wai-aria-support) |
+| Drawer | AA | [Enhanced](https://demos.telerik.com/blazor-ui/drawer/keyboard-navigation) | [Documentation](slug://drawer-wai-aria-support) |
+| DropDownButton | AA | [Enhanced](https://demos.telerik.com/blazor-ui/dropdownbutton/keyboard-navigation) | [Documentation](slug://dropdownbutton-wai-aria-support) |
+| DropDownList | AA | [Enhanced](https://demos.telerik.com/blazor-ui/dropdownlist/keyboard-navigation) | [Documentation](slug://dropdownlist-wai-aria-support) |
 | DropZone | N/A | N/A | N/A |
-| Editor | AA | [Enhanced](https://demos.telerik.com/blazor-ui/editor/keyboard-navigation) | [Documentation]({%slug editor-wai-aria-support%}) |
-| FileManager | AA |[Enhanced](https://demos.telerik.com/blazor-ui/filemanager/overview) <br /> Also see [Grid](https://demos.telerik.com/blazor-ui/grid/keyboard-navigation), [ListView](https://demos.telerik.com/blazor-ui/listview/keyboard-navigation), [Splitter](https://demos.telerik.com/blazor-ui/splitter/keyboard-navigation), [ToolBar](https://demos.telerik.com/blazor-ui/toolbar/keyboard-navigation), [TreeView](https://demos.telerik.com/blazor-ui/treeview/keyboard-navigation) | [Documentation]({%slug filemanager-wai-aria-support%}) |
+| Editor | AA | [Enhanced](https://demos.telerik.com/blazor-ui/editor/keyboard-navigation) | [Documentation](slug://editor-wai-aria-support) |
+| FileManager | AA |[Enhanced](https://demos.telerik.com/blazor-ui/filemanager/overview) <br /> Also see [Grid](https://demos.telerik.com/blazor-ui/grid/keyboard-navigation), [ListView](https://demos.telerik.com/blazor-ui/listview/keyboard-navigation), [Splitter](https://demos.telerik.com/blazor-ui/splitter/keyboard-navigation), [ToolBar](https://demos.telerik.com/blazor-ui/toolbar/keyboard-navigation), [TreeView](https://demos.telerik.com/blazor-ui/treeview/keyboard-navigation) | [Documentation](slug://filemanager-wai-aria-support) |
 | FileSelect | N/A | [Enhanced](https://demos.telerik.com/blazor-ui/fileselect/keyboard-navigation) | TBA |
-| Filter | AA | [Enhanced](https://demos.telerik.com/blazor-ui/filter/keyboard-navigation) | [Documentation]({%slug filter-wai-aria-support%}) |
-| FlatColorPicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/flatcolorpicker/overview) | [Documentation]({%slug flatcolorpicker-wai-aria-support%}) |
+| Filter | AA | [Enhanced](https://demos.telerik.com/blazor-ui/filter/keyboard-navigation) | [Documentation](slug://filter-wai-aria-support) |
+| FlatColorPicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/flatcolorpicker/overview) | [Documentation](slug://flatcolorpicker-wai-aria-support) |
 | FloatingLabel | N/A | N/A | N/A |
 | FontIcon | N/A | N/A | N/A |
-| Form | AA | [Standard](https://demos.telerik.com/blazor-ui/form/overview) | [Documentation]({%slug form-wai-aria-support%}) |
-| Gantt | AA | [Enhanced](https://demos.telerik.com/blazor-ui/gantt/keyboard-navigation) | [Documentation]({%slug gantt-wai-aria-support%}) |
-| Grid | AA | [Enhanced](https://demos.telerik.com/blazor-ui/grid/keyboard-navigation) | [Documentation]({%slug grid-wai-aria-support%}) |
+| Form | AA | [Standard](https://demos.telerik.com/blazor-ui/form/overview) | [Documentation](slug://form-wai-aria-support) |
+| Gantt | AA | [Enhanced](https://demos.telerik.com/blazor-ui/gantt/keyboard-navigation) | [Documentation](slug://gantt-wai-aria-support) |
+| Grid | AA | [Enhanced](https://demos.telerik.com/blazor-ui/grid/keyboard-navigation) | [Documentation](slug://grid-wai-aria-support) |
 | GridLayout | N/A | N/A | N/A |
 | LinearGauge | AA | N/A | N/A |
-| ListBox | AA | [Enhanced](https://demos.telerik.com/blazor-ui/listbox/keyboard-navigation) | [Documentation]({%slug listbox-wai-aria-support%}) |
-| ListView | AAA | [Enhanced](https://demos.telerik.com/blazor-ui/listview/keyboard-navigation) | [Documentation]({%slug listview-wai-aria-support%}) |
+| ListBox | AA | [Enhanced](https://demos.telerik.com/blazor-ui/listbox/keyboard-navigation) | [Documentation](slug://listbox-wai-aria-support) |
+| ListView | AAA | [Enhanced](https://demos.telerik.com/blazor-ui/listview/keyboard-navigation) | [Documentation](slug://listview-wai-aria-support) |
 | Loader | N/A | N/A | N/A |
 | LoaderContainer | N/A | N/A | N/A |
 | Map | N/A | [Enhanced](https://demos.telerik.com/blazor-ui/map/overview) | N/A |
-| MaskedTextbox | AA | [Standard](https://demos.telerik.com/blazor-ui/maskedtextbox/overview) | [Documentation]({%slug maskedtextbox-wai-aria-support%}) |
+| MaskedTextbox | AA | [Standard](https://demos.telerik.com/blazor-ui/maskedtextbox/overview) | [Documentation](slug://maskedtextbox-wai-aria-support) |
 | MediaQuery | N/A | N/A | N/A |
-| Menu | AA | [Enhanced](https://demos.telerik.com/blazor-ui/menu/keyboard-navigation) | [Documentation]({%slug menu-wai-aria-support%}) |
-| MultiColumnComboBox | N/A | [Enhanced](https://demos.telerik.com/blazor-ui/multicolumncombobox/keyboard-navigation) | [Documentation]({%slug multicolumncombobox-wai-aria-support%}) |
-| MultiSelect | AA | [Enhanced](https://demos.telerik.com/blazor-ui/multiselect/keyboard-navigation) | [Documentation]({%slug multiselect-wai-aria-support%}) |
-| Notification | AA | N/A | [Documentation]({%slug notification-wai-aria-support%}) |
-| NumericTextbox | AA | [Enhanced](https://demos.telerik.com/blazor-ui/numerictextbox/keyboard-navigation) | [Documentation]({%slug numerictextbox-wai-aria-support%}) |
-| Pager | AA | [Enhanced](https://demos.telerik.com/blazor-ui/pager/keyboard-navigation) | [Documentation]({%slug pager-wai-aria-support%}) |
-| PanelBar | AA | [Enhanced](https://demos.telerik.com/blazor-ui/panelbar/keyboard-navigation) | [Documentation]({%slug panelbar-wai-aria-support%}) |
-| PdfViewer | AA | [Enhanced](https://demos.telerik.com/blazor-ui/pdfviewer/overview) | [Documentation]({%slug pdfviewer-wai-aria-support%}) |
-| PivotGrid | AA | [Enhanced](https://demos.telerik.com/blazor-ui/pivotgrid/overview) | [Documentation]({%slug pivotgrid-wai-aria-support%}) |
-| ProgressBar | AA | N/A | [Documentation]({%slug progressbar-wai-aria-support%}) |
-| Popover | AA | [Standard](https://demos.telerik.com/blazor-ui/popover/overview) | [Documentation]({%slug popover-wai-aria-support%}) |
+| Menu | AA | [Enhanced](https://demos.telerik.com/blazor-ui/menu/keyboard-navigation) | [Documentation](slug://menu-wai-aria-support) |
+| MultiColumnComboBox | N/A | [Enhanced](https://demos.telerik.com/blazor-ui/multicolumncombobox/keyboard-navigation) | [Documentation](slug://multicolumncombobox-wai-aria-support) |
+| MultiSelect | AA | [Enhanced](https://demos.telerik.com/blazor-ui/multiselect/keyboard-navigation) | [Documentation](slug://multiselect-wai-aria-support) |
+| Notification | AA | N/A | [Documentation](slug://notification-wai-aria-support) |
+| NumericTextbox | AA | [Enhanced](https://demos.telerik.com/blazor-ui/numerictextbox/keyboard-navigation) | [Documentation](slug://numerictextbox-wai-aria-support) |
+| Pager | AA | [Enhanced](https://demos.telerik.com/blazor-ui/pager/keyboard-navigation) | [Documentation](slug://pager-wai-aria-support) |
+| PanelBar | AA | [Enhanced](https://demos.telerik.com/blazor-ui/panelbar/keyboard-navigation) | [Documentation](slug://panelbar-wai-aria-support) |
+| PdfViewer | AA | [Enhanced](https://demos.telerik.com/blazor-ui/pdfviewer/overview) | [Documentation](slug://pdfviewer-wai-aria-support) |
+| PivotGrid | AA | [Enhanced](https://demos.telerik.com/blazor-ui/pivotgrid/overview) | [Documentation](slug://pivotgrid-wai-aria-support) |
+| ProgressBar | AA | N/A | [Documentation](slug://progressbar-wai-aria-support) |
+| Popover | AA | [Standard](https://demos.telerik.com/blazor-ui/popover/overview) | [Documentation](slug://popover-wai-aria-support) |
 | Popup | AA | N/A | N/A |
 | QRCode | N/A | N/A | N/A |
 | RadialGauge | AA | N/A | N/A |
-| RadioGroup | AA | [Standard](https://demos.telerik.com/blazor-ui/radiogroup/keyboard-navigation) | [Documentation]({%slug radiogroup-wai-aria-support%}) |
-| RangeSlider | AA | [Enhanced](https://demos.telerik.com/blazor-ui/rangeslider/keyboard-navigation) | [Documentation]({%slug rangeslider-wai-aria-support%}) |
-| Rating | AA | [Enhanced](https://demos.telerik.com/blazor-ui/rating/keyboard-navigation) | [Documentation]({%slug rating-wai-aria-support%}) |
-| Sankey | AA | [Enhanced](https://demos.telerik.com/blazor-ui/sankey/overview) | [Documentation]({%slug sankey-wai-aria-support%}) |
-| Scheduler | AA | [Enhanced](https://demos.telerik.com/blazor-ui/scheduler/keyboard-navigation) | [Documentation]({%slug scheduler-wai-aria-support%}) |
-| Signature | AA | [Enhanced](https://demos.telerik.com/blazor-ui/signature/overview) | [Documentation]({%slug signature-wai-aria-support%}) |
-| Skeleton | AAA | N/A | [Documentation]({%slug skeleton-wai-aria-support%}) |
-| Slider | AA | [Enhanced](https://demos.telerik.com/blazor-ui/slider/keyboard-navigation) | [Documentation]({%slug slider-wai-aria-support%}) |
-| SplitButton | AA | [Enhanced](https://demos.telerik.com/blazor-ui/splitbutton/keyboard-navigation) | [Documentation]({%slug splitbutton-wai-aria-support%}) |
-| Splitter | AA | [Enhanced](https://demos.telerik.com/blazor-ui/splitter/keyboard-navigation) | [Documentation]({%slug splitter-wai-aria-support%}) |
-| Spreadsheet | AA | [Enhanced](https://demos.telerik.com/blazor-ui/spreadsheet/overview) | [Documentation]({%slug spreadsheet-wai-aria-support%}) |
+| RadioGroup | AA | [Standard](https://demos.telerik.com/blazor-ui/radiogroup/keyboard-navigation) | [Documentation](slug://radiogroup-wai-aria-support) |
+| RangeSlider | AA | [Enhanced](https://demos.telerik.com/blazor-ui/rangeslider/keyboard-navigation) | [Documentation](slug://rangeslider-wai-aria-support) |
+| Rating | AA | [Enhanced](https://demos.telerik.com/blazor-ui/rating/keyboard-navigation) | [Documentation](slug://rating-wai-aria-support) |
+| Sankey | AA | [Enhanced](https://demos.telerik.com/blazor-ui/sankey/overview) | [Documentation](slug://sankey-wai-aria-support) |
+| Scheduler | AA | [Enhanced](https://demos.telerik.com/blazor-ui/scheduler/keyboard-navigation) | [Documentation](slug://scheduler-wai-aria-support) |
+| Signature | AA | [Enhanced](https://demos.telerik.com/blazor-ui/signature/overview) | [Documentation](slug://signature-wai-aria-support) |
+| Skeleton | AAA | N/A | [Documentation](slug://skeleton-wai-aria-support) |
+| Slider | AA | [Enhanced](https://demos.telerik.com/blazor-ui/slider/keyboard-navigation) | [Documentation](slug://slider-wai-aria-support) |
+| SplitButton | AA | [Enhanced](https://demos.telerik.com/blazor-ui/splitbutton/keyboard-navigation) | [Documentation](slug://splitbutton-wai-aria-support) |
+| Splitter | AA | [Enhanced](https://demos.telerik.com/blazor-ui/splitter/keyboard-navigation) | [Documentation](slug://splitter-wai-aria-support) |
+| Spreadsheet | AA | [Enhanced](https://demos.telerik.com/blazor-ui/spreadsheet/overview) | [Documentation](slug://spreadsheet-wai-aria-support) |
 | StackLayout | N/A | N/A | N/A |
-| Stepper | AA | [Enhanced](https://demos.telerik.com/blazor-ui/stepper/keyboard-navigation) | [Documentation]({%slug stepper-wai-aria-support%}) |
+| Stepper | AA | [Enhanced](https://demos.telerik.com/blazor-ui/stepper/keyboard-navigation) | [Documentation](slug://stepper-wai-aria-support) |
 | StockChart | AA | [Enhanced](https://demos.telerik.com/blazor-ui/stockchart/overview) | N/A |
 | SvgIcon | N/A | N/A | N/A |
-| Switch | AA | [Enhanced](https://demos.telerik.com/blazor-ui/switch/keyboard-navigation) | [Documentation]({%slug switch-wai-aria-support%}) |
-| TabStrip | AA | [Enhanced](https://demos.telerik.com/blazor-ui/tabstrip/keyboard-navigation) | [Documentation]({%slug tabstrip-wai-aria-support%}) |
-| TextArea | AAA | [Standard](https://demos.telerik.com/blazor-ui/textarea/overview) | [Documentation]({%slug textarea-wai-aria-support%}) |
-| TextBox | AA | [Standard](https://demos.telerik.com/blazor-ui/textbox/overview) | [Documentation]({%slug textbox-wai-aria-support%}) |
-| TileLayout | AAA | [Enhanced](https://demos.telerik.com/blazor-ui/tilelayout/overview) | [Documentation]({%slug tilelayout-wai-aria-support%}) |
-| TimePicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/timepicker/keyboard-navigation) | [Documentation]({%slug timepicker-wai-aria-support%}) |
-| ToggleButton | AA | [Enhanced](https://demos.telerik.com/blazor-ui/togglebutton/keyboard-navigation) | [Documentation]({%slug togglebutton-wai-aria-support%}) |
-| ToolBar | AA | [Enhanced](https://demos.telerik.com/blazor-ui/toolbar/keyboard-navigation) | [Documentation]({%slug toolbar-wai-aria-support%}) |
-| Tooltip | AA | [Enhanced](https://demos.telerik.com/blazor-ui/tooltip/overview) | [Documentation]({%slug tooltip-wai-aria-support%}) |
-| TreeList | AA | [Enhanced](https://demos.telerik.com/blazor-ui/treelist/keyboard-navigation) | [Documentation]({%slug treelist-wai-aria-support%}) |
-| TreeView | AA | [Enhanced](https://demos.telerik.com/blazor-ui/treeview/keyboard-navigation) | [Documentation]({%slug treeview-wai-aria-support%}) |
-| Upload | AAA | [Enhanced](https://demos.telerik.com/blazor-ui/upload/keyboard-navigation) | [Documentation]({%slug upload-wai-aria-support%}) |
+| Switch | AA | [Enhanced](https://demos.telerik.com/blazor-ui/switch/keyboard-navigation) | [Documentation](slug://switch-wai-aria-support) |
+| TabStrip | AA | [Enhanced](https://demos.telerik.com/blazor-ui/tabstrip/keyboard-navigation) | [Documentation](slug://tabstrip-wai-aria-support) |
+| TextArea | AAA | [Standard](https://demos.telerik.com/blazor-ui/textarea/overview) | [Documentation](slug://textarea-wai-aria-support) |
+| TextBox | AA | [Standard](https://demos.telerik.com/blazor-ui/textbox/overview) | [Documentation](slug://textbox-wai-aria-support) |
+| TileLayout | AAA | [Enhanced](https://demos.telerik.com/blazor-ui/tilelayout/overview) | [Documentation](slug://tilelayout-wai-aria-support) |
+| TimePicker | AA | [Enhanced](https://demos.telerik.com/blazor-ui/timepicker/keyboard-navigation) | [Documentation](slug://timepicker-wai-aria-support) |
+| ToggleButton | AA | [Enhanced](https://demos.telerik.com/blazor-ui/togglebutton/keyboard-navigation) | [Documentation](slug://togglebutton-wai-aria-support) |
+| ToolBar | AA | [Enhanced](https://demos.telerik.com/blazor-ui/toolbar/keyboard-navigation) | [Documentation](slug://toolbar-wai-aria-support) |
+| Tooltip | AA | [Enhanced](https://demos.telerik.com/blazor-ui/tooltip/overview) | [Documentation](slug://tooltip-wai-aria-support) |
+| TreeList | AA | [Enhanced](https://demos.telerik.com/blazor-ui/treelist/keyboard-navigation) | [Documentation](slug://treelist-wai-aria-support) |
+| TreeView | AA | [Enhanced](https://demos.telerik.com/blazor-ui/treeview/keyboard-navigation) | [Documentation](slug://treeview-wai-aria-support) |
+| Upload | AAA | [Enhanced](https://demos.telerik.com/blazor-ui/upload/keyboard-navigation) | [Documentation](slug://upload-wai-aria-support) |
 | ValidationMessage | AA | N/A | TBA |
 | ValidationTooltip | AA | N/A | TBA |
 | ValidationSummary | AA | N/A | TBA |
-| Window | AA | [Enhanced](https://demos.telerik.com/blazor-ui/window/keyboard-navigation) | [Documentation]({%slug window-wai-aria-support%}) |
-| Wizard | AA | [Enhanced](https://demos.telerik.com/blazor-ui/wizard/keyboard-navigation) | [Documentation]({%slug wizard-wai-aria-support%}) |
+| Window | AA | [Enhanced](https://demos.telerik.com/blazor-ui/window/keyboard-navigation) | [Documentation](slug://window-wai-aria-support) |
+| Wizard | AA | [Enhanced](https://demos.telerik.com/blazor-ui/wizard/keyboard-navigation) | [Documentation](slug://wizard-wai-aria-support) |
 
 ## Accessibility Compliance Notes
 
 The information in the compliance table above is subject to the following considerations:
 
 * All components implement the required WAI-ARIA attributes without the need for any extra configuration. Some components may provide parameters that render additional optional WAI-ARIA attributes, for example, `aria-label` or `aria-describedby`.
-* The compliance levels are achievable with the [*Default Ocean Blue A11y* theme swatch]({%slug accessibility-overview%}#color-contrast) or any other [custom theme swatch]({%slug themes-customize%}) that provides the minimum required color contrast.
+* The compliance levels are achievable with the [*Default Ocean Blue A11y* theme swatch](slug://accessibility-overview#color-contrast) or any other [custom theme swatch](slug://themes-customize) that provides the minimum required color contrast.
 * The accessibility and compliance of some components may depend on the enabled features. In such cases, the compliance table information is based on the default component configuration.
 * Component templates introduce custom markup that may not be accessible. Test any modifications to ensure the web content still meets the desired level of accessibility compliance. Be mindful of components that work with user input such as images, text, or HTML content.
 * Due to the complexity of some components, there are scenarios that are not covered by the WAI-ARIA specification.
 
 ## See Also
 
-* [Accessibility Overview]({%slug accessibility-overview%})
-* [Globalization Overview]({%slug globalization-overview%})
+* [Accessibility Overview](slug://accessibility-overview)
+* [Globalization Overview](slug://globalization-overview)
diff --git a/accessibility/overview.md b/accessibility/overview.md
index cfda31df07..56ea8418c7 100644
--- a/accessibility/overview.md
+++ b/accessibility/overview.md
@@ -31,7 +31,7 @@ The national regulations normally share the following characteristics:
 * The legal requirements boil down to common technical standards such as a specific version of [WCAG](#web-context-accessibility-guidelines).
 * The national legislations are slower to adopt newer accessibility standards, compared to Telerik UI for Blazor.
 
-As a result, Telerik UI for Blazor does not review or aim to comply with specific national accessibility legislations. The components [target compliance with the latest official standard WCAG 2.2]({%slug accessibility-compliance%}#compliance-table), which is enough to claim compliance with national legal requirements.
+As a result, Telerik UI for Blazor does not review or aim to comply with specific national accessibility legislations. The components [target compliance with the latest official standard WCAG 2.2](slug://accessibility-compliance#compliance-table), which is enough to claim compliance with national legal requirements.
 
 From technical point of view, Telerik UI for Blazor achieves accessibility through the following features:
 
@@ -51,7 +51,7 @@ Telerik UI for Blazor targets <a href="https://www.w3.org/TR/WCAG22/" target="_b
 
 <a href="https://www.w3.org/WAI/standards-guidelines/aria/" target="_blank">WAI-ARIA</a> provides a framework for adding HTML attributes to identify features for user interaction, how they relate to each other, and their current state. The WAI-ARIA standard defines HTML element roles and states, which help with dynamic content and advanced user interface controls.
 
-Telerik UI for Blazor targets <a href="https://www.w3.org/TR/wai-aria/" target="_blank">WAI-ARIA version 1.2</a>. The [Compliance Table]({%slug accessibility-compliance%}#compliance-table) provides links to documentation articles, which describe the WAI-ARIA attributes of each applicable component.
+Telerik UI for Blazor targets <a href="https://www.w3.org/TR/wai-aria/" target="_blank">WAI-ARIA version 1.2</a>. The [Compliance Table](slug://accessibility-compliance#compliance-table) provides links to documentation articles, which describe the WAI-ARIA attributes of each applicable component.
 
 ## Keyboard Navigation
 
@@ -63,7 +63,7 @@ Most components represent a single tab stop. Once users reach and focus a compon
 
 ### Types of Keyboard Support
 
-The Telerik UI for Blazor components may provide enhanced, standard, or no keyboard support. See the [compliance table]({%slug accessibility-compliance%}#compliance-table) for component-specific information.
+The Telerik UI for Blazor components may provide enhanced, standard, or no keyboard support. See the [compliance table](slug://accessibility-compliance#compliance-table) for component-specific information.
 
 * *Standard keyboard support* implies similar keyboard navigation capabilities as standard HTML elements. For example, the Button components support `Enter` and `Space` for triggering clicks. All components with standard keyboard support are reachable through the `Tab` key and provide focus styles.
 * *Enhanced keyboard support* builds on top of the standard key combinations and provides additional built-in shortcuts for improved flexibility and user experience.
@@ -71,16 +71,16 @@ The Telerik UI for Blazor components may provide enhanced, standard, or no keybo
 
 ### Right-to-Left Support
 
-When using [right-to-left text direction]({%slug rtl-support%}), the keyboard shortcuts for the components remain unchanged. The left and right arrow keys reverse their behavior to be consistent with the RTL mode.
+When using [right-to-left text direction](slug://rtl-support), the keyboard shortcuts for the components remain unchanged. The left and right arrow keys reverse their behavior to be consistent with the RTL mode.
 
 ## Color Contrast
 
 WCAG sections <a href="https://www.w3.org/TR/WCAG22/#contrast-minimum" target="_blank">1.4.3 Contrast (Minimum)</a> and <a href="https://www.w3.org/TR/WCAG22/#contrast-enhanced" target="_blank">1.4.6 Contrast (Enhanced)</a> define contrast ratios for accessibility compliance. The built-in [*Default Ocean Blue A11y* theme swatch](https://www.telerik.com/design-system/docs/themes/kendo-themes/default/swatches/#ocean-blue-accessibility-swatch) in Telerik UI for Blazor conforms to WCAG Level AA, except success criterion <a href="https://www.w3.org/TR/WCAG22/#non-text-contrast" target="_blank">1.4.11 Non-text Contrast</a> in the ColorPalette component.
 
-You can [obtain and use the Default Ocean Blue A11y swatch]({%slug themes-overview%}#swatch) starting from the following component and theme versions:
+You can [obtain and use the Default Ocean Blue A11y swatch](slug://themes-overview#swatch) starting from the following component and theme versions:
 
 * [Telerik UI for Blazor version 4.0.1](https://www.telerik.com/support/whats-new/blazor-ui/release-history/ui-for-blazor-4-0-1)
-* [Themes version 6.0.3](https://github.com/telerik/kendo-themes/releases/tag/v6.0.3). Check section [Theme Version Compatibility]({%slug themes-overview%}#compatibility-and-maintenance) on how to align Telerik UI for Blazor versions with theme versions.
+* [Themes version 6.0.3](https://github.com/telerik/kendo-themes/releases/tag/v6.0.3). Check section [Theme Version Compatibility](slug://themes-overview#compatibility-and-maintenance) on how to align Telerik UI for Blazor versions with theme versions.
 
 ## Development Practices
 
@@ -114,5 +114,5 @@ Telerik UI for Blazor components are tested in the following environments:
 
 ## Next Steps
 
-* [Review Telerik UI for Blazor Accessibility Compliance Table]({%slug accessibility-compliance%}#compliance-table)
-* [Download Telerik UI for Blazor Accessibility Conformance Report (ACR)]({%slug accessibility-compliance%}#accessibility-conformance-report)
+* [Review Telerik UI for Blazor Accessibility Compliance Table](slug://accessibility-compliance#compliance-table)
+* [Download Telerik UI for Blazor Accessibility Conformance Report (ACR)](slug://accessibility-compliance#accessibility-conformance-report)
diff --git a/common-features/adaptive-rendering.md b/common-features/adaptive-rendering.md
index 3ea5066f0e..c8e96b8cdd 100644
--- a/common-features/adaptive-rendering.md
+++ b/common-features/adaptive-rendering.md
@@ -24,16 +24,16 @@ Telerik UI for Blazor supports adaptive rendering for the components that incorp
 
 The adaptive rendering functionality is supported by the following components:
 
-* [AutoComplete]({%slug autocomplete-overview%})
-* [ComboBox]({%slug components/combobox/overview%})
-* [ColorPicker]({%slug colorpicker-overview%})
-* [DatePicker]({%slug components/datepicker/overview%})
-* [DateRangePicker]({%slug daterangepicker-overview%})
-* [DateTimePicker]({%slug components/datetimepicker/overview%})
-* [DropDownList]({%slug components/dropdownlist/overview%})
-* [MultiColumnComboBox]({%slug multicolumncombobox-overview%})
-* [MultiSelect]({%slug multiselect-overview%})
-* [TimePicker]({%slug components/timepicker/overview%})
+* [AutoComplete](slug://autocomplete-overview)
+* [ColorPicker](slug://colorpicker-overview)
+* [ComboBox](slug://components/combobox/overview)
+* [DatePicker](slug://components/datepicker/overview)
+* [DateRangePicker](slug://daterangepicker-overview)
+* [DateTimePicker](slug://components/datetimepicker/overview)
+* [DropDownList](slug://components/dropdownlist/overview)
+* [MultiColumnComboBox](slug://multicolumncombobox-overview)
+* [MultiSelect](slug://multiselect-overview)
+* [TimePicker](slug://components/timepicker/overview)
 
 ## Basics
 
@@ -103,7 +103,7 @@ You can customize the [above-listed default adaptive breakpoints](#rendering-spe
 
 ## Limitations
 
-Some of the [supported components](#supported-components) allow custom values, for example, [ComboBox]({%slug components/combobox/custom-value%}) and [MultiColumnComboBox]({%slug multicolumncombobox-custom-value%}). Using custom values with `AdaptiveMode.Auto` is currently not supported. To expedite the development of this feature, vote for the related feature request in the Blazor Feedback Portal: [Support for custom values in `AdaptiveMode`](https://feedback.telerik.com/blazor/1611829-support-for-custom-values-in-adaptivemode).
+Some of the [supported components](#supported-components) allow custom values, for example, [ComboBox](slug://components/combobox/custom-value) and [MultiColumnComboBox](slug://multicolumncombobox-custom-value). Using custom values with `AdaptiveMode.Auto` is currently not supported. To expedite the development of this feature, vote for the related feature request in the Blazor Feedback Portal: [Support for custom values in `AdaptiveMode`](https://feedback.telerik.com/blazor/1611829-support-for-custom-values-in-adaptivemode).
 
 ## See also
 
diff --git a/common-features/cdn.md b/common-features/cdn.md
index 7d1e6a9212..80eec5d18b 100644
--- a/common-features/cdn.md
+++ b/common-features/cdn.md
@@ -20,10 +20,10 @@ The CDN hosts two kinds of static client assets for the Telerik UI for Blazor co
 
 ## CSS Theme URLs
 
-The [Telerik CSS themes]({%slug themes-overview%}) are available on two CDN hosts:
+The [Telerik CSS themes](slug://themes-overview) are available on two CDN hosts:
 
-* `unpkg.com` provides [all built-in theme swatches]({%slug themes-overview%}#swatch). The version number in the theme URL matches the version of the theme itself. Make sure to [use compatible theme and component versions]({%slug themes-overview%}#compatibility-and-maintenance). For example, use theme version `{{site.themesVersion}}` with UI for Blazor version `{{site.uiForBlazorLatestVersion}}`.
-* `blazor.cdn.telerik.com` provides a limited set of popular [theme swatches]({%slug themes-overview%}#basics). The version number in the theme URL matches the version of the Telerik UI for Blazor components, for example, `{{site.uiForBlazorLatestVersion}}`.
+* `unpkg.com` provides [all built-in theme swatches](slug://themes-overview#swatch). The version number in the theme URL matches the version of the theme itself. Make sure to [use compatible theme and component versions](slug://themes-overview#compatibility-and-maintenance). For example, use theme version `{{site.themesVersion}}` with UI for Blazor version `{{site.uiForBlazorLatestVersion}}`.
+* `blazor.cdn.telerik.com` provides a limited set of popular [theme swatches](slug://themes-overview#basics). The version number in the theme URL matches the version of the Telerik UI for Blazor components, for example, `{{site.uiForBlazorLatestVersion}}`.
 
 ### UNPKG CDN
 
@@ -31,7 +31,7 @@ The CSS file URLs on `unpkg.com` look like this:
 
 <code>unpkg.com/@progress/kendo-theme-**&lt;THEME-NAME&gt;**@**&lt;THEME-VERSION&gt;**/dist/**&lt;SWATCH-NAME&gt;**.css</code>
 
-The separate [font icons]({%slug common-features-icons%}) stylesheet URL looks like this:
+The separate [font icons](slug://common-features-icons) stylesheet URL looks like this:
 
 <code>unpkg.com/@progress/kendo-font-icons@**&lt;PACKAGE-VERSION&gt;**/dist/index.css</code>
 
@@ -58,7 +58,7 @@ The CSS file URLs on `blazor.cdn.telerik.com` look like this:
 
 <code>blazor.cdn.telerik.com/blazor/**&lt;COMPONENT-VERSION&gt;**/kendo-theme-**&lt;THEME-NAME&gt;**/swatches/**&lt;THEME-NAME&gt;**-**&lt;SWATCH-NAME&gt;**.css</code>
 
-The separate [font icons]({%slug common-features-icons%}) stylesheet URL looks like this:
+The separate [font icons](slug://common-features-icons) stylesheet URL looks like this:
 
 <code>blazor.cdn.telerik.com/blazor/**&lt;COMPONENT-VERSION&gt;**/kendo-font-icons/font-icons.css</code>
 
@@ -82,7 +82,7 @@ Here are a few examples:
 
 ## JavaScript URLs
 
-The CDN hosts the [JavaScript (JSInterop) file of Telerik UI for Blazor]({%slug getting-started/what-you-need%}#javascript-file). The file URL looks like this:
+The CDN hosts the [JavaScript (JSInterop) file of Telerik UI for Blazor](slug://getting-started/what-you-need#javascript-file). The file URL looks like this:
 
 <code>blazor.cdn.telerik.com/blazor/**&lt;COMPONENT-VERSION&gt;**/telerik-blazor.min.js</code>
 
@@ -94,7 +94,7 @@ The CDN hosts the [JavaScript (JSInterop) file of Telerik UI for Blazor]({%slug
 <script src="https://blazor.cdn.telerik.com/blazor/{{site.uiForBlazorLatestVersion}}/telerik-blazor.min.js"></script>
 ````
 
-> When using the `telerik-blazor.js` file from CDN and with a `defer` attribute, [start the client-side Blazor framework manually]({%slug getting-started/what-you-need%}#javascript-file).
+> When using the `telerik-blazor.js` file from CDN and with a `defer` attribute, [start the client-side Blazor framework manually](slug://getting-started/what-you-need#javascript-file).
 
 
 ## Pros and Cons of Using CDN
@@ -102,19 +102,19 @@ The CDN hosts the [JavaScript (JSInterop) file of Telerik UI for Blazor]({%slug
 The benefits of using a CDN in Blazor apps are:
 
 * Possible performance gains in the application loading time. Blazor apps are single page applications and browsers rely on cache by default, so this benefit is marginal and relates only to users that open the application for the first time.
-* Avoidance of [browser caching issues after component version upgrades]({%slug common-kb-browser-cache-buster%}). The CSS and JS files change with every component version, and so do the CDN URLs. This URL change guarantees that browsers will reload the static assets.
+* Avoidance of [browser caching issues after component version upgrades](slug://common-kb-browser-cache-buster). The CSS and JS files change with every component version, and so do the CDN URLs. This URL change guarantees that browsers will reload the static assets.
 
 The drawbacks of using a CDN are:
 
-* Additional [component version upgrade steps]({%slug upgrade-tutorial%}). You must change the version number in the URL, otherwise the application can display broken UI or throw [JavaScript errors]({%slug troubleshooting-js-errors%}).
-* A CDN is a critical external dependency for your app. Regardless of the claimed uptime, you must [implement a CDN fallback]({%slug common-kb-cdn-fallback%}) for cases when the CDN is not accessible to your users due to geographical, networking or system issues.
+* Additional [component version upgrade steps](slug://upgrade-tutorial). You must change the version number in the URL, otherwise the application can display broken UI or throw [JavaScript errors](slug://troubleshooting-js-errors).
+* A CDN is a critical external dependency for your app. Regardless of the claimed uptime, you must [implement a CDN fallback](slug://common-kb-cdn-fallback) for cases when the CDN is not accessible to your users due to geographical, networking or system issues.
 
 
 ## Next Steps
 
-* [Implement CDN Fallback]({%slug common-kb-cdn-fallback%})
+* [Implement CDN Fallback](slug://common-kb-cdn-fallback)
 
 
 ## See also
 
-* [Implement CDN Fallback]({%slug common-kb-cdn-fallback%})
+* [Implement CDN Fallback](slug://common-kb-cdn-fallback)
diff --git a/common-features/data-binding/cloud-services.md b/common-features/data-binding/cloud-services.md
index de14435860..76a425f058 100644
--- a/common-features/data-binding/cloud-services.md
+++ b/common-features/data-binding/cloud-services.md
@@ -12,7 +12,7 @@ position: 30
 
 This article suggests options for data binding the Telerik Blazor components to cloud data services. Applicable scenarios may include serverless Blazor apps, or any web apps that use cloud data. The article provides an overview of a series of posts on the [Telerik Blazor blog](https://www.telerik.com/blogs/web-blazor) and links to specific points of interest.
 
->tip [Telerik Blazor components are datasource-agnostic]({%slug common-features-data-binding-overview%}#how-to-provide-data). The data-binding integrations below are not subject to technical support.
+>tip [Telerik Blazor components are datasource-agnostic](slug://common-features-data-binding-overview#how-to-provide-data). The data-binding integrations below are not subject to technical support.
 
 This article contains the following sections, which map to blog posts from the series:
 
diff --git a/common-features/data-binding/descriptors.md b/common-features/data-binding/descriptors.md
index 7505abd354..c8390f886a 100644
--- a/common-features/data-binding/descriptors.md
+++ b/common-features/data-binding/descriptors.md
@@ -13,10 +13,10 @@ position: 10
 
 This article explains how to retrieve the applied filtering, searching, sorting, and grouping criteria in Blazor components. The article applies to components that support these features. The components that offer one or all of the functionalities are:
 
-* Components that [expose an `OnRead` event]({%slug common-features-data-binding-onread%}#components-with-onread-event), excluding the [ListView]({%slug listview-overview%}), because the ListView doesn't support built-in filtering, searching, sorting, and grouping.
-* [Filter]({%slug filter-overview%})
-* [Gantt]({%slug gantt-overview%})
-* [TreeList]({%slug treelist-overview%})
+* Components that [expose an `OnRead` event](slug://common-features-data-binding-onread#components-with-onread-event), excluding the [ListView](slug://listview-overview), because the ListView doesn't support built-in filtering, searching, sorting, and grouping.
+* [Filter](slug://filter-overview)
+* [Gantt](slug://gantt-overview)
+* [TreeList](slug://treelist-overview)
 
 ## Get Sort, Filter, Group, and Search Descriptors
 
@@ -27,7 +27,7 @@ You can obtain the applied filtering, searching, sorting, and grouping criteria
 
 ### Through the OnRead Event
 
-Use the [`Request` property]({%slug common-features-data-binding-onread%}#event-argument) of the [`OnRead` event argument object](/blazor-ui/api/Telerik.Blazor.Components.ReadEventArgs):
+Use the [`Request` property](slug://common-features-data-binding-onread#event-argument) of the [`OnRead` event argument object](/blazor-ui/api/Telerik.Blazor.Components.ReadEventArgs):
 
 <div class="skip-repl"></div>
 
@@ -335,13 +335,13 @@ You can obtain the FilterDescriptor, SearchFilter, SortDescriptor, and GroupDesc
 
 ## See Also
 
-* [AutoComplete OnRead Event]({%slug autocomplete-events%}#onread)
-* [ComboBox OnRead Event]({%slug components/combobox/events%}#onread)
-* [DropDownList OnRead Event]({%slug components/dropdownlist/events%}#onread)
-* [Filter Overview]({%slug filter-overview%})
-* [Gantt State]({%slug gantt-state%})
-* [Grid OnRead Event]({%slug components/grid/manual-operations%})
-* [Grid State]({%slug grid-state%})
-* [MultiColumnComboBox OnRead Event]({%slug multicolumncombobox-events%}#onread)
-* [MultiSelect OnRead Event]({%slug multiselect-events%}#onread)
-* [TreeList State]({%slug treelist-state%})
\ No newline at end of file
+* [AutoComplete OnRead Event](slug://autocomplete-events#onread)
+* [ComboBox OnRead Event](slug://components/combobox/events#onread)
+* [DropDownList OnRead Event](slug://components/dropdownlist/events#onread)
+* [Filter Overview](slug://filter-overview)
+* [Gantt State](slug://gantt-state)
+* [Grid OnRead Event](slug://components/grid/manual-operations)
+* [Grid State](slug://grid-state)
+* [MultiColumnComboBox OnRead Event](slug://multicolumncombobox-events#onread)
+* [MultiSelect OnRead Event](slug://multiselect-events#onread)
+* [TreeList State](slug://treelist-state)
\ No newline at end of file
diff --git a/common-features/data-binding/observable-data.md b/common-features/data-binding/observable-data.md
index 68f57d2a02..420a9c4e95 100644
--- a/common-features/data-binding/observable-data.md
+++ b/common-features/data-binding/observable-data.md
@@ -32,34 +32,34 @@ In this article:
 
 The following components support observable data for their `Data` parameter. Note that observable data is not supported with manual data binding via the `OnRead` event.
 
-* [AutoComplete]({%slug autocomplete-refresh-data%})
+* [AutoComplete](slug://autocomplete-refresh-data)
 
-* [Carousel]({%slug carousel-refresh-data%})
+* [Carousel](slug://carousel-refresh-data)
 
-* [ComboBox]({%slug combobox-refresh-data%})
+* [ComboBox](slug://combobox-refresh-data)
 
-* [DropDownList]({%slug dropdownlist-refresh-data%})
+* [DropDownList](slug://dropdownlist-refresh-data)
 
-* [Grid documentation]({%slug grid-refresh-data%}), [live demo](https://demos.telerik.com/blazor-ui/grid/observable-data)
+* [Grid documentation](slug://grid-refresh-data), [live demo](https://demos.telerik.com/blazor-ui/grid/observable-data)
 
-* [ListView]({%slug listview-refresh-data%})
+* [ListView](slug://listview-refresh-data)
 
-* [MultiSelect]({%slug multiselect-refresh-data%})
+* [MultiSelect](slug://multiselect-refresh-data)
 
-* [TreeList]({%slug treelist-refresh-data%})
+* [TreeList](slug://treelist-refresh-data)
 
-* [TreeView]({%slug treeview-refresh-data%})
+* [TreeView](slug://treeview-refresh-data)
 
 
 You can refresh other components that do not support observable data by creating a [New collection reference](#refresh-data).
 
-* [Scheduler]({%slug scheduler-refresh-data%})
+* [Scheduler](slug://scheduler-refresh-data)
 
-* [Menu]({%slug menu-refresh-data%})
+* [Menu](slug://menu-refresh-data)
 
-* [Drawer]({%slug drawer-refresh-data%})
+* [Drawer](slug://drawer-refresh-data)
 
-* [ContextMenu]({%slug context-menu-refresh-data%})
+* [ContextMenu](slug://context-menu-refresh-data)
 
 
 ## See Also
diff --git a/common-features/data-binding/onread.md b/common-features/data-binding/onread.md
index 4d42293bf3..c34af710b9 100644
--- a/common-features/data-binding/onread.md
+++ b/common-features/data-binding/onread.md
@@ -36,12 +36,12 @@ Large amounts of data require loading in chunks and on demand. This improves the
 
 `OnRead` allows full control over the data operations. For example, it is possible to use custom sorting and filtering algorithms, if the built-in ones do not fit a given scenario. Here are just a few examples, but there are many more possible scenarios:
 
-* [Search by multiple data fields in ComboBox and DropDownList]({%slug dropdowns-kb-search-in-multiple-fields%})
-* [Search in hidden Grid columns]({%slug grid-kb-search-in-hidden-fields%})
-* [Debounce Grid data requests]({%slug grid-kb-debounce-operations%})
-* [Debounce ComboBox filter requests]({%slug combo-kb-debounce-onread%})
+* [Search by multiple data fields in ComboBox and DropDownList](slug://dropdowns-kb-search-in-multiple-fields)
+* [Search in hidden Grid columns](slug://grid-kb-search-in-hidden-fields)
+* [Debounce Grid data requests](slug://grid-kb-debounce-operations)
+* [Debounce ComboBox filter requests](slug://combo-kb-debounce-onread)
 
-`OnRead` enables [data binding to **OData** services]({%slug common-kb-odata%}).
+`OnRead` enables [data binding to **OData** services](slug://common-kb-odata).
 
 `OnRead` also allows the application to know the exact data items, which the user is currently seeing.
 
@@ -54,15 +54,15 @@ Each component name points to component-specific `OnRead` documentation and exam
 
 | Component | Supports Paging | Supports Virtualization |
 | --- | --- | --- |
-| [AutoComplete]({%slug autocomplete-events%}#onread) | - | [AutoComplete virtualization]({%slug autocomplete-virtualization%}) |
-| [ComboBox]({%slug components/combobox/events%}#onread) | - | [ComboBox virtualization]({%slug combobox-virtualization%}) |
-| [DropDownList]({%slug components/dropdownlist/events%}#onread) | - | [DropDownList virtualization]({%slug dropdownlist-virtualization%}) |
-| [Grid]({%slug components/grid/manual-operations%}) | [Grid paging]({%slug components/grid/features/paging%}) | [Grid row virtualization]({%slug components/grid/virtual-scrolling%}) |
-| [ListView]({%slug listview-manual-operations%}) | [ListView paging]({%slug listview-paging%}) | - |
-| [MultiColumnComboBox]({%slug multicolumncombobox-events%}#onread) | - | [MultiColumnComboBox virtualization]({%slug multicolumncombobox-virtualization%}) |
-| [MultiSelect]({%slug multiselect-events%}#onread) | - | [MultiSelect virtualization]({%slug multiselect-virtualization%}) |
+| [AutoComplete](slug://autocomplete-events#onread) | - | [AutoComplete virtualization](slug://autocomplete-virtualization) |
+| [ComboBox](slug://components/combobox/events#onread) | - | [ComboBox virtualization](slug://combobox-virtualization) |
+| [DropDownList](slug://components/dropdownlist/events#onread) | - | [DropDownList virtualization](slug://dropdownlist-virtualization) |
+| [Grid](slug://components/grid/manual-operations) | [Grid paging](slug://components/grid/features/paging) | [Grid row virtualization](slug://components/grid/virtual-scrolling) |
+| [ListView](slug://listview-manual-operations) | [ListView paging](slug://listview-paging) | - |
+| [MultiColumnComboBox](slug://multicolumncombobox-events#onread) | - | [MultiColumnComboBox virtualization](slug://multicolumncombobox-virtualization) |
+| [MultiSelect](slug://multiselect-events#onread) | - | [MultiSelect virtualization](slug://multiselect-virtualization) |
 
-Components like the [**TreeList**]({%slug treelist-data-binding-load-on-demand%}) and the [**TreeView**]({%slug components/treeview/data-binding/load-on-demand%}) don't have an `OnRead` event. Instead, they load data on demand via `OnExpand` events.
+Components like the [**TreeList**](slug://treelist-data-binding-load-on-demand) and the [**TreeView**](slug://components/treeview/data-binding/load-on-demand) don't have an `OnRead` event. Instead, they load data on demand via `OnExpand` events.
 
 
 ## Event Argument
@@ -213,7 +213,7 @@ The components fire an `OnRead` event when the user performs an action, such as
 
 All components with an `OnRead` event have a `Rebind` method as well. To refresh the component data programmatically, call this method. It will force the component to fire `OnRead` and receive new data.
 
-Also check [how to rebind and refresh a component with a `Timer`]({%slug common-kb-rebind-timer%}).
+Also check [how to rebind and refresh a component with a `Timer`](slug://common-kb-rebind-timer).
 
 >caption Rebind DropDownList and Grid when using OnRead
 
@@ -316,5 +316,5 @@ Also check [how to rebind and refresh a component with a `Timer`]({%slug common-
 
 ## See Also
 
-* [Using the Grid with OnRead]({%slug components/grid/manual-operations%})
-* [Data Binding to cloud services]({%slug common-features-data-binding-cloud%})
+* [Using the Grid with OnRead](slug://components/grid/manual-operations)
+* [Data Binding to cloud services](slug://common-features-data-binding-cloud)
diff --git a/common-features/data-binding/overview.md b/common-features/data-binding/overview.md
index be48c7d554..d246f681c4 100644
--- a/common-features/data-binding/overview.md
+++ b/common-features/data-binding/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Data Binding Overview
 
-This article describes the fundamentals of data binding the Telerik Blazor components. For the sake of clarity, also check article [Value Binding vs Data Binding]({%slug get-started-value-vs-data-binding%}).
+This article describes the fundamentals of data binding the Telerik Blazor components. For the sake of clarity, also check article [Value Binding vs Data Binding](slug://get-started-value-vs-data-binding).
 
 * [Data binding options](#how-to-provide-data)
 * [Supported data types](#data-type)
@@ -25,7 +25,7 @@ The Telerik Blazor components are detached from the application's data layer. Th
 There are two main ways to provide data to the components:
 
 * `Data` parameter - use it to provide all the data at once.
-* [`OnRead` event]({%slug common-features-data-binding-onread%}) - use it to load data on demand in chunks. 
+* [`OnRead` event](slug://common-features-data-binding-onread) - use it to load data on demand in chunks. 
 
 Hierarchy components like the TreeList and the TreeView don't have an `OnRead` event. Instead, they load data on demand via `OnExpand` events.
 
@@ -95,11 +95,11 @@ Some components handle properties with specific names in a predefined way. For e
 
 There are three ways to refresh the component data:
 
-* [Bind the component to Observable data]({%slug common-features-observable-data%}). **This option applies only** if the `Data` parameter is set. The component will refresh automatically when items are **added or removed**.
-* Call the component's `Rebind()` method. UI for Blazor version **3.3.0** exposed `Rebind()` for all databound components. Until then, the method was available only for the [components that have an `OnRead` event]({%slug common-features-data-binding-onread%}#components-with-onread-event). If the component is databound via `OnRead`, the [`Rebind()` method will fire the `OnRead` event]({%slug common-features-data-binding-onread%}#refresh-data).
+* [Bind the component to Observable data](slug://common-features-observable-data). **This option applies only** if the `Data` parameter is set. The component will refresh automatically when items are **added or removed**.
+* Call the component's `Rebind()` method. UI for Blazor version **3.3.0** exposed `Rebind()` for all databound components. Until then, the method was available only for the [components that have an `OnRead` event](slug://common-features-data-binding-onread#components-with-onread-event). If the component is databound via `OnRead`, the [`Rebind()` method will fire the `OnRead` event](slug://common-features-data-binding-onread#refresh-data).
 * Reset the `Data` parameter reference. Sometimes, you may also need to call `StateHasChanged()` - for example, if the refreshing occurs in `OnAfterRenderAsync`.
 
-The [example below](#example) demonstrates the second and third option. Also check [how to rebind and refresh a component with a `Timer`]({%slug common-kb-rebind-timer%}).
+The [example below](#example) demonstrates the second and third option. Also check [how to rebind and refresh a component with a `Timer`](slug://common-kb-rebind-timer).
 
 ### Reset the Collection Reference
 
@@ -176,6 +176,6 @@ Thus, you will usually need to create a new reference for `Data` value in order
 
 ## Next Steps
 
-* [Data Binding with the OnRead event]({%slug common-features-data-binding-onread%})
-* [Data Binding to Observable Data]({%slug common-features-observable-data%})
-* [Data Binding to cloud data services]({%slug common-features-data-binding-cloud%})
+* [Data Binding with the OnRead event](slug://common-features-data-binding-onread)
+* [Data Binding to Observable Data](slug://common-features-observable-data)
+* [Data Binding to cloud data services](slug://common-features-data-binding-cloud)
diff --git a/common-features/data-binding/telerik-datasource-package.md b/common-features/data-binding/telerik-datasource-package.md
index 8713063727..c11c3426ee 100644
--- a/common-features/data-binding/telerik-datasource-package.md
+++ b/common-features/data-binding/telerik-datasource-package.md
@@ -25,7 +25,7 @@ In this article:
 
 ## Basics
 
-The `Telerik.DataSource` package is distributed through the [Telerik NuGet package source]({%slug installation/nuget%}) and is available to both trial and commercial licenses. It is also available as a resource in the [offline installer]({%slug installation/msi%}) and [resources archive]({%slug installation/zip%}) of Telerik UI for Blazor and some other Telerik suites, such as UI for ASP.NET Core.
+The `Telerik.DataSource` package is distributed through the [Telerik NuGet package source](slug://installation/nuget) and is available to both trial and commercial licenses. It is also available as a resource in the [offline installer](slug://installation/msi) and [resources archive](slug://installation/zip) of Telerik UI for Blazor and some other Telerik suites, such as UI for ASP.NET Core.
 
 The `Telerik.DataSource` package targets `netstandard2.1`.
 
@@ -41,7 +41,7 @@ The following classes and extension methods are the key components to the packag
 
     * The `ToDataSourceResult` method generates a LINQ expressions based on the `DataSourceRequest` and passes them to the `IQueryable.Provider`. It is up to the provider (collection) to resolve it and execute it against the database (for example, an `IQueryable` coming from an EntityFrameworkCore context will create and run an SQL query for you).
 
-* [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) - the class that describes the request for data - what page index, page size, filters and sorts, groups and aggregates are required by the client. You can receive it from Telerik components (such as the [Blazor grid in its manual data operations mode]({%slug components/grid/manual-operations%})), or over the wire and deserialize it (such as for requests coming from widgets like the [UI for ASP.NET Core Grid with remote data](https://demos.telerik.com/aspnet-core/grid/remote-data-binding)). You can even create a `new` instance of the object and populate its fields according to some other business logic (like an OData query string or some other case). This object is in the `Telerik.DataSource` namespace.
+* [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) - the class that describes the request for data - what page index, page size, filters and sorts, groups and aggregates are required by the client. You can receive it from Telerik components (such as the [Blazor grid in its manual data operations mode](slug://components/grid/manual-operations)), or over the wire and deserialize it (such as for requests coming from widgets like the [UI for ASP.NET Core Grid with remote data](https://demos.telerik.com/aspnet-core/grid/remote-data-binding)). You can even create a `new` instance of the object and populate its fields according to some other business logic (like an OData query string or some other case). This object is in the `Telerik.DataSource` namespace.
 
     * When you receive such an object from a Telerik component, you can iterate over the information it provides and implement you own data source operations, you are not obliged to use the `ToDataSourceResult` method (but it helps shape the data accordingly, so you may want to examine its `DataSourceResult` from a simple run to see what it contains).
 
diff --git a/common-features/dimensions.md b/common-features/dimensions.md
index 6aa35438f9..9762d134eb 100644
--- a/common-features/dimensions.md
+++ b/common-features/dimensions.md
@@ -28,7 +28,7 @@ When setting percentage dimensions to elements with special positioning (such as
 
 ## Position
 
-When using positioning parameters, for example `Top` or `Left`, the component placement may be affected by CSS styles on the component's parent. If you experience issues, [inspect the rendered HTML to see what elements are present and what their CSS styles are]({%slug themes-override%}#tools).
+When using positioning parameters, for example `Top` or `Left`, the component placement may be affected by CSS styles on the component's parent. If you experience issues, [inspect the rendered HTML to see what elements are present and what their CSS styles are](slug://themes-override#tools).
 
 >tip You can set dimensions in percentage (such as `Width="100%"`) to make the components responsive and let them resize according to the app layout and browser viewport. A lot of components expand to 100% width by default, for example, the Grid, Form, Scheduler, Spreadsheet, all input components, and others.
 
@@ -95,5 +95,5 @@ The examples here showcase different units and examples of using them to set dim
 
 ## See Also
 
-* [Themes]({%slug themes-overview%})
-* [Override Theme Styles]({%slug themes-override%})
+* [Themes](slug://themes-overview)
+* [Override Theme Styles](slug://themes-override)
diff --git a/common-features/icons.md b/common-features/icons.md
index 3e0c444a6a..0466bffa32 100644
--- a/common-features/icons.md
+++ b/common-features/icons.md
@@ -49,7 +49,7 @@ The Telerik Blazor components use built-in icons with the help of two NuGet pack
 * `Telerik.FontIcons` - defines the `FontIcon` `enum` for easier usage of built-in **font** icons
 * `Telerik.SvgIcons` - defines the `ISvgIcon` interface and the `SvgIcon` static class for built-in **SVG** icons
 
->tip Unlike the `Telerik.UI.for.Blazor` package, the icon packages are available on the `nuget.org` source. Keep this in mind when using [`packageSourceMapping`]({%slug installation/nuget%}#package-source-mapping).
+>tip Unlike the `Telerik.UI.for.Blazor` package, the icon packages are available on the `nuget.org` source. Keep this in mind when using [`packageSourceMapping`](slug://installation/nuget#package-source-mapping).
 
 ### Icon Namespaces
 
@@ -172,7 +172,7 @@ Our font icons are designed on a 16px grid base. For better display quality, use
 
 ### Render Font Icons with HTML
 
-Telerik UI for Blazor shares the same [themes]({%slug themes-overview%}) with several other Telerik and Kendo UI web component suites. All these products use the same font icons.
+Telerik UI for Blazor shares the same [themes](slug://themes-overview) with several other Telerik and Kendo UI web component suites. All these products use the same font icons.
 
 You can use the built-in font icons directly with HTML tags, without the `<TelerikFontIcon>` component. Such direct HTML usage may provide more flexibility, but if you don't really need it, we recommend using `FontIcon` objects and the `<TelerikFontIcon>` component instead.
 
@@ -293,7 +293,7 @@ The `ISvgIcon` interface members are:
 
 It is possible to configure the icon type for the whole application:
 
-1. Locate the [`<TelerikRootComponent>`]({%slug rootcomponent-overview%}) tag in the Blazor app. Normally, it's in a layout file such as `MainLayout.razor` or `TelerikLayout.razor`.
+1. Locate the [`<TelerikRootComponent>`](slug://rootcomponent-overview) tag in the Blazor app. Normally, it's in a layout file such as `MainLayout.razor` or `TelerikLayout.razor`.
 2. Set the RootComponent `IconType` parameter to an [`IconType` enum](/blazor-ui/api/telerik.blazor.icontype) value (`Svg` or `Font`). The default icon type is `Svg`.
 
 >caption Define global icon type via TelerikRootComponent
@@ -334,7 +334,7 @@ Telerik UI for Blazor supports using custom (third-party) icons:
 
 * [In the `SvgIcon` component](#use-custom-svg-icon-collection).
 * [In the `FontIcon` component](#fonticon-component).
-* In [Buttons]({%slug button-icons%}), [Menu items]({%slug menu-icons%}), [Drawer items]({%slug drawer-icons%}) and other [navigation components]({%slug blazor-overview%}#list-of-components).
+* In [Buttons](slug://button-icons), [Menu items](slug://menu-icons), [Drawer items](slug://drawer-icons) and other [navigation components](slug://blazor-overview#list-of-components).
 
 [Using custom icons for the automatically rendered icons is not supported yet](https://feedback.telerik.com/blazor/1641361-ability-to-change-the-built-in-icons). For example, the sort and filter icons in the Grid header cells, or the open arrow in the DropDownList.
 
@@ -343,4 +343,4 @@ Telerik UI for Blazor supports using custom (third-party) icons:
 
 * <a href="https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/" target="_blank">Built-in Icon List</a>
 * [Blazor Live Demos](https://demos.telerik.com/blazor-ui)
-* [CSS Themes]({%slug themes-overview%})
+* [CSS Themes](slug://themes-overview)
diff --git a/common-features/input-adornments.md b/common-features/input-adornments.md
index e59d46cee4..f3487388f3 100644
--- a/common-features/input-adornments.md
+++ b/common-features/input-adornments.md
@@ -29,14 +29,14 @@ A prefix input adornment refers to an element placed before the user input field
 
 The following input components support prefix and suffix adornments:
 
-* [AutoComplete]({%slug autocomplete-overview%})
-* [ComboBox]({%slug components/combobox/overview%})
-* [MaskedTextbox]({%slug maskedtextbox-overview%})
-* [MultiColumnComboBox]({%slug multicolumncombobox-overview%})
-* [MultiSelect]({%slug multiselect-overview%})
-* [NumericTextBox]({%slug components/numerictextbox/overview%})
-* [TextArea]({%slug textarea-overview%})
-* [TextBox]({%slug components/textbox/overview%})
+* [AutoComplete](slug://autocomplete-overview)
+* [ComboBox](slug://components/combobox/overview)
+* [MaskedTextbox](slug://maskedtextbox-overview)
+* [MultiColumnComboBox](slug://multicolumncombobox-overview)
+* [MultiSelect](slug://multiselect-overview)
+* [NumericTextBox](slug://components/numerictextbox/overview)
+* [TextArea](slug://textarea-overview)
+* [TextBox](slug://components/textbox/overview)
 
 ## Adding a Prefix Adornment
 
@@ -357,10 +357,10 @@ In addition to the common configuration settings listed in this article, the Tex
 
 This section applies to the components that incorporate popup element:
 
-* [AutoComplete]({%slug autocomplete-overview%})
-* [ComboBox]({%slug components/combobox/overview%})
-* [MultiColumnComboBox]({%slug multicolumncombobox-overview%})
-* [MultiSelect]({%slug multiselect-overview%})
+* [AutoComplete](slug://autocomplete-overview)
+* [ComboBox](slug://components/combobox/overview)
+* [MultiColumnComboBox](slug://multicolumncombobox-overview)
+* [MultiSelect](slug://multiselect-overview)
 
 By design, `Alt` + `Down` key combination opens the popup element when the component is focused. If you have added another dropdown component as a prefix or suffix adornment, focusing that component and pressing `Alt` + `Down` keys will open both popup elements - the one that belongs to the main component and the other associated with the dropdown in the prefix/suffix template.
 
diff --git a/common-features/input-validation.md b/common-features/input-validation.md
index 74bc0df82d..8f18bc7811 100644
--- a/common-features/input-validation.md
+++ b/common-features/input-validation.md
@@ -40,7 +40,7 @@ This article provides examples of validating the Telerik Blazor components. The
 * [Sliders](#sliders)
 
 
->tip Telerik offers the [Form Component]({%slug form-overview%}) that lets you generate and manage forms with predefined layouts and less code.
+>tip Telerik offers the [Form Component](slug://form-overview) that lets you generate and manage forms with predefined layouts and less code.
 
 ### Simple Inputs
 
@@ -514,11 +514,11 @@ Unlike other components, the editor does not trigger form validation on every ke
 
 ### MaskedTextbox
 
-The Masked Textbox prompts the user for their input and restricts it according to its [Mask]({%slug maskedtextbox-mask-prompt%}). 
+The Masked Textbox prompts the user for their input and restricts it according to its [Mask](slug://maskedtextbox-mask-prompt). 
 
 The Blazor validation is, however, controlled by data annotation attributes on the model and so the application must have the appropriate rules set that match the desired input and masks. The RegularExpression annotation is commonly used to require a specific input format and values, or you can implement custom data annotation attributes too.
 
-You may want to set the [`IncludeLiterals`]({%slug maskedtextbox-mask-prompt%}#include-literals-in-the-value) parameter to `true` and/or set the [`PromptPlaceholder`]({%slug maskedtextbox-mask-prompt%}#prompt) parameter accordingly to keep the prompt characters in the `Value` so you can validate the content more easily.
+You may want to set the [`IncludeLiterals`](slug://maskedtextbox-mask-prompt#include-literals-in-the-value) parameter to `true` and/or set the [`PromptPlaceholder`](slug://maskedtextbox-mask-prompt#prompt) parameter accordingly to keep the prompt characters in the `Value` so you can validate the content more easily.
 
 >caption Sample DataAnnotation rules that match masks to validate user input
 
@@ -920,8 +920,8 @@ The feature is supported by the following components treated as simple textbox-l
 ## See Also
 
 * [Data annotation attributes](https://docs.microsoft.com/en-us/aspnet/core/mvc/models/validation)
-* [Conditional validation]({%slug form-kb-conditional-validation%})
-* [ValueChanged and validation]({%slug value-changed-validation-model%})
-* [Validate on blur or change]({%slug textbox-validate-on-change%})
-* [Error: Requires a value for ValueExpression]({%slug common-kb-requires-valueexpression%})
-* [Form component]({%slug form-overview%})
+* [Conditional validation](slug://form-kb-conditional-validation)
+* [ValueChanged and validation](slug://value-changed-validation-model)
+* [Validate on blur or change](slug://textbox-validate-on-change)
+* [Error: Requires a value for ValueExpression](slug://common-kb-requires-valueexpression)
+* [Form component](slug://form-overview)
diff --git a/common-features/loading-sign.md b/common-features/loading-sign.md
index b2e8467ec8..e4d64f138c 100644
--- a/common-features/loading-sign.md
+++ b/common-features/loading-sign.md
@@ -12,7 +12,7 @@ position: 5
 
 Many times a component loads or saves data and that can take some time. To show your users the app is working, and to prevent them from performing the same action multiple times, the Telerik Blazor components can show a busy indicator while such an operation is under way.
 
-The Telerik components use the Telerik [Loader]({%slug loader-overview%}) and [LoaderContainer]({%slug loadercontainer-overview%}) components internally to match the theme and design.
+The Telerik components use the Telerik [Loader](slug://loader-overview) and [LoaderContainer](slug://loadercontainer-overview) components internally to match the theme and design.
 
 There are three patterns for showing a loading indicator:
 
@@ -342,7 +342,7 @@ Another example could be a slow calculation (for example, grouping a large amoun
 
 A fourth example could be a dropdown that has far too many items in it - expanding the dropdown will take some time to render because the DOM operation itself takes time. This would affect server-side Blazor apps too.
 
-To combat such performance issues, see the [Slow Performance]({%slug troubleshooting-general-issues%}#slow-performance) section of the documentation.
+To combat such performance issues, see the [Slow Performance](slug://troubleshooting-general-issues#slow-performance) section of the documentation.
 
 Truly asynchronous operations will still allow for a loading sign - such as the grid's `OnRead` event that is really `async` (for example, calls some WebAPI) will let the framework release the UI thread and re-render the component with a loading sign until the data response comes back.
 
diff --git a/components/aiprompt/accessibility/wai-aria-support.md b/components/aiprompt/accessibility/wai-aria-support.md
index 6a644878d3..011a51c0af 100644
--- a/components/aiprompt/accessibility/wai-aria-support.md
+++ b/components/aiprompt/accessibility/wai-aria-support.md
@@ -88,9 +88,9 @@ The AI Prompt has been tested with the following screen readers and browsers com
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor AIPrompt Demos](https://demos.telerik.com/blazor-ui/aiprompt/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/aiprompt/overview.md b/components/aiprompt/overview.md
index 8a78addc5b..3df9256847 100644
--- a/components/aiprompt/overview.md
+++ b/components/aiprompt/overview.md
@@ -64,22 +64,22 @@ The component allows you to interact with the output from the AI and execute a s
 
 ## ToolBar
 
-The AIPrompt includes a toolbar with built-in buttons that activate the view they are related to. The component also exposes the option to add custom tools, which may be associated with arbitrary handlers. [Read more about the AIPrompt's ToolBar...]({%slug aiprompt-toolbar%})
+The AIPrompt includes a toolbar with built-in buttons that activate the view they are related to. The component also exposes the option to add custom tools, which may be associated with arbitrary handlers. [Read more about the AIPrompt's ToolBar...](slug://aiprompt-toolbar)
 
 
 ## Views
 
-The AIPrompt component offers the Prompt, Output, and Commands views that relate to the current state of the prompt-response lifecycle. You can also customize the component through custom views. [Read more about the AIPrompt views...]({%slug aiprompt-views-overview%}) 
+The AIPrompt component offers the Prompt, Output, and Commands views that relate to the current state of the prompt-response lifecycle. You can also customize the component through custom views. [Read more about the AIPrompt views...](slug://aiprompt-views-overview) 
 
 
 ## Templates
 
-The AIPrompt component provides templates that enable developers to customize the rendering and appearance of the component. [Read more about the AIPrompt templates...]({%slug aiprompt-templates%})
+The AIPrompt component provides templates that enable developers to customize the rendering and appearance of the component. [Read more about the AIPrompt templates...](slug://aiprompt-templates)
 
 
 ## Events
 
-The various AIPrompt events allow you to implement custom functionality and handle user interactions with the component's ToolBar. [Read more about the AIPrompt events...]({%slug aiprompt-events%}) 
+The various AIPrompt events allow you to implement custom functionality and handle user interactions with the component's ToolBar. [Read more about the AIPrompt events...](slug://aiprompt-events) 
 
 
 ## AIPrompt Parameters
@@ -98,9 +98,9 @@ The table below lists the AIPrompt parameters. For a full list of the AIPrompt A
 | `PromptSuggestionItemTemplate` | `RenderFragment<string>` | The Prompt Suggestion Item template of the AIPrompt. |
 | `Commands` | `List<AIPromptCommandDescriptor>` | The predefined commands displayed within the Commands view. |
 | `ShowOutputRating` | `bool` <br /> (`false`) | Controls the visibility of the rating buttons within the output card. |
-| `Class` | `string` | The `class` attribute of the `<div class="k-prompt">` element. Use it to apply custom styles or [override the theme]({%slug themes-override%}). |
-| `Height` | `string` | The `height` style of the component in any [supported CSS unit]({%slug common-features/dimensions%}). The default AIPrompt dimensions depend on the CSS theme. |
-| `Width` | `string` | The `width` style of the component in any [supported CSS unit]({%slug common-features/dimensions%}). The default AIPrompt dimensions depend on the CSS theme. |
+| `Class` | `string` | The `class` attribute of the `<div class="k-prompt">` element. Use it to apply custom styles or [override the theme](slug://themes-override). |
+| `Height` | `string` | The `height` style of the component in any [supported CSS unit](slug://common-features/dimensions). The default AIPrompt dimensions depend on the CSS theme. |
+| `Width` | `string` | The `width` style of the component in any [supported CSS unit](slug://common-features/dimensions). The default AIPrompt dimensions depend on the CSS theme. |
 
 ## AIPrompt Reference and Methods
 
@@ -147,12 +147,12 @@ The AIPrompt exposes methods for programmatic operation. To use them, define a r
 
 ## Next Steps
 
-* [Configure the AIPrompt ToolBar]({%slug aiprompt-toolbar%})
-* [Customize the AIPrompt Views]({%slug aiprompt-views-overview%})
-* [Make the AIPrompt Your Own through Custom Commands]({%slug aiprompt-views-commands%})
-* [Implement AIPrompt Views Templates]({%slug aiprompt-views-templates%})
-* [Implement AIPrompt Templates]({%slug aiprompt-templates%})
-* [Handle the AIPrompt Events]({%slug aiprompt-events%})
+* [Configure the AIPrompt ToolBar](slug://aiprompt-toolbar)
+* [Customize the AIPrompt Views](slug://aiprompt-views-overview)
+* [Make the AIPrompt Your Own through Custom Commands](slug://aiprompt-views-commands)
+* [Implement AIPrompt Views Templates](slug://aiprompt-views-templates)
+* [Implement AIPrompt Templates](slug://aiprompt-templates)
+* [Handle the AIPrompt Events](slug://aiprompt-events)
 
 ## See Also
 
diff --git a/components/aiprompt/templates.md b/components/aiprompt/templates.md
index f7b5eb6885..03c84794d4 100644
--- a/components/aiprompt/templates.md
+++ b/components/aiprompt/templates.md
@@ -12,11 +12,11 @@ position: 30
 
 The AIPrompt component provides the `PromptSuggestionItemTemplate` that allows you to change the appearance of the prompt suggestions made by the component.
 
->tip The AIPrompt component also implements [View templates]({%slug aiprompt-templates%}) that control the rendering of the Prompt, Output, and Command views.
+>tip The AIPrompt component also implements [View templates](slug://aiprompt-templates) that control the rendering of the Prompt, Output, and Command views.
 
 The Prompt view of the AIPrompt renders any suggestions passed to the `PromptSuggestions` parameter in the form of elevated bubbles within a collapsible section. The `PromptSuggestionItemTemplate` allows you to control the rendering of individual suggestions.
 
->note By default, clicking on a suggestion will populate the prompt's input with the suggestion's value and also trigger a `PromptTextChanged` event. If you use the `PromptSuggestionItemTemplate`, you should also handle [any event]({%slug aiprompt-events%}) you deem necessary (such as `onclick`).
+>note By default, clicking on a suggestion will populate the prompt's input with the suggestion's value and also trigger a `PromptTextChanged` event. If you use the `PromptSuggestionItemTemplate`, you should also handle [any event](slug://aiprompt-events) you deem necessary (such as `onclick`).
 
 >caption Using the `PromptSuggestionItemTemplate` to alter the appearance of the suggestions
 
@@ -71,4 +71,4 @@ The Prompt view of the AIPrompt renders any suggestions passed to the `PromptSug
 
 ## See Also
 
-* [Views Templates]({%slug aiprompt-views-templates%})
+* [Views Templates](slug://aiprompt-views-templates)
diff --git a/components/aiprompt/toolbar.md b/components/aiprompt/toolbar.md
index 140e7280ac..d7bd1ab3d7 100644
--- a/components/aiprompt/toolbar.md
+++ b/components/aiprompt/toolbar.md
@@ -34,7 +34,7 @@ The `AIPromptToolBarButton` tag exposes parameters that allow you to customize t
 | Parameter | Type and Default Value | Description |
 | ----------- | ----------- | ----------- |
 | `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the AIPromptToolBarButton. You could use that class to cascade styles. |
-| `Icon` | `object` | Adds a font icon to the button. You can find more information on adding a font icon to a Telerik Component in [Telerik Font and Svg Icons article]({%slug common-features-icons%}#icon-namespaces). |
+| `Icon` | `object` | Adds a font icon to the button. You can find more information on adding a font icon to a Telerik Component in [Telerik Font and Svg Icons article](slug://common-features-icons#icon-namespaces). |
 | `OnClick` | `EventCallback<MouseEventArgs>` | The onclick event handler. |
 | `ChildContent` | `RenderFragment` | The child content rendered within the button. |
 
@@ -88,11 +88,11 @@ The example below omits any event handlers for brevity. Custom buttons are to be
 
 ## Next Steps
 
-* [Customize the AIPrompt Views]({%slug aiprompt-views-overview%})
-* [Implement AIPrompt Templates]({%slug aiprompt-templates%})
-* [Handle AIPrompt Events]({%slug aiprompt-events%})
+* [Customize the AIPrompt Views](slug://aiprompt-views-overview)
+* [Implement AIPrompt Templates](slug://aiprompt-templates)
+* [Handle AIPrompt Events](slug://aiprompt-events)
 
 ## See Also
 
-* [Views Templates]({%slug aiprompt-views-templates%})
+* [Views Templates](slug://aiprompt-views-templates)
 * [Live Demo: AIPrompt Overview](https://demos.telerik.com/blazor-ui/aiprompt/overview)
\ No newline at end of file
diff --git a/components/aiprompt/views/commands.md b/components/aiprompt/views/commands.md
index 70465f5a4e..9d126ba7c9 100644
--- a/components/aiprompt/views/commands.md
+++ b/components/aiprompt/views/commands.md
@@ -24,7 +24,7 @@ The following properties enable you to customize each command:
 | ----------- | ----------- | ----------- |
 | `Id` | `string` | The `Id` of the command. |
 | `Title` | `string` | The title of the command. Rendered as text within the Command view. |
-| `Icon` | `object` | The [Telerik Font or SVG icon]({%slug common-features-icons%}) rendered before the title within the Command view. |
+| `Icon` | `object` | The [Telerik Font or SVG icon](slug://common-features-icons) rendered before the title within the Command view. |
 | `Children` | `List<AIPromptCommandDescriptor>` | The nested commands (if any) of the command. |
 
 >caption Using the `Commands` parameter to pass a collection of predefined commands to the AIPrompt for Blazor
@@ -86,7 +86,7 @@ The following properties enable you to customize each command:
 ## See Also
 
   * [Live Demo: AIPrompt](https://demos.telerik.com/blazor-ui/aiprompt/overview)
-  * [Views Overview]({%slug aiprompt-views-overview%})
-  * [Prompt View]({%slug aiprompt-views-prompt%})
-  * [Output View]({%slug aiprompt-views-output%})
-  * [Views Templates]({%slug aiprompt-views-templates%})
\ No newline at end of file
+  * [Views Overview](slug://aiprompt-views-overview)
+  * [Prompt View](slug://aiprompt-views-prompt)
+  * [Output View](slug://aiprompt-views-output)
+  * [Views Templates](slug://aiprompt-views-templates)
\ No newline at end of file
diff --git a/components/aiprompt/views/output.md b/components/aiprompt/views/output.md
index e82ede7b05..e738fa8a39 100644
--- a/components/aiprompt/views/output.md
+++ b/components/aiprompt/views/output.md
@@ -12,7 +12,7 @@ position: 20
 
 The Output view shows the responses generated by the underlying AI service. Each response renders in its dedicated output card and provides two options to the user—to copy the content of the response or to retry the request. The Output view is activated through interaction—once the user fills out a prompt within the Prompt view and requests a response, the Output view will become active.
 
-If the `ShowOutputRating` is enabled on the component level, the output card will also feature two additional options-to upvote or downvote the response. To handle this interaction, you can use the `OnOutputRate` event. For more information on how to handle the event, refer to the [AIPrompt events]({%slug aiprompt-events%}) article.
+If the `ShowOutputRating` is enabled on the component level, the output card will also feature two additional options-to upvote or downvote the response. To handle this interaction, you can use the `OnOutputRate` event. For more information on how to handle the event, refer to the [AIPrompt events](slug://aiprompt-events) article.
 
 By default, the Output view is rendered and is part of the predefined views. However, if you provide a render fragment of type `AIPromptViews` to the `TelerikAIPrompt` tag, you override the default rendering, meaning you must explicitly add `AIPromptOutputView` tag within it.
 
@@ -54,7 +54,7 @@ By default, the Output view is rendered and is part of the predefined views. How
 ## See Also
 
   * [Live Demo: AIPrompt](https://demos.telerik.com/blazor-ui/aiprompt/overview)
-  * [Views Overview]({%slug aiprompt-views-overview%})
-  * [Prompt View]({%slug aiprompt-views-prompt%})
-  * [Commands View]({%slug aiprompt-views-commands%})
-  * [Views Templates]({%slug aiprompt-views-templates%})
\ No newline at end of file
+  * [Views Overview](slug://aiprompt-views-overview)
+  * [Prompt View](slug://aiprompt-views-prompt)
+  * [Commands View](slug://aiprompt-views-commands)
+  * [Views Templates](slug://aiprompt-views-templates)
\ No newline at end of file
diff --git a/components/aiprompt/views/overview.md b/components/aiprompt/views/overview.md
index a827db238d..a5a91b41eb 100644
--- a/components/aiprompt/views/overview.md
+++ b/components/aiprompt/views/overview.md
@@ -14,9 +14,9 @@ The AIPrompt component provides three predefined views and also lets you create
 
 The available built-in views are:
 
-* [Prompt View]({%slug aiprompt-views-prompt%})
-* [Output View]({%slug aiprompt-views-output%})
-* [Commands View]({%slug aiprompt-views-commands%})
+* [Prompt View](slug://aiprompt-views-prompt)
+* [Output View](slug://aiprompt-views-output)
+* [Commands View](slug://aiprompt-views-commands)
 
 ## Parameters
 
@@ -27,9 +27,9 @@ The AIPrompt views provide various parameters that allow you to configure the co
 | Parameter | Type | Description |
 | --- | --- | --- |
 | `ButtonText` | `string` | The text rendered within the toolbar button associated with the view. |
-| `ButtonIcon` | `object` | The [Telerik Font or SVG icon]({%slug common-features-icons%}) rendered within the toolbar button associated with the view. |
-| `ViewTemplate` | `RenderFragment` | The template controlling the rendering of the view's content. Read more in the [Templates]({%slug aiprompt-views-templates%}#view-template) article. |
-| `FooterTemplate` | `RenderFragment` | The template controlling the rendering of the view's footer. Read more in the [Templates]({%slug aiprompt-views-templates%}#footer-template) article. |
+| `ButtonIcon` | `object` | The [Telerik Font or SVG icon](slug://common-features-icons) rendered within the toolbar button associated with the view. |
+| `ViewTemplate` | `RenderFragment` | The template controlling the rendering of the view's content. Read more in the [Templates](slug://aiprompt-views-templates#view-template) article. |
+| `FooterTemplate` | `RenderFragment` | The template controlling the rendering of the view's footer. Read more in the [Templates](slug://aiprompt-views-templates#footer-template) article. |
 
 By default, the AIPrompt will always render both the Prompt and the Output view. The Commands view will be rendered only if you pass a custom set of commands through the `Commands` parameter:
 
@@ -74,8 +74,8 @@ By default, the AIPrompt will always render both the Prompt and the Output view.
 ## See Also
 
   * [Live Demo: AIPrompt](https://demos.telerik.com/blazor-ui/aiprompt/overview)
-  * [Prompt View]({%slug aiprompt-views-prompt%})
-  * [Output View]({%slug aiprompt-views-output%})
-  * [Commands View]({%slug aiprompt-views-commands%})
-  * [Views Templates]({%slug aiprompt-views-templates%})
+  * [Prompt View](slug://aiprompt-views-prompt)
+  * [Output View](slug://aiprompt-views-output)
+  * [Commands View](slug://aiprompt-views-commands)
+  * [Views Templates](slug://aiprompt-views-templates)
 
diff --git a/components/aiprompt/views/prompt.md b/components/aiprompt/views/prompt.md
index d4abf0c9c2..7bae5d5b7c 100644
--- a/components/aiprompt/views/prompt.md
+++ b/components/aiprompt/views/prompt.md
@@ -38,7 +38,7 @@ Additionally, the Prompt view can display prompt suggestions related to the prom
 ## See Also
 
   * [Live Demo: AIPrompt](https://demos.telerik.com/blazor-ui/aiprompt/overview)
-  * [Views Overview]({%slug aiprompt-views-overview%})
-  * [Prompt View]({%slug aiprompt-views-prompt%})
-  * [Output View]({%slug aiprompt-views-output%})
-  * [Views Templates]({%slug aiprompt-views-templates%})
\ No newline at end of file
+  * [Views Overview](slug://aiprompt-views-overview)
+  * [Prompt View](slug://aiprompt-views-prompt)
+  * [Output View](slug://aiprompt-views-output)
+  * [Views Templates](slug://aiprompt-views-templates)
\ No newline at end of file
diff --git a/components/aiprompt/views/templates.md b/components/aiprompt/views/templates.md
index aa77fe973a..32523a7c04 100644
--- a/components/aiprompt/views/templates.md
+++ b/components/aiprompt/views/templates.md
@@ -83,7 +83,7 @@ The `FooterTemplate` allows you to control the rendering of the footer within in
 ## See Also
 
   * [Live Demo: AIPrompt](https://demos.telerik.com/blazor-ui/aiprompt/overview)
-  * [Views Overview]({%slug aiprompt-views-overview%})
-  * [Prompt View]({%slug aiprompt-views-prompt%})
-  * [Output View]({%slug aiprompt-views-output%})
-  * [Commands View]({%slug aiprompt-views-commands%})
\ No newline at end of file
+  * [Views Overview](slug://aiprompt-views-overview)
+  * [Prompt View](slug://aiprompt-views-prompt)
+  * [Output View](slug://aiprompt-views-output)
+  * [Commands View](slug://aiprompt-views-commands)
\ No newline at end of file
diff --git a/components/animationcontainer/overview.md b/components/animationcontainer/overview.md
index 8a776c64c2..ada0b14768 100644
--- a/components/animationcontainer/overview.md
+++ b/components/animationcontainer/overview.md
@@ -12,7 +12,7 @@ position: 0
 
 The <a href="https://www.telerik.com/blazor-ui/animation-container" target="_blank">Blazor Animation Container component</a> enables you to create messages and popups or expandable containers. It lets you define its animation, size and position, and arbitrary content.
 
->tip If you are looking for an option to create [Notification]({%slug notification-overview%}), [Tooltip]({%slug tooltip-overview%}) or expandable container such as [Drawer]({%slug drawer-overview%}), you may use the dedicated components.
+>tip If you are looking for an option to create [Notification](slug://notification-overview), [Tooltip](slug://tooltip-overview) or expandable container such as [Drawer](slug://drawer-overview), you may use the dedicated components.
 
 ## Creating Blazor AnimationContainer
 
@@ -51,7 +51,7 @@ The <a href="https://www.telerik.com/blazor-ui/animation-container" target="_bla
 
 The Animation Container renders at the place of its declaration. It has a `position:absolute` CSS style, so it will display over adjacent elements. The component position can be offset by parent elements with a `position` style, even of the `Top` and `Left` parameters are set.
 
-The component should reside outside elements with an `overflow` CSS style. Otherwise, it may be clipped or overlapped by other scrollable containers. This limitation does not exist for the [Popup]({%slug popup-overview%}) and [Popover]({%slug popover-overview%}) components.
+The component should reside outside elements with an `overflow` CSS style. Otherwise, it may be clipped or overlapped by other scrollable containers. This limitation does not exist for the [Popup](slug://popup-overview) and [Popover](slug://popover-overview) components.
 
 ## Animation
 
@@ -194,5 +194,5 @@ The Animation Container provides methods for programmatic operation. To use them
 
 * [Live Demos: Animation Container](https://demos.telerik.com/blazor-ui/animationcontainer/overview)
 * [AnimationContainer API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikAnimationContainer)
-* [Hide the AnimationContainer on Outside Click]({%slug animationcontainer-kb-close-on-outside-click%})
-* [Comparison between All Popup Components]({%slug common-kb-popup-component-comparison%})
+* [Hide the AnimationContainer on Outside Click](slug://animationcontainer-kb-close-on-outside-click)
+* [Comparison between All Popup Components](slug://common-kb-popup-component-comparison)
diff --git a/components/appbar/overview.md b/components/appbar/overview.md
index 03dcc0af90..c9b2b48a22 100644
--- a/components/appbar/overview.md
+++ b/components/appbar/overview.md
@@ -60,15 +60,15 @@ The <a href = "https://www.telerik.com/blazor-ui/appbar" target="_blank">Blazor
 
 ## AppBar Sections
 
-Use the AppBar Sections to render arbitrary HTML content to match the UI and UX needs of your application. [Read more about the Blazor AppBar sections...]({%slug appbar-sections%})
+Use the AppBar Sections to render arbitrary HTML content to match the UI and UX needs of your application. [Read more about the Blazor AppBar sections...](slug://appbar-sections)
 
 ## Content Dividers
 
-The AppBar features separators and spacers that can visually divide the component items. [Read more about the Blazor AppBar separators and spacers.]({%slug appbar-separators%}).
+The AppBar features separators and spacers that can visually divide the component items. [Read more about the Blazor AppBar separators and spacers.](slug://appbar-separators).
 
 ## Positioning
 
-You can control the position of the AppBar and how the component behaves according to the flow of the page. [Read more about the Blazor AppBar positioning.]({%slug appbar-position%}).
+You can control the position of the AppBar and how the component behaves according to the flow of the page. [Read more about the Blazor AppBar positioning.](slug://appbar-position).
 
 ## AppBar Parameters
 
@@ -78,8 +78,8 @@ The Blazor AppBar provides parameters to configure the component. Also check the
 
 | Parameter | Type | Description |
 | ----------- | ----------- | ----------- |
-| `Position` | `AppBarPosition` <br /> (`None`) | The position of the AppBar on the page. [Read more about AppBar positioning.]({%slug appbar-position%}) |
-| `PositionMode` | `AppBarPosition` <br /> (`Static`) | Sets how the AppBar is positioned according to the flow of the document. [Read more about AppBar positioning.]({%slug appbar-position%}) |
+| `Position` | `AppBarPosition` <br /> (`None`) | The position of the AppBar on the page. [Read more about AppBar positioning.](slug://appbar-position) |
+| `PositionMode` | `AppBarPosition` <br /> (`Static`) | Sets how the AppBar is positioned according to the flow of the document. [Read more about AppBar positioning.](slug://appbar-position) |
 
 ### Styling and Appearance
 
@@ -87,12 +87,12 @@ The following parameters enable you to customize the appearance of the Blazor Ap
 
 | Parameter | Type | Description |
 | --- | --- | --- |
-| `Class` | `string` | The CSS class to be rendered on the main wrapping element of the AppBar component, which is `<div class="k-appbar">`. Use for [styling customizations]({%slug themes-override%}). |
+| `Class` | `string` | The CSS class to be rendered on the main wrapping element of the AppBar component, which is `<div class="k-appbar">`. Use for [styling customizations](slug://themes-override). |
 | `Height` | `string` | The height of the AppBar. |
 | `ThemeColor` | `Telerik.Blazor.ThemeConstants.AppBar.ThemeColor` | Adjust the color of the AppBar |
 | `Width` | `string` | The width of the AppBar. |
 
-You can find more information for customizing the AppBar appearance in the [Appearance article]({%slug appbar-appearance%}).
+You can find more information for customizing the AppBar appearance in the [Appearance article](slug://appbar-appearance).
 
 ## AppBar Reference and Methods
 
@@ -121,9 +121,9 @@ To execute AppBar methods, obtain reference to the component instance with `@ref
 
 ## Next Steps
 
-* [Explore the AppBar Sections]({%slug appbar-sections%})
-* [Use the AppBar Sections]({%slug appbar-separators%})
-* [Customize the AppBar position]({%slug appbar-position%})
+* [Explore the AppBar Sections](slug://appbar-sections)
+* [Use the AppBar Sections](slug://appbar-separators)
+* [Customize the AppBar position](slug://appbar-position)
 
 ## See Also
 
diff --git a/components/appbar/sections.md b/components/appbar/sections.md
index 3d377cf1c2..bbf90fcbf5 100644
--- a/components/appbar/sections.md
+++ b/components/appbar/sections.md
@@ -56,4 +56,4 @@ The nested `AppBarSection` tag exposes parameters:
 ## See Also
 
   * [Live Demo: AppBar Overview](https://demos.telerik.com/blazor-ui/appbar/overview)
-  * [AppBar Overview]({%slug appbar-overview%})
+  * [AppBar Overview](slug://appbar-overview)
diff --git a/components/appbar/separators.md b/components/appbar/separators.md
index 85ace98537..7c9d62d021 100644
--- a/components/appbar/separators.md
+++ b/components/appbar/separators.md
@@ -38,7 +38,7 @@ The nested `AppBarSpacer` tag exposes the following parameters:
 | Parameter | Type and Default Value | Description |
 | ----------- | ----------- | ----------- |
 | `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the AppBar spacer. Use that class to cascade styles. |
-| `Size` | `string` | The width of the spacer. All `AppBarSpacer` tags without Size will take up the same amount of the remaining space between the [Sections]({%slug appbar-sections%}). |
+| `Size` | `string` | The width of the spacer. All `AppBarSpacer` tags without Size will take up the same amount of the remaining space between the [Sections](slug://appbar-sections). |
 | `Visible` | `bool` <br /> `true` | Specifies if the spacer will be visible in the AppBar. |
 
 >caption The AppBar separators
@@ -87,4 +87,4 @@ The nested `AppBarSpacer` tag exposes the following parameters:
 ## See Also
 
   * [Live Demo: AppBar Overview](https://demos.telerik.com/blazor-ui/appbar/overview)
-  * [AppBar Overview]({%slug appbar-overview%})
+  * [AppBar Overview](slug://appbar-overview)
diff --git a/components/autocomplete/accessibility/wai-aria-support.md b/components/autocomplete/accessibility/wai-aria-support.md
index dd447c40a5..7aae1c2980 100644
--- a/components/autocomplete/accessibility/wai-aria-support.md
+++ b/components/autocomplete/accessibility/wai-aria-support.md
@@ -101,4 +101,4 @@ For details on how the AutoComplete keyboard navigation works, refer to the [Bla
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/autocomplete/data-bind.md b/components/autocomplete/data-bind.md
index 20cb8c0cdd..f92889cec2 100644
--- a/components/autocomplete/data-bind.md
+++ b/components/autocomplete/data-bind.md
@@ -160,5 +160,5 @@ The AutoComplete is, essentially, a textbox. This means that its `Value` is alwa
 
 ## See Also
 
-* [AutoComplete Overview]({%slug autocomplete-overview%})
+* [AutoComplete Overview](slug://autocomplete-overview)
 * [Live Demo: AutoComplete](https://demos.telerik.com/blazor-ui/autocomplete/overview)
diff --git a/components/autocomplete/events.md b/components/autocomplete/events.md
index fef08b189d..590e3418f0 100644
--- a/components/autocomplete/events.md
+++ b/components/autocomplete/events.md
@@ -116,15 +116,15 @@ from model: @Role
 
 ## OnRead
 
-You can use the [`OnRead` event]({%slug common-features-data-binding-onread%}) to provide data to the component based on custom logic and the current user input and/or scroll position (when using [virtualization]({%slug autocomplete-virtualization%})). The event fires when:
+You can use the [`OnRead` event](slug://common-features-data-binding-onread) to provide data to the component based on custom logic and the current user input and/or scroll position (when using [virtualization](slug://autocomplete-virtualization)). The event fires when:
 
 * The component initializes.
-* The user [filters]({%slug autocomplete-filter%}).
-* The user scrolls with [virtualization]({%slug autocomplete-virtualization%}) enabled.
+* The user [filters](slug://autocomplete-filter).
+* The user scrolls with [virtualization](slug://autocomplete-virtualization) enabled.
 
 You can also call remote data through async operations.
 
-Find out how to [get the applied filtering and grouping criteria]({%slug common-features-descriptors%}).
+Find out how to [get the applied filtering and grouping criteria](slug://common-features-descriptors).
 
 When using `OnRead`, make sure to set `TItem` and `TValue`.
 
@@ -380,7 +380,7 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
-* [Filter AutoComplete Items]({%slug autocomplete-filter%})
-* [Refresh AutoComplete Data]({%slug autocomplete-refresh-data%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
+* [Filter AutoComplete Items](slug://autocomplete-filter)
+* [Refresh AutoComplete Data](slug://autocomplete-refresh-data)
diff --git a/components/autocomplete/filter.md b/components/autocomplete/filter.md
index 0b3c64d64c..2768feed70 100644
--- a/components/autocomplete/filter.md
+++ b/components/autocomplete/filter.md
@@ -14,8 +14,8 @@ The AutoComplete component can filter the available suggestions, according to th
 
 To enable filtering, set the `Filterable` parameter to `true`. The filtering is case insensitive.
 
-You can also use the [`OnRead` event]({%slug autocomplete-events%}#onread) to:
-* Get the [applied filtering criteria]({%slug common-features-descriptors%}#through-the-onread-event).
+You can also use the [`OnRead` event](slug://autocomplete-events#onread) to:
+* Get the [applied filtering criteria](slug://common-features-descriptors#through-the-onread-event).
 * Implement custom (server) filtering and set data dynamically.
 
 ## Filter Operator
@@ -28,7 +28,7 @@ To control when the filter list appears, set the `MinLength` parameter. This can
 
 ## Performance
 
-By default, the filtering is debounced with 150ms. Configure that with the [`DebounceDelay`]({%slug autocomplete-overview%}#autocomplete-parameters) parameter of the component.
+By default, the filtering is debounced with 150ms. Configure that with the [`DebounceDelay`](slug://autocomplete-overview#autocomplete-parameters) parameter of the component.
 
 ## Filtering Example
 
@@ -92,4 +92,4 @@ By default, the filtering is debounced with 150ms. Configure that with the [`Deb
 
 * [Live Demo: AutoComplete Filtering](https://demos.telerik.com/blazor-ui/autocomplete/filtering)
 
-* [Custom Filtering by Multiple Fields]({%slug dropdowns-kb-search-in-multiple-fields%})
+* [Custom Filtering by Multiple Fields](slug://dropdowns-kb-search-in-multiple-fields)
diff --git a/components/autocomplete/grouping.md b/components/autocomplete/grouping.md
index 864d30f703..c67ebd4599 100644
--- a/components/autocomplete/grouping.md
+++ b/components/autocomplete/grouping.md
@@ -66,7 +66,7 @@ The group headers can stick to the top of the dropdown during scrolling. In othe
 # Notes
 
 * One level of grouping is supported.
-* A grouped AutoComplete will provide a `Groups` property with a single [`GroupDescriptor`](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) argument of its [OnRead event]({%slug autocomplete-events%}#onread). This will allow the developer to apply grouping with [manual data operations]({%slug components/grid/manual-operations%}).
+* A grouped AutoComplete will provide a `Groups` property with a single [`GroupDescriptor`](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) argument of its [OnRead event](slug://autocomplete-events#onread). This will allow the developer to apply grouping with [manual data operations](slug://components/grid/manual-operations).
 
 ## See Also
 
diff --git a/components/autocomplete/overview.md b/components/autocomplete/overview.md
index 824c5ccb21..4119ad3fac 100644
--- a/components/autocomplete/overview.md
+++ b/components/autocomplete/overview.md
@@ -10,13 +10,13 @@ position: 0
 
 # Blazor AutoComplete Overview
 
-The <a href="https://www.telerik.com/blazor-ui/autocomplete" target="_blank">Blazor AutoComplete component</a> is a textbox that offers the users hints as they type. These suggestions can be [filtered]({%slug autocomplete-filter%}) as the user types. The user can write their own value or click a suggestion from the dropdown to select it and populate the input. You can control the list of suggestions through [data binding]({%slug autocomplete-databind%}), various appearance settings like [dimensions]({%slug common-features/dimensions%}) and [templates]({%slug autocomplete-templates%}).
+The <a href="https://www.telerik.com/blazor-ui/autocomplete" target="_blank">Blazor AutoComplete component</a> is a textbox that offers the users hints as they type. These suggestions can be [filtered](slug://autocomplete-filter) as the user types. The user can write their own value or click a suggestion from the dropdown to select it and populate the input. You can control the list of suggestions through [data binding](slug://autocomplete-databind), various appearance settings like [dimensions](slug://common-features/dimensions) and [templates](slug://autocomplete-templates).
 
 ## Creating AutoComplete
 
 1. Use the `TelerikAutoComplete` tag to add the component to your razor page.
 1. Populate the `Data` property with the collection of items that you want to appear in the dropdown.
-1. [Bind the value of the component]({%slug get-started-value-vs-data-binding %}#value-binding) to the same type as the member of the `ValueField` parameter.
+1. [Bind the value of the component](slug://get-started-value-vs-data-binding #value-binding) to the same type as the member of the `ValueField` parameter.
 1. (Optional) Enable features like placeholder text and clear button.
 
 >caption AutoComplete with two-way value binding and data binding to collection of strings
@@ -45,21 +45,21 @@ User input: @AutoCompleteValue
 
 ## Data Binding
 
-The Blazor AutoComplete @[template](/_contentTemplates/dropdowns/features.md#data-binding) [Read more about the Blazor AutoComplete data binding...]({%slug autocomplete-databind%})
+The Blazor AutoComplete @[template](/_contentTemplates/dropdowns/features.md#data-binding) [Read more about the Blazor AutoComplete data binding...](slug://autocomplete-databind)
 
 ## Filtering
 
-The Blazor AutoComplete @[template](/_contentTemplates/dropdowns/features.md#filtering) [Read more about the Blazor AutoComplete filter...]({%slug autocomplete-filter%})
+The Blazor AutoComplete @[template](/_contentTemplates/dropdowns/features.md#filtering) [Read more about the Blazor AutoComplete filter...](slug://autocomplete-filter)
  
 ## Grouping
 
-The Blazor AutoComplete @[template](/_contentTemplates/dropdowns/features.md#grouping) [Read more about the Blazor AutoComplete grouping...]({%slug components/autocomplete/grouping%})
+The Blazor AutoComplete @[template](/_contentTemplates/dropdowns/features.md#grouping) [Read more about the Blazor AutoComplete grouping...](slug://components/autocomplete/grouping)
 
 @[template](/_contentTemplates/common/inputs.md#adornments)
 
 ## Templates
 
-@[template](/_contentTemplates/dropdowns/features.md#templates) [Read more about the Blazor AutoComplete templates...]({%slug autocomplete-templates%})
+@[template](/_contentTemplates/dropdowns/features.md#templates) [Read more about the Blazor AutoComplete templates...](slug://autocomplete-templates)
 
 ## Validation
 
@@ -67,7 +67,7 @@ The Blazor AutoComplete @[template](/_contentTemplates/dropdowns/features.md#gro
 
 ## Virtualization
 
-@[template](/_contentTemplates/dropdowns/features.md#virtualization) [Read more about the Blazor AutoComplete virtualization...]({% slug autocomplete-virtualization %})
+@[template](/_contentTemplates/dropdowns/features.md#virtualization) [Read more about the Blazor AutoComplete virtualization...](slug://autocomplete-virtualization)
 
 ## Adaptive Rendering
 
@@ -81,24 +81,24 @@ The Blazor AutoComplete provides various parameters that allow you to configure
 
 | Parameter    | Type  | Description |
 | ----------- | ----------- | -------|
-| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode]({%slug adaptive-rendering%}) of the component. |
+| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode](slug://adaptive-rendering) of the component. |
 | `Data` | `IEnumerable<TItem>` | allows you to provide the data source. Required. |
 | `DebounceDelay` | `int` <br/> 150 | Time in milliseconds between the last typed symbol and the internal `oninput` event firing. Applies when the user types and filters. Use it to balance between client-side performance and number of database queries. |
 | `Enabled` | `bool` | Whether the component is enabled. |
-| `Filterable` | `bool` | Whether [filtering]({%slug multiselect-filter%}) is enabled for the end user (suggestions will get narrowed down as they type). |
-| `FilterOperator` | `StringFilterOperator` <br /> (`StartsWith`) | The string operation that will be used for [filtering]({%slug multiselect-filter%}). |
+| `Filterable` | `bool` | Whether [filtering](slug://multiselect-filter) is enabled for the end user (suggestions will get narrowed down as they type). |
+| `FilterOperator` | `StringFilterOperator` <br /> (`StartsWith`) | The string operation that will be used for [filtering](slug://multiselect-filter). |
 | `Id` | `string` | Renders as the `id` attribute on the `<input />` element, so you can attach a `<label for="">` to the input.|
 | `InputMode` | `string` | The [`inputmode` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) of the `<input />` element. |
 | `LoaderShowDelay` | `int ` <br /> 300 | Time in milliseconds between opening the popup and showing the loading skeleton in it when the data is not yet available. |
 | `TItem` | `Type`  | The type of the model to which the component is bound. Required if you can't provide `Data` or `Value`. Determines the type of the reference object. |
-| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`]({%slug adaptive-rendering%}). |
+| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`](slug://adaptive-rendering). |
 | `Value` and `bind-Value` | `string`  | Get/set the value of the component, can be used for binding. Use the `@bind-Value` syntax for two-way binding, for example, to a variable of your own. The `Value` must be a `string`.|
 | `ValueField` | `string` <br /> (`Value`) | The name of the field from the model that will be shown as hints to the user. Not required when binding to a simple list of strings. |
 | `TabIndex` | `int?`  | Maps to the `tabindex` attribute of the HTML element. You can use it to customize the order in which the inputs in your form focus with the `Tab` key. |
 | `ShowClearButton` | `bool`  | Whether the user will have the option to clear the selected value with a button on the input. When it is clicked, the `Value` will be updated to `string.Empty`. |
 | `Enabled` | `bool`  | Use this Boolean property to render a disabled Blazor AutoComplete component until certain requirements are met. |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
-| `MinLength` | `int`  | How many characters the text has to be before the suggestions list appears. Cannot be `0`. Often works together with [filtering]({%slug autocomplete-filter%}). |
+| `MinLength` | `int`  | How many characters the text has to be before the suggestions list appears. Cannot be `0`. Often works together with [filtering](slug://autocomplete-filter). |
 | `Placeholder` | `string` | The text the user sees as a hint when there is no text in the input. In order for it to be shown, the `Value` parameter should be set to the default value for string (`null`). |
 
 ### Styling and Appearance
@@ -107,7 +107,7 @@ The following parameters enable you to customize the appearance of the Blazor Au
 
 @[template](/_contentTemplates/dropdowns/features.md#styling)
 
-You can find more options for customizing the AutoComplete styling in the [Appearance article]({%slug autocomplete-appearance%}).
+You can find more options for customizing the AutoComplete styling in the [Appearance article](slug://autocomplete-appearance).
 
 ### Popup settings
 
@@ -143,7 +143,7 @@ The AutoComplete provides the following popup settings:
 
 ## AutoComplete Reference and Methods
 
-The AutoComplete is a generic component and its type is determined by the type of the model you use as its data source. You can find examples in the [Data Bind - Considerations]({%slug autocomplete-databind%}#considerations) article.
+The AutoComplete is a generic component and its type is determined by the type of the model you use as its data source. You can find examples in the [Data Bind - Considerations](slug://autocomplete-databind#considerations) article.
 
 Add a reference to the component instance to use the [AutoComplete's methods](/blazor-ui/api/Telerik.Blazor.Components.TelerikAutoComplete-1).
 
@@ -176,11 +176,11 @@ Add a reference to the component instance to use the [AutoComplete's methods](/b
 
 ## Next Steps
 
-* [Binding the AutoComplete to Data]({%slug autocomplete-databind%})
+* [Binding the AutoComplete to Data](slug://autocomplete-databind)
 
 ## See Also
 
-* [Data Binding]({%slug autocomplete-databind%})
+* [Data Binding](slug://autocomplete-databind)
 * [Live Demo: AutoComplete](https://demos.telerik.com/blazor-ui/autocomplete/overview)
 * [Live Demo: AutoComplete Validation](https://demos.telerik.com/blazor-ui/autocomplete/validation)
 * [AutoComplete API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikAutoComplete-1)
diff --git a/components/autocomplete/refresh-data.md b/components/autocomplete/refresh-data.md
index 4f4961399c..cda893988b 100644
--- a/components/autocomplete/refresh-data.md
+++ b/components/autocomplete/refresh-data.md
@@ -21,7 +21,7 @@ In this article:
 
 ## Rebind Method
 
-To refresh the AutoComplete data when using [`OnRead`]({%slug autocomplete-events%}#onread), call the `Rebind` method of the TelerikAutoComplete reference. This will fire the `OnRead` event and execute the business logic in the handler.
+To refresh the AutoComplete data when using [`OnRead`](slug://autocomplete-events#onread), call the `Rebind` method of the TelerikAutoComplete reference. This will fire the `OnRead` event and execute the business logic in the handler.
 
 ````RAZOR
 @* Clicking on the Rebind button will delete the first item from the datasource and refresh the data in the UI *@
@@ -221,6 +221,6 @@ To refresh the AutoComplete data when using [`OnRead`]({%slug autocomplete-event
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
\ No newline at end of file
diff --git a/components/avatar/appearance.md b/components/avatar/appearance.md
index 344faef00b..6cc8b6900d 100644
--- a/components/avatar/appearance.md
+++ b/components/avatar/appearance.md
@@ -170,7 +170,7 @@ The color of the Avatar is controlled through the `ThemeColor` parameter. You ca
 
 ## Next Steps
 
-* [Explore the Avatar types]({%slug avatar-types%})
+* [Explore the Avatar types](slug://avatar-types)
 
 ## See Also
 
diff --git a/components/avatar/overview.md b/components/avatar/overview.md
index d943eef30a..7b1e8c1953 100644
--- a/components/avatar/overview.md
+++ b/components/avatar/overview.md
@@ -12,7 +12,7 @@ position: 0
 
 The <a href="https://www.telerik.com/blazor-ui/avatar" target="_blank">Blazor Avatar component</a> is typically used to display images, icons or initials representing people or other entities.
 
-You can set different [Avatar types]({%slug avatar-types%}) and customize its [size]({%slug avatar-appearance%}#size), [fill mode]({%slug avatar-appearance%}#fillmode) and more.
+You can set different [Avatar types](slug://avatar-types) and customize its [size](slug://avatar-appearance#size), [fill mode](slug://avatar-appearance#fillmode) and more.
 
 ## Creating Blazor Avatar
 
@@ -20,9 +20,9 @@ You can set different [Avatar types]({%slug avatar-types%}) and customize its [s
 
 1. Declare your desired content (as `ChildContent`) inside the `TelerikAvatar` tag - text, icon or image. This example demonstrates Avatar with initials (text).
 
-1. Set the [Avatar `Type`]({%slug avatar-types%}), depending on the displayed content. In this case, we are using `Text`.
+1. Set the [Avatar `Type`](slug://avatar-types), depending on the displayed content. In this case, we are using `Text`.
 
-1. (Optional) Configure the [`ThemeColor`]({%slug avatar-appearance%}) of the Avatar.
+1. (Optional) Configure the [`ThemeColor`](slug://avatar-appearance) of the Avatar.
 
 >caption Basic Avatar with text and specified `ThemeColor`
 
@@ -37,11 +37,11 @@ You can set different [Avatar types]({%slug avatar-types%}) and customize its [s
 
 ## Types
 
-The Avatar `Type` defines the type of the content that the component will display - it may be text, icon or image. [Read more about the specifics of the Avatar types...]({%slug avatar-types%})
+The Avatar `Type` defines the type of the content that the component will display - it may be text, icon or image. [Read more about the specifics of the Avatar types...](slug://avatar-types)
 
 ## Appearance
 
-The Avatar provides multiple options for configuring its look - `ThemeColor`, `Rounded` and more. [Explore the available appearance settings...]({%slug avatar-appearance%})
+The Avatar provides multiple options for configuring its look - `ThemeColor`, `Rounded` and more. [Explore the available appearance settings...](slug://avatar-appearance)
 
 ## Avatar Parameters
 
@@ -52,17 +52,17 @@ The Blazor Avatar provides the following parameters that allow you to configure
 | Parameter    | Type  | Description |
 | ----------- | ----------- | -------|
 | `Bordered` | `bool` | Whether the Avatar will have border. |
-| `Class` | `string` | A custom CSS class that will be rendered on the main wrapping element of the Avatar. (`<div class="k-avatar>`) Use it to [override the theme or apply custom styles]({%slug themes-override%}). |
-| `Height` | `string` | The height of the Avatar. Takes precedence over the [`Size`]({%slug avatar-appearance%}#size) parameter. |
-| `Width` | `string` | The width of the Avatar. Takes precedence over the [`Size`]({%slug avatar-appearance%}#size) parameter. |
+| `Class` | `string` | A custom CSS class that will be rendered on the main wrapping element of the Avatar. (`<div class="k-avatar>`) Use it to [override the theme or apply custom styles](slug://themes-override). |
+| `Height` | `string` | The height of the Avatar. Takes precedence over the [`Size`](slug://avatar-appearance#size) parameter. |
+| `Width` | `string` | The width of the Avatar. Takes precedence over the [`Size`](slug://avatar-appearance#size) parameter. |
 | `Type` | `AvatarType` <br/> (`Image`) | The type of the Avatar. Read more in the [Types article]. |
 
-You can find more options for customizing the Avatar styling in the [Appearance article]({%slug avatar-appearance%}).
+You can find more options for customizing the Avatar styling in the [Appearance article](slug://avatar-appearance).
 
 ## Next Steps
 
-* [Explore the Avatar types]({%slug avatar-types%})
-* [Configure the appearance options of the Avatar]({%slug avatar-appearance%})
+* [Explore the Avatar types](slug://avatar-types)
+* [Configure the appearance options of the Avatar](slug://avatar-appearance)
 
 ## See Also
 
diff --git a/components/avatar/types.md b/components/avatar/types.md
index bdbe6cef91..9c58c59004 100644
--- a/components/avatar/types.md
+++ b/components/avatar/types.md
@@ -48,7 +48,7 @@ If the `Type` parameter value is not matching the type of the content, you will
 
 ## Next Steps
 
-* [Configure the appearance options of the Avatar]({%slug avatar-appearance%})
+* [Configure the appearance options of the Avatar](slug://avatar-appearance)
 
 ## See Also
 
diff --git a/components/badge/overview.md b/components/badge/overview.md
index 1ad05a2541..b0e08642b5 100644
--- a/components/badge/overview.md
+++ b/components/badge/overview.md
@@ -12,13 +12,13 @@ position: 0
 
 The <a href = "https://www.telerik.com/blazor-ui/badge" target="_blank">Blazor Badge component</a> is a visual element that displays additional information, such as a status indicator, notification icon, short text, and others.
 
-The Badge comes with built-in customization features that allow the developer to fine-tune the [positioning and alignment]({%slug badge-position-alignment%}) of the component, change the [background color]({%slug badge-appearance%}#themecolor) and the [fill mode]({%slug badge-appearance%}#fillmode), and to enable or disable the cutout border.
+The Badge comes with built-in customization features that allow the developer to fine-tune the [positioning and alignment](slug://badge-position-alignment) of the component, change the [background color](slug://badge-appearance#themecolor) and the [fill mode](slug://badge-appearance#fillmode), and to enable or disable the cutout border.
 
 ## Creating Blazor Badge
 
 1. Add the `<TelerikBadge>` tag to a container that the Badge will attach to.
 1. Use the Badge `ChildContent` to add content.
-1. (optional) Customize the [appearance]({%slug badge-appearance%}) and fine-tune the [positioning and alignment]({%slug badge-position-alignment%}) of the Telerik Blazor Badge.
+1. (optional) Customize the [appearance](slug://badge-appearance) and fine-tune the [positioning and alignment](slug://badge-position-alignment) of the Telerik Blazor Badge.
 
 >caption Basic configuration of the Blazor Badge
 
@@ -31,7 +31,7 @@ The Badge comes with built-in customization features that allow the developer to
 
 ## Positioning and Alignment
 
-You can control how the Badge is positioned relative to its associated container. Read more about the [Blazor Badge positioning...]({%slug badge-position-alignment%})
+You can control how the Badge is positioned relative to its associated container. Read more about the [Blazor Badge positioning...](slug://badge-position-alignment)
 
 ## Badge Parameters
 
@@ -42,9 +42,9 @@ The Blazor Badge provides various parameters that allow you to configure the com
 | Parameter | Type | Description |
 | ----------- | ----------- | ----------- |
 | `ShowCutoutBorder` | `bool` | Controls whether there is a small visual separation between the Badge and the container when they overlap. |
-| `Position` | `BadgePosition ` <br /> (`Edge`) | The position of the Badge relative to the container. [Read more about Badge positioning.]({%slug badge-position-alignment%}) |
-| `HorizontalAlign` | `BadgeHorizontalAlign ` <br /> (`End`) | Determines if the left or the right side of the Badge will touch its parent container. [Read more about Badge positioning.]({%slug badge-position-alignment%}) |
-| `VerticalAlign` | `BadgeVerticalAlign  ` <br /> (`Top`) | Determines if the Badge will touch the parent container with its top or bottom side. [Read more about Badge positioning.]({%slug badge-position-alignment%}) |
+| `Position` | `BadgePosition ` <br /> (`Edge`) | The position of the Badge relative to the container. [Read more about Badge positioning.](slug://badge-position-alignment) |
+| `HorizontalAlign` | `BadgeHorizontalAlign ` <br /> (`End`) | Determines if the left or the right side of the Badge will touch its parent container. [Read more about Badge positioning.](slug://badge-position-alignment) |
+| `VerticalAlign` | `BadgeVerticalAlign  ` <br /> (`Top`) | Determines if the Badge will touch the parent container with its top or bottom side. [Read more about Badge positioning.](slug://badge-position-alignment) |
 
 ### Styling and Appearance
 
@@ -52,19 +52,19 @@ The following parameters enable you to customize the appearance of the Blazor Ba
 
 | Parameter | Type | Description |
 | --- | --- | --- |
-| `Class` | `string` | Defines the `<div class="k-badge">` CSS class rendered on the main wrapping element of the Badge component. Use it for [styling customizations]({%slug themes-override%}). |
+| `Class` | `string` | Defines the `<div class="k-badge">` CSS class rendered on the main wrapping element of the Badge component. Use it for [styling customizations](slug://themes-override). |
 | `FillMode` | `Telerik.Blazor.ThemeConstants.Badge.FillMode.Solid` | Controls how the Badge is filled. |
 | `Rounded` | `Telerik.Blazor.ThemeConstants.Badge.Rounded.Full` | Defines how rounded the borders of the Badge are. |
 | `Size` | `Telerik.Blazor.ThemeConstants.Badge.Size.Medium` | Sets the size of the Badge. |
 | `ThemeColor` | `Telerik.Blazor.ThemeConstants.Badge.ThemeColor.Primary` | Adjusts the background color of the Badge. |
 
-You can find more information for customizing the Badge appearance in the [Appearance article]({%slug badge-appearance%}).
+You can find more information for customizing the Badge appearance in the [Appearance article](slug://badge-appearance).
 
 ## Next Steps
 
-* [Explore the Badge Positioning and Alignment Settings]({%slug badge-position-alignment%})
-* [Customize the Badge Appearance]({%slug badge-appearance%})
-* [Add a Badge to a Container that Cannot Have Children (Knowledge-Base Article)]({%slug kb-badge-container-no-children%})
+* [Explore the Badge Positioning and Alignment Settings](slug://badge-position-alignment)
+* [Customize the Badge Appearance](slug://badge-appearance)
+* [Add a Badge to a Container that Cannot Have Children (Knowledge-Base Article)](slug://kb-badge-container-no-children)
 
 ## See Also
 
diff --git a/components/barcodes/barcode/overview.md b/components/barcodes/barcode/overview.md
index b1696f7900..30128bb018 100644
--- a/components/barcodes/barcode/overview.md
+++ b/components/barcodes/barcode/overview.md
@@ -22,7 +22,7 @@ All graphics are rendered on the client by using [Scalable Vector Graphics (SVG)
 
 1. Set the `Height` and `Width` properties.
 
-1. Optionally, choose a `Type` (one of the [encodings we support]({%slug  barcode-encoding%})).
+1. Optionally, choose a `Type` (one of the [encodings we support](slug://barcode-encoding)).
     * Its default encoding is `Code39`.
 
 >caption A basic configuration of the Telerik Barcode
@@ -36,7 +36,7 @@ All graphics are rendered on the client by using [Scalable Vector Graphics (SVG)
 
 ## Encoding
 
-Encoding represents the mapping between messages and barcodes. [Read more about the supported Blazor Barcode Encodings]({%slug barcode-encoding%}).
+Encoding represents the mapping between messages and barcodes. [Read more about the supported Blazor Barcode Encodings](slug://barcode-encoding).
 
 ## Methods
 
@@ -83,7 +83,7 @@ The Blazor Barcode provides various parameters that allow you to configure the c
 | ----------- | ----------- | ----------- |
 | `RenderAs` | `RenderingMode` enum <br /> `Svg` | Defines the preferred rendering mode - svg/canvas. |
 | `Checksum` | `bool` | By setting it to true, the Barcode will display the checksum digit next to the value in the text area. |
-| `Type` | `BarcodeType` enum <br /> `Code39` | Defines the symbology (encoding) the Barcode will use - ([full list of supported encodings]({%slug  barcode-encoding%})) |
+| `Type` | `BarcodeType` enum <br /> `Code39` | Defines the symbology (encoding) the Barcode will use - ([full list of supported encodings](slug://barcode-encoding)) |
 | `Value` | `string` | Defines the initial value of the Barcode. |
 | `Width` | `string` | |
 | `Height` | `string` | |
@@ -129,10 +129,10 @@ The nested `BarcodePadding` tag exposes parameters that enable you to customize
 
 ## Next Steps
 
-[Explore the Barcode Encodings]({%slug barcode-encoding%})
+[Explore the Barcode Encodings](slug://barcode-encoding)
 
 ## See Also
 
 * [Live Demo: Barcode](https://demos.telerik.com/blazor-ui/barcode/overview)
 * [Live Demo: Barcode Encoding](https://demos.telerik.com/blazor-ui/barcode/encodings)
-* [Export Barcode to Image]({%slug qrcode-barcode-chart-kb-export-to-image%})
+* [Export Barcode to Image](slug://qrcode-barcode-chart-kb-export-to-image)
diff --git a/components/barcodes/qrcode/overview.md b/components/barcodes/qrcode/overview.md
index 7f51580ac9..be80ec5878 100644
--- a/components/barcodes/qrcode/overview.md
+++ b/components/barcodes/qrcode/overview.md
@@ -22,7 +22,7 @@ The generated image from the component is a machine-readable label that contains
 
 1. Set its `Size` property.
 
-1. Optionally, choose a `QRCode Type` (one of the [types we support]({%slug  qrcode-qr-code-types%})).
+1. Optionally, choose a `QRCode Type` (one of the [types we support](slug://qrcode-qr-code-types)).
 
 >caption A basic configuration of the Telerik QRCode
 
@@ -34,11 +34,11 @@ The generated image from the component is a machine-readable label that contains
 
 ## Encoding
 
-Encoding represents the mapping between messages and qr codes. [Read more about the supported Blazor QRCode Encodings]({%slug qrcode-encoding%}).
+Encoding represents the mapping between messages and qr codes. [Read more about the supported Blazor QRCode Encodings](slug://qrcode-encoding).
 
 ## Types
 
-The component exposes Swiss and Image QRCode types. [Read more about the supported Blazor QRCode Types...]({%slug qrcode-qr-code-types%})
+The component exposes Swiss and Image QRCode types. [Read more about the supported Blazor QRCode Types...](slug://qrcode-qr-code-types)
 
 ## Methods
 
@@ -46,7 +46,7 @@ The QRCode methods are accessible through its reference.
 
 * `Refresh` - redraws the component.
 
-You can see the [example with the Barcode]({%slug barcode-overview%}#methods) and use the `Refresh()` method in the same way with QRCode.
+You can see the [example with the Barcode](slug://barcode-overview#methods) and use the `Refresh()` method in the same way with QRCode.
 
 ## Parameters
 
@@ -58,7 +58,7 @@ The Blazor Barcode provides various parameters that allow you to configure the c
 | `QRCodeEncoding` | `enum` | The encoding mode used to encode the value. |
 | `QRCodeErrorCorrection` | `enum` | The error correction level used to encode the value. |
 | `Value` | `string` | Defines the initial value of the QRCode. |
-| `Size` | `string` | Specifies the size (`Width` and `Height`) of a QR code in pixels (i.e. "200px") as the QRCode is a square. You can read more details for the dimension properties in the [Dimensions article]({%slug common-features/dimensions%}). Setting both `Size` and `Width` and/or `Height` will throw an error. Setting different values to `Width` and `Height` will also cause an issue. |
+| `Size` | `string` | Specifies the size (`Width` and `Height`) of a QR code in pixels (i.e. "200px") as the QRCode is a square. You can read more details for the dimension properties in the [Dimensions article](slug://common-features/dimensions). Setting both `Size` and `Width` and/or `Height` will throw an error. Setting different values to `Width` and `Height` will also cause an issue. |
 | `Width` | `string` | Sets the width of the QRCode. If `Height` is set and the `Size` property is not set, the same value as `Width` should be set to `Height`. |
 | `Height` | `string` | Sets the height of the QRCode. If `Height` is set and the `Size` property is not set, the same value as `Height` should be set to `Width`. |
 | `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the QRCode component. |
@@ -88,11 +88,11 @@ The nested `QRCodeBorder` tag exposes parameters that enable you to customize th
 
 ## Next Steps
 
-[Explore the QRCode Encodings]({%slug qrcode-encoding%})
+[Explore the QRCode Encodings](slug://qrcode-encoding)
 
-[Explore the QRCode Types]({%slug qrcode-qr-code-types%})
+[Explore the QRCode Types](slug://qrcode-qr-code-types)
 
 ## See Also
 
 * [Live Demo: QRCode](https://demos.telerik.com/blazor-ui/qrcode/overview)
-* [Export QRCode to Image]({%slug qrcode-barcode-chart-kb-export-to-image%})
+* [Export QRCode to Image](slug://qrcode-barcode-chart-kb-export-to-image)
diff --git a/components/breadcrumb/accessibility/wai-aria-support.md b/components/breadcrumb/accessibility/wai-aria-support.md
index 5a6dab878c..13e62e9781 100644
--- a/components/breadcrumb/accessibility/wai-aria-support.md
+++ b/components/breadcrumb/accessibility/wai-aria-support.md
@@ -69,4 +69,4 @@ For details on how the Breadcrumb keyboard navigation works, refer to the [Blazo
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/breadcrumb/data-binding.md b/components/breadcrumb/data-binding.md
index 0450690d6a..5af74a85cd 100644
--- a/components/breadcrumb/data-binding.md
+++ b/components/breadcrumb/data-binding.md
@@ -20,7 +20,7 @@ This article has the following sections:
 * How to map fields in the model to the Breadcrumb items [data bindings](#data-bindings).
 * [Example](#example-data-binding-to-non-default-field-names) of using non-default field names for data binding.
 
->tip In some cases you might prefer to dynamically generate the Breadcrumb items based on the current application `Url`. Read more how to achieve that in the [Navigation article]({%slug breadcrumb-navigation%}).
+>tip In some cases you might prefer to dynamically generate the Breadcrumb items based on the current application `Url`. Read more how to achieve that in the [Navigation article](slug://breadcrumb-navigation).
 
 ## Breadcrumb Item Features
 
@@ -29,7 +29,7 @@ The Breadcrumb items provide the following features that you control through the
 
 * `Text` - the text that will be shown on the item.
 * `Title` - the text that will be added to the `title` attribute of the html element.
-* `Icon` - The [Telerik Font or SVG icon]({%slug common-features-icons%}) that will be rendered in the item. Read more in the [Icons article]({%slug breadcrumb-icons%}).
+* `Icon` - The [Telerik Font or SVG icon](slug://common-features-icons) that will be rendered in the item. Read more in the [Icons article](slug://breadcrumb-icons).
 * `Url` - the view the item will navigate to by generating a link.
 * `Disabled` -  you can disable items by setting this field to `true`. Such items will keep rendering but will not be clickable.
 * `Class` - the CSS class that will be rendered on the main wrapping container of the item. You can use it to apply the desired styles to the separate Breadcrumb items.
diff --git a/components/breadcrumb/icons.md b/components/breadcrumb/icons.md
index 1fb85a0b49..3a51d3b3c5 100644
--- a/components/breadcrumb/icons.md
+++ b/components/breadcrumb/icons.md
@@ -10,7 +10,7 @@ position: 10
 
 # Breadcrumb Icons
 
-You can add [Telerik Font or SVG icons]({%slug common-features-icons%}) to the Breadcrumb items. The component also supports custom icons.
+You can add [Telerik Font or SVG icons](slug://common-features-icons) to the Breadcrumb items. The component also supports custom icons.
 
 To use Breadcrumb icons, define a property in the component model class and assign the property name to the `IconField` parameter of the Breadcrumb.
 
diff --git a/components/breadcrumb/navigation.md b/components/breadcrumb/navigation.md
index 00a9ea9129..c63b924f36 100644
--- a/components/breadcrumb/navigation.md
+++ b/components/breadcrumb/navigation.md
@@ -10,7 +10,7 @@ position: 7
 
 # Breadcrumb for Navigation
 
-The Breadcrumb can be used to navigate between different pages in the application. It can generate the needed links for you through its `UrlField` when [data binding]({%slug breadcrumb-data-binding%}).
+The Breadcrumb can be used to navigate between different pages in the application. It can generate the needed links for you through its `UrlField` when [data binding](slug://breadcrumb-data-binding).
 
 In some cases you might prefer to dynamically generate the breadcrumbs based on the current application `Url`. For this scenario you can use the [`NavigationManager`](https://docs.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.navigationmanager) that the component supports and subscribe to its [`LocationChanged`](https://docs.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.navigationmanager.locationchanged) event. Thus, you can set new Breadcrumb items on every location change.
 
diff --git a/components/breadcrumb/overview.md b/components/breadcrumb/overview.md
index 6489b17742..dbc7222aaa 100644
--- a/components/breadcrumb/overview.md
+++ b/components/breadcrumb/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Breadcrumb Overview
 
-The <a href="https://www.telerik.com/blazor-ui/breadcrumb" target="_blank">Blazor Breadcrumb component</a> allows navigation within a folder structure or web page. It provides an easy way to navigate backwards by one or multiple steps. In addition to built-in [navigation capabilities]({%slug breadcrumb-navigation%}), you can browse through the items, define [templates]({%slug breadcrumb-templates%}) for the individual nodes, render text and [icons]({%slug breadcrumb-icons%}), and respond to [events]({%slug breadcrumb-events%}).
+The <a href="https://www.telerik.com/blazor-ui/breadcrumb" target="_blank">Blazor Breadcrumb component</a> allows navigation within a folder structure or web page. It provides an easy way to navigate backwards by one or multiple steps. In addition to built-in [navigation capabilities](slug://breadcrumb-navigation), you can browse through the items, define [templates](slug://breadcrumb-templates) for the individual nodes, render text and [icons](slug://breadcrumb-icons), and respond to [events](slug://breadcrumb-events).
 
 >caption In this article:
 
@@ -23,9 +23,9 @@ The <a href="https://www.telerik.com/blazor-ui/breadcrumb" target="_blank">Blazo
 To use a Telerik Breadcrumb for Blazor:
 
 1. add the `TelerikBreadcrumb` tag
-1. provide a collection of objects to its `Data` property (read more in the [Data Binding article]({%slug breadcrumb-data-binding%}))
+1. provide a collection of objects to its `Data` property (read more in the [Data Binding article](slug://breadcrumb-data-binding))
 1. match the fields in the model with the binding schema for the nodes
-    * In this example, we keep it simple by only providing text for the Breadcrumb items. See the [Navigation article]({%slug breadcrumb-navigation%}) for more details on how to use the Breadcrumb for navigating through items.
+    * In this example, we keep it simple by only providing text for the Breadcrumb items. See the [Navigation article](slug://breadcrumb-navigation) for more details on how to use the Breadcrumb for navigating through items.
 
 >caption Basic Breadcrumb with data binding. The result from the snippet below.
 
@@ -97,9 +97,9 @@ To use a Telerik Breadcrumb for Blazor:
 
 The Breadcrumb provides the following features:
 
-* `Data`&mdash;a collection of flat data for all items in the Breadcrumb. See the [Data Binding]({%slug breadcrumb-data-binding%}) article for details.
+* `Data`&mdash;a collection of flat data for all items in the Breadcrumb. See the [Data Binding](slug://breadcrumb-data-binding) article for details.
 
-* `CollapseMode`&mdash;specifies how the Breadcrumb items are displayed if they cannot fit on a single line. Read more in the [Collapse Modes]({%slug breadcrumb-collapse-modes%}) article.
+* `CollapseMode`&mdash;specifies how the Breadcrumb items are displayed if they cannot fit on a single line. Read more in the [Collapse Modes](slug://breadcrumb-collapse-modes) article.
 
 * `Width`&mdash;the width of the Breadcrumb component.
 
@@ -109,11 +109,11 @@ The Breadcrumb provides the following features:
 
 * `Class`&mdash;the CSS class that will be rendered on the main wrapping element of the Breadcrumb.
 
-* `ItemTemplate`&mdash;define a custom template for the Items of the Breadcrumb. Read more in the [Templates]({%slug breadcrumb-templates%}) article.
+* `ItemTemplate`&mdash;define a custom template for the Items of the Breadcrumb. Read more in the [Templates](slug://breadcrumb-templates) article.
 
-* `SeparatorTemplate`&mdash;define a custom template for the [Breadcrumb Separator]({%slug breadcrumb-separator%}). Read more in the [Templates]({%slug breadcrumb-templates%}) article.
+* `SeparatorTemplate`&mdash;define a custom template for the [Breadcrumb Separator](slug://breadcrumb-separator). Read more in the [Templates](slug://breadcrumb-templates) article.
 
-* Events&mdash;you can respond to user actions to implement your business logic. For more details see the [Events]({%slug breadcrumb-events%}) article.
+* Events&mdash;you can respond to user actions to implement your business logic. For more details see the [Events](slug://breadcrumb-events) article.
 
 ## See Also
 
diff --git a/components/breadcrumb/separator.md b/components/breadcrumb/separator.md
index 237bf507bf..41e0cfa23b 100644
--- a/components/breadcrumb/separator.md
+++ b/components/breadcrumb/separator.md
@@ -10,11 +10,11 @@ position: 15
 
 # Breadcrumb Separator
 
-The Breadcrumb component renders a [Telerik font icon]({%slug common-features-icons%}) as a separator between its items. By default the separator icon is `chevron-right`.
+The Breadcrumb component renders a [Telerik font icon](slug://common-features-icons) as a separator between its items. By default the separator icon is `chevron-right`.
 
-You can define a separator icon of your choice through the `SeparatorIcon` attribute of the `TelerikBreadcrumb`. It accepts an `object` with the [Telerik icon]({%slug common-features-icons%}) name.
+You can define a separator icon of your choice through the `SeparatorIcon` attribute of the `TelerikBreadcrumb`. It accepts an `object` with the [Telerik icon](slug://common-features-icons) name.
 
-Furthermore, you can take full control over the Separator rendering with the [SeparatorTemplate]({%slug breadcrumb-templates%}#separatortemplate) the Breadcrumb component provides.
+Furthermore, you can take full control over the Separator rendering with the [SeparatorTemplate](slug://breadcrumb-templates#separatortemplate) the Breadcrumb component provides.
 
 >caption Change the default Breadcrumb Separator. The result from the snippet below.
 
diff --git a/components/breadcrumb/templates.md b/components/breadcrumb/templates.md
index 951ae62962..7df5b0fa75 100644
--- a/components/breadcrumb/templates.md
+++ b/components/breadcrumb/templates.md
@@ -18,7 +18,7 @@ The Breadcrumb can be customized by using Templates. This article explains the a
 
 ## ItemTemplate
 
-The `<ItemTemplate>` controls the rendering of the [data bound items]({%slug breadcrumb-data-binding%}) in the Breadcrumb, in case you want to use a rendering different than the default one.
+The `<ItemTemplate>` controls the rendering of the [data bound items](slug://breadcrumb-data-binding) in the Breadcrumb, in case you want to use a rendering different than the default one.
 
 This template receives a `context` argument that is of the data model type and represents the current item.
 
diff --git a/components/button/accessibility/wai-aria-support.md b/components/button/accessibility/wai-aria-support.md
index 42b4eaa7cd..e97341b6d9 100644
--- a/components/button/accessibility/wai-aria-support.md
+++ b/components/button/accessibility/wai-aria-support.md
@@ -62,4 +62,4 @@ For details on how the Button keyboard navigation works, refer to the [Blazor Bu
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/button/events.md b/components/button/events.md
index 5f80d1309f..79856adadc 100644
--- a/components/button/events.md
+++ b/components/button/events.md
@@ -47,4 +47,4 @@ It receives argument of type [MouseEventArgs](https://docs.microsoft.com/en-us/d
 
 ## See Also
 
-  * [Telerik UI for Blazor Button Overview]({%slug components/button/overview%})
+  * [Telerik UI for Blazor Button Overview](slug://components/button/overview)
diff --git a/components/button/icons.md b/components/button/icons.md
index 07235046ad..db11750951 100644
--- a/components/button/icons.md
+++ b/components/button/icons.md
@@ -10,7 +10,7 @@ position: 2
 
 # Button Icons
 
-You can add a [Telerik Font or SVG icon]({%slug common-features-icons%}) to the Button to illustrate its purpose by using the `Icon` parameter.
+You can add a [Telerik Font or SVG icon](slug://common-features-icons) to the Button to illustrate its purpose by using the `Icon` parameter.
 
 
 ## Icon Parameter
@@ -61,4 +61,4 @@ Images used as icons should generally be small enough to fit in a line of text.
 
 ## See Also
 
-* [Telerik UI for Blazor Button Overview]({%slug components/button/overview%})
+* [Telerik UI for Blazor Button Overview](slug://components/button/overview)
diff --git a/components/button/overview.md b/components/button/overview.md
index 2e3b7c25a6..f8008ffa5a 100644
--- a/components/button/overview.md
+++ b/components/button/overview.md
@@ -14,7 +14,7 @@ This article introduces the <a href="https://www.telerik.com/blazor-ui/buttons"
 
 Buttons convey user actions and can display text, images and HTML.
 
-The Blazor Button provides a variety of styling options through the [built-in themes]({%slug themes-overview%}) and the [button type]({%slug button-type%}). It supports [font icons and images]({%slug button-icons%}) and fires click [events]({%slug button-events%}).
+The Blazor Button provides a variety of styling options through the [built-in themes](slug://themes-overview) and the [button type](slug://button-type). It supports [font icons and images](slug://button-icons) and fires click [events](slug://button-events).
 
 ## Creating Blazor Button
 
@@ -41,23 +41,23 @@ The Blazor Button provides a variety of styling options through the [built-in th
 
 ## Icons
 
-To visually communicate the purpose of a button, you can add an image, sprite, or font icon. You can choose between a wide range of built-in font icons or use your custom font icons. [Read more about the Blazor Button icons...]({%slug button-icons%})
+To visually communicate the purpose of a button, you can add an image, sprite, or font icon. You can choose between a wide range of built-in font icons or use your custom font icons. [Read more about the Blazor Button icons...](slug://button-icons)
 
 ## Type
 
-To control the submit behavior of the Blazor Button, use the `Type` attribute. Select from the following button types: `Submit`, `Reset`, and `Button`. The component also provides a `Form` parameter, which allows the user to submit a form from an external button. [Read more about the Blazor Button Type...]({%slug button-type%})
+To control the submit behavior of the Blazor Button, use the `Type` attribute. Select from the following button types: `Submit`, `Reset`, and `Button`. The component also provides a `Form` parameter, which allows the user to submit a form from an external button. [Read more about the Blazor Button Type...](slug://button-type)
 
 ## Events
 
-The Blazor Button fires events that you can handle and respond to user actions. [Read more about the Blazor Button events...]({%slug button-events%}).
+The Blazor Button fires events that you can handle and respond to user actions. [Read more about the Blazor Button events...](slug://button-events).
 
 ## Disabled State
 
-To prevent user interaction with a Button, disable it. [Read more about the disabled state of the Blazor Button...]({%slug button-disabled%}).
+To prevent user interaction with a Button, disable it. [Read more about the disabled state of the Blazor Button...](slug://button-disabled).
 
 ## Styling
 
-To customize the style and the appearance of the Blazor Button, you can use the [built-in themes]({%slug themes-overview%}). Additionally, set the `Class` attribute to implement custom CSS rules or [configure the built-in appearance options]({%slug button-styling%}).
+To customize the style and the appearance of the Blazor Button, you can use the [built-in themes](slug://themes-overview). Additionally, set the `Class` attribute to implement custom CSS rules or [configure the built-in appearance options](slug://button-styling).
 
 >tip To learn more about the appearance, anatomy, and accessibility of the Button, visit the [Progress Design System Kit documentation](https://www.telerik.com/design-system/docs/components/button/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 
@@ -74,13 +74,13 @@ The Blazor Button provides various parameters that allow you to configure the co
 | `Enabled` | `bool` <br/> (`true`) | Whether the Button is enabled. |
 | `Form` | `string` | The ID of the associated form. Allows using a submit button outside a form. |
 | `Id` | `string` | The `id` attribute of the Button. |
-| `Icon` | `object` | The [icon rendered in the Button]({%slug button-icons%}). Can be set to a predefined Telerik icon or a custom one. | 
+| `Icon` | `object` | The [icon rendered in the Button](slug://button-icons). Can be set to a predefined Telerik icon or a custom one. | 
 | `Title` | `string` | The `title` attribute of the Button. |
 | `Visible` | `bool` <br/> (`true`) | Whether the Button is visible. |
 
 ## Button Reference and Methods
 
-Add a reference to the component instance to use the [Button methods](/blazor-ui/api/Telerik.Blazor.Components.TelerikButton). Be aware of the Blazor life cycle if you want to [focus the component on page load]({%slug inputs-kb-focus%}#focus-on-page-load).
+Add a reference to the component instance to use the [Button methods](/blazor-ui/api/Telerik.Blazor.Components.TelerikButton). Be aware of the Blazor life cycle if you want to [focus the component on page load](slug://inputs-kb-focus#focus-on-page-load).
 
 | Method | Description |
 | --- | --- |
@@ -103,14 +103,14 @@ Add a reference to the component instance to use the [Button methods](/blazor-ui
 
 ## Next Steps
 
-* [Styling the Blazor Button]({%slug button-styling%})
+* [Styling the Blazor Button](slug://button-styling)
 
-* [Using Button Icons]({%slug button-icons%})
+* [Using Button Icons](slug://button-icons)
 
 
 ## See Also
 
 * [Live Demo: Button](https://demos.telerik.com/blazor-ui/button/overview)
-* [Events]({%slug button-events%})
-* [Type]({%slug button-type%})
+* [Events](slug://button-events)
+* [Type](slug://button-type)
 * [Button API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikButton)
diff --git a/components/button/styling.md b/components/button/styling.md
index 79a59272c8..0f21c39aea 100644
--- a/components/button/styling.md
+++ b/components/button/styling.md
@@ -13,12 +13,12 @@ position: 10
 There are a few ways to style the Button component:
 
 * Set a [primary button](#primary-button) style.
-* Use another [built-in theme]({%slug themes-overview%}).
+* Use another [built-in theme](slug://themes-overview).
 * Use the [Button `Class`](#button-class) attribute.
 
 ## Primary Button
 
-To set a Primary button you should set the `ThemeColor` parameter to `primary`. [Read the Appearance article for further information...]({%slug button-appearance%}).
+To set a Primary button you should set the `ThemeColor` parameter to `primary`. [Read the Appearance article for further information...](slug://button-appearance).
 
 ## Button Class
 
diff --git a/components/button/type.md b/components/button/type.md
index 679a88b3ac..31ceab6953 100644
--- a/components/button/type.md
+++ b/components/button/type.md
@@ -27,9 +27,9 @@ You can control the `type` attribute through the `ButtonType` property of the co
 
 ## Form Parameter
 
-The Blazor Button has another parameter related to form submission - `Form`. It allows you to associate a form with a submit button, which is outside the form. Use together with the [`Id` parameter of the Form]({%slug form-overview%}#form-parameters) and set both parameters to the same `string` value.
+The Blazor Button has another parameter related to form submission - `Form`. It allows you to associate a form with a submit button, which is outside the form. Use together with the [`Id` parameter of the Form](slug://form-overview#form-parameters) and set both parameters to the same `string` value.
 
 
 ## See Also
 
-* [Telerik UI for Blazor Button Overview]({%slug components/button/overview%})
+* [Telerik UI for Blazor Button Overview](slug://components/button/overview)
diff --git a/components/buttongroup/accessibility/wai-aria-support.md b/components/buttongroup/accessibility/wai-aria-support.md
index eb46ed0373..6c72027458 100644
--- a/components/buttongroup/accessibility/wai-aria-support.md
+++ b/components/buttongroup/accessibility/wai-aria-support.md
@@ -66,4 +66,4 @@ For details on how the ButtonGroup keyboard navigation works, refer to the [Blaz
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/buttongroup/buttons.md b/components/buttongroup/buttons.md
index f33d2233b2..344a0e9c3e 100644
--- a/components/buttongroup/buttons.md
+++ b/components/buttongroup/buttons.md
@@ -15,19 +15,19 @@ The ButtonGroup component supports two types of buttons that have different beha
 * [`ButtonGroupToggleButton`](#buttongroup-togglebutton)
 * [`ButtonGroupButton`](#buttongroup-button)
 
-You can add the desired button instances by declaring the dedicated button tags. Additionally, you can individually configure their [appearance]({%slug buttongroup-appearance%}), [enabled/disabled state](#disabled-state) and [visibility](#visibility) through the parameters each button tag exposes.
+You can add the desired button instances by declaring the dedicated button tags. Additionally, you can individually configure their [appearance](slug://buttongroup-appearance), [enabled/disabled state](#disabled-state) and [visibility](#visibility) through the parameters each button tag exposes.
 
 ## ButtonGroup ToggleButton
 
-The `ButtonGroupToggleButton` becomes selected when clicked and deselects when another one is clicked. If multiple selection is enabled, the user can select more than one `ButtonGroupToggleButton` at a time. Clicking on a selected button in this case will deselect it. Read more in the [Selection]({%slug buttongroup-selection%}) article.
+The `ButtonGroupToggleButton` becomes selected when clicked and deselects when another one is clicked. If multiple selection is enabled, the user can select more than one `ButtonGroupToggleButton` at a time. Clicking on a selected button in this case will deselect it. Read more in the [Selection](slug://buttongroup-selection) article.
 
-The `ButtonGroupToggleButton` inherits the parameters and behavior of the [`TelerikToggleButton`]({%slug togglebutton-overview%}) component.
+The `ButtonGroupToggleButton` inherits the parameters and behavior of the [`TelerikToggleButton`](slug://togglebutton-overview) component.
 
 ## ButtonGroup Button
 
 The `ButtonGroupButton` does not change its visual state when clicked. It behaves as a regular button and does not support selection.
 
-The `ButtonGroupButton` inherits the parameters and behavior of the [Telerik UI for Blazor Button]({%slug components/button/overview%}) component.
+The `ButtonGroupButton` inherits the parameters and behavior of the [Telerik UI for Blazor Button](slug://components/button/overview) component.
 
 ## Disabled State
 
diff --git a/components/buttongroup/events.md b/components/buttongroup/events.md
index 1ab9e4758d..94f9b47fc8 100644
--- a/components/buttongroup/events.md
+++ b/components/buttongroup/events.md
@@ -116,5 +116,5 @@ Normally, the `SelectedChanged` handler should update the `Selected` value of th
 
 ## See Also
 
-* [ButtonGroup Overview]({%slug buttongroup-overview%})
-* [ButtonGroup Selection]({%slug buttongroup-selection%})
+* [ButtonGroup Overview](slug://buttongroup-overview)
+* [ButtonGroup Selection](slug://buttongroup-selection)
diff --git a/components/buttongroup/icons.md b/components/buttongroup/icons.md
index bc49bf1d43..092c775946 100644
--- a/components/buttongroup/icons.md
+++ b/components/buttongroup/icons.md
@@ -11,7 +11,7 @@ position: 15
 
 # ButtonGroup Icons
 
-You can add a [Telerik Font or SVG icon]({%slug common-features-icons%}) to the ButtonGroup items to illustrate its purpose by using the `Icon` parameter.
+You can add a [Telerik Font or SVG icon](slug://common-features-icons) to the ButtonGroup items to illustrate its purpose by using the `Icon` parameter.
 
 The example below also includes conditional logic to show different icons in the different button states.
 
@@ -51,4 +51,4 @@ Images used as icons should generally be small enough to fit in a line of text.
 
 ## See Also
 
-* [ButtonGroup Overview]({%slug buttongroup-overview%})
+* [ButtonGroup Overview](slug://buttongroup-overview)
diff --git a/components/buttongroup/overview.md b/components/buttongroup/overview.md
index 2eabf7b780..ae15e76099 100644
--- a/components/buttongroup/overview.md
+++ b/components/buttongroup/overview.md
@@ -12,15 +12,15 @@ position: 0
 
 This article provides information about the <a href="https://www.telerik.com/blazor-ui/buttongroup" target="_blank">Blazor ButtonGroup component</a> and its core features.
 
-The ButtonGroup component is a container for [regular and toggle buttons]({%slug buttongroup-buttons%}). Before continuing, make sure you are familiar with the differences between [regular buttons]({%slug components/button/overview%}) and [toggle buttons]({%slug togglebutton-overview%}).
+The ButtonGroup component is a container for [regular and toggle buttons](slug://buttongroup-buttons). Before continuing, make sure you are familiar with the differences between [regular buttons](slug://components/button/overview) and [toggle buttons](slug://togglebutton-overview).
 
-The ButtonGroup component lets you [select one or more toggle buttons]({%slug buttongroup-selection%}), and respond to the [selection and click events]({%slug buttongroup-events%}). The buttons inside fill up the container, match the styling according to the [chosen theme]({%slug themes-overview%}) and provide the regular button features like images and icons and the other parameters and attributes.
+The ButtonGroup component lets you [select one or more toggle buttons](slug://buttongroup-selection), and respond to the [selection and click events](slug://buttongroup-events). The buttons inside fill up the container, match the styling according to the [chosen theme](slug://themes-overview) and provide the regular button features like images and icons and the other parameters and attributes.
 
 ## Creating Blazor ButtonGroup
 
 1. Use the `<TelerikButtonGroup>` tag to add the component to your razor page.
-1. Inside it, add the desired [button tags]({%slug buttongroup-buttons%}) that denote each button - `<ButtonGroupToggleButton>` or `<ButtonGroupButton>`.
-1. Optionally, use the `OnClick` event of these buttons to handle the user actions. Read more in the [Events]({%slug buttongroup-events%}) article.
+1. Inside it, add the desired [button tags](slug://buttongroup-buttons) that denote each button - `<ButtonGroupToggleButton>` or `<ButtonGroupButton>`.
+1. Optionally, use the `OnClick` event of these buttons to handle the user actions. Read more in the [Events](slug://buttongroup-events) article.
 
 >caption Blazor ButtonGroup with regular buttons and toggle buttons, and their respective `OnClick` handlers
 
@@ -45,25 +45,25 @@ The ButtonGroup component lets you [select one or more toggle buttons]({%slug bu
 
 ## Buttons
 
-The ButtonGroup incorporates two types of buttons - `ButtonGroupToggleButton` and `ButtonGroupButton`. You can individually configure their settings, control their enabled/disabled state and visibility. [Read more about the Blazor ButtonGroup buttons...]({%slug buttongroup-buttons%})
+The ButtonGroup incorporates two types of buttons - `ButtonGroupToggleButton` and `ButtonGroupButton`. You can individually configure their settings, control their enabled/disabled state and visibility. [Read more about the Blazor ButtonGroup buttons...](slug://buttongroup-buttons)
 
 ## Icons
 
-To visually communicate the purpose of a button, you can add an image, sprite, or font icon. You can choose between a wide range of built-in font icons or use your custom font icons. [Read more about the Blazor ButtonGroup icons...]({%slug buttongroup-icons%})
+To visually communicate the purpose of a button, you can add an image, sprite, or font icon. You can choose between a wide range of built-in font icons or use your custom font icons. [Read more about the Blazor ButtonGroup icons...](slug://buttongroup-icons)
 
 ## Selection
 
-The ButtonGroup allows you to control the selection mode of its `ButtonGroupToggleButton` instances. The user can select single or multiple `ButtonGroupToggleButton`. [Read more about the selection in the ButtonGroup component...]({%slug buttongroup-selection%})
+The ButtonGroup allows you to control the selection mode of its `ButtonGroupToggleButton` instances. The user can select single or multiple `ButtonGroupToggleButton`. [Read more about the selection in the ButtonGroup component...](slug://buttongroup-selection)
 
 ## Appearance
 
-The separate button instances of the ButtonGroup provide several parameters that control their [styling and appearance, including background color, rounded corners and fill]({%slug buttongroup-appearance%}).
+The separate button instances of the ButtonGroup provide several parameters that control their [styling and appearance, including background color, rounded corners and fill](slug://buttongroup-appearance).
 
 >tip To learn more about the appearance, anatomy, and accessibility of the ButtonGroup, visit the [Progress Design System Kit documentation](https://www.telerik.com/design-system/docs/components/buttongroup/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 
 ## Events
 
-The Blazor ButtonGroup fires events that you can handle and respond to user actions. [Read more about the Blazor ButtonGroup events....]({%slug buttongroup-events%})
+The Blazor ButtonGroup fires events that you can handle and respond to user actions. [Read more about the Blazor ButtonGroup events....](slug://buttongroup-events)
 
 ## ButtonGroup Parameters
 
@@ -73,9 +73,9 @@ The following table lists ButtonGroup parameters. Check the [ButtonGroup API Ref
 
 | Parameter | Type and Default&nbsp;Value | Description |
 |---|---|---|
-| `Class` | `string` | Additional CSS class to the `<button class="k-button">` element. Use it to apply custom styles or [override the theme]({%slug themes-override%}). See [Custom Styling](#custom-styling) below. |
+| `Class` | `string` | Additional CSS class to the `<button class="k-button">` element. Use it to apply custom styles or [override the theme](slug://themes-override). See [Custom Styling](#custom-styling) below. |
 | `Enabled` | `bool` <br /> (`true`) | Whether the ButtonGroup is enabled and accepts clicks. |
-| `SelectionMode` | `ButtonGroupSelectionMode` <br /> (`ButtonGroupSelectionMode.Single`) | The [selection mode]({%slug buttongroup-selection%}) of the ButtonGroup. |
+| `SelectionMode` | `ButtonGroupSelectionMode` <br /> (`ButtonGroupSelectionMode.Single`) | The [selection mode](slug://buttongroup-selection) of the ButtonGroup. |
 | `Width` | `string` | The width of the ButtonGroup. |
 
 
@@ -112,13 +112,13 @@ You can style the individual buttons through their `Class` attribute to define y
 
 ## Next Steps
 
-* [Enhance the ButtonGroup with Icons]({%slug buttongroup-icons%})
-* [Handle ButtonGroup Events]({%slug buttongroup-buttons%})
+* [Enhance the ButtonGroup with Icons](slug://buttongroup-icons)
+* [Handle ButtonGroup Events](slug://buttongroup-buttons)
 
 ## See Also
 
 * [Live Demo: ButtonGroup](https://demos.telerik.com/blazor-ui/buttongroup/overview)
-* [Events]({%slug buttongroup-events%})
-* [Selection]({%slug buttongroup-selection%})
-* [Icons]({%slug buttongroup-icons%})
+* [Events](slug://buttongroup-events)
+* [Selection](slug://buttongroup-selection)
+* [Icons](slug://buttongroup-icons)
 * [ButtonGroup API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikButtonGroup)
diff --git a/components/buttongroup/selection.md b/components/buttongroup/selection.md
index 4e19070b66..b61eda1750 100644
--- a/components/buttongroup/selection.md
+++ b/components/buttongroup/selection.md
@@ -16,7 +16,7 @@ The ButtonGroup lets you select one or more of its `ButtonGroupToggleButton` ins
 * [Single](#single-selection) (default) - the buttons act like radio buttons
 * [Multiple](#multiple-selection) - the buttons act like checkboxes
 
-You can control whether a button is selected (it is in its `Primary` state) through its `Selected` parameter. It offers two-way binding and an [SelectedChanged event]({%slug buttongroup-events%}) so you can respond to the user actions.
+You can control whether a button is selected (it is in its `Primary` state) through its `Selected` parameter. It offers two-way binding and an [SelectedChanged event](slug://buttongroup-events) so you can respond to the user actions.
 
 ## Single Selection
 
@@ -100,6 +100,6 @@ When you click a button, it becomes selected. When you click another button, the
 
 ## See Also
 
-  * [ButtonGroup Overview]({%slug buttongroup-overview%})
-  * [ButtonGroup Events]({%slug buttongroup-events%})
+  * [ButtonGroup Overview](slug://buttongroup-overview)
+  * [ButtonGroup Events](slug://buttongroup-events)
   * [Live Demo: ButtonGroup Selection](https://demos.telerik.com/blazor-ui/buttongroup/selection)
diff --git a/components/calendar/accessibility/wai-aria-support.md b/components/calendar/accessibility/wai-aria-support.md
index 9134029968..b58d41af40 100644
--- a/components/calendar/accessibility/wai-aria-support.md
+++ b/components/calendar/accessibility/wai-aria-support.md
@@ -95,4 +95,4 @@ For details on how the Calendar keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/calendar/events.md b/components/calendar/events.md
index e00094af21..52158efbdc 100644
--- a/components/calendar/events.md
+++ b/components/calendar/events.md
@@ -20,11 +20,11 @@ This article explains the events available in the Telerik Calendar for Blazor:
 
 ## ValueChanged
 
-The `ValueChanged` event fires when the user selects a date. To see how to handle it and to obtain the user selection, review the [Selection]({%slug components/calendar/selection%}) article.
+The `ValueChanged` event fires when the user selects a date. To see how to handle it and to obtain the user selection, review the [Selection](slug://components/calendar/selection) article.
 
 ## DateChanged
 
-The `DateChanged` event fires when the currently shown date changes. For example, when the user [navigates]({%slug components/calendar/navigation%}) from one month to the next through the arrows.
+The `DateChanged` event fires when the currently shown date changes. For example, when the user [navigates](slug://components/calendar/navigation) from one month to the next through the arrows.
 
 When handling the `DateChanged` event, you cannot use two-way binding for the `Date` parameter. You should update it yourself in the model. If you do not, the currently shown range may revert to the original value set in the markup or to the default value.
 
@@ -174,7 +174,7 @@ The event arguments are of type `CalendarCellRenderEventArgs` and provide the fo
 | `Date` | `DateTime` | The date of the cell |
 | `View` | `CalendarView` enum <br /> (`Month`) | The currently visible view. You can use it to determine if the calendar is rendering the MonthView, YearView, and so on. |
 
-You can also customize the cells through their [templates]({%slug calendar-templates-overview%}). You can use the event together with the templates.
+You can also customize the cells through their [templates](slug://calendar-templates-overview). You can use the event together with the templates.
 
 >caption Use the CellRender event to style cells based on conditions
 
@@ -216,5 +216,5 @@ Special cells in the decade view will be purple and yellow on hover.
 
 ## See Also
 
-* [Selection]({%slug components/calendar/selection%})
-* [Navigation]({%slug components/calendar/navigation%})
+* [Selection](slug://components/calendar/selection)
+* [Navigation](slug://components/calendar/navigation)
diff --git a/components/calendar/multiview.md b/components/calendar/multiview.md
index 5f8c80d635..7deb44c085 100644
--- a/components/calendar/multiview.md
+++ b/components/calendar/multiview.md
@@ -35,7 +35,7 @@ Additionally, you may configure the orientation of the views through the `Orient
 
 ## See Also
 
-  * [Blazor Calendar Overview]({%slug components/calendar/overview%})
+  * [Blazor Calendar Overview](slug://components/calendar/overview)
   * [Live Demo: Calendar - MultiView](https://demos.telerik.com/blazor-ui/calendar/multiview)
   * [Live Demo: Calendar - Orientation](https://demos.telerik.com/blazor-ui/calendar/orientation)
 
diff --git a/components/calendar/overview.md b/components/calendar/overview.md
index dca7dec9b6..b01991b587 100644
--- a/components/calendar/overview.md
+++ b/components/calendar/overview.md
@@ -51,23 +51,23 @@ The selected date is: @selectedDate
 
 ## Navigation
 
-The Blazor Calendar navigation allows the user to navigate through several views that represent different periods of time, for example, a month or a year. You can control the calendar level (view) at which the user starts, to what detail (view) they can go, the min, max, and current date. To make the Calendar display a specific date programmatically, you can use the `Date` and `View` parameters that support two-way binding. [Read more about the Calendar navigation...]({%slug components/calendar/navigation%}) 
+The Blazor Calendar navigation allows the user to navigate through several views that represent different periods of time, for example, a month or a year. You can control the calendar level (view) at which the user starts, to what detail (view) they can go, the min, max, and current date. To make the Calendar display a specific date programmatically, you can use the `Date` and `View` parameters that support two-way binding. [Read more about the Calendar navigation...](slug://components/calendar/navigation) 
 
 ## Selection
 
-The Calendar allows you to configure every aspect of the date selection. You can control whether the user can select only one or more dates. You can create a collection of disabled dates so that the user cannot select from them or define selectable ranges of days. [Read more about the Calendar selection...]({%slug components/calendar/selection%})
+The Calendar allows you to configure every aspect of the date selection. You can control whether the user can select only one or more dates. You can create a collection of disabled dates so that the user cannot select from them or define selectable ranges of days. [Read more about the Calendar selection...](slug://components/calendar/selection)
 
 ## Templates
 
-The Blazor Calendar provides different types of templates to customize the component's content and styling. These include [month cell, year cell, decade cell, century cell and header templates]({%slug calendar-templates-overview%}).
+The Blazor Calendar provides different types of templates to customize the component's content and styling. These include [month cell, year cell, decade cell, century cell and header templates](slug://calendar-templates-overview).
 
 ## Multiple Views
 
-You can display a wider range of dates by rendering multiple instances of the Calendar so that the users can find the desired date easier. [Read more about the multiple views in the Calendar...]({%slug components/calendar/multiview%})
+You can display a wider range of dates by rendering multiple instances of the Calendar so that the users can find the desired date easier. [Read more about the multiple views in the Calendar...](slug://components/calendar/multiview)
 
 ## Events
 
-The Blazor Calendar generates events that you can handle and further customize ist behavior. [Read more about the Blazor Calendar events...]({%slug components/calendar/events%}).
+The Blazor Calendar generates events that you can handle and further customize ist behavior. [Read more about the Blazor Calendar events...](slug://components/calendar/events).
 
 ## Calendar Parameters
 
@@ -77,23 +77,23 @@ The Blazor Calendar provides various parameters that allow you to configure the
 
 | Attribute | Type and Default Value | Description |
 |----------|----------|----------|
-| `AllowReverse` | `bool` | When [range selection]({%slug components/calendar/selection%}#range-selection-mode) is enabled, defines if the range is valid when the selected end date is a date before the start date. |
+| `AllowReverse` | `bool` | When [range selection](slug://components/calendar/selection#range-selection-mode) is enabled, defines if the range is valid when the selected end date is a date before the start date. |
 | `BottomView` | `CalendarView` enum <br /> (`Month`) | The most detailed view of the Calendar to which the user can navigate to. |
 | `Date` | `DateTime` | The date that indicates the view the user is currently in. Supports two-way binding. |
 | `DisabledDates` | `List<DateTime>` | A list of dates that cannot be selected as the start or end of the range. See the <a href="https://demos.telerik.com/blazor-ui/calendar/disabled-dates" target="_blank">Live Demo: Calendar - Disabled Dates</a>. |
 | `Max` | `DateTime` | The latest date that the user can select. |
 | `Min` | `DateTime` | The earliest date that the user can select. |
-| `Orientation` | `CalendarOrientation` enum <br /> (`Horizontal`) | The orientation of the Calendar. The available options are `Horizontal` and `Vertical`. Applicable when using [more than one view]({%slug components/calendar/multiview%}). |
-| `RangeStart` | `DateTime` | The selected start date when [range selection]({%slug components/calendar/selection%}#range-selection-mode) is enabled. Supports two-way binding. |
-| `RangeEnd` | `DateTime` | The selected end date when [range selection]({%slug components/calendar/selection%}#range-selection-mode) is enabled. Supports two-way binding. |
-| `SelectedDates` | `List<DateTime>` | The selected dates when [multiple selection]({%slug components/calendar/selection%}#multiple-selection-mode) is used. |
-| `SelectionMode` | `CalendarSelectionMode` enum <br /> (`Single`) | The [selection mode]({%slug components/calendar/selection%}) of the calendar. |
+| `Orientation` | `CalendarOrientation` enum <br /> (`Horizontal`) | The orientation of the Calendar. The available options are `Horizontal` and `Vertical`. Applicable when using [more than one view](slug://components/calendar/multiview). |
+| `RangeStart` | `DateTime` | The selected start date when [range selection](slug://components/calendar/selection#range-selection-mode) is enabled. Supports two-way binding. |
+| `RangeEnd` | `DateTime` | The selected end date when [range selection](slug://components/calendar/selection#range-selection-mode) is enabled. Supports two-way binding. |
+| `SelectedDates` | `List<DateTime>` | The selected dates when [multiple selection](slug://components/calendar/selection#multiple-selection-mode) is used. |
+| `SelectionMode` | `CalendarSelectionMode` enum <br /> (`Single`) | The [selection mode](slug://components/calendar/selection) of the calendar. |
 | `ShowWeekNumbers` | `bool` | Sets if the Calendar will display week numbers according to the [ISO-8601 format](https://learn.microsoft.com/en-us/dotnet/api/system.globalization.isoweek.getweekofyear). Note that the [ISO week number may differ from the conventional .NET week number](https://learn.microsoft.com/en-us/dotnet/api/system.globalization.calendar.getweekofyear). |
 | `ShowOtherMonthDays` | `bool` <br /> (`true`) | Defines whether the leading and trailing days from other months are visible in the current month view. |
 | `TopView` | `CalendarView` enum <br /> (`Century`) | The most aggregated view of the Calendar to which the user can navigate. |
-| `Value` | `DateTime` or `DateTime?` | The current value of the component when [single selection]({%slug components/calendar/selection%}#single-selection-mode) is used. Supports two-way binding. |
+| `Value` | `DateTime` or `DateTime?` | The current value of the component when [single selection](slug://components/calendar/selection#single-selection-mode) is used. Supports two-way binding. |
 | `View` | ` CalendarView` enum <br /> (`Month`)| The current view that will be displayed in the Calendar. Supports two-way binding. |
-| `Views` | ` int` <br/> (`1`) | The [number of views]({%slug components/calendar/multiview%}) that will be rendered to each other. |
+| `Views` | ` int` <br/> (`1`) | The [number of views](slug://components/calendar/multiview) that will be rendered to each other. |
 
 ### Styling and Appearance
 
@@ -143,14 +143,14 @@ Add a reference to the component instance to use the [Blazor Calendar methods](/
 
 ## Next Steps
 
-* [Configuring the Date Selection]({%slug components/calendar/selection%})
+* [Configuring the Date Selection](slug://components/calendar/selection)
 
-* [Using the Calendar Events]({%slug components/calendar/events%})
+* [Using the Calendar Events](slug://components/calendar/events)
 
 ## See Also
 
-* [Navigation]({%slug components/calendar/navigation%})
-* [Selection]({%slug components/calendar/selection%})
-* [Multiple Views]({%slug components/calendar/multiview%})
+* [Navigation](slug://components/calendar/navigation)
+* [Selection](slug://components/calendar/selection)
+* [Multiple Views](slug://components/calendar/multiview)
 * [Live Demo: Calendar](https://demos.telerik.com/blazor-ui/calendar/overview)
 * [Calendar API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikCalendar)
diff --git a/components/calendar/selection.md b/components/calendar/selection.md
index 1c0c9fbd0f..069991e68e 100644
--- a/components/calendar/selection.md
+++ b/components/calendar/selection.md
@@ -32,7 +32,7 @@ You can pre-select a date in `Single` selection mode by setting the `Value` prop
 
 To pre-select dates in the `Multiple` selection mode, use the `SelectedDates` property which is of type `List<DateTime>`.
 
-In `Range` selection mode you can get the start and end dates of the range the user selected through the `RangeStart` and `RangeEnd` parameters of type `DateTime`. You also get events `RangeStartChanged` and `RangeEndChanged`. You can read more about them and see an example in the [Events]({%slug components/calendar/events%}) article.
+In `Range` selection mode you can get the start and end dates of the range the user selected through the `RangeStart` and `RangeEnd` parameters of type `DateTime`. You also get events `RangeStartChanged` and `RangeEndChanged`. You can read more about them and see an example in the [Events](slug://components/calendar/events) article.
 
 ## Receive User Selection
 
@@ -133,14 +133,14 @@ With multiple selection mode, to get the user selection, use the `SelectedDates`
 
 ### Range Selection Mode
 
-With range selection mode, the range selection is alternating, meaning every odd click sets the value of the [`RangeStart` parameter]({%slug components/calendar/overview%}#calendar-parameters), while every even click sets the value of the [`RangeEnd` parameter]({%slug components/calendar/overview%}#calendar-parameters).
+With range selection mode, the range selection is alternating, meaning every odd click sets the value of the [`RangeStart` parameter](slug://components/calendar/overview#calendar-parameters), while every even click sets the value of the [`RangeEnd` parameter](slug://components/calendar/overview#calendar-parameters).
 
-Setting either value may reset the other value if the range is not valid. The range is not valid if the `RangeStart` value is after the `RangeEnd` value. To set such range as valid you can use the [`AllowReverse` parameter]({%slug components/calendar/overview%}#calendar-parameters).
+Setting either value may reset the other value if the range is not valid. The range is not valid if the `RangeStart` value is after the `RangeEnd` value. To set such range as valid you can use the [`AllowReverse` parameter](slug://components/calendar/overview#calendar-parameters).
 
 With range selection mode, you have two options to get the user choice:
 
 * Configure two-way binding for the `RangeStart` and the `RangeEnd` parameters, OR
-* Use one-way binding for `RangeStart` and the `RangeEnd` parameters and handle the [RangeStartChanged and RangeEndChanged events]({%slug components/calendar/events%}#rangestartchanged-and-rangeendchanged).
+* Use one-way binding for `RangeStart` and the `RangeEnd` parameters and handle the [RangeStartChanged and RangeEndChanged events](slug://components/calendar/events#rangestartchanged-and-rangeendchanged).
 
 
 >caption Range selection with two-way binding and AllowReverse
diff --git a/components/calendar/templates/century-cell.md b/components/calendar/templates/century-cell.md
index e88c8aa0c5..2751b5bf23 100644
--- a/components/calendar/templates/century-cell.md
+++ b/components/calendar/templates/century-cell.md
@@ -51,7 +51,7 @@ The template receives the `DateTime` corresponding to its cell start year.
 
 ## See Also
 
- * [Calendar Templates Overview]({%slug calendar-templates-overview%})
+ * [Calendar Templates Overview](slug://calendar-templates-overview)
  * [Live Demo: Calendar Templates](https://demos.telerik.com/blazor-ui/calendar/templates)
  
 
diff --git a/components/calendar/templates/decade-cell.md b/components/calendar/templates/decade-cell.md
index ebbc1ccebc..3a947b0a57 100644
--- a/components/calendar/templates/decade-cell.md
+++ b/components/calendar/templates/decade-cell.md
@@ -42,7 +42,7 @@ The template receives the `DateTime` corresponding to its cell.
 
 ## See Also
 
- * [Calendar Templates Overview]({%slug calendar-templates-overview%})
+ * [Calendar Templates Overview](slug://calendar-templates-overview)
  * [Live Demo: Calendar Templates](https://demos.telerik.com/blazor-ui/calendar/templates)
  
 
diff --git a/components/calendar/templates/header-template.md b/components/calendar/templates/header-template.md
index 149728d6c0..82e1c86829 100644
--- a/components/calendar/templates/header-template.md
+++ b/components/calendar/templates/header-template.md
@@ -12,7 +12,7 @@ position: 10
 
 The `<HeaderTemplate>` allows you to customize the header of the calendar. If the application defines this template, the component will not render any of the built-in buttons and labels in the header area.
 
-The example below is using a [Calendar reference and methods]({%slug components/calendar/overview%}#calendar-reference-and-methods).
+The example below is using a [Calendar reference and methods](slug://components/calendar/overview#calendar-reference-and-methods).
 
 >caption Use custom rendering in the Calendar header
 
@@ -54,5 +54,5 @@ The example below is using a [Calendar reference and methods]({%slug components/
 
 ## See Also
 
-* [Calendar Templates Overview]({%slug calendar-templates-overview%})
+* [Calendar Templates Overview](slug://calendar-templates-overview)
 * [Live Demo: Calendar Templates](https://demos.telerik.com/blazor-ui/calendar/templates)
diff --git a/components/calendar/templates/month-cell.md b/components/calendar/templates/month-cell.md
index 62f3939b03..29c1861430 100644
--- a/components/calendar/templates/month-cell.md
+++ b/components/calendar/templates/month-cell.md
@@ -52,7 +52,7 @@ The template receives the `DateTime` corresponding to its cell.
 
 ## See Also
 
- * [Calendar Templates Overview]({%slug calendar-templates-overview%})
+ * [Calendar Templates Overview](slug://calendar-templates-overview)
  * [Live Demo: Calendar Templates](https://demos.telerik.com/blazor-ui/calendar/templates)
  
 
diff --git a/components/calendar/templates/overview.md b/components/calendar/templates/overview.md
index e76699a1a9..3f2d229288 100644
--- a/components/calendar/templates/overview.md
+++ b/components/calendar/templates/overview.md
@@ -14,15 +14,15 @@ You can customize the calendar appearance through the various templates it provi
 
 The Calendar component provides templates for: 
 
-* [Month Cell]({%slug calendar-templates-month%}) - the rendering of each cell in the Month view.
+* [Month Cell](slug://calendar-templates-month) - the rendering of each cell in the Month view.
 
-* [Year Cell]({%slug calendar-templates-year%}) - the rendering of each cell in the Year view.
+* [Year Cell](slug://calendar-templates-year) - the rendering of each cell in the Year view.
 
-* [Decade Cell]({%slug calendar-templates-decade%}) - the rendering of each cell in the Decade view.
+* [Decade Cell](slug://calendar-templates-decade) - the rendering of each cell in the Decade view.
 
-* [Century Cell]({%slug calendar-templates-century%}) - the rendering of each cell in the Century view.
+* [Century Cell](slug://calendar-templates-century) - the rendering of each cell in the Century view.
 
-* [Header Template]({%slug calendar-templates-header%}) - the header segment of the Calendar.
+* [Header Template](slug://calendar-templates-header) - the header segment of the Calendar.
 
 ## See Also
 
diff --git a/components/calendar/templates/year-cell.md b/components/calendar/templates/year-cell.md
index 1b7037da91..d1161d9794 100644
--- a/components/calendar/templates/year-cell.md
+++ b/components/calendar/templates/year-cell.md
@@ -42,7 +42,7 @@ The template receives the `DateTime` corresponding to its cell.
 
 ## See Also
 
- * [Calendar Templates Overview]({%slug calendar-templates-overview%})
+ * [Calendar Templates Overview](slug://calendar-templates-overview)
  * [Live Demo: Calendar Templates](https://demos.telerik.com/blazor-ui/calendar/templates)
  
 
diff --git a/components/card/accessibility/wai-aria-support.md b/components/card/accessibility/wai-aria-support.md
index 2418183050..7d72ce7c5d 100644
--- a/components/card/accessibility/wai-aria-support.md
+++ b/components/card/accessibility/wai-aria-support.md
@@ -62,9 +62,9 @@ The Card has been tested with the following screen readers and browsers combinat
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor Card Demos](https://demos.telerik.com/blazor-ui/card/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/card/actions.md b/components/card/actions.md
index 14338ae494..72855c9a5d 100644
--- a/components/card/actions.md
+++ b/components/card/actions.md
@@ -97,7 +97,7 @@ The `Layout` parameter takes a member of the `Telerik.Blazor.CardActionsLayout`
 </TelerikCard>
 ````
 
->tip Icon buttons in the CardActions area will expand horizontally and vertically, if the `Layout` is `Stretch` or if the `Orientation` is `Vertical`. If this is not desired, check this knowledge base article: [CardAction Icon Buttons Are Too Big]({%slug card-kb-icon-buttons-too-large%}).
+>tip Icon buttons in the CardActions area will expand horizontally and vertically, if the `Layout` is `Stretch` or if the `Orientation` is `Vertical`. If this is not desired, check this knowledge base article: [CardAction Icon Buttons Are Too Big](slug://card-kb-icon-buttons-too-large).
 
 ## See Also
   
diff --git a/components/card/building-blocks.md b/components/card/building-blocks.md
index 02bd21af7d..633d166b7b 100644
--- a/components/card/building-blocks.md
+++ b/components/card/building-blocks.md
@@ -19,11 +19,11 @@ The Card component supports a variety of template-based components used as build
 
 * [`CardFooter`](#cardfooter) -  renders footer area separated from the content through a separator.
 
-* [`CardImage`](#cardimage) - renders card image to fill the size of the card. Read more in the [Card Image article]({%slug card-image%}).
+* [`CardImage`](#cardimage) - renders card image to fill the size of the card. Read more in the [Card Image article](slug://card-image).
 
-* [`CardActions`](#cardactions) - renders dedicated area for actions. Read more in the [Actions article]({%slug card-actions%}).
+* [`CardActions`](#cardactions) - renders dedicated area for actions. Read more in the [Actions article](slug://card-actions).
 
-* [`CardSeparator`](#cardseparator) - renders a horizontal line. Read more in the [Card Separator]({%slug card-separator%}) article.
+* [`CardSeparator`](#cardseparator) - renders a horizontal line. Read more in the [Card Separator](slug://card-separator) article.
 
 * [`CardTitle`](#cardtitle) - renders div title with default theme styling.
 
@@ -98,7 +98,7 @@ Use the `CardFooter` tag to render the footer area of the Card.
 
 ## CardImage
 
-Use the [`CardImage`]({%slug card-image%}) tag to render the image section of the Card. The image will fill the size of the card unless you set any other `Width` and `Height` values.
+Use the [`CardImage`](slug://card-image) tag to render the image section of the Card. The image will fill the size of the card unless you set any other `Width` and `Height` values.
 
 >caption Use `CardImage` in the Card component. The result from the snippet below.
 
@@ -120,7 +120,7 @@ Use the [`CardImage`]({%slug card-image%}) tag to render the image section of th
 
 ## CardActions
 
-Use the [`CardActions`]({%slug card-actions%}) tag to render the actions area of the Card. You could place any action buttons inside and style them with the predefined orientation and layout of the buttons.
+Use the [`CardActions`](slug://card-actions) tag to render the actions area of the Card. You could place any action buttons inside and style them with the predefined orientation and layout of the buttons.
 
 >caption Use `CardActions` in the Card component. The result from the snippet below.
 
@@ -145,7 +145,7 @@ Use the [`CardActions`]({%slug card-actions%}) tag to render the actions area of
 
 ## CardSeparator
 
-Use the `CardActions` tag to render the actions area of the Card. An example of [`CardSeparator`]({%slug card-separator%}) used between Card elements or nested inside an element.
+Use the `CardActions` tag to render the actions area of the Card. An example of [`CardSeparator`](slug://card-separator) used between Card elements or nested inside an element.
 
 >caption Use `CardSeparator` in the Card component. The result from the snippet below.
 
diff --git a/components/card/overview.md b/components/card/overview.md
index b4421823ae..902f729153 100644
--- a/components/card/overview.md
+++ b/components/card/overview.md
@@ -11,16 +11,16 @@ position: 0
 
 # Blazor Card Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/card" target="_blank">Card for Blazor</a> is a component that combines text, visual content and actions about a single subject. It quickly grabs the user’s attention with its clean layout, consisting of a title, usually an image, some text as the body and perhaps a footer. You can use it to easily organize content when building catalogs, dashboards, blogs, e-shops, etc. It has dedicated areas for its [building blocks]({%slug card-building-blocks%}) and that provides various ways of component usage.
+The <a href = "https://www.telerik.com/blazor-ui/card" target="_blank">Card for Blazor</a> is a component that combines text, visual content and actions about a single subject. It quickly grabs the user’s attention with its clean layout, consisting of a title, usually an image, some text as the body and perhaps a footer. You can use it to easily organize content when building catalogs, dashboards, blogs, e-shops, etc. It has dedicated areas for its [building blocks](slug://card-building-blocks) and that provides various ways of component usage.
 
 
 ## Creating Card
 
 1. Use the `TelerikCard` tag to add the component to your razor page.
 
-1. Add the desired Building Blocks - explore the available elements in the [Card Building Blocks]({%slug card-building-blocks%}) article.
+1. Add the desired Building Blocks - explore the available elements in the [Card Building Blocks](slug://card-building-blocks) article.
 
-1. (Optional) Configure the Card settings such as ThemeColor, [Orientation]({%slug card-orientation%}).
+1. (Optional) Configure the Card settings such as ThemeColor, [Orientation](slug://card-orientation).
 
 The below snippet demonstrates the setup of a Card component with all building blocks implemented. You don't have to use them all.
 
@@ -63,20 +63,20 @@ The Card provides various parameters that allow you to configure the component:
 | Parameter   | Type | Description |
 | ----------- | ----------- | -------|
 | `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the Card.
-| `ChildContent` | `RenderFragment` | Defines the child content of the component. All possible [Card Building Blocks]({%slug card-building-blocks%}) can be directly used as a `ChildContent` of the Card.
+| `ChildContent` | `RenderFragment` | Defines the child content of the component. All possible [Card Building Blocks](slug://card-building-blocks) can be directly used as a `ChildContent` of the Card.
 | `Height` | `string` | Defines the height of the component.
-| `Orientation` | `CardOrientation` | Defines the orientation of the card. Takes a member of the `Telerik.Blazor.CardOrientation` enum (`Horizontal` or `Vertical`). Read more in the [Card Orientation article]({%slug card-orientation%}).
+| `Orientation` | `CardOrientation` | Defines the orientation of the card. Takes a member of the `Telerik.Blazor.CardOrientation` enum (`Horizontal` or `Vertical`). Read more in the [Card Orientation article](slug://card-orientation).
 | `ThemeColor` | `string` | Defines the appearance of the component. We support predefined theme colors such as primary, secondary, tertiary, success, info, warning, error, dark, light, and inverse (members of the `Telerik.Blazor.ThemeConstants.Card` class). Test changing the Card theme colors in our [live demo](https://demos.telerik.com/blazor-ui/card/appearance).
 | `Width` | `string` | Defines the width of the component.
 
 
->tip To make multiple Cards occupy the same **height** automatically, use the predefined [Deck or Group layouts]({%slug card-layouts%}). If the Cards should wrap to multiple rows, use the custom [Tile layout](https://demos.telerik.com/blazor-ui/card/data-cards). It is also possible to set a specific height to Cards with a CSS rule.
+>tip To make multiple Cards occupy the same **height** automatically, use the predefined [Deck or Group layouts](slug://card-layouts). If the Cards should wrap to multiple rows, use the custom [Tile layout](https://demos.telerik.com/blazor-ui/card/data-cards). It is also possible to set a specific height to Cards with a CSS rule.
 
 
 ## Next Steps
 
-* [Card Building Blocks]({%slug card-building-blocks%})
-* [Card Actions]({%slug card-actions%})
+* [Card Building Blocks](slug://card-building-blocks)
+* [Card Actions](slug://card-actions)
 
 ## See Also
 
diff --git a/components/carousel/accessibility/wai-aria-support.md b/components/carousel/accessibility/wai-aria-support.md
index cc7728dd13..368bba4595 100644
--- a/components/carousel/accessibility/wai-aria-support.md
+++ b/components/carousel/accessibility/wai-aria-support.md
@@ -75,4 +75,4 @@ For details on how the Carousel keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/carousel/events.md b/components/carousel/events.md
index e15d0706a4..6336b03eec 100644
--- a/components/carousel/events.md
+++ b/components/carousel/events.md
@@ -73,4 +73,4 @@ The event can be used to implement custom business logic, or update the Carousel
 
 ## See Also
 
-* [Carousel Overview]({%slug carousel-overview%})
+* [Carousel Overview](slug://carousel-overview)
diff --git a/components/carousel/overview.md b/components/carousel/overview.md
index 132d481d52..c56cde1f59 100644
--- a/components/carousel/overview.md
+++ b/components/carousel/overview.md
@@ -16,7 +16,7 @@ The <a href = "https://www.telerik.com/blazor-ui/carousel" target="_blank">Carou
 
 1. Use the `TelerikCarousel` tag to add the component to your razor page.
 1. Populate the `Data` property with your collection of items.
-1. Use the nested [`<Template>`]({%slug carousel-template%}) tag to declare the HTML content that you want to display.
+1. Use the nested [`<Template>`](slug://carousel-template) tag to declare the HTML content that you want to display.
 1. Set `Width` and `Height` attributes of the Carousel, according to the content to display.
 
 >caption Carousel with 5 pages and some basic content
@@ -59,11 +59,11 @@ The <a href = "https://www.telerik.com/blazor-ui/carousel" target="_blank">Carou
 
 ## Template
 
-To display any content in the Carousel, use a [Template]({%slug carousel-template%}) and place your desired markup inside. If a template is not set, the Carousel will not display anything.
+To display any content in the Carousel, use a [Template](slug://carousel-template) and place your desired markup inside. If a template is not set, the Carousel will not display anything.
 
 ## Events
 
-The Blazor Carousel generates events that you can handle and further customize its behavior. [Read more about the Blazor Carousel events...]({%slug carousel-events%})
+The Blazor Carousel generates events that you can handle and further customize its behavior. [Read more about the Blazor Carousel events...](slug://carousel-events)
 
 ## Carousel Parameters
 
@@ -79,22 +79,22 @@ The following table lists Carousel parameters. Check the [Carousel API Reference
 | `Page` | `int` <br/> ( 1 ) | The 1-based index of content item to display. Supports two-way binding.|
 | `AutomaticPageChange` | `bool` <br/> (`true`) | Whether the Carousel will automatically switch to the next page after a short delay.|
 | `AutomaticPageChangeInterval` | `int` <br/> ( 5000 )| The automatic page change delay in milliseconds.|
-| `Width` | `string` | The Carousel width. See [Dimensions]({%slug common-features/dimensions%}) for more details. The Carousel renders in a `<div>`, so it expands horizontally to 100% by default.|
+| `Width` | `string` | The Carousel width. See [Dimensions](slug://common-features/dimensions) for more details. The Carousel renders in a `<div>`, so it expands horizontally to 100% by default.|
 | `Height` | `string` | The Carousel height. By default and by design, the component has no height and does not expand, based on its content. *In other words, the Carousel will be zero pixels high, if height is not applied.*|
-| `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the component. Use it to apply custom styles or [override the theme]({%slug themes-override%}).
+| `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the component. Use it to apply custom styles or [override the theme](slug://themes-override).
 | `ThemeColor` | `string` <br /> (`"light"`) | Sets predefined colors to the Carousel component. Use the members of the static class `ThemeConstants.Carousel.ThemeColor` to set valid values. |
 
 ## Carousel Reference and Methods
 
 To execute Carousel methods, obtain reference to the component instance via `@ref`.
 
-The Carousel is a generic component. Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters]({%slug common-features-data-binding-overview%}#component-type).
+The Carousel is a generic component. Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters](slug://common-features-data-binding-overview#component-type).
 
 The table below lists the Carousel methods. Also consult the [Carousel API](/blazor-ui/api/Telerik.Blazor.Components.TelerikCarousel-1).
 
 | Method | Description |
 | --- | --- |
-| `Rebind` | [Refreshes the component data]({%slug carousel-refresh-data%}#rebind-method). |
+| `Rebind` | [Refreshes the component data](slug://carousel-refresh-data#rebind-method). |
 
 <div class="skip-repl"></div>
 ````RAZOR
@@ -107,12 +107,12 @@ The table below lists the Carousel methods. Also consult the [Carousel API](/bla
 
 ## Next Steps
 
-* [Declare a Template]({%slug carousel-template%})
-* [Explore the Carousel Events]({%slug carousel-events%})
+* [Declare a Template](slug://carousel-template)
+* [Explore the Carousel Events](slug://carousel-events)
 
 ## See Also
 
-* [Carousel Template]({%slug carousel-template%})
-* [Carousel Events]({%slug carousel-events%})
+* [Carousel Template](slug://carousel-template)
+* [Carousel Events](slug://carousel-events)
 * [Carousel Live Demo](https://demos.telerik.com/blazor-ui/carousel/overview)
 * [Carousel API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikCarousel-1)
diff --git a/components/carousel/refresh-data.md b/components/carousel/refresh-data.md
index c8fbfe2cd8..369ee00f46 100644
--- a/components/carousel/refresh-data.md
+++ b/components/carousel/refresh-data.md
@@ -237,6 +237,6 @@ In this article:
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
diff --git a/components/carousel/template.md b/components/carousel/template.md
index ba6e6d91a2..fc404f566f 100644
--- a/components/carousel/template.md
+++ b/components/carousel/template.md
@@ -54,5 +54,5 @@ The template exposes a `context` parameter, which allows access to the Carousel
 
 ## See Also
 
-* [Carousel Events]({%slug carousel-events%})
+* [Carousel Events](slug://carousel-events)
 * [Carousel Live Demo](https://demos.telerik.com/blazor-ui/carousel/overview)
diff --git a/components/chart/accessibility/wai-aria-support.md b/components/chart/accessibility/wai-aria-support.md
index 78f3cb1210..702d0092b8 100644
--- a/components/chart/accessibility/wai-aria-support.md
+++ b/components/chart/accessibility/wai-aria-support.md
@@ -74,4 +74,4 @@ For details on how the Chart keyboard navigation works, refer to the [Blazor Cha
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/chart/data-bind.md b/components/chart/data-bind.md
index 4208061abf..66a8565898 100644
--- a/components/chart/data-bind.md
+++ b/components/chart/data-bind.md
@@ -23,7 +23,7 @@ You can, of course, [mix these approaches](#mixed-data-source).
 
 There are three main types of chart in terms of the data they require for their x-axis:
 
-* **Categorical** - series like Area, Line, Column, Candlestick require a set of categories to match the data points values against. Those categories can be shared among different series, or unique. The categories are usually strings, but can also be [dates]({%slug components/chart/date-axis%}). While there are X and Y axes, the x-axis is not a progression of numerical values - spacing between all x-axis items is equal and they show the text of the category.
+* **Categorical** - series like Area, Line, Column, Candlestick require a set of categories to match the data points values against. Those categories can be shared among different series, or unique. The categories are usually strings, but can also be [dates](slug://components/chart/date-axis). While there are X and Y axes, the x-axis is not a progression of numerical values - spacing between all x-axis items is equal and they show the text of the category.
 
 * **Numerical** - series like Bubble, Scatter and Scatter Line represent two numerical values for the X and Y axes. They do not use categories on the x-axis and thus each data point is independent. This makes it easier to bind each series to a separate collection of data that can have different number of items in it, because plotting the data points is not dependent on string categories, but on numeric values that will be plotted and spaced according to their values.
 
@@ -429,7 +429,7 @@ This means that it is often suitable to provide each series with its own collect
 
 ## Chart Model with JsonProperty
 
-The Telerik Chart serializes its data for client-side rendering. The component will honor any server-side serialization settings. For example, `JsonProperty` settings in the Chart model will change the field names from what is in the Chart markup, as the `nameof()` operator does not use these settings. See this KB article about [using a Chart Model with `Newtonsoft.Json.JsonProperty`]({%slug chart-kb-newtonsoft-seialization-settings%}).
+The Telerik Chart serializes its data for client-side rendering. The component will honor any server-side serialization settings. For example, `JsonProperty` settings in the Chart model will change the field names from what is in the Chart markup, as the `nameof()` operator does not use these settings. See this KB article about [using a Chart Model with `Newtonsoft.Json.JsonProperty`](slug://chart-kb-newtonsoft-seialization-settings).
 
 ## See Also
 
diff --git a/components/chart/date-axis.md b/components/chart/date-axis.md
index dcf4410c55..565e4be44e 100644
--- a/components/chart/date-axis.md
+++ b/components/chart/date-axis.md
@@ -18,12 +18,12 @@ You can find the following sections:
 
 ## Categorical charts
 
-Categorical charts (such as [Column]({%slug components/chart/types/column%}), [Line]({%slug components/chart/types/line%}), [Area]({%slug components/chart/types/area%})) support displaying dates on the x-axis. A date axis aggregates the data points that fall within its scope to a single data point that gets rendered.
+Categorical charts (such as [Column](slug://components/chart/types/column), [Line](slug://components/chart/types/line), [Area](slug://components/chart/types/area)) support displaying dates on the x-axis. A date axis aggregates the data points that fall within its scope to a single data point that gets rendered.
 
 To enable a date axis:
 
 1. Set the `Type` property of the `ChartCategoryAxis` to `ChartCategoryAxisType.Date`.
-1. Provide categories of type `DateTime` to it (see [data binding a chart]({%slug components/chart/databind%})).
+1. Provide categories of type `DateTime` to it (see [data binding a chart](slug://components/chart/databind)).
 
 You can control the aggregation level through the `BaseUnit` property of the axis. It takes a member of the `Telerik.Blazor.ChartCategoryAxisBaseUnit` class.
 
@@ -142,10 +142,10 @@ Steps, custom label format, non-default start of week
 
 ## Numerical charts
 
-The numerical [Scatter]({%slug components/chart/types/scatter%}) and [ScatterLine]({%slug components/chart/types/scatterline%}) charts also support `DateTime` values for the x-axis. To enable such scenario:
+The numerical [Scatter](slug://components/chart/types/scatter) and [ScatterLine](slug://components/chart/types/scatterline) charts also support `DateTime` values for the x-axis. To enable such scenario:
 
 1. Set the `Type` property of the `ChartXAxis` to "date".
-1. Provide a field of type `DateTime` to the `XField` parameter of the `ChartSeries` (see [data binding a chart]({%slug components/chart/databind%})).
+1. Provide a field of type `DateTime` to the `XField` parameter of the `ChartSeries` (see [data binding a chart](slug://components/chart/databind)).
 
 You can control the aggregation level through the `BaseUnit` property of the axis. It takes a string and the available options are "milliseconds", "seconds", "minutes", "hours", "days", "weeks", "months" or "years".
 
@@ -274,5 +274,5 @@ For example, if the chosen `BaseUnit` is `days`, the X labels mark the beginning
 
 ## See Also
 
-  * [Data Binding a Chart]({%slug components/chart/databind%})
+  * [Data Binding a Chart](slug://components/chart/databind)
   * [Live Demos: Chart](https://demos.telerik.com/blazor-ui/chart/overview)
diff --git a/components/chart/drilldown.md b/components/chart/drilldown.md
index 4fb854f8cc..4b798be7d3 100644
--- a/components/chart/drilldown.md
+++ b/components/chart/drilldown.md
@@ -12,7 +12,7 @@ position: 55
 
 The Telerik UI for Blazor Chart supports drilldown functionality for exploring data.
 
-The drill-down feature allows the users to click on a data point (for example, bar, column, pie segment, etc.) to navigate to a different view that contains finer-grained data like breakdown by product of the selected category. The view hierarchy can be displayed in a [Breadcrumb]({%slug breadcrumb-overview%}) for easy navigation back to previous views.
+The drill-down feature allows the users to click on a data point (for example, bar, column, pie segment, etc.) to navigate to a different view that contains finer-grained data like breakdown by product of the selected category. The view hierarchy can be displayed in a [Breadcrumb](slug://breadcrumb-overview) for easy navigation back to previous views.
 
 ## Configuring DrillDown Charts
 
diff --git a/components/chart/events.md b/components/chart/events.md
index 356800690c..7a451db3af 100644
--- a/components/chart/events.md
+++ b/components/chart/events.md
@@ -236,7 +236,7 @@ The `OnLegendItemClick` event fires when the user clicks on any item in the Char
 
 ## OnDrilldown
 
-The `OnDrilldown` event is triggered when the [drill-down functionality executes]({%slug chart-drilldown%}). The handler of this event accepts a `ChartDrilldownEventArgs` object as a parameter. You can access the name of the drilled down (clicked) series through the `SeriesName` property of the event arguments object.
+The `OnDrilldown` event is triggered when the [drill-down functionality executes](slug://chart-drilldown). The handler of this event accepts a `ChartDrilldownEventArgs` object as a parameter. You can access the name of the drilled down (clicked) series through the `SeriesName` property of the event arguments object.
 
 ## OnSeriesClick
 
@@ -257,15 +257,15 @@ The event handler receives a `ChartSeriesClickEventArgs` object which provides t
 
 * `DataItem` - provides the data model of the current series item. You need to cast it to the type from your datasource, which needs to be serializable.
 
-  * If you are using a [Date Axis]({%slug components/chart/date-axis%}), the `DataItem` will contain the only the aggregated value in the corresponding y-value field, because it is a collection of more than one items. See the `Category` below for details.
+  * If you are using a [Date Axis](slug://components/chart/date-axis), the `DataItem` will contain the only the aggregated value in the corresponding y-value field, because it is a collection of more than one items. See the `Category` below for details.
 
 
-* `Category` - provides information on the category the data point is located in. You need to cast it to the type in your data source, for example `DateTime`, `string`, `int` or another type. The Category parameter is applicable to [Categorical Charts]({%slug components/chart/databind%}#series-types).
+* `Category` - provides information on the category the data point is located in. You need to cast it to the type in your data source, for example `DateTime`, `string`, `int` or another type. The Category parameter is applicable to [Categorical Charts](slug://components/chart/databind#series-types).
 
-  * When using a [Date Axis]({%slug components/chart/date-axis%}), you can use it, together with the `BaseUnit` value of the axis, to filter the data source and obtain the actual data items from the data source in case you want to provide extra information about them.
+  * When using a [Date Axis](slug://components/chart/date-axis), you can use it, together with the `BaseUnit` value of the axis, to filter the data source and obtain the actual data items from the data source in case you want to provide extra information about them.
 
 
-* `Percentage` - applicable to [Donut]({%slug components/chart/types/donut%}), [Pie]({%slug components/chart/types/pie%}) and [Stacked 100%]({%slug components/chart/stack%}#stack-100) Charts - the percentage value of the current data point from the whole.
+* `Percentage` - applicable to [Donut](slug://components/chart/types/donut), [Pie](slug://components/chart/types/pie) and [Stacked 100%](slug://components/chart/stack#stack-100) Charts - the percentage value of the current data point from the whole.
 
 * `SeriesIndex` - provides the index of the `<ChartSeries>` the data point belongs to.
 
diff --git a/components/chart/labels-template-and-format.md b/components/chart/labels-template-and-format.md
index 86b5be9776..981a66d260 100644
--- a/components/chart/labels-template-and-format.md
+++ b/components/chart/labels-template-and-format.md
@@ -111,7 +111,7 @@ The `AriaTemplate` parameter of `ChartSeriesLabels` allows the app to provide a
 
 When `AriaTemplate` is not defined, the Chart renders accessible data point labels that match the [series label template](#series-label-template). If a series label template is also not defined, the Chart renders an accessible data point label that matches the default series label.
 
-`AriaTemplate` requires the [Chart to render as SVG]({%slug chart-rendering-modes%}) (the default behavior).
+`AriaTemplate` requires the [Chart to render as SVG](slug://chart-rendering-modes) (the default behavior).
 
 ### Category Axis Label Template
 
@@ -424,7 +424,7 @@ function chartLabelFunction(context) {
 
 ### Hide Label Conditionally
 
-In some cases, you want the series to have labels, but certain data points must not have a label. For example, in a [stacked series]({%slug components/chart/stack%}) where a certain value is `0`.
+In some cases, you want the series to have labels, but certain data points must not have a label. For example, in a [stacked series](slug://components/chart/stack) where a certain value is `0`.
 
 To do that, you need to:
 
@@ -505,6 +505,6 @@ To do that, you need to:
 ## See Also
 
 * [Live Demos: Chart](https://demos.telerik.com/blazor-ui/chart/overview)
-* [Format percentage in label for Pie or Donut Chart]({%slug chart-format-percent%})
-* [Localize numeric Chart labels]({%slug chart-kb-localized-numeric-labels%})
+* [Format percentage in label for Pie or Donut Chart](slug://chart-format-percent)
+* [Localize numeric Chart labels](slug://chart-kb-localized-numeric-labels)
 * [Complex logic in Chart label format](https://github.com/telerik/blazor-ui/tree/master/chart/label-template)
diff --git a/components/chart/multiple-axes.md b/components/chart/multiple-axes.md
index 88800a32fa..6733453c6b 100644
--- a/components/chart/multiple-axes.md
+++ b/components/chart/multiple-axes.md
@@ -32,7 +32,7 @@ This article contains the following sections:
 
 ## Define Multiple Axes
 
-The way multiple axes are declared depends on the [chart series type]({%slug components/chart/databind%}#series-types):
+The way multiple axes are declared depends on the [chart series type](slug://components/chart/databind#series-types):
 
 ### Categorical Charts
 
@@ -550,5 +550,5 @@ This approach can work for both numerical and categorical axes. The example belo
 
 ## See Also
 
-  * [Data Binding a Chart]({%slug components/chart/databind%})
+  * [Data Binding a Chart](slug://components/chart/databind)
   * [Live Demos: Chart](https://demos.telerik.com/blazor-ui/chart/overview)
diff --git a/components/chart/overview.md b/components/chart/overview.md
index 5139d3ca6b..da81d751d8 100644
--- a/components/chart/overview.md
+++ b/components/chart/overview.md
@@ -15,7 +15,7 @@ The <a href="https://www.telerik.com/blazor-ui/chart" target="_blank">Blazor Cha
 ## Creating Blazor Chart
 
 1. Add the `<TelerikChart>` tag to your razor page.
-1. Define [Chart series](/blazor-ui/api/Telerik.Blazor.Components.ChartSeries) and [bind them to data]({%slug components/chart/databind%}).
+1. Define [Chart series](/blazor-ui/api/Telerik.Blazor.Components.ChartSeries) and [bind them to data](slug://components/chart/databind).
 1. Configure the [category axis](/blazor-ui/api/Telerik.Blazor.Components.ChartCategoryAxis) (X axis). Either set a `CategoryField` for each `<ChartSeries>`, or provide all `Categories` in bulk in a `<ChartCategoryAxis>` tag.
 1. Set a `<ChartTitle>` and the `Position` of the [`<ChartLegend>`](/blazor-ui/api/Telerik.Blazor.Components.ChartLegend). To make the legend appear, define a `Name` for each `<ChartSeries>`.
 
@@ -92,9 +92,9 @@ You can add a descriptive text that enriches the [Title](#chart-title) by adding
 
 ## Chart Size
 
-To control the chart size, use its `Width` and `Height` properties. You can read more on how they work in the [Dimensions]({%slug common-features/dimensions%}) article.
+To control the chart size, use its `Width` and `Height` properties. You can read more on how they work in the [Dimensions](slug://common-features/dimensions) article.
 
-You can also set the chart size in percentage values so it occupies its container when it renders. If the parent container size changes, you must call the chart's `Refresh()` C# method after the DOM has been redrawn and the new container dimensions are rendered. You can do this when you explicitly change container sizes (like in the example below), or from code that gets called by events like `window.resize`. You can find an example and guidelines for making Charts refresh on `window.resize` in the knowledge base article for [responsive Chart]({%slug chart-kb-responsive%}).
+You can also set the chart size in percentage values so it occupies its container when it renders. If the parent container size changes, you must call the chart's `Refresh()` C# method after the DOM has been redrawn and the new container dimensions are rendered. You can do this when you explicitly change container sizes (like in the example below), or from code that gets called by events like `window.resize`. You can find an example and guidelines for making Charts refresh on `window.resize` in the knowledge base article for [responsive Chart](slug://chart-kb-responsive).
 
 
 >caption Change the 100% chart size dynamically to have a responsive chart
@@ -165,7 +165,7 @@ To execute Chart methods, obtain reference to the component instance via `@ref`.
 | Method  | Description |
 |---------|-------------|
 | `Refresh` | Use the method to programmatically re-render the Chart.  |
-| `ResetDrilldownLevel` | Use the method to programmatically reset the drilldown level of the Chart. For more information refer to the [DrillDown article]({%slug chart-drilldown%}#reset-drilldown-level). |
+| `ResetDrilldownLevel` | Use the method to programmatically reset the drilldown level of the Chart. For more information refer to the [DrillDown article](slug://chart-drilldown#reset-drilldown-level). |
 
 <div class="skip-repl"></div>
 
@@ -186,9 +186,9 @@ To execute Chart methods, obtain reference to the component instance via `@ref`.
 
 ## Next Steps
 
-* [Data bind the Chart]({%slug components/chart/databind%})
-* [Explore the Chart events]({%slug chart-events%})
-* [Learn more about Chart Tooltips]({%slug chart-tooltip-overview%})
+* [Data bind the Chart](slug://components/chart/databind)
+* [Explore the Chart events](slug://chart-events)
+* [Learn more about Chart Tooltips](slug://chart-tooltip-overview)
 
 ## See Also
 
diff --git a/components/chart/plot-bands.md b/components/chart/plot-bands.md
index 378e09ae1f..5a9e519e38 100644
--- a/components/chart/plot-bands.md
+++ b/components/chart/plot-bands.md
@@ -12,7 +12,7 @@ position: 45
 
 Plot Bands are colored ranges in the Telerik UI for Blazor Chart. Their purpose is to highlight areas of the chart by changing the background in a predefined axis range.
 
-Plot bands are supported for [categorical and numerical charts]({%slug components/chart/databind%}#series-types).
+Plot bands are supported for [categorical and numerical charts](slug://components/chart/databind#series-types).
 
 ## Creating Plot Bands
 
diff --git a/components/chart/rendering-modes.md b/components/chart/rendering-modes.md
index 894fc60817..199861b760 100644
--- a/components/chart/rendering-modes.md
+++ b/components/chart/rendering-modes.md
@@ -25,7 +25,7 @@ Using vector graphics ensures that:
 * The browser zoom does not degrade the image.
 * The prints are crisp regardless of the resolution.
 
-In addition, the SVG Chart provides accessibility features such as [general description]({%slug components/chart/overview%}#chart-title) and [aria label templates]({%slug components/chart/label-template-format%}#series-label-aria-template) out of the box.
+In addition, the SVG Chart provides accessibility features such as [general description](slug://components/chart/overview#chart-title) and [aria label templates](slug://components/chart/label-template-format#series-label-aria-template) out of the box.
 
 >caption Bar Chart rendered as SVG
 
diff --git a/components/chart/stacked-series.md b/components/chart/stacked-series.md
index 4dc6ee9893..3e96b2f853 100644
--- a/components/chart/stacked-series.md
+++ b/components/chart/stacked-series.md
@@ -149,4 +149,4 @@ Stack to 100%
 ## See Also
 
 * [Live Demos: Chart](https://demos.telerik.com/blazor-ui/chart/overview)
-* [Render total value and group name for stacked columns]({%slug chart-kb-stacked-series-sum-label%})
+* [Render total value and group name for stacked columns](slug://chart-kb-stacked-series-sum-label)
diff --git a/components/chart/tooltip/overview.md b/components/chart/tooltip/overview.md
index c261150ca6..5315383343 100644
--- a/components/chart/tooltip/overview.md
+++ b/components/chart/tooltip/overview.md
@@ -10,7 +10,7 @@ position: 1
 
 # Tooltip for Telerik Blazor Chart
 
-The Telerik Chart provides a tooltip for its data points. You can have settings specific to each `<ChartSeries>`, common tooltip settings for all series, or a [shared]({%slug chart-tooltip-shared%}) tooltip for all categories.
+The Telerik Chart provides a tooltip for its data points. You can have settings specific to each `<ChartSeries>`, common tooltip settings for all series, or a [shared](slug://chart-tooltip-shared) tooltip for all categories.
 
 In this article:
 
@@ -262,5 +262,5 @@ The available series data point information in the `context` is:
 
 ## See Also
 
-  * [Chart Overview]({%slug components/chart/overview%})
-  * [Chart Shared Tooltip]({%slug chart-tooltip-shared%})
+  * [Chart Overview](slug://components/chart/overview)
+  * [Chart Shared Tooltip](slug://chart-tooltip-shared)
diff --git a/components/chart/tooltip/shared.md b/components/chart/tooltip/shared.md
index e9300e135d..eadb007acb 100644
--- a/components/chart/tooltip/shared.md
+++ b/components/chart/tooltip/shared.md
@@ -10,7 +10,7 @@ position: 2
 
 # Shared Tooltip for Telerik Blazor Chart
 
-The Telerik Chart allows you to show a unified tooltip for all categories in [Categorical]({%slug components/chart/databind%}#series-types) Charts.
+The Telerik Chart allows you to show a unified tooltip for all categories in [Categorical](slug://components/chart/databind#series-types) Charts.
 
 In this article:
 * [Basics](#basics)
@@ -21,7 +21,7 @@ In this article:
 
 ## Basics
 
-The shared tooltip provides summarized information of all data points from the hovered category (applies for [Categorical Charts]({%slug components/chart/databind%}#series-types)). This tooltip will take precedence over tooltip settings defined for a specific series.
+The shared tooltip provides summarized information of all data points from the hovered category (applies for [Categorical Charts](slug://components/chart/databind#series-types)). This tooltip will take precedence over tooltip settings defined for a specific series.
 
 To enable the shared tooltip:
 
@@ -145,5 +145,5 @@ Each `Point` contains the following data:
 
 ## See also
 
-* [Chart Overview]({%slug components/chart/overview%})
-* [Chart Tooltip Overview]({%slug chart-tooltip-overview%})
+* [Chart Overview](slug://components/chart/overview)
+* [Chart Tooltip Overview](slug://chart-tooltip-overview)
diff --git a/components/chart/types/area.md b/components/chart/types/area.md
index 5c0480f533..5981b1790a 100644
--- a/components/chart/types/area.md
+++ b/components/chart/types/area.md
@@ -16,7 +16,7 @@ The <a href="https://www.telerik.com/blazor-ui/area-chart" target="_blank">Blazo
 
 An Area chart emphasizes the volume of money, data or any other unit that the given series has encompassed. When backgrounds are semi-transparent, it lets the user clearly see where different sets of data overlap.
 
-The Area Chart is similar to the [Range Area Chart]({%slug components/chart/types/rangearea%}), which allows the area to raise above the horizontal axis.
+The Area Chart is similar to the [Range Area Chart](slug://components/chart/types/rangearea), which allows the area to raise above the horizontal axis.
 
 @[template](/_contentTemplates/chart/link-to-basics.md#understand-basics-and-databinding-first)
 
diff --git a/components/chart/types/bar.md b/components/chart/types/bar.md
index 97a052a373..ea9fa5b2c1 100644
--- a/components/chart/types/bar.md
+++ b/components/chart/types/bar.md
@@ -14,7 +14,7 @@ The <a href="https://www.telerik.com/blazor-ui/bar-chart" target="_blank">Blazor
 
 ![bar chart](images/bar-chart.png)
 
-The Bar Chart is similar to the [Range Bar Chart]({%slug components/chart/types/rangebar%}), which allows the bar to move away from the category axis.
+The Bar Chart is similar to the [Range Bar Chart](slug://components/chart/types/rangebar), which allows the bar to move away from the category axis.
 
 @[template](/_contentTemplates/chart/link-to-basics.md#understand-basics-and-databinding-first)
 
diff --git a/components/chart/types/bubble.md b/components/chart/types/bubble.md
index 1d34568293..bbfa59fe95 100644
--- a/components/chart/types/bubble.md
+++ b/components/chart/types/bubble.md
@@ -10,7 +10,7 @@ position: 0
 
 # Bubble Chart
 
-The <a href="https://www.telerik.com/blazor-ui/bubble-chart" target="_blank">Blazor Bubble chart</a> shows the data as points with coordinates and size defined by their items' values. You might think of a Bubble chart as a variation of the [Scatter chart]({%slug components/chart/types/scatter%}), in which the data points are replaced with bubbles. This allows a Bubble chart to display three dimensional data — two values for the items' coordinates and one for their size.
+The <a href="https://www.telerik.com/blazor-ui/bubble-chart" target="_blank">Blazor Bubble chart</a> shows the data as points with coordinates and size defined by their items' values. You might think of a Bubble chart as a variation of the [Scatter chart](slug://components/chart/types/scatter), in which the data points are replaced with bubbles. This allows a Bubble chart to display three dimensional data — two values for the items' coordinates and one for their size.
 
 ![bubble chart](images/bubble-chart.png)
 
diff --git a/components/chart/types/candlestick.md b/components/chart/types/candlestick.md
index 5e42d86551..f4a5228321 100644
--- a/components/chart/types/candlestick.md
+++ b/components/chart/types/candlestick.md
@@ -26,7 +26,7 @@ The <a href="https://www.telerik.com/blazor-ui/candlestick-chart" target="_blank
     * `CloseField` - the field with the Close value
     * `HighField` - the field with the High value
     * `LowField` - the field with the Low value
-4. make the x-axis a [Date axis]({%slug components/chart/date-axis%}) - while the candlestick chart can work with simple string categories, it is designed to show financial data over time
+4. make the x-axis a [Date axis](slug://components/chart/date-axis) - while the candlestick chart can work with simple string categories, it is designed to show financial data over time
 
 
 >caption A Candlestick chart that shows product financial stock data
diff --git a/components/chart/types/column.md b/components/chart/types/column.md
index e683a71d7b..323f0c6fc0 100644
--- a/components/chart/types/column.md
+++ b/components/chart/types/column.md
@@ -14,7 +14,7 @@ The <a href="https://www.telerik.com/blazor-ui/column-chart" target="_blank">Bla
 
 ![column chart](images/column-chart.png)
 
-The Column Chart is similar to the [Range Column Chart]({%slug components/chart/types/rangecolumn%}), which allows the column's low end to start above the horizontal axis.
+The Column Chart is similar to the [Range Column Chart](slug://components/chart/types/rangecolumn), which allows the column's low end to start above the horizontal axis.
 
 @[template](/_contentTemplates/chart/link-to-basics.md#understand-basics-and-databinding-first)
 
diff --git a/components/chart/types/donut.md b/components/chart/types/donut.md
index 2ef530c3a2..0865cfeca1 100644
--- a/components/chart/types/donut.md
+++ b/components/chart/types/donut.md
@@ -23,7 +23,7 @@ The <a href="https://www.telerik.com/blazor-ui/donut-chart" target="_blank">Blaz
 3. Provide a data model collection to its `Data` property
 4. Set the `Field` and `CategoryField` properties to the corresponding fields in the model that carry the values and names that will be shown in the legend
 
-If you use [simple data binding]({%slug components/chart/databind%}#independent-series-binding) and only provide values, the chart will not render a legend.
+If you use [simple data binding](slug://components/chart/databind#independent-series-binding) and only provide values, the chart will not render a legend.
 
 >caption A donut chart that shows product revenues
 
diff --git a/components/chart/types/ohlc.md b/components/chart/types/ohlc.md
index 6cceae4697..1bf5f682e8 100644
--- a/components/chart/types/ohlc.md
+++ b/components/chart/types/ohlc.md
@@ -26,7 +26,7 @@ The <a href="https://www.telerik.com/blazor-ui/ohlc-chart" target="_blank">OHLC
     * `CloseField` - the field with the Close value
     * `HighField` - the field with the High value
     * `LowField` - the field with the Low value
-4. make the x-axis a [Date axis]({%slug components/chart/date-axis%}) - while the candlestick chart can work with simple string categories, it is designed to show financial data over time
+4. make the x-axis a [Date axis](slug://components/chart/date-axis) - while the candlestick chart can work with simple string categories, it is designed to show financial data over time
 
 
 >caption An OHLC chart that shows product financial stock data
diff --git a/components/chart/types/pie.md b/components/chart/types/pie.md
index 2320523ca4..a79af30108 100644
--- a/components/chart/types/pie.md
+++ b/components/chart/types/pie.md
@@ -25,7 +25,7 @@ The <a href="https://www.telerik.com/blazor-ui/pie-chart" target="_blank">Blazor
 3. provide a data model collection to its `Data` property
 4. set the `Field` and `CategoryField` properties to the corresponding fields in the model that carry the values and names that will be shown in the legend
 
-If you use [simple data binding]({%slug components/chart/databind%}#independent-series-binding) and only provide values, the chart will not render a legend.
+If you use [simple data binding](slug://components/chart/databind#independent-series-binding) and only provide values, the chart will not render a legend.
 
 >caption A pie chart that shows product revenues
 
diff --git a/components/chart/types/rangearea.md b/components/chart/types/rangearea.md
index 4c7d974557..204a4cf7db 100644
--- a/components/chart/types/rangearea.md
+++ b/components/chart/types/rangearea.md
@@ -10,7 +10,7 @@ position: 0
 
 # Range Area Chart
 
-The <a href="https://www.telerik.com/blazor-ui/range-area-chart" target="_blank">Blazor Range Area Chart</a> shows the data as a colored area between two continuous lines that pass through points defined by pairs of `from` and `to` values. The graph between the border lines has a different customizable color for each series. The Range Area Chart is similar to the [Area Chart]({%slug components/chart/types/area%}), which can be regarded as a Range Area Chart with zero `from` values.
+The <a href="https://www.telerik.com/blazor-ui/range-area-chart" target="_blank">Blazor Range Area Chart</a> shows the data as a colored area between two continuous lines that pass through points defined by pairs of `from` and `to` values. The graph between the border lines has a different customizable color for each series. The Range Area Chart is similar to the [Area Chart](slug://components/chart/types/area), which can be regarded as a Range Area Chart with zero `from` values.
 
 You can use the Range Area Chart to emphasize the difference between pairs of continuous value sequences.
 
@@ -24,7 +24,7 @@ By default, the series backgrounds are semi-transparent, which lets the user cle
 2. Set the series `Type` parameter to `ChartSeriesType.RangeArea`.
 3. Provide a data collection to its `Data` property. You can use a [collection of arrays](#binding-range-area-series-to-collection-of-arrays) or a [collection of custom objects](#binding-range-area-series-to-custom-objects).
 4. If the Range Area data is a collection of arrays, provide data for the `Categories` parameter of the `ChartCategoryAxis`.
-5. (optional) Set `Visible="true"` to `<ChartSeriesLabels>` to show both the `from` and `to` labels. Alternatively, enable visibility or define [label `Template`]({%slug components/chart/label-template-format%}) for `<ChartSeriesLabelsFrom>` or `<ChartSeriesLabelsTo>`. These are nested tags inside `<ChartSeriesLabels>` of the respective `<ChartSeries>`.
+5. (optional) Set `Visible="true"` to `<ChartSeriesLabels>` to show both the `from` and `to` labels. Alternatively, enable visibility or define [label `Template`](slug://components/chart/label-template-format) for `<ChartSeriesLabelsFrom>` or `<ChartSeriesLabelsTo>`. These are nested tags inside `<ChartSeriesLabels>` of the respective `<ChartSeries>`.
 
 ### Binding Range Area Series to Collection of Arrays
 
diff --git a/components/chart/types/rangebar.md b/components/chart/types/rangebar.md
index 4406fefb20..ecf9f0c025 100644
--- a/components/chart/types/rangebar.md
+++ b/components/chart/types/rangebar.md
@@ -10,7 +10,7 @@ position: 0
 
 # Range Bar Chart
 
-The <a href="https://www.telerik.com/blazor-ui/range-bar-chart" target="_blank">Blazor Range Bar Chart</a> displays data as horizontal bars whose position and length vary according to pairs of `from` and `to` values. You can use a Range Bar Chart to show a comparison between several sets of data (for example, summaries of quantitative or time data). Each series is automatically colored differently for easier reading. The Range Bar Chart is similar to the [Bar Chart]({%slug components/chart/types/bar%}), which can be regarded as a Range Bar Chart with zero `from` values.
+The <a href="https://www.telerik.com/blazor-ui/range-bar-chart" target="_blank">Blazor Range Bar Chart</a> displays data as horizontal bars whose position and length vary according to pairs of `from` and `to` values. You can use a Range Bar Chart to show a comparison between several sets of data (for example, summaries of quantitative or time data). Each series is automatically colored differently for easier reading. The Range Bar Chart is similar to the [Bar Chart](slug://components/chart/types/bar), which can be regarded as a Range Bar Chart with zero `from` values.
 
 @[template](/_contentTemplates/chart/link-to-basics.md#understand-basics-and-databinding-first)
 
@@ -20,7 +20,7 @@ The <a href="https://www.telerik.com/blazor-ui/range-bar-chart" target="_blank">
 2. Set the series `Type` parameter to `ChartSeriesType.RangeBar`.
 3. Provide a data collection to the series `Data` parameter. You can use a [collection of arrays](#binding-range-bar-series-to-collection-of-arrays) or a [collection of custom objects](#binding-range-column-series-to-custom-objects).
 4. If the Range Bar data is a collection of arrays, provide data for the `Categories` parameter of the `ChartCategoryAxis`.
-5. (optional) Set `Visible="true"` or define [label `Template`]({%slug components/chart/label-template-format%}) for `<ChartSeriesLabelsFrom>` or `<ChartSeriesLabelsTo>`. These are nested tags inside `<ChartSeriesLabels>` of the respective `<ChartSeries>`.
+5. (optional) Set `Visible="true"` or define [label `Template`](slug://components/chart/label-template-format) for `<ChartSeriesLabelsFrom>` or `<ChartSeriesLabelsTo>`. These are nested tags inside `<ChartSeriesLabels>` of the respective `<ChartSeries>`.
 
 ### Binding Range Bar Series to Collection of Arrays
 
diff --git a/components/chart/types/rangecolumn.md b/components/chart/types/rangecolumn.md
index 5648ae629d..aeb22c36d7 100644
--- a/components/chart/types/rangecolumn.md
+++ b/components/chart/types/rangecolumn.md
@@ -10,7 +10,7 @@ position: 0
 
 # Range Column Chart
 
-The <a href="https://www.telerik.com/blazor-ui/range-column-chart" target="_blank">Blazor Range Column Chart</a> displays data as vertical bars whose position and height vary according to pairs of `from` and `to` values. You can use a Range Column Chart to show a comparison between several sets of data (for example, summaries of quantities or measurements for different time periods). Each series is automatically colored differently for easier perception. The Range Column Chart is similar to the [Column Chart]({%slug components/chart/types/column%}), which can be regarded as a Range Column Chart with zero `from` values.
+The <a href="https://www.telerik.com/blazor-ui/range-column-chart" target="_blank">Blazor Range Column Chart</a> displays data as vertical bars whose position and height vary according to pairs of `from` and `to` values. You can use a Range Column Chart to show a comparison between several sets of data (for example, summaries of quantities or measurements for different time periods). Each series is automatically colored differently for easier perception. The Range Column Chart is similar to the [Column Chart](slug://components/chart/types/column), which can be regarded as a Range Column Chart with zero `from` values.
 
 @[template](/_contentTemplates/chart/link-to-basics.md#understand-basics-and-databinding-first)
 
@@ -20,7 +20,7 @@ The <a href="https://www.telerik.com/blazor-ui/range-column-chart" target="_blan
 2. Set the series `Type` parameter to `ChartSeriesType.RangeColumn`.
 3. Provide a data collection to its `Data` property. You can use a [collection of arrays](#binding-range-column-series-to-collection-of-arrays) or a [collection of custom objects](#binding-range-column-series-to-custom-objects).
 4. If the Range Column data is a collection of arrays, provide data for the `Categories` parameter of the `ChartCategoryAxis`.
-5. (optional) Set `Visible="true"` or define [label `Template`]({%slug components/chart/label-template-format%}) for `<ChartSeriesLabelsFrom>` or `<ChartSeriesLabelsTo>`. These are nested tags inside `<ChartSeriesLabels>` of the respective `<ChartSeries>`.
+5. (optional) Set `Visible="true"` or define [label `Template`](slug://components/chart/label-template-format) for `<ChartSeriesLabelsFrom>` or `<ChartSeriesLabelsTo>`. These are nested tags inside `<ChartSeriesLabels>` of the respective `<ChartSeries>`.
 
 ### Binding Range Column Series to Collection of Arrays
 
diff --git a/components/chart/types/scatterline.md b/components/chart/types/scatterline.md
index 00c151f22e..b35dcf1805 100644
--- a/components/chart/types/scatterline.md
+++ b/components/chart/types/scatterline.md
@@ -10,7 +10,7 @@ position: 0
 
 # ScatterLine Chart
 
-The <a href="https://www.telerik.com/blazor-ui/scatter-line-chart" target="_blank">Blazor ScatterLine chart</a> is very similar to the [Scatter]({%slug components/chart/types/scatter%}) chart—it shows data as points defined by their items' values, but the points are connected by lines and thus it can account for missing values in a series. Its x-axis is numerical and does not require items.
+The <a href="https://www.telerik.com/blazor-ui/scatter-line-chart" target="_blank">Blazor ScatterLine chart</a> is very similar to the [Scatter](slug://components/chart/types/scatter) chart—it shows data as points defined by their items' values, but the points are connected by lines and thus it can account for missing values in a series. Its x-axis is numerical and does not require items.
 
 You would usually use ScatterLine charts for showing the relation between different sets of data, for example scientific (experimental) results, or when you need to have two numerical axes on a line-type chart.
 
diff --git a/components/checkbox/accessibility/wai-aria-support.md b/components/checkbox/accessibility/wai-aria-support.md
index f8149e8089..52a0bcdb9e 100644
--- a/components/checkbox/accessibility/wai-aria-support.md
+++ b/components/checkbox/accessibility/wai-aria-support.md
@@ -64,9 +64,9 @@ The CheckBox has been tested with the following screen readers and browsers comb
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor CheckBox Demos](https://demos.telerik.com/blazor-ui/checkbox/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/checkbox/events.md b/components/checkbox/events.md
index 5505f068c7..6530f7850c 100644
--- a/components/checkbox/events.md
+++ b/components/checkbox/events.md
@@ -209,6 +209,6 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
 
diff --git a/components/checkbox/indeterminate-state.md b/components/checkbox/indeterminate-state.md
index 445a6bda7b..b6a097eb51 100644
--- a/components/checkbox/indeterminate-state.md
+++ b/components/checkbox/indeterminate-state.md
@@ -13,7 +13,7 @@ position: 2
 In addition to `checked` and `unchecked` basic states, the Telerik CheckBox has a third state - `Indeterminate`. This means that its state is something in between - neither checked, nor unchecked.
 The main use case is when the checkbox owns a number of sub-options and they have different states, than the main checkbox is in indeterminate state.
 
-To put the checkbox in the indeterminate state, set its `Indeterminate` parameter to `true`. You can bind it to a `bool` and `bool?` types, and it also exposes the [`IndeterminateChanged` event]({%slug checkbox-events%}#indeterminatechanged) and two-way binding.
+To put the checkbox in the indeterminate state, set its `Indeterminate` parameter to `true`. You can bind it to a `bool` and `bool?` types, and it also exposes the [`IndeterminateChanged` event](slug://checkbox-events#indeterminatechanged) and two-way binding.
 
 The `Indeterminate` parameter maps to the `indeterminate` attribute of the standard HTML `<input type="checkbox" />`.
 
@@ -170,5 +170,5 @@ Checked: @TheValue
 
 ## See Also
 
-* [Checkbox Overview]({%slug checkbox-overview%})
-* [Checkbox Events]({%slug checkbox-events%})
+* [Checkbox Overview](slug://checkbox-overview)
+* [Checkbox Events](slug://checkbox-events)
diff --git a/components/checkbox/overview.md b/components/checkbox/overview.md
index 6b21d994c5..895c21102f 100644
--- a/components/checkbox/overview.md
+++ b/components/checkbox/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Checkbox Overview
 
-The <a href="https://www.telerik.com/blazor-ui/checkbox" target="_blank">Blazor Checkbox component</a> allows you to add more customizable checkboxes to your application. It maintains the behavior of the standard HTML checkbox and provides checked, unchecked and [indeterminate]({%slug checkbox-indeterminate-state%}) states.
+The <a href="https://www.telerik.com/blazor-ui/checkbox" target="_blank">Blazor Checkbox component</a> allows you to add more customizable checkboxes to your application. It maintains the behavior of the standard HTML checkbox and provides checked, unchecked and [indeterminate](slug://checkbox-indeterminate-state) states.
 
 ## Creating Blazor Checkbox
 
@@ -35,17 +35,17 @@ The <a href="https://www.telerik.com/blazor-ui/checkbox" target="_blank">Blazor
 
 ## Indeterminate State
 
-In addition to basic *checked* and *unchecked* states, the Blazor CheckBox has a third state - *indeterminate*. [Read more about the Blazor Checkbox indeterminate state]({%slug checkbox-indeterminate-state%}).
+In addition to basic *checked* and *unchecked* states, the Blazor CheckBox has a third state - *indeterminate*. [Read more about the Blazor Checkbox indeterminate state](slug://checkbox-indeterminate-state).
 
 ## Appearance
 
-The Checkbox component provides size and border settings to control its appearance. [Read more about the Blazor Checkbox appearance settings]({%slug checkbox-appearance%}).
+The Checkbox component provides size and border settings to control its appearance. [Read more about the Blazor Checkbox appearance settings](slug://checkbox-appearance).
 
 >tip To learn more about the appearance, anatomy, and accessibility of the CheckBox, visit the [Progress Design System Kit documentation](https://www.telerik.com/design-system/docs/components/checkbox/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 
 ## Events
 
-The Blazor Checkbox fires value change, focus and state change events that you can handle and further customize its behavior. [Read more about the Blazor Checkbox events]({%slug checkbox-events%}).
+The Blazor Checkbox fires value change, focus and state change events that you can handle and further customize its behavior. [Read more about the Blazor Checkbox events](slug://checkbox-events).
 
 ## Checkbox Parameters
 
@@ -58,11 +58,11 @@ The Blazor CheckBox provides various parameters that allow you to configure the
 | `Class` | `string` | Renders a custom CSS class to the `<input class="k-checkbox">` element. |
 | `Enabled` | `bool` | Whether the component is enabled. |
 | `Id` | `string` | Renders as the `id` attribute on the `<input />` element, so you can attach a `<label for="">` to it. |
-| `Indeterminate` | `bool` | Puts the CheckBox in its third state - Indeterminate. See the [Indeterminate state]({%slug checkbox-indeterminate-state%}) article for more information and examples. |
+| `Indeterminate` | `bool` | Puts the CheckBox in its third state - Indeterminate. See the [Indeterminate state](slug://checkbox-indeterminate-state) article for more information and examples. |
 | `TabIndex` | `Nullable<int>` | The `tabindex` attribute rendered on the CheckBox. |
 | `Value` | `bool` | Mapped to the `Checked` property of the normal HTML checkbox. |
 
-See also the [Input Validation]({%slug common-features/input-validation%}) article.
+See also the [Input Validation](slug://common-features/input-validation) article.
 
 ## Common Example
 
@@ -93,9 +93,9 @@ else
 
 ## Next Steps
 
-* [Explore the CheckBox Indeterminate State]({%slug checkbox-indeterminate-state%})
+* [Explore the CheckBox Indeterminate State](slug://checkbox-indeterminate-state)
 
-* [Handle the CheckBox Events]({%slug checkbox-events%})
+* [Handle the CheckBox Events](slug://checkbox-events)
 
 ## See Also
 
diff --git a/components/chip/accessibility/wai-aria-support.md b/components/chip/accessibility/wai-aria-support.md
index 2104ae194f..5b1600b570 100644
--- a/components/chip/accessibility/wai-aria-support.md
+++ b/components/chip/accessibility/wai-aria-support.md
@@ -64,4 +64,4 @@ For details on how the Chip keyboard navigation works, refer to the [Blazor Chip
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/chip/appearance.md b/components/chip/appearance.md
index 59a79854d7..17b85fb401 100644
--- a/components/chip/appearance.md
+++ b/components/chip/appearance.md
@@ -177,7 +177,7 @@ The `ThemeColor` parameter applies a predefined text color and background color.
 
 ## Next Steps
 
-* [Handle Chip events]({%slug chip-events%})
+* [Handle Chip events](slug://chip-events)
 
 ## See Also
 
diff --git a/components/chip/events.md b/components/chip/events.md
index 0ac834aab7..a33641b84d 100644
--- a/components/chip/events.md
+++ b/components/chip/events.md
@@ -22,7 +22,7 @@ The `OnClick` event fires when the user clicks or taps on the Chip component. Th
 
 ## OnRemove
 
-The `OnRemove` event fires when the user clicks the remove icon of the Chip. The event handler receives a `ChipRemoveEventArgs` object which provides the value of the [`Text` parameter]({%slug chip-overview%}#chip-parameters) of the clicked Chip. You can cancel the event by setting the `IsCancelled` property to `true`.
+The `OnRemove` event fires when the user clicks the remove icon of the Chip. The event handler receives a `ChipRemoveEventArgs` object which provides the value of the [`Text` parameter](slug://chip-overview#chip-parameters) of the clicked Chip. You can cancel the event by setting the `IsCancelled` property to `true`.
 
 ## SelectedChanged
 
@@ -69,4 +69,4 @@ The `SelectedChanged` event fires when the `Selectable` parameter is `true` and
 ## See Also
 
 * [Live Demo: Chip Events](https://demos.telerik.com/blazor-ui/chip/events)
-* [Chip OverView]({%slug chip-overview%})
+* [Chip OverView](slug://chip-overview)
diff --git a/components/chip/overview.md b/components/chip/overview.md
index 6597ae6737..0ba2f075f8 100644
--- a/components/chip/overview.md
+++ b/components/chip/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Chip Overview
 
-The <a href="https://www.telerik.com/blazor-ui/chip" target="_blank">Blazor Chip component</a> shows a piece of information in a compact form. The chip can be selected, removed or disabled. You can respond to various user interactions through the exposed [events]({%slug chip-events%}), and customize the [appearance]({%slug chip-appearance%}) of the Telerik Chip for Blazor.
+The <a href="https://www.telerik.com/blazor-ui/chip" target="_blank">Blazor Chip component</a> shows a piece of information in a compact form. The chip can be selected, removed or disabled. You can respond to various user interactions through the exposed [events](slug://chip-events), and customize the [appearance](slug://chip-appearance) of the Telerik Chip for Blazor.
 
 ## Creating Blazor Chip
 
@@ -43,11 +43,11 @@ To use a Telerik Chip for Blazor:
 
 ## Events
 
-[The Chip component fires events for clicks, selection and removal. Read more about them here.]({%slug chip-events%})
+[The Chip component fires events for clicks, selection and removal. Read more about them here.](slug://chip-events)
 
 ## Appearance
 
-You can customize the appearance of the Blazor Chip via a variety of built-in customization options. [Read more about the Chip appearance settings...]({%slug chip-appearance%})
+You can customize the appearance of the Blazor Chip via a variety of built-in customization options. [Read more about the Chip appearance settings...](slug://chip-appearance)
 
 >tip To learn more about the appearance, anatomy, and accessibility of the Chip, visit the [Progress Design System Kit documentation](https://www.telerik.com/design-system/docs/components/chip/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 
@@ -60,7 +60,7 @@ The table below lists the Chip parameters. Also check the [Chip API Reference](/
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
 | `AriaLabel` | `string` | Maps to the `aria-label` attribute of the `<div class="k-chip">` element. Use this parameter if the text that labels the component is not visible. |
-| `Class` | `string` | An additional CSS class for the `<div class="k-chip">` element. Use it to [customize the component styles and override the theme]({%slug themes-override%}). |
+| `Class` | `string` | An additional CSS class for the `<div class="k-chip">` element. Use it to [customize the component styles and override the theme](slug://themes-override). |
 | `Disabled` | `bool` | Specifies if the Chip is disabled. |
 | `Icon` | `object` | Use this parameter to render an icon in the chip. |
 | `Id` | `string` | Renders as the `id` attribute on the `<select />` element, so you can attach a `<label for="">` to it. |
@@ -69,12 +69,12 @@ The table below lists the Chip parameters. Also check the [Chip API Reference](/
 | `Selectable` | `bool` <br/> (`true`) | Specifies if the Chip can be selected. Overrides the `Selected` parameter value.|
 | `Selected` | `bool` | Controls the selected state of the Chip. |
 | `TabIndex` | `int` | Maps to the `tabindex` attribute of the HTML element. You can use it to customize the order in which the inputs in your form focus with the `Tab` key. |
-| `Text` | `string` | The string that is rendered in the Chip. You can set the `Text` parameter even when [using a `RenderFragment` as a `ChildContent` of the Chip](#creating-blazor-chip). Otherwise `ChipRemoveEventArgs.Text` will be `null` in the [`OnRemove` handler]({%slug chip-events%})#onremove. |
+| `Text` | `string` | The string that is rendered in the Chip. You can set the `Text` parameter even when [using a `RenderFragment` as a `ChildContent` of the Chip](#creating-blazor-chip). Otherwise `ChipRemoveEventArgs.Text` will be `null` in the [`OnRemove` handler](slug://chip-events)#onremove. |
 
 ## Next Steps
 
-* [Customize the Chip appearance]({%slug chip-appearance%})
-* [Handle Chip events]({%slug chip-events%})
+* [Customize the Chip appearance](slug://chip-appearance)
+* [Handle Chip events](slug://chip-events)
 
 
 ## See Also
diff --git a/components/chiplist/accessibility/wai-aria-support.md b/components/chiplist/accessibility/wai-aria-support.md
index e8aac3d594..4f1bf9e8d1 100644
--- a/components/chiplist/accessibility/wai-aria-support.md
+++ b/components/chiplist/accessibility/wai-aria-support.md
@@ -72,4 +72,4 @@ For details on how the ChipList keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/chiplist/data-bind.md b/components/chiplist/data-bind.md
index 3933febc97..58f1cedfe7 100644
--- a/components/chiplist/data-bind.md
+++ b/components/chiplist/data-bind.md
@@ -128,5 +128,5 @@ The `IconField` model property can hold:
 
 ## See Also
 
-* [ChipList Overview]({%slug chiplist-overview%})
+* [ChipList Overview](slug://chiplist-overview)
 * [Live Demo: ChipList](https://demos.telerik.com/blazor-ui/chiplist/overview)
diff --git a/components/chiplist/events.md b/components/chiplist/events.md
index 8cf69b7bd7..1b744b4a39 100644
--- a/components/chiplist/events.md
+++ b/components/chiplist/events.md
@@ -21,7 +21,7 @@ The `OnRemove` event fires when the user clicks the remove icon on any chip in t
 
 ## SelectedItemsChanged
 
-The `SelectedItemsChanged` fires when the user selects a chip from the ChipList. [Read the Selection article for more information on the SelectedItemsChanged event...]({%slug chiplist-selection%}#one-way-binding)
+The `SelectedItemsChanged` fires when the user selects a chip from the ChipList. [Read the Selection article for more information on the SelectedItemsChanged event...](slug://chiplist-selection#one-way-binding)
 
 ## Example
 
@@ -81,5 +81,5 @@ The `SelectedItemsChanged` fires when the user selects a chip from the ChipList.
 
 ## See Also
 
-* [ChipList Overview]({%slug chiplist-overview%})
-* [ChipList Selection]({%slug chiplist-selection%})
+* [ChipList Overview](slug://chiplist-overview)
+* [ChipList Selection](slug://chiplist-selection)
diff --git a/components/chiplist/overview.md b/components/chiplist/overview.md
index 39045a4a0d..d57767860a 100644
--- a/components/chiplist/overview.md
+++ b/components/chiplist/overview.md
@@ -10,14 +10,14 @@ position: 0
 
 # Blazor ChipList Overview
 
-The <a href="https://www.telerik.com/blazor-ui/chiplist" target="_blank">Blazor ChipList component</a> shows pieces of information in a compact form. The individual chips can be [selected]({%slug chiplist-selection%}), removed, or disabled. You can respond to various user interactions through the exposed [events]({%slug chiplist-events%}), customize the [appearance]({%slug chiplist-appearance%}) of the chips, or define custom content for the chip with the [ItemTemplate]({%slug chiplist-templates%}).
+The <a href="https://www.telerik.com/blazor-ui/chiplist" target="_blank">Blazor ChipList component</a> shows pieces of information in a compact form. The individual chips can be [selected](slug://chiplist-selection), removed, or disabled. You can respond to various user interactions through the exposed [events](slug://chiplist-events), customize the [appearance](slug://chiplist-appearance) of the chips, or define custom content for the chip with the [ItemTemplate](slug://chiplist-templates).
 
 ## Creating Blazor ChipList
 
 
 1. Add the `TelerikChipList` tag
 1. Set the `Data` parameter to a collection of models that will be rendered as chips.
-1. Set the `TextField` parameter to point to the corresponding name in the model that holds the text that will be rendered in the individual chip. Read the [Data Binding article]({%slug chiplist-bound%}) for more information on other binding options.
+1. Set the `TextField` parameter to point to the corresponding name in the model that holds the text that will be rendered in the individual chip. Read the [Data Binding article](slug://chiplist-bound) for more information on other binding options.
 
 >caption Basic ChipList for Blazor
 
@@ -52,23 +52,23 @@ The <a href="https://www.telerik.com/blazor-ui/chiplist" target="_blank">Blazor
 
 ## Data Binding
 
-The Blazor ChipList requires a data source so that it can display items to the user. To provide a data source, use the `Data` property. [Read more about the Blazor ChipList data binding]({%slug chiplist-bound%}).
+The Blazor ChipList requires a data source so that it can display items to the user. To provide a data source, use the `Data` property. [Read more about the Blazor ChipList data binding](slug://chiplist-bound).
 
 ## Selection
 
-The Blazor ChipList supports single and multiple selection of chips. [Read more about the Blazor ChipList selection...]({%slug chiplist-selection%})  
+The Blazor ChipList supports single and multiple selection of chips. [Read more about the Blazor ChipList selection...](slug://chiplist-selection)  
 
 ## Templates 
 
-You can use the functionality of the built-in templates and customize the default rendering of the component. [Read more about the Blazor ChipList templates...]({%slug chiplist-templates%})
+You can use the functionality of the built-in templates and customize the default rendering of the component. [Read more about the Blazor ChipList templates...](slug://chiplist-templates)
 
 ## Events
 
-You can use the built-in events of the Blazor ChipList to react to chip selection and removal. [Read more about the Blazor ChipList events...]({%slug chiplist-events%})
+You can use the built-in events of the Blazor ChipList to react to chip selection and removal. [Read more about the Blazor ChipList events...](slug://chiplist-events)
 
 ## Appearance
 
-You can customize the appearance of the Blazor ChipList via a variety of built-in customization options. [Read more about the ChipList appearance settings...]({%slug chiplist-appearance%})
+You can customize the appearance of the Blazor ChipList via a variety of built-in customization options. [Read more about the ChipList appearance settings...](slug://chiplist-appearance)
 
 ## ChipList Parameters
 
@@ -80,16 +80,16 @@ The table below lists the ChipList parameters. Also check the [ChipList API Refe
 | --- | --- | --- |
 | `AriaLabel` | `string` | Maps to the `aria-label` attribute. Use  this parameter if the text that labels the component is not visible. |
 | `AriaLabelledBy` | `string` | Maps to the `area-labelledby` attribute. Use this parameter to reference another element to define its accessible name. |
-| `Class` | `string` | An additional CSS class for the `<div class="k-chip-list">` element. Use it to [customize the component styles and override the theme]({%slug themes-override%}). |
+| `Class` | `string` | An additional CSS class for the `<div class="k-chip-list">` element. Use it to [customize the component styles and override the theme](slug://themes-override). |
 | `Data` | `IEnumerable<TItem>` | The collection of the items that will be rendered as chips. |
 | `Removable` | `bool` | Specifies if the chip can be removed by the user. If set to `true` a remove icon will be rendered on each available chip. |
 | `RemoveIcon` | `object` | Defines the icon that will be rendered if the `Removable` parameter is set to `true`. |
 
 ## Next Steps
 
-* [Binding the ChipList to Data]({%slug chiplist-bound%})
-* [Handle the ChipList events]({%slug chiplist-events%})
-* [Handle Chip Selection]({%slug chiplist-selection%})
+* [Binding the ChipList to Data](slug://chiplist-bound)
+* [Handle the ChipList events](slug://chiplist-events)
+* [Handle Chip Selection](slug://chiplist-selection)
 
 
 ## See Also
diff --git a/components/chiplist/selection.md b/components/chiplist/selection.md
index 6e9738e92f..76e77669b4 100644
--- a/components/chiplist/selection.md
+++ b/components/chiplist/selection.md
@@ -103,6 +103,6 @@ When you use the `@bind-SelectedItems` syntax, the ChipList will automatically u
 
 ## See Also
 
-* [ChipList Events]({%slug chiplist-events%})
-* [ChipList Data Binding]({%slug chiplist-bound%})
+* [ChipList Events](slug://chiplist-events)
+* [ChipList Data Binding](slug://chiplist-bound)
 
diff --git a/components/chiplist/templates.md b/components/chiplist/templates.md
index c1289c0096..1e1bacdc1e 100644
--- a/components/chiplist/templates.md
+++ b/components/chiplist/templates.md
@@ -56,6 +56,6 @@ The `<ItemTemplate>` allows you to control the rendering of the chips in the Chi
 ````
 ## See Also
 
-  * [ChipList Overview]({%slug chiplist-overview%})
+  * [ChipList Overview](slug://chiplist-overview)
    
   
diff --git a/components/chunkprogressbar/accessibility/wai-aria-support.md b/components/chunkprogressbar/accessibility/wai-aria-support.md
index 611f60af26..4037df5a4f 100644
--- a/components/chunkprogressbar/accessibility/wai-aria-support.md
+++ b/components/chunkprogressbar/accessibility/wai-aria-support.md
@@ -61,9 +61,9 @@ The ChunkProgressBar has been tested with the following screen readers and brows
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor ChunkProgressBar Demos](https://demos.telerik.com/blazor-ui/chunkprogressbar/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/chunkprogressbar/indeterminate.md b/components/chunkprogressbar/indeterminate.md
index 1cbe597817..1d8a17cb30 100644
--- a/components/chunkprogressbar/indeterminate.md
+++ b/components/chunkprogressbar/indeterminate.md
@@ -41,5 +41,5 @@ To put the ChunkProgressBar in Indeterminate state set the `Indeterminate`, `boo
 ## See Also
 
   * [Live Demo: ChunkProgressBar Overview](https://demos.telerik.com/blazor-ui/chunkprogressbar/overview)
-  * [Overview]({%slug chunkprogressbar-overview%})
+  * [Overview](slug://chunkprogressbar-overview)
   
diff --git a/components/chunkprogressbar/overview.md b/components/chunkprogressbar/overview.md
index fbeab53359..e3f53b7c6e 100644
--- a/components/chunkprogressbar/overview.md
+++ b/components/chunkprogressbar/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor ChunkProgressBar Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/chunkprogressbar" target = "_blank">Blazor ChunkProgressBar component</a> tracks the execution of operations and displays what portion of it is completed in predefined number of sections (chunks). For very long tasks, you can also make it [indeterminate]({%slug chunkprogressbar-indeterminate-state%}) while waiting for an update.
+The <a href = "https://www.telerik.com/blazor-ui/chunkprogressbar" target = "_blank">Blazor ChunkProgressBar component</a> tracks the execution of operations and displays what portion of it is completed in predefined number of sections (chunks). For very long tasks, you can also make it [indeterminate](slug://chunkprogressbar-indeterminate-state) while waiting for an update.
 
 
 ## Creating Blazor ChunkProgressBar
@@ -77,7 +77,7 @@ In the example below each chunk is "worth" `10 / 4 = 2.5`. The `Value` is `3` so
 | `Value` | `double` | The value of the ChunkProgressBar. This value indicates the progress of the tracked process and is distributed in the chunks (sections) of the ChunkProgressBar. It is a fraction of the `Max`. Read mode in the [Chunk Count, Value and MaxValue](#chunk-count-value-and-maxvalue) section. |
 | `ChunkCount` | `unsigned int` <br /> (`5`) | The number of chunks the ChunkProgressBar will be separated into. |
 | `Orientation` | `ProgressBarOrientation` <br /> (`Horizontal`) | Controls the orientation of the Chunk Progress Bar. |
-| `Indeterminate` | `bool` <br /> (`true`) | Controls if the Chunk Progress Bar is in indeterminate state. Read the [Indeterminate]({%slug chunkprogressbar-indeterminate-state%}) article for more information. |
+| `Indeterminate` | `bool` <br /> (`true`) | Controls if the Chunk Progress Bar is in indeterminate state. Read the [Indeterminate](slug://chunkprogressbar-indeterminate-state) article for more information. |
 
 ## Examples
 
@@ -100,7 +100,7 @@ In the example below each chunk is "worth" `10 / 4 = 2.5`. The `Value` is `3` so
 
 ## Next Steps
 
-* [Learn more about the Indeterminate state]({%slug chunkprogressbar-indeterminate-state%})
+* [Learn more about the Indeterminate state](slug://chunkprogressbar-indeterminate-state)
 
 ## See Also
 
diff --git a/components/colorgradient/accessibility/wai-aria-support.md b/components/colorgradient/accessibility/wai-aria-support.md
index 19613b4734..d369ae8925 100644
--- a/components/colorgradient/accessibility/wai-aria-support.md
+++ b/components/colorgradient/accessibility/wai-aria-support.md
@@ -94,4 +94,4 @@ For details on how the ColorGradient keyboard navigation works, refer to the [Bl
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/colorgradient/events.md b/components/colorgradient/events.md
index 7a86f4c532..e8a572c6a0 100644
--- a/components/colorgradient/events.md
+++ b/components/colorgradient/events.md
@@ -72,5 +72,5 @@ When using this event, make sure to update the component `Value` programmaticall
 
 ## See Also
 
-* [ColorGradient Overview]({%slug colorgradient-overview%})
+* [ColorGradient Overview](slug://colorgradient-overview)
 * [ColorGradient Live Demo](https://demos.telerik.com/blazor-ui/colorgradient/overview)
diff --git a/components/colorgradient/overview.md b/components/colorgradient/overview.md
index 34b64e796c..bd09075805 100644
--- a/components/colorgradient/overview.md
+++ b/components/colorgradient/overview.md
@@ -10,13 +10,13 @@ position: 0
 
 # Blazor ColorGradient Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/colorgradient" target="_blank">ColorGradient for Blazor</a> enables users to select a color from an [HSVA](https://en.wikipedia.org/wiki/HSL_and_HSV) canvas, or to type a specific RGB/HEX color value. Compared to our [ColorPalette component]({%slug colorpalette-overview%}), the ColorGradient allows selection from unlimited number of colors. It may also be preferred by advanced users.
+The <a href = "https://www.telerik.com/blazor-ui/colorgradient" target="_blank">ColorGradient for Blazor</a> enables users to select a color from an [HSVA](https://en.wikipedia.org/wiki/HSL_and_HSV) canvas, or to type a specific RGB/HEX color value. Compared to our [ColorPalette component](slug://colorpalette-overview), the ColorGradient allows selection from unlimited number of colors. It may also be preferred by advanced users.
 
 
 ## Creating Blazor ColorGradient
 
 1. Add the `TelerikColorGradient` tag.
-1. Set its `Value` attribute to a [HEX/RGB](#supported-value-formats) `string` variable via [one-way]({%slug colorgradient-events%}#valuechanged) or two-way binding.
+1. Set its `Value` attribute to a [HEX/RGB](#supported-value-formats) `string` variable via [one-way](slug://colorgradient-events#valuechanged) or two-way binding.
 1. (optional) Set the [`ValueFormat` and `Format` attributes](#colorgradient-parameters) to the desired color format.
 
 
@@ -36,7 +36,7 @@ The <a href = "https://www.telerik.com/blazor-ui/colorgradient" target="_blank">
 
 ## Events
 
-The Blazor ColorGradient fires value change and format change events that you can handle and further customize its behavior. [Read more about the Blazor ColorGradient events]({%slug colorgradient-events%}).
+The Blazor ColorGradient fires value change and format change events that you can handle and further customize its behavior. [Read more about the Blazor ColorGradient events](slug://colorgradient-events).
 
 ## Supported Value Formats
 
@@ -44,7 +44,7 @@ The ColorGradient accepts values by the application code in the following format
 
 @[template](/_contentTemplates/common/coloreditors.md#value-formats)
 
-Color keywords are not supported. If this is the preferred use case scenario, consider the [ColorPalette component]({%slug colorpalette-overview%}).
+Color keywords are not supported. If this is the preferred use case scenario, consider the [ColorPalette component](slug://colorpalette-overview).
 
 ## ColorGradient Parameters
 
@@ -64,9 +64,9 @@ The Blazor ColorGradient provides various parameters to configure the component.
 
 ## Next Steps
 
-* [Handle the ColorGradient Events]({%slug colorgradient-events%})
+* [Handle the ColorGradient Events](slug://colorgradient-events)
 
 ## See Also
 
-* [ColorGradient Events]({%slug colorgradient-events%})
+* [ColorGradient Events](slug://colorgradient-events)
 * [ColorGradient Live Demo](https://demos.telerik.com/blazor-ui/colorgradient/overview)
diff --git a/components/colorpalette/accessibility/wai-aria-support.md b/components/colorpalette/accessibility/wai-aria-support.md
index 4d1c2f31f4..7e1e2027be 100644
--- a/components/colorpalette/accessibility/wai-aria-support.md
+++ b/components/colorpalette/accessibility/wai-aria-support.md
@@ -67,4 +67,4 @@ For details on how the ColorPalette keyboard navigation works, refer to the [Bla
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/colorpalette/custom-colors.md b/components/colorpalette/custom-colors.md
index 197cb77bbe..c82c2f8a3e 100644
--- a/components/colorpalette/custom-colors.md
+++ b/components/colorpalette/custom-colors.md
@@ -36,5 +36,5 @@ You can provide your own set of colors to the Blazor Color Palette component. Yo
 
 ## See Also
 
-* [Color Palette Overview]({%slug colorpalette-overview%})
-* [Predefined Color Lists]({%slug colorpalette-presets%})
+* [Color Palette Overview](slug://colorpalette-overview)
+* [Predefined Color Lists](slug://colorpalette-presets)
diff --git a/components/colorpalette/events.md b/components/colorpalette/events.md
index 1f8ef7a4b0..99121d502d 100644
--- a/components/colorpalette/events.md
+++ b/components/colorpalette/events.md
@@ -104,5 +104,5 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
diff --git a/components/colorpalette/overview.md b/components/colorpalette/overview.md
index 8dae41f9a7..1fb2c9258e 100644
--- a/components/colorpalette/overview.md
+++ b/components/colorpalette/overview.md
@@ -10,9 +10,9 @@ position: 0
 
 # Blazor Color Palette Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/colorpalette" target="_blank">Blazor Color Palette component</a> provides a list of color tiles for the user to pick a color by clicking or tapping. You can choose a [predefined list of colors]({%slug colorpalette-presets%}), or [create your own]({%slug colorpalette-custom-colors%}). Two-way binding and [events]({%slug colorpalette-events%}) let you react to the user choice.
+The <a href = "https://www.telerik.com/blazor-ui/colorpalette" target="_blank">Blazor Color Palette component</a> provides a list of color tiles for the user to pick a color by clicking or tapping. You can choose a [predefined list of colors](slug://colorpalette-presets), or [create your own](slug://colorpalette-custom-colors). Two-way binding and [events](slug://colorpalette-events) let you react to the user choice.
 
-If unlimited choice of colors is preferred, consider the [ColorGradient component]({%slug colorgradient-overview%}) instead.
+If unlimited choice of colors is preferred, consider the [ColorGradient component](slug://colorgradient-overview) instead.
 
 ## Creating Blazor ColorPalette
 
@@ -33,15 +33,15 @@ If unlimited choice of colors is preferred, consider the [ColorGradient componen
 
 ## Predefined Colors
 
-The ColorPalette component comes with multiple sets of predefined colors that are shown to the users. [Read more about the available predefined ColorPallete colors]({%slug colorpalette-presets%}).
+The ColorPalette component comes with multiple sets of predefined colors that are shown to the users. [Read more about the available predefined ColorPallete colors](slug://colorpalette-presets).
 
 ## Custom Colors
 
-The ColorPallete can work with your own set of colors. [Read more about the Blazor ColorPallete custom colors setup]({%slug colorpalette-custom-colors%}).
+The ColorPallete can work with your own set of colors. [Read more about the Blazor ColorPallete custom colors setup](slug://colorpalette-custom-colors).
 
 ## Events
 
-The Blazor ColorPalette fires value change and blur events that you can handle and further customize its behavior. [Read more about the Blazor ColorPalette events]({%slug colorpalette-events%}).
+The Blazor ColorPalette fires value change and blur events that you can handle and further customize its behavior. [Read more about the Blazor ColorPalette events](slug://colorpalette-events).
 
 ## ColorPalette Parameters
 
@@ -52,16 +52,16 @@ The Blazor ColorPalette provides various parameters to configure the component.
 | Parameter | Type and Default Value | Description |
 | --- | --- | --- |
 | `Class` | `string` | Renders a custom CSS class to the `<div class="k-colorpalette">` element. |
-| `Colors` | `IEnumerable<string>` <br /> (`Office`) | The collection of colors for the user to choose from. Can be one of the [built-in preset palettes]({%slug colorpalette-presets%}), or [a custom list of colors]({%slug colorpalette-custom-colors%}). |
+| `Colors` | `IEnumerable<string>` <br /> (`Office`) | The collection of colors for the user to choose from. Can be one of the [built-in preset palettes](slug://colorpalette-presets), or [a custom list of colors](slug://colorpalette-custom-colors). |
 | `Columns` | `int` <br /> (`10`) | The number of columns to use when rendering the Colors list. Determines the size of the component together with the `TileHeight` and `TileWidth`. |
 | `Enabled` | `bool` <br /> (`true`) | Whether the component is enabled. |
 | `Id` | `string` | Renders as an `id` attribute of the `<div class="k-colorpalette">` element. |
 | `TabIndex` | `Nullable<int>` | Maps to the `tabindex` attribute of the `<div class="k-colorpalette">` element. Use it to customize the tabbing focus order on the page. |
-| `TileHeight` | `string` | The height of each individual color item. Determines the size of the component together with the `Columns` and `TileWidth`. Accepts [CSS dimension]({%slug common-features/dimensions%}) strings.  |
-| `TileWidth` | `string` | The width of each individual color item. Determines the size of the component together with the `Columns` and `TileHeight`. Accepts [CSS dimension]({%slug common-features/dimensions%}) strings. |
+| `TileHeight` | `string` | The height of each individual color item. Determines the size of the component together with the `Columns` and `TileWidth`. Accepts [CSS dimension](slug://common-features/dimensions) strings.  |
+| `TileWidth` | `string` | The width of each individual color item. Determines the size of the component together with the `Columns` and `TileHeight`. Accepts [CSS dimension](slug://common-features/dimensions) strings. |
 | `Value` | `string` | Sets the value of the input, can be used for binding. Accepts any valid [CSS `background-color` string](https://css-tricks.com/almanac/properties/b/background-color/). The preset palettes use HEX format (`#123abc`). |
 
-See the [Input Validation]({%slug common-features/input-validation%}) article.
+See the [Input Validation](slug://common-features/input-validation) article.
 
 ## Example
 
@@ -81,8 +81,8 @@ The Blazor ColorPallete provides appearance settings. Control the size of the co
 
 ## Next Steps
 
-* [Explore the ColorPallete predefined colors]({%slug colorpalette-presets%})
-* [Handle the ColorPallete events]({%slug colorpalette-events%})
+* [Explore the ColorPallete predefined colors](slug://colorpalette-presets)
+* [Handle the ColorPallete events](slug://colorpalette-events)
 
 ## See Also
 
diff --git a/components/colorpalette/presets.md b/components/colorpalette/presets.md
index 9069b0ecda..9bbbfa5f6f 100644
--- a/components/colorpalette/presets.md
+++ b/components/colorpalette/presets.md
@@ -45,5 +45,5 @@ The Telerik Blazor Color Palette component comes with a set of predefined color
 
 ## See Also
 
-* [Color Palette Overview]({%slug colorpalette-overview%})
-* [Custom Color Lists]({%slug colorpalette-custom-colors%})
+* [Color Palette Overview](slug://colorpalette-overview)
+* [Custom Color Lists](slug://colorpalette-custom-colors)
diff --git a/components/colorpicker/accessibility/wai-aria-support.md b/components/colorpicker/accessibility/wai-aria-support.md
index 42ea7f4e62..a1c97991a7 100644
--- a/components/colorpicker/accessibility/wai-aria-support.md
+++ b/components/colorpicker/accessibility/wai-aria-support.md
@@ -82,4 +82,4 @@ For details on how the ColorPicker keyboard navigation works, refer to:
 ## See Also
 
 * [Blazor ColorPicker Demos](https://demos.telerik.com/blazor-ui/colorpicker/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/colorpicker/events.md b/components/colorpicker/events.md
index 1ee6729580..d14375db67 100644
--- a/components/colorpicker/events.md
+++ b/components/colorpicker/events.md
@@ -148,5 +148,5 @@ The event handler receives as an argument an `MultiColumnComboBoxCloseEventArgs`
 
 ## See Also
 
-* [ColorPicker Overview]({%slug colorpicker-overview%})
-* [ColorPicker Views]({%slug colorpicker-views%})
+* [ColorPicker Overview](slug://colorpicker-overview)
+* [ColorPicker Views](slug://colorpicker-views)
diff --git a/components/colorpicker/overview.md b/components/colorpicker/overview.md
index 95e0170184..9f2092c8d2 100644
--- a/components/colorpicker/overview.md
+++ b/components/colorpicker/overview.md
@@ -12,13 +12,13 @@ position: 0
 
 The <a href="https://www.telerik.com/blazor-ui/colorpicker" target="_blank">Telerik UI ColorPicker for Blazor</a> is an interactive component that allows users to select colors from a popup palette or a [Hue, Saturation, Value (HSV) canvas](https://en.wikipedia.org/wiki/HSL_and_HSV), and also manually type a specific RGB or HEX color value.
 
-Practically, the ColorPicker is identical to the [Telerik UI for Blazor FlatColorPicker component]({%slug flatcolorpicker-overview%}) with the only difference that the ColorPicker takes up less space and displays the color selection UI in a popup.
+Practically, the ColorPicker is identical to the [Telerik UI for Blazor FlatColorPicker component](slug://flatcolorpicker-overview) with the only difference that the ColorPicker takes up less space and displays the color selection UI in a popup.
 
 ## Creating Blazor ColorPicker
 
 
 1. Add the `TelerikColorPicker` tag.
-1. Set its `string` `Value` parameter to any of the [supported HEX or RGB formats](#supported-value-formats). The parameter supports two-way binding or [one-way binding with a `ValueChanged` handler]({%slug colorpicker-events%}#valuechanged).
+1. Set its `string` `Value` parameter to any of the [supported HEX or RGB formats](#supported-value-formats). The parameter supports two-way binding or [one-way binding with a `ValueChanged` handler](slug://colorpicker-events#valuechanged).
 1. (optional) If your app expects a specific color format, set the `ValueFormat` to `ColorFormat.Hex` or `ColorFormat.Rgb`.
 
 >caption A basic ColorPicker with two-way value binding
@@ -35,7 +35,7 @@ Practically, the ColorPicker is identical to the [Telerik UI for Blazor FlatColo
 
 ## Views
 
-The Blazor [ColorPicker component comes with the Palette and Gradient views]({%slug colorpicker-views%}) which allow users to select a color from an interface that matches their preferences.
+The Blazor [ColorPicker component comes with the Palette and Gradient views](slug://colorpicker-views) which allow users to select a color from an interface that matches their preferences.
 
 ## Interface
 
@@ -56,7 +56,7 @@ Clicking outside the ColorPicker popup applies an **Apply** button behavior.
 
 ## Events
 
-The Blazor ColorPicker fires a set of events that you can handle to further customize its behavior. [Read more about the Telerik UI for Blazor ColorPicker events]({%slug colorpicker-events%}).
+The Blazor ColorPicker fires a set of events that you can handle to further customize its behavior. [Read more about the Telerik UI for Blazor ColorPicker events](slug://colorpicker-events).
 
 ## Supported Value Formats
 
@@ -77,14 +77,14 @@ The ColorPicker tag exposes the following features through its attributes:
 | `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode]({%slug adaptive-rendering%}) of the component. |
 | `Value` | `string` | The ColorPicker value in a few [different color formats](#supported-value-formats). Supports two-way binding. |
 | `ValueFormat` | `ColorFormat` enum <br /> (`Rgb`) | Sets the color format, which the component will return in the application code - `Rgb` or `Hex`. |
-| `ColorPickerViews` | `RenderFragment` | A nested container to list the [ColorPicker views]({%slug colorpicker-views%}). All views are enabled by default and the user can switch between them with the buttons. Each view tag has its own configuration attributes. |
-| `View` | `ColorPickerView` enum <br /> (`Gradient`) | The default selected [view]({%slug colorpicker-views%}). Supports two-way binding. |
+| `ColorPickerViews` | `RenderFragment` | A nested container to list the [ColorPicker views](slug://colorpicker-views). All views are enabled by default and the user can switch between them with the buttons. Each view tag has its own configuration attributes. |
+| `View` | `ColorPickerView` enum <br /> (`Gradient`) | The default selected [view](slug://colorpicker-views). Supports two-way binding. |
 | `ShowPreview` | `bool` <br /> (`true`) | Toggles the visibility of the [current color box and the color preview box](#interface) in the popup. |
 | `Class` | `string` | A custom CSS class for the `span.k-colorpicker` element. |
 | `Enabled` | `bool` <br /> (`true`) | Determines if the user can open the popup and change the value. |
 | `ShowButtons` | `bool` <br /> (`true`) | Controls the visibility of the **Apply** and **Cancel** buttons. |
 | `ShowClearButton` | `bool` <br /> (`true`) | Sets the visibility of the **Clear** button. |
-| `Icon` | `object` | Adds a font icon inside the [main component button](#interface). You can find more information on adding a font icon to a Telerik Component in the [Telerik Font and Svg Icons article]({%slug common-features-icons%}#icon-namespaces). |
+| `Icon` | `object` | Adds a font icon inside the [main component button](#interface). You can find more information on adding a font icon to a Telerik Component in the [Telerik Font and Svg Icons article](slug://common-features-icons#icon-namespaces). |
 
 ### Styling and Appearance
 
@@ -96,7 +96,7 @@ The following parameters enable you to customize the appearance of the Blazor Co
 | `Rounded` | `Telerik.Blazor.ThemeConstants.ColorPicker.Rounded` | Affects the `border-radius` of the ColorPicker. |
 | `FillMode` | `Telerik.Blazor.ThemeConstants.ColorPicker.FillMode` | Controls how the ColorPicker is filled. |
 
-For more information on customizing the ColorPicker styling, see the article about [setting the appearance of the ColorPicker]({%slug colorpicker-appearance%}).
+For more information on customizing the ColorPicker styling, see the article about [setting the appearance of the ColorPicker](slug://colorpicker-appearance).
 
 ## ColorPicker Reference and Methods
 
@@ -131,8 +131,8 @@ To use the [methods of the Blazor ColorPicker](/blazor-ui/api/Telerik.Blazor.Com
 
 ## Next Steps
 
-* [Explore the Telerik UI for Blazor ColorPicker Views]({%slug colorpicker-views%})
-* [Handle the Blazor ColorPicker Events]({%slug colorpicker-events%})
+* [Explore the Telerik UI for Blazor ColorPicker Views](slug://colorpicker-views)
+* [Handle the Blazor ColorPicker Events](slug://colorpicker-events)
 
 ## See Also
 
diff --git a/components/colorpicker/views.md b/components/colorpicker/views.md
index e3c586a4b2..c8735fabbf 100644
--- a/components/colorpicker/views.md
+++ b/components/colorpicker/views.md
@@ -12,14 +12,14 @@ position: 0
 
 The ColorPicker popup can display different views. They allow users to select a color from an interface that matches their preferences. The supported views are:
 
-* [ColorPickerGradientView](#colorpickergradientview) - allows unlimited color selection from an [HSVA](https://en.wikipedia.org/wiki/HSL_and_HSV) canvas. This view also renders textboxes for typing a color in [RGB or HEX format]({%slug colorpicker-overview%}#supported-value-formats).
+* [ColorPickerGradientView](#colorpickergradientview) - allows unlimited color selection from an [HSVA](https://en.wikipedia.org/wiki/HSL_and_HSV) canvas. This view also renders textboxes for typing a color in [RGB or HEX format](slug://colorpicker-overview#supported-value-formats).
 * [ColorPickerPaletteView](#colorpickerpaletteview) - allows color selection from a predefined collection of colors.
 
-By default, both views are enabled and the gradient view is displayed first. Both behaviors can be configured via the ColorPicker [`ColorPickerViews` container and `View` attribute]({%slug colorpicker-overview%}#colorpicker-parameters).
+By default, both views are enabled and the gradient view is displayed first. Both behaviors can be configured via the ColorPicker [`ColorPickerViews` container and `View` attribute](slug://colorpicker-overview#colorpicker-parameters).
 
 ## ColorPickerGradientView
 
-The GradientView uses a [`TelerikColorGradient` component]({%slug colorgradient-overview%}). The following [ColorGradient attributes]({%slug colorgradient-overview%}#colorgradient-parameters) are exposed in the `ColorPickerGradientView` tag:
+The GradientView uses a [`TelerikColorGradient` component](slug://colorgradient-overview). The following [ColorGradient attributes](slug://colorgradient-overview#colorgradient-parameters) are exposed in the `ColorPickerGradientView` tag:
 
 * `Format`
 * `Formats`
@@ -27,7 +27,7 @@ The GradientView uses a [`TelerikColorGradient` component]({%slug colorgradient-
 
 ## ColorPickerPaletteView
 
-The PaletteView uses a [`TelerikColorPalette` component]({%slug colorpalette-overview%}). The following [ColorPalette attributes]({%slug colorpalette-overview%}#colorpalette-parameters) are exposed in the `ColorPickerPaletteView` tag:
+The PaletteView uses a [`TelerikColorPalette` component](slug://colorpalette-overview). The following [ColorPalette attributes](slug://colorpalette-overview#colorpalette-parameters) are exposed in the `ColorPickerPaletteView` tag:
 
 * `Columns`
 * `Colors`
@@ -58,5 +58,5 @@ The PaletteView uses a [`TelerikColorPalette` component]({%slug colorpalette-ove
 
 ## See Also
 
-* [ColorPicker Events]({%slug colorpicker-events%})
+* [ColorPicker Events](slug://colorpicker-events)
 * [ColorPicker Views Demo](https://demos.telerik.com/blazor-ui/colorpicker/views)
diff --git a/components/combobox/accessibility/wai-aria-support.md b/components/combobox/accessibility/wai-aria-support.md
index ec2034cf40..9401a8e7e6 100644
--- a/components/combobox/accessibility/wai-aria-support.md
+++ b/components/combobox/accessibility/wai-aria-support.md
@@ -104,4 +104,4 @@ For details on how the ComboBox keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/combobox/custom-value.md b/components/combobox/custom-value.md
index 3d08ce4be6..3f5ca2e5f2 100644
--- a/components/combobox/custom-value.md
+++ b/components/combobox/custom-value.md
@@ -18,9 +18,9 @@ To enable custom user input set the `AllowCustom` parameter to `true`.
 
 >note When custom values are enabled, the `TextField`, `ValueField` and the `Value` must be of type `string`. Otherwise an exception will be thrown. Strings are required because the user input can take any form and may not be parsable to other types (such as numbers or GUID).
 
-When custom input is allowed, the [ValueChanged event]({%slug components/combobox/events%}) fires on every keystroke, and not when an item is selected, because the ComboBox component acts as a text input.
+When custom input is allowed, the [ValueChanged event](slug://components/combobox/events) fires on every keystroke, and not when an item is selected, because the ComboBox component acts as a text input.
 
-When custom values are typed in, there may be no selected item in the ComboBox. See the [ComboBox Overview - Selected Item]({%slug components/combobox/overview%}#selected-item) article for details on when how item selection and `Value` work together.
+When custom values are typed in, there may be no selected item in the ComboBox. See the [ComboBox Overview - Selected Item](slug://components/combobox/overview#selected-item) article for details on when how item selection and `Value` work together.
 
 >caption Allow custom user input in the combo box
 
@@ -103,7 +103,7 @@ Selected value: @selectedValue
 
 ## Limitations
 
-* `AllowCustom` is not compatible with [Adaptive rendering]({%slug adaptive-rendering%}).
+* `AllowCustom` is not compatible with [Adaptive rendering](slug://adaptive-rendering).
 
 ## See Also
 
diff --git a/components/combobox/data-bind.md b/components/combobox/data-bind.md
index d5e4223f1b..0cfdc673b5 100644
--- a/components/combobox/data-bind.md
+++ b/components/combobox/data-bind.md
@@ -109,7 +109,7 @@ The ComboBox component attempts to infer the type of its model and value based o
 
 ### Value Out of Range
 
-This specific is applicable for the case when [custom value input]({%slug components/combobox/custom-value%}) is disabled (`AllowCustom="false"` which is its default value).
+This specific is applicable for the case when [custom value input](slug://components/combobox/custom-value) is disabled (`AllowCustom="false"` which is its default value).
 
 When the `Value` the application provides does not match any of the values present in the `ValueField` of the `Data` collection, the ComboBox component will not change the `Value` or select a new item. In the common case, it will show up blank to indicate there is nothing selected from its data.
 
@@ -210,5 +210,5 @@ In case you cannot provide strongly-typed `Value` or `Data` at compile time, you
 
 ## See Also
 
-* [Blazor ComboBox Overview]({%slug components/combobox/overview%})
+* [Blazor ComboBox Overview](slug://components/combobox/overview)
 * [Live Demo: ComboBox](https://demos.telerik.com/blazor-ui/combobox/overview)
diff --git a/components/combobox/events.md b/components/combobox/events.md
index 348b656b6b..ee342e68c2 100644
--- a/components/combobox/events.md
+++ b/components/combobox/events.md
@@ -24,9 +24,9 @@ This article explains the events available in the Telerik ComboBox for Blazor:
 
 ## ValueChanged
 
-The `ValueChanged` event fires upon every change of the user selection. When [custom values]({%slug components/combobox/custom-value%}) are enabled, it fires upon every keystroke, like in a regular `<input>` element.
+The `ValueChanged` event fires upon every change of the user selection. When [custom values](slug://components/combobox/custom-value) are enabled, it fires upon every keystroke, like in a regular `<input>` element.
 
-The examples below use binding to string data for simplicity, but you can use [full models]({%slug components/combobox/databind%}) as well. Make sure to review the [Data Binding - Missing Value or Data]({%slug components/combobox/databind%}#missing-value-or-data) section to provide all necessary parameters to the component if you do so. The type of the argument in the lambda expression must match the `Value` type of the component, and the `ValueField` type (if `ValueField` is set).
+The examples below use binding to string data for simplicity, but you can use [full models](slug://components/combobox/databind) as well. Make sure to review the [Data Binding - Missing Value or Data](slug://components/combobox/databind#missing-value-or-data) section to provide all necessary parameters to the component if you do so. The type of the argument in the lambda expression must match the `Value` type of the component, and the `ValueField` type (if `ValueField` is set).
 
 >caption Handle ValueChanged with list values
 
@@ -107,7 +107,7 @@ The `OnChange` event represents a user action - confirmation of the current valu
 * `OnChange` does not prevent two-way binding (the `@bind-Value` syntax)
 * `OnChange` fires when the user presses `Enter` in the input, or blurs the input (for example, clicks outside of the combo box). It does not fire on every keystroke, even when `AllowCustom="true"`, but it fires when an item is selected from the dropdown. To get the selected item, you can check if the new value is present in the data source.
 
-See the [ComboBox Overview - Selected Item]({%slug components/combobox/overview%}#selected-item) article for details on when the event fires and how item selection and `Value` work.
+See the [ComboBox Overview - Selected Item](slug://components/combobox/overview#selected-item) article for details on when the event fires and how item selection and `Value` work.
 
 >caption Handle OnChange without custom values - to get a value from the list, you must write text that will match the text of an item (e.g, "item 5").
 
@@ -175,21 +175,21 @@ See the [ComboBox Overview - Selected Item]({%slug components/combobox/overview%
 
 ## OnRead
 
-You can use the [`OnRead` event]({%slug common-features-data-binding-onread%}) to provide data to the component based on custom logic and the current user input and/or scroll position (when using [virtualization]({%slug combobox-virtualization%})). The event fires when:
+You can use the [`OnRead` event](slug://common-features-data-binding-onread) to provide data to the component based on custom logic and the current user input and/or scroll position (when using [virtualization](slug://combobox-virtualization)). The event fires when:
 
 * The component initializes.
-* The user [filters]({%slug components/combobox/filter%}).
-* The user scrolls with [virtualization]({%slug combobox-virtualization%}) enabled.
+* The user [filters](slug://components/combobox/filter).
+* The user scrolls with [virtualization](slug://combobox-virtualization) enabled.
 
 You can also call remote data through `async` operations.
 
-Find out how to [get the applied filtering and grouping criteria]({%slug common-features-descriptors%}).
+Find out how to [get the applied filtering and grouping criteria](slug://common-features-descriptors).
 
 When using `OnRead`, make sure to set `TItem` and `TValue`.
 
 >caption Custom Data according to the user input in the ComboBox
 
->tip You can also [debounce the service calls and implement minimum filter length]({%slug combo-kb-debounce-onread%}).
+>tip You can also [debounce the service calls and implement minimum filter length](slug://combo-kb-debounce-onread).
 
 @[template](/_contentTemplates/common/dropdowns-virtualization.md#value-in-onread)
 
@@ -472,6 +472,6 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
 
diff --git a/components/combobox/filter.md b/components/combobox/filter.md
index a9d8b97fb6..a2a9450859 100644
--- a/components/combobox/filter.md
+++ b/components/combobox/filter.md
@@ -14,8 +14,8 @@ The ComboBox component allows the user to filter the available items by their te
 
 To enable filtering, set the `Filterable` parameter to `true`. The filtering is case insensitive. 
 
-You can also use the [`OnRead` event]({%slug components/combobox/events%}#onread) to:
-* Get the [applied filtering criteria]({%slug common-features-descriptors%}#through-the-onread-event).
+You can also use the [`OnRead` event](slug://components/combobox/events#onread) to:
+* Get the [applied filtering criteria](slug://common-features-descriptors#through-the-onread-event).
 * Implement custom (server) filtering and set data dynamically.
 
 Filtering looks in the `TextField`, and the filter is reset when the dropdown closes.
@@ -26,7 +26,7 @@ The default filter operator is `starts with`. You can choose a different operato
 
 ## Performance
 
-By default, the filtering is debounced with 150ms. Configure that with the [`DebounceDelay`]({%slug components/combobox/overview%}#parameters) parameter of the component.
+By default, the filtering is debounced with 150ms. Configure that with the [`DebounceDelay`](slug://components/combobox/overview#parameters) parameter of the component.
 
 ## Filtering Example
 
@@ -104,5 +104,5 @@ By default, the filtering is debounced with 150ms. Configure that with the [`Deb
 
 * [Live Demo: ComboBox Filtering](https://demos.telerik.com/blazor-ui/combobox/filtering)
 
-* [Custom Filtering by Multiple Fields]({%slug dropdowns-kb-search-in-multiple-fields%})
+* [Custom Filtering by Multiple Fields](slug://dropdowns-kb-search-in-multiple-fields)
 
diff --git a/components/combobox/grouping.md b/components/combobox/grouping.md
index cc7badbd54..afd804c6ce 100644
--- a/components/combobox/grouping.md
+++ b/components/combobox/grouping.md
@@ -67,7 +67,7 @@ The group headers can stick to the top of the dropdown during scrolling. In othe
 # Notes
 
 * One level of grouping is supported.
-* A grouped ComboBox will provide a `Groups` property with a single [`GroupDescriptor`](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) argument of its [OnRead event]({%slug components/combobox/events%}#onread). This will allow the developer to apply grouping with [manual data operations]({%slug components/grid/manual-operations%}).
+* A grouped ComboBox will provide a `Groups` property with a single [`GroupDescriptor`](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) argument of its [OnRead event](slug://components/combobox/events#onread). This will allow the developer to apply grouping with [manual data operations](slug://components/grid/manual-operations).
 
 ## See Also
 
diff --git a/components/combobox/overview.md b/components/combobox/overview.md
index 20010aaa9c..db6a43a18f 100644
--- a/components/combobox/overview.md
+++ b/components/combobox/overview.md
@@ -10,14 +10,14 @@ position: 0
 
 # Blazor ComboBox Overview
 
-The <a href="https://www.telerik.com/blazor-ui/combobox" target="_blank">Blazor ComboBox component</a> allows the user to choose an option from a predefined set of choices presented in a dropdown popup. You can also allow them to enter [custom values]({%slug components/combobox/custom-value%}) and to [filter]({%slug components/combobox/filter%}) the available items. You can control the [data]({%slug components/dropdownlist/databind%}), sizes, and various appearance options like class and [templates]({%slug components/combobox/templates%}).
+The <a href="https://www.telerik.com/blazor-ui/combobox" target="_blank">Blazor ComboBox component</a> allows the user to choose an option from a predefined set of choices presented in a dropdown popup. You can also allow them to enter [custom values](slug://components/combobox/custom-value) and to [filter](slug://components/combobox/filter) the available items. You can control the [data](slug://components/dropdownlist/databind), sizes, and various appearance options like class and [templates](slug://components/combobox/templates).
 
 ## Creating Blazor ComboBox
 
 1. Use the `TelerikComboBox` tag to add the component to your razor page.
 1. Populate the `Data` property with the collection of items that you want to appear in the dropdown.
 1. Set the `TextField` and `ValueField` properties to point to the corresponding names of the model
-1. [Bind the value of the component]({%slug get-started-value-vs-data-binding %}#value-binding) to a variable of the same type as the type defined in the `ValueField` parameter.
+1. [Bind the value of the component](slug://get-started-value-vs-data-binding #value-binding) to a variable of the same type as the type defined in the `ValueField` parameter.
 1. (optional) enable features like filtering and clear button
 
 >caption Combobox [data binding](slug://components/combobox/databind) with two-way value binding
@@ -47,21 +47,21 @@ Selected value: @selectedValue
 
 ## Data Binding
 
-The Blazor ComboBox @[template](/_contentTemplates/dropdowns/features.md#data-binding) [Read more about the Blazor ComboBox data binding...]({% slug components/combobox/databind %}).
+The Blazor ComboBox @[template](/_contentTemplates/dropdowns/features.md#data-binding) [Read more about the Blazor ComboBox data binding...](slug://components/combobox/databind).
 
 ## Filtering
 
-The Blazor ComboBox @[template](/_contentTemplates/dropdowns/features.md#filtering) [Read more about the Blazor ComboBox filter...]({% slug components/combobox/filter %}).
+The Blazor ComboBox @[template](/_contentTemplates/dropdowns/features.md#filtering) [Read more about the Blazor ComboBox filter...](slug://components/combobox/filter).
 
 ## Grouping
 
-The Blazor ComboBox @[template](/_contentTemplates/dropdowns/features.md#grouping) [Read more about the Blazor ComboBox grouping...]({% slug components/combobox/grouping %}).
+The Blazor ComboBox @[template](/_contentTemplates/dropdowns/features.md#grouping) [Read more about the Blazor ComboBox grouping...](slug://components/combobox/grouping).
 
 @[template](/_contentTemplates/common/inputs.md#adornments)
 
 ## Templates
 
-@[template](/_contentTemplates/dropdowns/features.md#templates) [Read more about the Blazor ComboBox templates...]({% slug components/combobox/templates %}).
+@[template](/_contentTemplates/dropdowns/features.md#templates) [Read more about the Blazor ComboBox templates...](slug://components/combobox/templates).
 
 ## Validation
 
@@ -69,7 +69,7 @@ The Blazor ComboBox @[template](/_contentTemplates/dropdowns/features.md#groupin
 
 ## Virtualization
 
-@[template](/_contentTemplates/dropdowns/features.md#virtualization) [Read more about the Blazor ComboBox virtualization...]({% slug combobox-virtualization %})
+@[template](/_contentTemplates/dropdowns/features.md#virtualization) [Read more about the Blazor ComboBox virtualization...](slug://combobox-virtualization)
 
 ## Adaptive Rendering
 
@@ -83,22 +83,22 @@ The Blazor ComboBox @[template](/_contentTemplates/dropdowns/features.md#groupin
 
 | Parameter      | Type | Description
 | ----------- | ----------- | -----------|
-| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode]({%slug adaptive-rendering%}) of the component. |
-| `AllowCustom` | `bool` | Defines if the user can enter a custom value that is not among the dropdown items. The custom user input becomes the component `Value`. If enabled, the `Value` must be of type `string`. See [ComboBox Custom Values]({%slug components/combobox/custom-value%}) for details and examples. |
+| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode](slug://adaptive-rendering) of the component. |
+| `AllowCustom` | `bool` | Defines if the user can enter a custom value that is not among the dropdown items. The custom user input becomes the component `Value`. If enabled, the `Value` must be of type `string`. See [ComboBox Custom Values](slug://components/combobox/custom-value) for details and examples. |
 | `ShowClearButton` | `bool` | whether the user will have the option to clear the selected value. When it is clicked, the `Value` will be updated to `default(TValue)`, so there must be no item in the `Data` that has such a `Value`. For example, if `TValue` is `int`, clearing the value will lead to a `0` `Value`, so if there is an Item with `0` in its `ValueField` - issues may arise with its selection. This feature can often go together with `AllowCustom`. |
 | `Data` | `IEnumerable<TItem>` | allows you to provide the data source. Required. |
 | `DebounceDelay` | `int` <br/> 150 | Time in milliseconds between the last typed symbol and the internal `oninput` event firing. Applies when the user types and filters. Use it to balance between client-side performance and number of database queries. |
 | `Enabled` | `bool` | whether the component is enabled. |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
-|`Filterable` | `bool` | whether [filtering]({%slug components/combobox/filter%}) is enabled for the end user. |
-| `FilterOperator` | `StringFilterOperator` <br /> (`StartsWith`) | the method of [filtering]({%slug components/combobox/filter%}) the items. |
+|`Filterable` | `bool` | whether [filtering](slug://components/combobox/filter) is enabled for the end user. |
+| `FilterOperator` | `StringFilterOperator` <br /> (`StartsWith`) | the method of [filtering](slug://components/combobox/filter) the items. |
 | `Id` | `string` | renders as the `id` attribute on the `<input />` element, so you can attach a `<label for="">` to the input. |
 | `InputMode` | `string` | The [`inputmode` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) of the `<input />` element. |
 | `LoaderShowDelay` | `int ` <br /> 300 | Time in milliseconds between opening the popup and showing the loading skeleton in it when the data is not yet available. |
 | `Placeholder` | `string` | the text the user sees as a hint when no item is selected. In order for it to be shown, the `Value` parameter should be set to a default value depending on the type defined in the `ValueField` parameter. For example, `0` for an `int`, and `null` for an `int?` or `string`. You need to make sure that it does not match the value of an existing item in the data source. |
 | `TItem` | `Type` | the type of the model to which the component is bound. Required if you can't provide `Data` or `Value`. Determines the type of the reference object. |
 | `TValue` | `Type` | the type of the value field from the model to which the component is bound. Required if you can't provide `Data` or `Value`. Determines the type of the reference object. The type of the values can be:<br /> - `number` (such as `int`, `double`, and so on)<br /> - `string`<br /> - `Guid`<br /> - `Enum` |
-| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`]({%slug adaptive-rendering%}). |
+| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`](slug://adaptive-rendering). |
 | `TextField` | `string` <br /> (`Text`)| the name of the field from the model that will be shown to the user. |
 | `ValueField` | `string` <br /> (`Value`) | the name of the field from the model that will be the underlying `value`. |
 | `Value` and `bind-Value` | `TValue` | get/set the value of the component, can be used for binding. If you set it to a value allowed by the model class value field, the corresponding item from the data collection will be pre-selected. Use the `bind-Value` syntax for two-way binding, for example, to a variable of your own. |
@@ -106,7 +106,7 @@ The Blazor ComboBox @[template](/_contentTemplates/dropdowns/features.md#groupin
 
 ### Styling and Appearance
 
-The following parameters enable you to customize the [appearance]({%slug combobox-appearance%}) of the Blazor ComboBox:
+The following parameters enable you to customize the [appearance](slug://combobox-appearance) of the Blazor ComboBox:
 
 @[template](/_contentTemplates/dropdowns/features.md#styling)
 
@@ -143,7 +143,7 @@ The ComboBox provides the following popup settings:
 
 ## ComboBox Reference and Methods
 
-The ComboBox is a generic component and its type is determined by the type of the model you pass to it, and the type of its value field. You can find examples in the [Data Bind - Considerations]({%slug components/combobox/databind%}#considerations) article.
+The ComboBox is a generic component and its type is determined by the type of the model you pass to it, and the type of its value field. You can find examples in the [Data Bind - Considerations](slug://components/combobox/databind#considerations) article.
 
 Add a reference to the component instance to use the [ComboBox's methods](/blazor-ui/api/Telerik.Blazor.Components.TelerikComboBox-2).
 
@@ -177,7 +177,7 @@ Add a reference to the component instance to use the [ComboBox's methods](/blazo
 
 ## Selected Item
 
-By default, if no `Value` is provided, the ComboBox will appear empty, or will display the `Placeholder` defined. If a `Value` is provided and `AllowCustom` is *not* set to `true`, the `Value` should match an item in the data source (see more in the [Value Out of Range]({%slug components/combobox/databind%}#value-out-of-range) section).
+By default, if no `Value` is provided, the ComboBox will appear empty, or will display the `Placeholder` defined. If a `Value` is provided and `AllowCustom` is *not* set to `true`, the `Value` should match an item in the data source (see more in the [Value Out of Range](slug://components/combobox/databind#value-out-of-range) section).
 
 The ComboBox will not always have a selected item, however, because it can act as an input. There will be no selected item in the following cases that depend on the settings of the component that the developer can control:
 
@@ -203,13 +203,13 @@ Missing selection is most common when the initial value is `null` as data source
 
 ## Next Steps
 
-* [Binding the ComboBox to Data]({%slug components/combobox/databind%})
+* [Binding the ComboBox to Data](slug://components/combobox/databind)
 
-* [Pre-Selecting Items for the User]({% slug  combobox-pre-select-item %})
+* [Pre-Selecting Items for the User](slug://combobox-pre-select-item)
 
 ## See Also
 
-* [Data Binding]({%slug components/combobox/databind%})
+* [Data Binding](slug://components/combobox/databind)
 * [Live Demo: ComboBox](https://demos.telerik.com/blazor-ui/combobox/overview)
 * [Live Demo: ComboBox Validation](https://demos.telerik.com/blazor-ui/combobox/validation)
 * [ComboBox API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikComboBox-2)
diff --git a/components/combobox/refresh-data.md b/components/combobox/refresh-data.md
index e58b872a13..10d642a182 100644
--- a/components/combobox/refresh-data.md
+++ b/components/combobox/refresh-data.md
@@ -21,7 +21,7 @@ In this article:
 
 ## Rebind Method
 
-To refresh the ComboBox data when using [`OnRead`]({%slug components/combobox/events%}#onread), call the `Rebind` method of the TelerikComboBox reference. This will fire the `OnRead` event and execute the business logic in the handler.
+To refresh the ComboBox data when using [`OnRead`](slug://components/combobox/events#onread), call the `Rebind` method of the TelerikComboBox reference. This will fire the `OnRead` event and execute the business logic in the handler.
 
 ````RAZOR
 @* Clicking on the Rebind button will delete the first option from the dropdown and refresh the data *@
@@ -230,6 +230,6 @@ To refresh the ComboBox data when using [`OnRead`]({%slug components/combobox/ev
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
\ No newline at end of file
diff --git a/components/contextmenu/accessibility/wai-aria-support.md b/components/contextmenu/accessibility/wai-aria-support.md
index cc8b818a6b..bdd5d5a3bd 100644
--- a/components/contextmenu/accessibility/wai-aria-support.md
+++ b/components/contextmenu/accessibility/wai-aria-support.md
@@ -67,4 +67,4 @@ For details on how the ContextMenu keyboard navigation works, refer to the [Blaz
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/contextmenu/data-binding/flat-data.md b/components/contextmenu/data-binding/flat-data.md
index 2c71b9de01..cb29547cfa 100644
--- a/components/contextmenu/data-binding/flat-data.md
+++ b/components/contextmenu/data-binding/flat-data.md
@@ -114,7 +114,7 @@ You are *not* required to provide a value for the `HasChildren` field. @[templat
 
 ## See Also
 
-  * [Menu Data Binding Basics]({%slug components/menu/data-binding/overview%})
+  * [Menu Data Binding Basics](slug://components/menu/data-binding/overview)
   * [Live Demo: Context Menu](https://demos.telerik.com/blazor-ui/contextmenu/overview)
-  * [Binding to Hierarchical Data]({%slug components/menu/data-binding/hierarchical-data%})
+  * [Binding to Hierarchical Data](slug://components/menu/data-binding/hierarchical-data)
 
diff --git a/components/contextmenu/data-binding/hierarchical-data.md b/components/contextmenu/data-binding/hierarchical-data.md
index 1926be406a..8cd2a22aef 100644
--- a/components/contextmenu/data-binding/hierarchical-data.md
+++ b/components/contextmenu/data-binding/hierarchical-data.md
@@ -16,7 +16,7 @@ This article explains how to bind the Context Menu for Blazor to hierarchical da
 
 Hierarchical data means that the collection of child items is provided in a field of its parent's model. By default, this is the `Items` field. If there are items for a certain node, it will have an expand icon. The `HasChildren` field can override this, however, but it is not required for hierarchical data binding. Note that all menu item models must be of the same type.
 
-This approach of providing nodes lets you gather separate collections of data for certain sections or areas. Check out the [Know The Target And Adjust Items]({%slug contextmenu-integration%}#know-the-target-and-adjust-items) example to see one way of altering the data (items) in the menu before showing it. 
+This approach of providing nodes lets you gather separate collections of data for certain sections or areas. Check out the [Know The Target And Adjust Items](slug://contextmenu-integration#know-the-target-and-adjust-items) example to see one way of altering the data (items) in the menu before showing it. 
 
 >caption Example of using hierarchical data in a context menu
 
@@ -115,7 +115,7 @@ This approach of providing nodes lets you gather separate collections of data fo
 
 ## See Also
 
-  * [Context Menu Data Binding Basics]({%slug contextmenu-data-binding-overview%})
+  * [Context Menu Data Binding Basics](slug://contextmenu-data-binding-overview)
   * [Live Demo: Context Menu](https://demos.telerik.com/blazor-ui/contextmenu/overview)
-  * [Binding to Flat Data]({%slug contextmenu-data-binding-flat-data%})
+  * [Binding to Flat Data](slug://contextmenu-data-binding-flat-data)
 
diff --git a/components/contextmenu/data-binding/overview.md b/components/contextmenu/data-binding/overview.md
index 88e526ab5c..05eca4027c 100644
--- a/components/contextmenu/data-binding/overview.md
+++ b/components/contextmenu/data-binding/overview.md
@@ -21,8 +21,8 @@ First, review:
 
 There are two modes of providing data to a menu, and they all use the items' features. Once you are familiar with the current article, choose the data binding more you wish to use:
 
-* [Hierarchical data]({%slug contextmenu-data-binding-hierarchical-data%}) - separate collections of items and their child items.
-* [Flat data]({%slug contextmenu-data-binding-flat-data%}) - a single collection of items with defined parent-child relationships.
+* [Hierarchical data](slug://contextmenu-data-binding-hierarchical-data) - separate collections of items and their child items.
+* [Flat data](slug://contextmenu-data-binding-flat-data) - a single collection of items with defined parent-child relationships.
 
 ## Context Menu Item Features
 
@@ -38,7 +38,7 @@ The menu items provide the following features that you control through the corre
 
 * `Text` - the text that will be shown on the item.
 
-* `Icon` - The [Telerik Font or SVG icon]({%slug common-features-icons%}) that will be rendered in the item. Read more in the [Icons article]({%slug contextmenu-icons%}).
+* `Icon` - The [Telerik Font or SVG icon](slug://common-features-icons) that will be rendered in the item. Read more in the [Icons article](slug://contextmenu-icons).
 
 * `Url` - the view the item will navigate to by generating a link.
 
@@ -202,6 +202,6 @@ public class ContextMenuItem
 
 ## See Also
 
-  * [Binding to Flat Data]({%slug contextmenu-data-binding-flat-data%})
-  * [Binding to Hierarchical Data]({%slug contextmenu-data-binding-hierarchical-data%})
+  * [Binding to Flat Data](slug://contextmenu-data-binding-flat-data)
+  * [Binding to Hierarchical Data](slug://contextmenu-data-binding-hierarchical-data)
   * [Live Demo: Context Menu](https://demos.telerik.com/blazor-ui/contextmenu/overview)
diff --git a/components/contextmenu/events.md b/components/contextmenu/events.md
index 95922af4bb..008fa49ef9 100644
--- a/components/contextmenu/events.md
+++ b/components/contextmenu/events.md
@@ -179,4 +179,4 @@ The event handler receives an argument object of type `MenuItemRenderEventArgs`
 
 ## See Also
 
-* [Templates]({%slug contextmenu-templates-overview%})
+* [Templates](slug://contextmenu-templates-overview)
diff --git a/components/contextmenu/icons.md b/components/contextmenu/icons.md
index 125824ec9e..53a131a496 100644
--- a/components/contextmenu/icons.md
+++ b/components/contextmenu/icons.md
@@ -10,7 +10,7 @@ position: 15
 
 # Context Menu Icons
 
-You can add [Telerik Font or SVG icons]({%slug common-features-icons%}) to the ContextMenu items. The component also supports custom icons.
+You can add [Telerik Font or SVG icons](slug://common-features-icons) to the ContextMenu items. The component also supports custom icons.
 
 To use ContextMenu item icons, define a property in the component model class and assign the property name to the `IconField` parameter of the ContextMenu.
 
@@ -92,4 +92,4 @@ If the icon property name in the ContextMenu model is `Icon`, there is no need t
 ## See Also
 
 * [Online Demo: Context Menu Icons](https://demos.telerik.com/blazor-ui/contextmenu/icons)
-* [Context Menu Overview]({%slug contextmenu-overview%})
+* [Context Menu Overview](slug://contextmenu-overview)
diff --git a/components/contextmenu/integration.md b/components/contextmenu/integration.md
index 17d069508b..fce9013bca 100644
--- a/components/contextmenu/integration.md
+++ b/components/contextmenu/integration.md
@@ -19,7 +19,7 @@ To achieve such flexibility and granularity, you can:
 1. Use your own code to hook to an event such as `@oncontextmenu` to store the desired target and its metadata. You can use other events such as `@onclick` too.
     * You can use other events to show the context menu, like click, mousedown and so on. Make sure to pass correct coordinates to the menu - they must be relative to the viewport.
     * If you use the `@oncontextmenu` event, also add `@oncontextmenu:preventDefault="true"` to avoid the browser context menu which will always show above HTML structures on the page, like the Telerik Context Menu.
-1. Optionally, alter the [data source]({%slug contextmenu-data-binding-overview%}) or [templates]({%slug contextmenu-templates-overview%}) of the menu based on the metadata for the target.
+1. Optionally, alter the [data source](slug://contextmenu-data-binding-overview) or [templates](slug://contextmenu-templates-overview) of the menu based on the metadata for the target.
 1. Show the Telerik menu through its `@ref` and the `ShowAsync` method it exposes.
 
 This article provides the following two examples:
@@ -29,7 +29,7 @@ This article provides the following two examples:
 * [Context Menu for a Grid Row](#context-menu-for-a-grid-row)
 * [Context Menu for a TreeView Node](#context-menu-for-a-treeview-node)
 
-You can apply the approach of hooking to your own events to show the context menu in other scenarios as well. For example, you can [add a context menu for your treeview nodes]({%slug contextmenu-kb-treeview-item%}).
+You can apply the approach of hooking to your own events to show the context menu in other scenarios as well. For example, you can [add a context menu for your treeview nodes](slug://contextmenu-kb-treeview-item).
 
 ## Know The Target And Adjust Items
 
@@ -172,8 +172,8 @@ Hooking to your own HTML elements' events lets you determine what to do with the
 
 To integrate the context menu with the Telerik Grid, you need to:
 
-1. Use the grid's [`OnRowContextMenu`]({%slug grid-events%}#onrowcontextmenu) event to get the current row model and show the menu
-2. Use the context menu's [`OnClick`]({%slug contextmenu-events%}#onclick) event to handle the desired operation
+1. Use the grid's [`OnRowContextMenu`](slug://grid-events#onrowcontextmenu) event to get the current row model and show the menu
+2. Use the context menu's [`OnClick`](slug://contextmenu-events#onclick) event to handle the desired operation
 
 In this example, the context menu is used to select/deselect items, put an item in edit mode and delete items
 
@@ -390,8 +390,8 @@ In this example, the context menu is used to select/deselect items, put an item
 
 To integrate the ContextMenu with the TreeView, you need to:
 
-1. Use the [`OnItemContextMenu`]({%slug treeview-events%}#onitemcontextmenu) event of the TreeView to get the current row model and show the menu
-2. Use the context menu's [`OnClick`]({%slug contextmenu-events%}#onclick) event to handle the desired operation
+1. Use the [`OnItemContextMenu`](slug://treeview-events#onitemcontextmenu) event of the TreeView to get the current row model and show the menu
+2. Use the context menu's [`OnClick`](slug://contextmenu-events#onclick) event to handle the desired operation
 
 In this example, the context menu is used to select/deselect items and delete items
 
@@ -582,6 +582,6 @@ In this example, the context menu is used to select/deselect items and delete it
 
 ## See Also
 
-* [Context Menu Overview]({%slug contextmenu-overview%})
-* [Context Menu Data Binding]({%slug contextmenu-data-binding-overview%})
-* [Context Menu Templates]({%slug contextmenu-templates-overview%})
+* [Context Menu Overview](slug://contextmenu-overview)
+* [Context Menu Data Binding](slug://contextmenu-data-binding-overview)
+* [Context Menu Templates](slug://contextmenu-templates-overview)
diff --git a/components/contextmenu/navigation.md b/components/contextmenu/navigation.md
index f3e80b6104..6a3c537460 100644
--- a/components/contextmenu/navigation.md
+++ b/components/contextmenu/navigation.md
@@ -10,11 +10,11 @@ position: 10
 
 # Context Menu for Navigation
 
-The Context Menu can be used to navigate between different pages in the application. It can generate the needed links for you through its `UrlField` when [data binding]({%slug contextmenu-data-binding-overview%}).
+The Context Menu can be used to navigate between different pages in the application. It can generate the needed links for you through its `UrlField` when [data binding](slug://contextmenu-data-binding-overview).
 
 To use the Context Menu for navigating between pages:
 
-* Add the ContextMenu to your application and [choose a target]({%slug contextmenu-overview%}) or [show it with your own code]({%slug contextmenu-integration%}#know-the-target-and-adjust-items).
+* Add the ContextMenu to your application and [choose a target](slug://contextmenu-overview) or [show it with your own code](slug://contextmenu-integration#know-the-target-and-adjust-items).
 * Provide a collection of models that describe the pages you want the user to navigate to.
 * Populate its `UrlField` with the corresponding data from the model or provide a `Url` property in the model.
 
@@ -90,6 +90,6 @@ To use the Context Menu for navigating between pages:
 
 ## See Also
 
-* [Context Menu Overview]({%slug contextmenu-overview%})
-* [Context Menu Data Binding]({%slug contextmenu-data-binding-overview%})
-* [Context Menu Templates]({%slug contextmenu-templates-overview%})
+* [Context Menu Overview](slug://contextmenu-overview)
+* [Context Menu Data Binding](slug://contextmenu-data-binding-overview)
+* [Context Menu Templates](slug://contextmenu-templates-overview)
diff --git a/components/contextmenu/overview.md b/components/contextmenu/overview.md
index 04cfcb79a2..8c72c379e5 100644
--- a/components/contextmenu/overview.md
+++ b/components/contextmenu/overview.md
@@ -12,15 +12,15 @@ position: 0
 
 The <a href="https://www.telerik.com/blazor-ui/context-menu" target="_blank">Blazor Context Menu</a> displays a contextual popup with flat or hierarchical data in a traditional menu-like structure. The component enables you to invoke commands while preserving the screen real estate.
 
-In addition to the built-in [navigation capabilities]({%slug contextmenu-navigation%}), you can browse through the items and their children, define [templates]({%slug contextmenu-templates-overview%}) for the individual nodes, render text and icons or images, and respond to [events]({%slug contextmenu-events%}).
+In addition to the built-in [navigation capabilities](slug://contextmenu-navigation), you can browse through the items and their children, define [templates](slug://contextmenu-templates-overview) for the individual nodes, render text and icons or images, and respond to [events](slug://contextmenu-events).
 
 ## Creating the Blazor Context Menu
 
 To create the Context Menu: 
 
 1. Add the `TelerikContextMenu` tag and set its `Selector` parameter to a CSS selector that will match the elements to which you want to attach the Context Menu.
-1. Provide a collection of models to the `Data` property of the component. The Context Menu will automatically recognize property names like `Id`, `ParentId`, `Text`, and more. Otherwise, [configure custom property names by using bindings]({%slug contextmenu-data-binding-overview%}#data-bindings).
-1. Handle the [`OnClick` event]({%slug contextmenu-events%}#onclick) to respond to user actions.
+1. Provide a collection of models to the `Data` property of the component. The Context Menu will automatically recognize property names like `Id`, `ParentId`, `Text`, and more. Otherwise, [configure custom property names by using bindings](slug://contextmenu-data-binding-overview#data-bindings).
+1. Handle the [`OnClick` event](slug://contextmenu-events#onclick) to respond to user actions.
 
 >caption A basic Context Menu with hierarchical data binding and an `OnClick` event handler
 
@@ -98,32 +98,32 @@ To create the Context Menu:
 
 ## Data Binding
 
-To show any items, the Blazor Context Menu requires a data source that you can provide through the `Data` property. The Context Menu allows you to display the items both as flat data and hierarchically. [Read more about the Blazor Context Menu data binding...]({%slug contextmenu-data-binding-overview%})
+To show any items, the Blazor Context Menu requires a data source that you can provide through the `Data` property. The Context Menu allows you to display the items both as flat data and hierarchically. [Read more about the Blazor Context Menu data binding...](slug://contextmenu-data-binding-overview)
 
 ## Per-Target Customization
 
-You can easily attach one and the same Context Menu to many targets or you can use its `ShowAsync(x, y)` method to show the component explicitly based on your business logic needs, data, and events. [Read more about the integration approaches of the Blazor Context Menu...]({%slug contextmenu-integration%}).
+You can easily attach one and the same Context Menu to many targets or you can use its `ShowAsync(x, y)` method to show the component explicitly based on your business logic needs, data, and events. [Read more about the integration approaches of the Blazor Context Menu...](slug://contextmenu-integration).
 
 ## Navigation Views
 
 A Context Menu is often used to list pages, views, or sections in an application so that users can navigate through them. To achieve the desired scenario, use either of the following options:
 
-* If a URL is provided for the given item, populate the URLs in the anchors which the Context Menu will generate by using the built-in `UrlField` in the [bound data]({%slug contextmenu-data-binding-overview%}), as demonstrated in the first example of this article.
-* Enable fine-tuning and generate the desired links, such as `NavLink` components, by using a [template]({%slug contextmenu-templates-overview%}).
+* If a URL is provided for the given item, populate the URLs in the anchors which the Context Menu will generate by using the built-in `UrlField` in the [bound data](slug://contextmenu-data-binding-overview), as demonstrated in the first example of this article.
+* Enable fine-tuning and generate the desired links, such as `NavLink` components, by using a [template](slug://contextmenu-templates-overview).
 
-[Read more about the Blazor Context Menu navigation...]({%slug contextmenu-navigation%})
+[Read more about the Blazor Context Menu navigation...](slug://contextmenu-navigation)
 
 ## Icons
 
-To illustrate the purpose of each Context Menu item, the Blazor Context Menu allows you to add images, icon classes, or font icons. [Read more about the Blazor Menu icons...]({%slug contextmenu-icons%})
+To illustrate the purpose of each Context Menu item, the Blazor Context Menu allows you to add images, icon classes, or font icons. [Read more about the Blazor Menu icons...](slug://contextmenu-icons)
 
 ## Templates
 
-You can use the functionality of the built-in templates and customize what is rendered in the items. [Read more about the available Blazor Context Menu templates...]({%slug contextmenu-templates-overview%})
+You can use the functionality of the built-in templates and customize what is rendered in the items. [Read more about the available Blazor Context Menu templates...](slug://contextmenu-templates-overview)
 
 ## Events
 
-The Context Menu generates events that you can handle and further customize its behavior. [Read more about the supported Blazor Context Menu events...]({%slug contextmenu-events%})
+The Context Menu generates events that you can handle and further customize its behavior. [Read more about the supported Blazor Context Menu events...](slug://contextmenu-events)
 
 ## Context Menu Parameters
 
@@ -131,7 +131,7 @@ The following table lists Context Menu parameters, which are not related to othe
 
 | Attribute | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | Renders an additional CSS class to the main wrapping element of the component. Use it to apply custom styles or [override the theme]({%slug themes-override%}). |
+| `Class` | `string` | Renders an additional CSS class to the main wrapping element of the component. Use it to apply custom styles or [override the theme](slug://themes-override). |
 | `Selector` | `string` | A CSS selector of the target elements where the Context Menu will be shown.|
 
 ### Popup settings
@@ -152,8 +152,8 @@ The ContextMenu provides the following popup settings:
 
 | Parameter | Type | Description |
 | --- | --- | --- |
-| `HorizontalCollision` | `PopupCollision` enum <br /> (`Fit`) | Sets the behavior of the Popup when it doesn't fit in the viewport based on the horizontal plane. [Read more about Popup collision behavior.]({%slug popup-position-collision%}#collision) |
-| `VerticalCollision` | `PopupCollision` enum <br /> (`Fit`) | Defines the behavior of the Popup when it doesn't fit in the viewport based on the vertical plane. [Read more about Popup collision behavior.]({%slug popup-position-collision%}#collision) |
+| `HorizontalCollision` | `PopupCollision` enum <br /> (`Fit`) | Sets the behavior of the Popup when it doesn't fit in the viewport based on the horizontal plane. [Read more about Popup collision behavior.](slug://popup-position-collision#collision) |
+| `VerticalCollision` | `PopupCollision` enum <br /> (`Fit`) | Defines the behavior of the Popup when it doesn't fit in the viewport based on the vertical plane. [Read more about Popup collision behavior.](slug://popup-position-collision#collision) |
 
 ## Context Menu Reference and Methods
 
@@ -251,11 +251,11 @@ To use the [Blazor Context Menu methods](/blazor-ui/api/Telerik.Blazor.Component
 
 ## Next Steps
 
-* [Binding the Telerik UI for Blazor Context Menu to Data]({%slug contextmenu-data-binding-overview%})
-* [Handling the `OnClick` Context Menu Event and Respond to User Interaction]({%slug contextmenu-events%}#onclick)
+* [Binding the Telerik UI for Blazor Context Menu to Data](slug://contextmenu-data-binding-overview)
+* [Handling the `OnClick` Context Menu Event and Respond to User Interaction](slug://contextmenu-events#onclick)
 
 ## See Also
 
-* [Binding the Blazor Context Menu to Data]({%slug contextmenu-data-binding-overview%})
+* [Binding the Blazor Context Menu to Data](slug://contextmenu-data-binding-overview)
 * [Live Demo: Overview of the Blazor Context Menu](https://demos.telerik.com/blazor-ui/contextmenu/overview)
 * [Context Menu API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikContextMenu-1)
diff --git a/components/contextmenu/refresh-data.md b/components/contextmenu/refresh-data.md
index 473817d824..e032ef8796 100644
--- a/components/contextmenu/refresh-data.md
+++ b/components/contextmenu/refresh-data.md
@@ -117,6 +117,6 @@ In this article:
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
diff --git a/components/contextmenu/templates/content.md b/components/contextmenu/templates/content.md
index d02d767c61..64dc3a5333 100644
--- a/components/contextmenu/templates/content.md
+++ b/components/contextmenu/templates/content.md
@@ -116,6 +116,6 @@ You can use the template to render arbitrary content according to your applicati
 
 ## See Also
 
-  * [Data Binding a Context Menu]({%slug contextmenu-data-binding-overview%})
+  * [Data Binding a Context Menu](slug://contextmenu-data-binding-overview)
   * [Live Demo: Context Menu Templates](https://demos.telerik.com/blazor-ui/contextmenu/templates)
 
diff --git a/components/contextmenu/templates/item.md b/components/contextmenu/templates/item.md
index 9ce730d487..736b4027ac 100644
--- a/components/contextmenu/templates/item.md
+++ b/components/contextmenu/templates/item.md
@@ -88,6 +88,6 @@ You can use the template to render arbitrary content according to your applicati
 
 ## See Also
 
-  * [Data Binding a Context Menu]({%slug contextmenu-data-binding-overview%})
+  * [Data Binding a Context Menu](slug://contextmenu-data-binding-overview)
   * [Live Demo: Context Menu Templates](https://demos.telerik.com/blazor-ui/contextmenu/templates)
 
diff --git a/components/contextmenu/templates/overview.md b/components/contextmenu/templates/overview.md
index 2958b5d05d..a790b6a0cb 100644
--- a/components/contextmenu/templates/overview.md
+++ b/components/contextmenu/templates/overview.md
@@ -12,13 +12,13 @@ position: 1
 
 The Context Menu component provides templates you can use to customize its appearance and behavior:
 
-* [Item Template]({%slug contextmenu-item-template%}) - the rendering of each individual context menu item so you can render more than the built-in text and icon fields.
+* [Item Template](slug://contextmenu-item-template) - the rendering of each individual context menu item so you can render more than the built-in text and icon fields.
 
-* [Content Template]({%slug contextmenu-content-template%}) - lets you control the rendering of the entire popup, without having to us the built-in `<ul> --> <li>` structure.
+* [Content Template](slug://contextmenu-content-template) - lets you control the rendering of the entire popup, without having to us the built-in `<ul> --> <li>` structure.
 
 
 ## See Also
 
-  * [Data Binding a Context Menu]({%slug contextmenu-data-binding-overview%})
+  * [Data Binding a Context Menu](slug://contextmenu-data-binding-overview)
   * [Live Demo: Context Menu Templates](https://demos.telerik.com/blazor-ui/contextmenu/templates)
 
diff --git a/components/dateinput/accessibility/wai-aria-support.md b/components/dateinput/accessibility/wai-aria-support.md
index 826fc7baab..825161905c 100644
--- a/components/dateinput/accessibility/wai-aria-support.md
+++ b/components/dateinput/accessibility/wai-aria-support.md
@@ -69,4 +69,4 @@ For details on how the DateInput keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/dateinput/events.md b/components/dateinput/events.md
index 9f3eceb43f..ca827b4b38 100644
--- a/components/dateinput/events.md
+++ b/components/dateinput/events.md
@@ -126,5 +126,5 @@ model value: @DateInputValue
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
diff --git a/components/dateinput/increment-steps.md b/components/dateinput/increment-steps.md
index f5a45b1ef6..bcc0d7bfce 100644
--- a/components/dateinput/increment-steps.md
+++ b/components/dateinput/increment-steps.md
@@ -42,5 +42,5 @@ All values default to `1` to provide every possible option. If you set a value l
 ## See Also
 
 * [Live Demo: Date Input Incremental Steps](https://demos.telerik.com/blazor-ui/dateinput/incremental-steps)
-* [DateInput Overview]({%slug components/dateinput/overview%})
+* [DateInput Overview](slug://components/dateinput/overview)
 
diff --git a/components/dateinput/keyboard-typing.md b/components/dateinput/keyboard-typing.md
index 973720bc57..e7b5f642ce 100644
--- a/components/dateinput/keyboard-typing.md
+++ b/components/dateinput/keyboard-typing.md
@@ -154,12 +154,12 @@ There are many user experience patterns and ways that users want to input dates,
 
 ## Next Steps
 
-* [Set Date Input format]({%slug components/dateinput/supported-formats%})
-* [Customize the Date Input appearance]({%slug dateinput-appearance%})
-* [Handle Date Input events]({%slug components/dateinput/events%})
+* [Set Date Input format](slug://components/dateinput/supported-formats)
+* [Customize the Date Input appearance](slug://dateinput-appearance)
+* [Handle Date Input events](slug://components/dateinput/events)
 
 
 ## See Also
 
 * [Live Demo: Date Input](https://demos.telerik.com/blazor-ui/dateinput/overview)
-* [DateInput Overview]({%slug components/dateinput/overview%})
+* [DateInput Overview](slug://components/dateinput/overview)
diff --git a/components/dateinput/overview.md b/components/dateinput/overview.md
index d8f600aa35..08b8d203c3 100644
--- a/components/dateinput/overview.md
+++ b/components/dateinput/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor DateInput Overview
 
-The <a href="https://www.telerik.com/blazor-ui/date-input" target="_blank">Blazor Date Input component</a> allows the user to type a date in a more convenient and user-friendly way, compared to a regular textbox. The DateInput can display its value with a specific date format and hint the user to follow it during typing. The component also provides multiple settings that are related to the typing and auto-correction user experience. The DateInput is a base for other components such as the [DatePicker]({%slug components/datepicker/overview%}), [DateTimePicker]({%slug components/datetimepicker/overview%}) and [DateRangePicker]({%slug daterangepicker-overview%}).
+The <a href="https://www.telerik.com/blazor-ui/date-input" target="_blank">Blazor Date Input component</a> allows the user to type a date in a more convenient and user-friendly way, compared to a regular textbox. The DateInput can display its value with a specific date format and hint the user to follow it during typing. The component also provides multiple settings that are related to the typing and auto-correction user experience. The DateInput is a base for other components such as the [DatePicker](slug://components/datepicker/overview), [DateTimePicker](slug://components/datetimepicker/overview) and [DateRangePicker](slug://daterangepicker-overview).
 
 
 ## Creating Blazor DateInput
@@ -58,27 +58,27 @@ The Date Input behavior differs, depend on the type of field it is bound to, and
 
 ## Typing Settings
 
-The Date Input provides various [options to configure the Date Input keyboard typing]({%slug dateinput-keyboard-typing%}) and user experience. They are related to the caret movement, two-digit years, and automatic correction of invalid values.
+The Date Input provides various [options to configure the Date Input keyboard typing](slug://dateinput-keyboard-typing) and user experience. They are related to the caret movement, two-digit years, and automatic correction of invalid values.
 
 
 ## Increment Steps
 
-The Date Input enables users to change the value by pressing the arrow keys. Use the `<DateInputSteps>` nested tag to [set the increment and decrement steps for each part of the date format]({%slug dateinput-steps%}).
+The Date Input enables users to change the value by pressing the arrow keys. Use the `<DateInputSteps>` nested tag to [set the increment and decrement steps for each part of the date format](slug://dateinput-steps).
 
 
 ## Validation
 
-The [built-in Date Input validation]({%slug common-features/input-validation%}) ensures that the component value is acceptable for the application business logic.
+The [built-in Date Input validation](slug://common-features/input-validation) ensures that the component value is acceptable for the application business logic.
 
 
 ## Events
 
-The [Blazor Date Input fires events]({%slug components/dateinput/events%}) such as `change` and `blur`. Handle these events to react to user actions and customize the component behavior.
+The [Blazor Date Input fires events](slug://components/dateinput/events) such as `change` and `blur`. Handle these events to react to user actions and customize the component behavior.
 
 
 ## Appearance
 
-The [DateInput exposes a few parameters for its styling]({%slug dateinput-appearance%}). Use them to change the component appearance declaratively and without custom CSS.
+The [DateInput exposes a few parameters for its styling](slug://dateinput-appearance). Use them to change the component appearance declaratively and without custom CSS.
 
 
 ## DateInput Parameters
@@ -96,7 +96,7 @@ The following section lists some Date Input parameters and links to other pages
 | `DebounceDelay` | `int` <br/> (`150`) | The time in milliseconds between the last typed symbol and the value update. Use it to balance between client-side performance and number of database queries. |
 | `Enabled` | `bool` | Defines if the Date Input is enabled and accepts new values. |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
-| `Format` | `string` <br /> (`ShortDatePattern`) | The textbox mask and date format that the user input must match. The default value depends on `CultureInfo.CurrentCulture`. Read more in the [Supported Formats]({%slug components/dateinput/supported-formats%}) article. |
+| `Format` | `string` <br /> (`ShortDatePattern`) | The textbox mask and date format that the user input must match. The default value depends on `CultureInfo.CurrentCulture`. Read more in the [Supported Formats](slug://components/dateinput/supported-formats) article. |
 | `Id` | `string` | The `id` attribute of the `input`. |
 | `InputMode` | `string` | The [`inputmode` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) of the `<input />` element. |
 | `Max` | `DateTime` <br /> (`new DateTime(2099, 12, 31)`)| The latest allowed date that the user can type. |
@@ -104,21 +104,21 @@ The following section lists some Date Input parameters and links to other pages
 | `Placeholder` | `string` | The [`placeholder` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#placeholder) of the `input`. The placeholder will appear only if the component is bound to nullable `DateTime?` object, the `Value` is `null` and the component is not focused. Once the user focuses it to start typing, the `FormatPlaceholder` (default or [custom one](#format-placeholder)) will override the `Placeholder` to indicate the expected date format. |
 | `ShowClearButton` | `bool` | Defines if the user can clear the component value through an **x** button rendered inside the input. |
 | `TabIndex` | `int` | The `tabindex` attribute of the `input`. Use it to control the tabbing order of the inputs on the page. |
-| `ValidateOn` | `ValidationEvent` enum <br/> (`Input`) | The event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs) |
-| `Value` | `DateTime` or `DateTime?` | The component value. Use with two-way binding or [`ValueChanged` event handler]({%slug components/dateinput/events%}#valuechanged). |
+| `ValidateOn` | `ValidationEvent` enum <br/> (`Input`) | The event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs](slug://common-features/input-validation#validation-modes-for-simple-inputs) |
+| `Value` | `DateTime` or `DateTime?` | The component value. Use with two-way binding or [`ValueChanged` event handler](slug://components/dateinput/events#valuechanged). |
 
 ### Typing User Experience
 
-The component provides multiple parameters, which control the [caret placement, two-digit year values and the auto-correct behavior of the Date Input]({%slug dateinput-keyboard-typing%}).
+The component provides multiple parameters, which control the [caret placement, two-digit year values and the auto-correct behavior of the Date Input](slug://dateinput-keyboard-typing).
 
 ### Styling and Appearance
 
 | Parameter | Type and Default Value | Description |
 |---|---|---|
-| `Class` | `string` | A custom CSS class to be rendered on the `<span class="k-dateinput">` element. Use it for [custom CSS styling and theme overrides]({%slug themes-override%}). |
+| `Class` | `string` | A custom CSS class to be rendered on the `<span class="k-dateinput">` element. Use it for [custom CSS styling and theme overrides](slug://themes-override). |
 | `Width` | `string` | The width of the Date Input. |
 
-The [Date Input Appearance article lists more parameters, which configure the component styling]({%slug dateinput-appearance%}).
+The [Date Input Appearance article lists more parameters, which configure the component styling](slug://dateinput-appearance).
 
 @[template](/_contentTemplates/date-inputs/general.md#format-placeholder)
 
@@ -156,14 +156,14 @@ The Date Input exposes methods for programmatic operation. To use them, define a
 
 ## Next Steps
 
-* [Learn about the flexible Date Input typing user experience]({%slug dateinput-keyboard-typing%})
-* [Set Date Input format]({%slug components/dateinput/supported-formats%})
-* [Customize the Date Input appearance]({%slug dateinput-appearance%})
-* [Handle Date Input events]({%slug components/dateinput/events%})
+* [Learn about the flexible Date Input typing user experience](slug://dateinput-keyboard-typing)
+* [Set Date Input format](slug://components/dateinput/supported-formats)
+* [Customize the Date Input appearance](slug://dateinput-appearance)
+* [Handle Date Input events](slug://components/dateinput/events)
 
 
 ## See Also
 
 * [Live Demo: Date Input](https://demos.telerik.com/blazor-ui/dateinput/overview)
-* [Input Validation]({%slug common-features/input-validation%})
+* [Input Validation](slug://common-features/input-validation)
 * [Date Input API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikDateInput-1)
diff --git a/components/dateinput/supported-formats.md b/components/dateinput/supported-formats.md
index b71570ef86..6ccb594511 100644
--- a/components/dateinput/supported-formats.md
+++ b/components/dateinput/supported-formats.md
@@ -56,7 +56,7 @@ So, for example, typing merely "20" would actually be the year 0020 (twenty year
 
 ## Culture Awareness
 
-The format strings are culture aware (see [Globalization - Overview]({%slug globalization-overview %})) and the same `Format` may render different things depending on the culture. For example:
+The format strings are culture aware (see [Globalization - Overview](slug://globalization-overview )) and the same `Format` may render different things depending on the culture. For example:
 
 * If a custom format string includes the `/` format specifier, the DateInput displays the value of `System.Globalization.DateTimeFormat.DateSeparator` in place of `/` in the result string.
 
@@ -181,4 +181,4 @@ Console.WriteLine(date.ToString("hh:mm:ss tt", CultureInfo.GetCultureInfo("bg-bg
 
 ## See Also
 
-* [DateInput Overview]({%slug components/dateinput/overview%})
+* [DateInput Overview](slug://components/dateinput/overview)
diff --git a/components/datepicker/accessibility/wai-aria-support.md b/components/datepicker/accessibility/wai-aria-support.md
index 6558e983a6..7898b677d2 100644
--- a/components/datepicker/accessibility/wai-aria-support.md
+++ b/components/datepicker/accessibility/wai-aria-support.md
@@ -87,4 +87,4 @@ For details on how the DatePicker keyboard navigation works, refer to the [Blazo
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/datepicker/events.md b/components/datepicker/events.md
index 97dd13975c..51c74f51e2 100644
--- a/components/datepicker/events.md
+++ b/components/datepicker/events.md
@@ -245,5 +245,5 @@ model value: @DatePickerValue
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
\ No newline at end of file
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
\ No newline at end of file
diff --git a/components/datepicker/header-template.md b/components/datepicker/header-template.md
index 67dc244b26..5018478e20 100644
--- a/components/datepicker/header-template.md
+++ b/components/datepicker/header-template.md
@@ -12,7 +12,7 @@ position: 15
 
 The DatePicker `<HeaderTemplate>` allows you to customize the header of the Calendar popup. If the application defines this template, the component will not render any of the built-in buttons and labels in the Calendar header area.
 
-The example below is using a [Blazor DatePicker reference and methods]({%slug components/datepicker/overview%}#datepicker-reference-and-methods).
+The example below is using a [Blazor DatePicker reference and methods](slug://components/datepicker/overview#datepicker-reference-and-methods).
 
 >caption Using DatePicker header template with custom content in the Calendar header
 
diff --git a/components/datepicker/increment-steps.md b/components/datepicker/increment-steps.md
index 2ad476e845..7f5d4a0723 100644
--- a/components/datepicker/increment-steps.md
+++ b/components/datepicker/increment-steps.md
@@ -40,5 +40,5 @@ All values default to `1` to provide every possible option. If you set a value l
 ## See Also
 
 * [Live Demo: Date Picker Incremental Steps](https://demos.telerik.com/blazor-ui/datepicker/incremental-steps)
-* [Blazor DatePicker Overview]({%slug components/datepicker/overview%})
+* [Blazor DatePicker Overview](slug://components/datepicker/overview)
 
diff --git a/components/datepicker/overview.md b/components/datepicker/overview.md
index ba56c3bc07..72ffbdf5b4 100644
--- a/components/datepicker/overview.md
+++ b/components/datepicker/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor DatePicker Overview
 
-The <a href="https://www.telerik.com/blazor-ui/datepicker" target="_blank">Blazor Date Picker component</a> allows the user to choose a date from a visual Gregorian [Telerik UI for Blazor Calendar]({%slug components/calendar/overview%}) or type it into a [date input]({%slug components/dateinput/overview%}) that can accept only dates. You can control the date format of the input, how the user navigates through the calendar, and which dates the user cannot select.
+The <a href="https://www.telerik.com/blazor-ui/datepicker" target="_blank">Blazor Date Picker component</a> allows the user to choose a date from a visual Gregorian [Telerik UI for Blazor Calendar](slug://components/calendar/overview) or type it into a [date input](slug://components/dateinput/overview) that can accept only dates. You can control the date format of the input, how the user navigates through the calendar, and which dates the user cannot select.
 
 
 ## Creating Blazor Date Picker
@@ -48,19 +48,19 @@ DatePicker.
 
 ## Increment Steps
 
-The Date Picker enables the end users to change the selected value by clicking the rendered arrows. You can set the increment and decrement steps through the nested `DatePickerSteps` tag and its parameters. [Read more about the Blazor Date Picker increment steps...]({%slug datepicker-steps%})
+The Date Picker enables the end users to change the selected value by clicking the rendered arrows. You can set the increment and decrement steps through the nested `DatePickerSteps` tag and its parameters. [Read more about the Blazor Date Picker increment steps...](slug://datepicker-steps)
 
 ## Events
 
-The Blazor Date Picker generates events that you can handle and further customize its behavior. [Read more about the Blazor Date Picker events...]({%slug components/datepicker/events%}).
+The Blazor Date Picker generates events that you can handle and further customize its behavior. [Read more about the Blazor Date Picker events...](slug://components/datepicker/events).
 
 ## Validation
 
-You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...]({%slug common-features/input-validation%}).
+You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...](slug://common-features/input-validation).
 
 ## Header Template
 
-The Blazor DatePicker allows you to customize the rendering of the Calendar popup header. Learn more from the [Header Template article]({%slug datepicker-header-template%}).
+The Blazor DatePicker allows you to customize the rendering of the Calendar popup header. Learn more from the [Header Template article](slug://datepicker-header-template).
 
 ## Adaptive Rendering
 
@@ -74,14 +74,14 @@ The Blazor Date Picker provides various parameters that allow you to configure t
 
 | Attribute | Type and Default Value | Description |
 |---|---|---|
-| `AdaptiveMode` | `AdaptiveMode` enum <br /> (`None`) | The [adaptive mode]({%slug adaptive-rendering%}) of the component. |
+| `AdaptiveMode` | `AdaptiveMode` enum <br /> (`None`) | The [adaptive mode](slug://adaptive-rendering) of the component. |
 | `AutoComplete` | `string` <br /> (`"off"`) | The `autocomplete` HTML attribute of the `input`. |
 | `BottomView` | ` CalendarView` enum <br/> (`Month`) | Defines the bottommost view in the popup calendar to which the user can navigate to. |
 | `DebounceDelay` | `int` <br/> (`150`) | Time in milliseconds between the last typed symbol and the value update. Use it to balance between client-side performance and number of database queries. |
 | `DisabledDates` | `List<DateTime>` | A list of dates that cannot be selected. |
 | `Enabled` | `bool` | Specifies whether typing in the input and clicking the button is allowed. |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
-| `Format` | `string` <br /> (`ShortDatePattern`) | The format of the DatePicker's DateInput. The default value depends on `CultureInfo.CurrentCulture`. Read more at [Supported date formats by the DateInput]({%slug components/dateinput/supported-formats%}). |
+| `Format` | `string` <br /> (`ShortDatePattern`) | The format of the DatePicker's DateInput. The default value depends on `CultureInfo.CurrentCulture`. Read more at [Supported date formats by the DateInput](slug://components/dateinput/supported-formats). |
 | `Id` | `string` | The `id` attribute on the `<input />` element. Use it to attach a `<label for="">` to the input. |
 | `InputMode` | `string` | The [`inputmode` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) of the `<input />` element. |
 | `Max` | `DateTime` <br /> (`DateTime(2099, 12, 31, 23, 59, 59)`)| The latest date that the user can select. |
@@ -91,12 +91,12 @@ The Blazor Date Picker provides various parameters that allow you to configure t
 | `ShowWeekNumbers` | `bool` | Sets if the popup Calendar will display week numbers according to the [ISO-8601 format](https://learn.microsoft.com/en-us/dotnet/api/system.globalization.isoweek.getweekofyear). Note that the [ISO week number may differ from the conventional .NET week number](https://learn.microsoft.com/en-us/dotnet/api/system.globalization.calendar.getweekofyear). |
 | `ShowOtherMonthDays` | `bool` <br /> (`true`) | Defines whether the leading and trailing days from other months in the Calendar popup are visible in the current month view. |
 | `TabIndex` | `int?` | Maps to the `tabindex` attribute of the HTML element. You can use it to customize the order in which the inputs in your form focus with the `Tab` key. |
-| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`]({%slug adaptive-rendering%}). |
-| `ValidateOn` |`ValidationEvent` enum <br/> (`Input`) | Configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs). |
+| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`](slug://adaptive-rendering). |
+| `ValidateOn` |`ValidationEvent` enum <br/> (`Input`) | Configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs](slug://common-features/input-validation#validation-modes-for-simple-inputs). |
 | `Value` | `DateTime` or `DateTime?` | The current value of the component. Supports two-way binding. |
 | `View` | ` CalendarView` enum <br/> (`Month`) | The current view that will be displayed in the popup calendar. |
 
-The Date Picker is, essentially, a [DateInput]({%slug components/dateinput/overview%}) and a [Calendar]({%slug components/calendar/overview%}) and the properties it exposes are mapped to the corresponding properties of these two components. You can read more about their behavior in the respective components' documentation.
+The Date Picker is, essentially, a [DateInput](slug://components/dateinput/overview) and a [Calendar](slug://components/calendar/overview) and the properties it exposes are mapped to the corresponding properties of these two components. You can read more about their behavior in the respective components' documentation.
 
 @[template](/_contentTemplates/date-inputs/general.md#typing-parameters)
 
@@ -112,7 +112,7 @@ The following parameters enable you to customize the appearance of the Blazor Da
 | `PopupWidth` | `string` | Defines the width of the DatePicker's Popup. Defaults to `auto`. |
 | `Width` | `string` | Defines the width of the DatePicker. Defaults to `280px`. |
 
-You can find more options for customizing the Date Picker styling in the [Appearance article]({%slug datepicker-appearance%}).
+You can find more options for customizing the Date Picker styling in the [Appearance article](slug://datepicker-appearance).
 
 @[template](/_contentTemplates/date-inputs/general.md#format-placeholder)
 
@@ -158,13 +158,13 @@ Add a reference to the component instance to use the [Date Picker's methods](/bl
 
 ## Next Steps
 
-* [Using the Date Picker Events]({%slug components/datepicker/events%})
+* [Using the Date Picker Events](slug://components/datepicker/events)
 
-* [Configuring the Date Picker Increment Steps]({%slug datepicker-steps%})
+* [Configuring the Date Picker Increment Steps](slug://datepicker-steps)
 
 ## See Also
 
 * [Live Demo: Date Picker](https://demos.telerik.com/blazor-ui/datepicker/overview)
-* [Input Validation]({%slug common-features/input-validation%})
-* [Supported Input Date Formats]({%slug components/dateinput/supported-formats%})
+* [Input Validation](slug://common-features/input-validation)
+* [Supported Input Date Formats](slug://components/dateinput/supported-formats)
 * [DatePicker API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikDatePicker-1)
diff --git a/components/daterangepicker/accessibility/wai-aria-support.md b/components/daterangepicker/accessibility/wai-aria-support.md
index 4e030c02bb..fe76ca9222 100644
--- a/components/daterangepicker/accessibility/wai-aria-support.md
+++ b/components/daterangepicker/accessibility/wai-aria-support.md
@@ -84,4 +84,4 @@ For details on how the DateRangePicker keyboard navigation works, refer to the [
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/daterangepicker/events.md b/components/daterangepicker/events.md
index 26c5e29cac..92e1ad3190 100644
--- a/components/daterangepicker/events.md
+++ b/components/daterangepicker/events.md
@@ -31,7 +31,7 @@ When the user selects a range from the calendar popup, the first click always fi
 
 >note The user can only type in the inputs and that will fire the corresponding event. Selecting from the calendar popup also fires the event. There is no way to know what the user intent is when they start modifying the values - whether they will modify one or both, so there is no definitive way to know when the user has finished using the component. Such logic is heuristic and is up to the application.
 
-> If [`AdaptiveRendering`]({%slug adaptive-rendering%}) is enabled, on small and medium devices `StartValueChanged` and `EndValueChanged` will fire only when the user clicks the confirmation button in the action sheet.
+> If [`AdaptiveRendering`](slug://adaptive-rendering) is enabled, on small and medium devices `StartValueChanged` and `EndValueChanged` will fire only when the user clicks the confirmation button in the action sheet.
 
 >caption Handle StartValueChanged and EndValueChanged
 
@@ -267,5 +267,5 @@ The event handler receives as an argument an `DateRangePickerCalendarCellRenderE
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
diff --git a/components/daterangepicker/header-template.md b/components/daterangepicker/header-template.md
index 86f8b19793..877dc7f0f6 100644
--- a/components/daterangepicker/header-template.md
+++ b/components/daterangepicker/header-template.md
@@ -12,7 +12,7 @@ position: 15
 
 The `<HeaderTemplate>` allows you to customize the header of the calendar popup. If the application defines this template, the component will not render any of the built-in buttons and labels in the calendar header area.
 
-The example below is using a [DateRangePicker reference and methods]({%slug daterangepicker-overview%}#daterangepicker-reference-and-methods).
+The example below is using a [DateRangePicker reference and methods](slug://daterangepicker-overview#daterangepicker-reference-and-methods).
 
 >caption Header template with custom content in the DateRangePicker Calendar header
 
diff --git a/components/daterangepicker/overview.md b/components/daterangepicker/overview.md
index ae0e698f7a..20f18eb5be 100644
--- a/components/daterangepicker/overview.md
+++ b/components/daterangepicker/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor DateRange Picker Component Overview
 
-The <a href="https://www.telerik.com/blazor-ui/daterange-picker" target="_blank">Blazor DateRange Picker component</a> allows the user to select a date range (start and end date) - both from a visual list ([Telerik UI for Blazor Calendar]({%slug components/calendar/overview%})) or to type it into a [date input]({%slug components/dateinput/overview%}) that can accept only dates. You can control the format shown in the input, and dates the user cannot select, as well as implement validation and respond to events.
+The <a href="https://www.telerik.com/blazor-ui/daterange-picker" target="_blank">Blazor DateRange Picker component</a> allows the user to select a date range (start and end date) - both from a visual list ([Telerik UI for Blazor Calendar](slug://components/calendar/overview)) or to type it into a [date input](slug://components/dateinput/overview) that can accept only dates. You can control the format shown in the input, and dates the user cannot select, as well as implement validation and respond to events.
 
 ## Creating Blazor Date Range Picker
 
@@ -50,17 +50,17 @@ DateRangePicker.
 
 ## Events
 
-The Blazor Date Range Picker generates events that you can handle and further customize its behavior. [Read more about the Blazor Date Range Picker events...]({%slug daterangepicker-events %}).
+The Blazor Date Range Picker generates events that you can handle and further customize its behavior. [Read more about the Blazor Date Range Picker events...](slug://daterangepicker-events ).
 
 ## Validation
 
-You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...]({%slug common-features/input-validation%}).
+You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...](slug://common-features/input-validation).
 
 By default, a valid date range is when the start date is before the end date. When a valid range is selected the Calendar popup closes. To set a range where the start date is after the end date as valid you can use the [`AllowReverse` parameter](#daterangepicker-parameters). When you set `AllowReverse` to `true` the Calendar popup closes on each date selection.
 
 ## Header Template
 
-The DateRangePicker allows you to customize the rendering of the Calendar popup header. Learn more from the [Header Template article]({%slug daterangepicker-header-template%}).
+The DateRangePicker allows you to customize the rendering of the Calendar popup header. Learn more from the [Header Template article](slug://daterangepicker-header-template).
 
 ## Adaptive Rendering
 
@@ -74,7 +74,7 @@ The Blazor Date Range Picker provides various parameters that allow you to confi
 
 | Attribute | Type and Default Value | Description |
 |----------|----------|----------|
-| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode]({%slug adaptive-rendering%}) of the component. |
+| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode](slug://adaptive-rendering) of the component. |
 | `AllowReverse` | `bool` | Defines if the range is valid when the selected end date is a date before the start date. |
 | `BottomView` | ` CalendarView` enum <br/> (`Month`) | Defines the bottommost view in the popup calendar to which the user can navigate to. |
 | `DebounceDelay` | `int` <br/> (`150`) | Time in milliseconds between the last typed symbol and the value update. Use it to balance between client-side performance and number of database queries. |
@@ -82,7 +82,7 @@ The Blazor Date Range Picker provides various parameters that allow you to confi
 | `Enabled` | `bool` | Whether typing in the inputs is allowed. |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
 | `EndId` and `StartId` | `string` | The `id` attribute on the `<input />` element, so you can attach a `<label for="">` to the input. |
-| `Format` | `string` <br /> (`ShortDatePattern`) | The format of the DateRangePicker DateInputs. The default value depends on `CultureInfo.CurrentCulture`. Read more at [Supported date formats by the DateInput]({%slug components/dateinput/supported-formats%}). |
+| `Format` | `string` <br /> (`ShortDatePattern`) | The format of the DateRangePicker DateInputs. The default value depends on `CultureInfo.CurrentCulture`. Read more at [Supported date formats by the DateInput](slug://components/dateinput/supported-formats). |
 | `Max` | `DateTime`  <br /> (`DateTime(2099, 12, 31)`) | The latest date that the user can select. |
 | `Min` | `DateTime`  <br /> (`DateTime(1900, 1, 1)`)| The earliest date that the user can select. |
 | `InputMode` | `string` | The [`inputmode` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) of the `<input />` element. |
@@ -93,10 +93,10 @@ The Blazor Date Range Picker provides various parameters that allow you to confi
 | `ShowOtherMonthDays` | `bool` | Defines whether the leading and trailing days from other months in the Calendar popup are visible in the current month view. |
 | `StartValue` and `EndValue` | `T` | The current values of the inputs for start and end of the range. Can be used for two-way binding. |
 | `TabIndex` | `int?` | The `tabindex` attribute of both `input` HTML elements in the component. They both will have the same `tabindex`. Use it to customize the tabbing (focus) order of the inputs on your page. |
-| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`]({%slug adaptive-rendering%}). |
+| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`](slug://adaptive-rendering). |
 | `View` | ` CalendarView` enum <br/> (`Month`) | The current view that will be displayed in the popup calendar. |
 
-The date range picker is, essentially, two [DateInputs]({%slug components/dateinput/overview%}) and a [Calendar]({%slug components/calendar/overview%}) and the properties it exposes are mapped to the corresponding properties of these two components. You can read more about their behavior in the respective components' documentation.
+The date range picker is, essentially, two [DateInputs](slug://components/dateinput/overview) and a [Calendar](slug://components/calendar/overview) and the properties it exposes are mapped to the corresponding properties of these two components. You can read more about their behavior in the respective components' documentation.
 
 @[template](/_contentTemplates/date-inputs/general.md#typing-parameters)
 
@@ -109,7 +109,7 @@ The following parameters enable you to customize the appearance of the Blazor Da
 | `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the Date Range Picker.
 | `PopupClass` | `string` | additional CSS class to customize the appearance of the Date Range Picker's dropdown.
 
-You can find more options for customizing the Date Range Picker styling in the [Appearance article]({%slug daterangepicker-appearance%}).
+You can find more options for customizing the Date Range Picker styling in the [Appearance article](slug://daterangepicker-appearance).
 
 @[template](/_contentTemplates/date-inputs/general.md#format-placeholder)
 
@@ -163,11 +163,11 @@ Add a reference to the component instance to use the [Date Range Picker's method
 
 ## Next Steps
 
-* [Using the Date Range Picker Events]({%slug daterangepicker-events%})
+* [Using the Date Range Picker Events](slug://daterangepicker-events)
 
 ## See Also
 
 * [Live Demo: Date Range Picker](https://demos.telerik.com/blazor-ui/daterangepicker/overview)
-* [Input Validation]({%slug common-features/input-validation%})
-* [Supported Input Date Formats]({%slug components/dateinput/supported-formats%})
+* [Input Validation](slug://common-features/input-validation)
+* [Supported Input Date Formats](slug://components/dateinput/supported-formats)
 * [DateRangePicker API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikDateRangePicker-1)
diff --git a/components/datetimepicker/accessibility/wai-aria-support.md b/components/datetimepicker/accessibility/wai-aria-support.md
index d164345739..93f64036df 100644
--- a/components/datetimepicker/accessibility/wai-aria-support.md
+++ b/components/datetimepicker/accessibility/wai-aria-support.md
@@ -103,4 +103,4 @@ For details on how the DateTimePicker keyboard navigation works, refer to the [B
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/datetimepicker/events.md b/components/datetimepicker/events.md
index d0e96bc868..f70a015a8c 100644
--- a/components/datetimepicker/events.md
+++ b/components/datetimepicker/events.md
@@ -242,5 +242,5 @@ model value: @DateTimePickerValue
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
diff --git a/components/datetimepicker/increment-steps.md b/components/datetimepicker/increment-steps.md
index ef2551edee..cdcafff090 100644
--- a/components/datetimepicker/increment-steps.md
+++ b/components/datetimepicker/increment-steps.md
@@ -50,5 +50,5 @@ All values default to `1` to provide every possible option. If you set a value l
 ## See Also
 
 * [Live Demo: DateTime Picker Incremental Steps](https://demos.telerik.com/blazor-ui/datetimepicker/incremental-steps)
-* [DateTimePicker Overview]({%slug components/datetimepicker/overview%})
+* [DateTimePicker Overview](slug://components/datetimepicker/overview)
 
diff --git a/components/datetimepicker/overview.md b/components/datetimepicker/overview.md
index 8142f9d913..7a8cf4f9f6 100644
--- a/components/datetimepicker/overview.md
+++ b/components/datetimepicker/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor DateTime Picker Overview
 
-The <a href="https://www.telerik.com/blazor-ui/datetimepicker" target="_blank">Blazor DateTime Picker component</a> allows the user to choose both a date and a time from a visual list in a dropdown, or to type it into a [date input]({%slug components/dateinput/overview%}) that can accept only DateTime values. You can control the date and time format of the input, and respond to [events]({%slug components/datetimepicker/events %}).
+The <a href="https://www.telerik.com/blazor-ui/datetimepicker" target="_blank">Blazor DateTime Picker component</a> allows the user to choose both a date and a time from a visual list in a dropdown, or to type it into a [date input](slug://components/dateinput/overview) that can accept only DateTime values. You can control the date and time format of the input, and respond to [events](slug://components/datetimepicker/events ).
 
 ## Creating Blazor DateTimePicker
 
@@ -42,15 +42,15 @@ DateTimePicker.
 
 ## Increment Steps
 
-The DateTime Picker enables the end users to change the selected value by clicking the rendered arrows. You can set the increment and decrement steps through the nested `DateTimePickerSteps` tag and its parameters. [Read more about the Blazor DateTime Picker increment steps...]({%slug datetimepicker-steps%})
+The DateTime Picker enables the end users to change the selected value by clicking the rendered arrows. You can set the increment and decrement steps through the nested `DateTimePickerSteps` tag and its parameters. [Read more about the Blazor DateTime Picker increment steps...](slug://datetimepicker-steps)
 
 ## Events
 
-The Blazor DateTime Picker generates events that you can handle and further customize its behavior. [Read more about the Blazor DateTime Picker events...]({%slug components/datetimepicker/events%}).
+The Blazor DateTime Picker generates events that you can handle and further customize its behavior. [Read more about the Blazor DateTime Picker events...](slug://components/datetimepicker/events).
 
 ## Validation
 
-You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...]({%slug common-features/input-validation%}).
+You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...](slug://common-features/input-validation).
 
 ## Action Buttons
 
@@ -72,12 +72,12 @@ The Blazor Date Time Picker provides various parameters that allow you to config
 
 | Attribute | Type and Default Value | Description |
 |---|---|---|
-| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode]({%slug adaptive-rendering%}) of the component. |
+| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode](slug://adaptive-rendering) of the component. |
 | `AutoComplete` | `string` <br /> (`"off"`) | The `autocomplete` HTML attribute of the `input`. |
 | `DebounceDelay` | `int` <br/> (`150`) | Time in milliseconds between the last typed symbol and the value update. Use it to balance between client-side performance and number of database queries. |
 | `Enabled` | `bool` | Defines if the `DateTimePicker` is enabled |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
-| `Format` | `string` <br /> (`FullDateTimePattern`) | The format of the DateTimePicker's DateInput. The default value depends on `CultureInfo.CurrentCulture`. Read more at [Supported date formats by the DateInput]({%slug components/dateinput/supported-formats%}). |
+| `Format` | `string` <br /> (`FullDateTimePattern`) | The format of the DateTimePicker's DateInput. The default value depends on `CultureInfo.CurrentCulture`. Read more at [Supported date formats by the DateInput](slug://components/dateinput/supported-formats). |
 | `Id` | `string` | The `id` HTML attribute of the `input` |
 | `InputMode` | `string` | The [`inputmode` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) of the `<input />` element. |
 | `Max` | `DateTime` <br /> (`DateTime(2099, 12, 31, 23, 59, 59)`) | The latest date and time that the user can select |
@@ -87,7 +87,7 @@ The Blazor Date Time Picker provides various parameters that allow you to config
 | `ShowWeekNumbers` | `bool` | Sets if the popup Calendar will display week numbers according to the [ISO-8601 format](https://learn.microsoft.com/en-us/dotnet/api/system.globalization.isoweek.getweekofyear). Note that the [ISO week number may differ from the conventional .NET week number](https://learn.microsoft.com/en-us/dotnet/api/system.globalization.calendar.getweekofyear). |
 | `ShowOtherMonthDays` | `bool` <br/> (`true`) | Defines whether the leading and trailing days from other months in the Calendar popup are visible in the current month view. |
 | `TabIndex` | `int?` | The `tabindex` attribute of the HTML element. You can use it to customize the order in which the inputs in your form focus with the `Tab` key. |
-| `ValidateOn` | `ValidationEvent` enum <br/> (`Input`) |`ValidateOn` - configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs) |
+| `ValidateOn` | `ValidationEvent` enum <br/> (`Input`) |`ValidateOn` - configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs](slug://common-features/input-validation#validation-modes-for-simple-inputs) |
 | `Value` | `DateTime` or `DateTime?` | The current value of the component. Supports two-way binding. |
 
 @[template](/_contentTemplates/date-inputs/general.md#typing-parameters)
@@ -102,7 +102,7 @@ The following parameters enable you to customize the appearance of the Blazor Da
 |`PopupClass`|`string`|Additional CSS class to customize the appearance of the DateTimePicker's dropdown|
 |`Width`|`string`|The width of the `DateTimePicker`|
 
-You can find more options for customizing the DateTimePicker styling in the [Appearance article]({%slug datetimepicker-appearance%}).
+You can find more options for customizing the DateTimePicker styling in the [Appearance article](slug://datetimepicker-appearance).
 
 @[template](/_contentTemplates/date-inputs/general.md#format-placeholder)
 
@@ -139,12 +139,12 @@ Add a reference to the component instance to use the [Date Time Picker's methods
 
 ## Next Steps
 
-* [DateTimePicker Events]({%slug components/datetimepicker/events%})
+* [DateTimePicker Events](slug://components/datetimepicker/events)
 
 
 ## See Also
 
 * [Live Demo: DateTime Picker](https://demos.telerik.com/blazor-ui/datetimepicker/overview)
-* [Input Validation]({%slug common-features/input-validation%})
-* [Supported Input Date Formats]({%slug components/dateinput/supported-formats%})
+* [Input Validation](slug://common-features/input-validation)
+* [Supported Input Date Formats](slug://components/dateinput/supported-formats)
 * [DateTimePicker API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikDateTimePicker-1)
diff --git a/components/dialog/accessibility/wai-aria-support.md b/components/dialog/accessibility/wai-aria-support.md
index 784ed70711..f418740de2 100644
--- a/components/dialog/accessibility/wai-aria-support.md
+++ b/components/dialog/accessibility/wai-aria-support.md
@@ -69,9 +69,9 @@ The Dialog has been tested with the following screen readers and browsers combin
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor Dialog Demos](https://demos.telerik.com/blazor-ui/dialog/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/dialog/action-buttons.md b/components/dialog/action-buttons.md
index a4f0a5c921..11ebd970a2 100644
--- a/components/dialog/action-buttons.md
+++ b/components/dialog/action-buttons.md
@@ -76,4 +76,4 @@ The following example demonstrates all supported layout options for the Dialog a
 
 ## See Also
 
-* [(KB) Keep Content in the DOM When the Window Is Closed]({%slug window-kb-keep-content-when-closed%})
+* [(KB) Keep Content in the DOM When the Window Is Closed](slug://window-kb-keep-content-when-closed)
diff --git a/components/dialog/events.md b/components/dialog/events.md
index 0893a391be..2b93c6887f 100644
--- a/components/dialog/events.md
+++ b/components/dialog/events.md
@@ -108,4 +108,4 @@ You can use the `VisibleChanged` event to get notifications when the user tries
 
 ## See Also
 
-* [Focus TextBox on Dialog Open]({%slug window-kb-focus-button-textbox-on-open%})
+* [Focus TextBox on Dialog Open](slug://window-kb-focus-button-textbox-on-open)
diff --git a/components/dialog/header.md b/components/dialog/header.md
index ecef0cf892..24344677a8 100644
--- a/components/dialog/header.md
+++ b/components/dialog/header.md
@@ -10,7 +10,7 @@ position: 5
 
 # Dialog Header
 
-The header contains the `Title` and the [`Close Action` button]({%slug dialog-action-buttons%}).
+The header contains the `Title` and the [`Close Action` button](slug://dialog-action-buttons).
 
 There are two ways to define a Dialog title:
 * a string `Title` attribute of the component
@@ -55,4 +55,4 @@ The following example demonstrates how to set up the title through a template. T
 
 ## See Also
 
-* [(KB) Keep Content in the DOM When the Window Is Closed]({%slug window-kb-keep-content-when-closed%})
+* [(KB) Keep Content in the DOM When the Window Is Closed](slug://window-kb-keep-content-when-closed)
diff --git a/components/dialog/integration.md b/components/dialog/integration.md
index 32743538a3..5e0e5b2d1e 100644
--- a/components/dialog/integration.md
+++ b/components/dialog/integration.md
@@ -12,7 +12,7 @@ position: 9
 
 A common application requirement is to display other Blazor components in the Blazor Dialog. You can achieve this by placing them inside the `DialogContent`.
 
->The two-way binding for the parameters of the components nested in the `DialogContent` may not work as expected. The Dialog needs to [`Refresh`]({%slug dialog-overview%}#dialog-reference-and-methods) to reflect UI changes.
+>The two-way binding for the parameters of the components nested in the `DialogContent` may not work as expected. The Dialog needs to [`Refresh`](slug://dialog-overview#dialog-reference-and-methods) to reflect UI changes.
 
 This article contains the following examples:
 
@@ -23,9 +23,9 @@ This article contains the following examples:
 
 To integrate the Checkbox in the Dialog:
 
-1. Include the [Telerik Checkbox]({%slug checkbox-overview%}) as `DialogContent`.
-1. Set the [`Value` parameter]({%slug checkbox-overview%}#checkbox-parameters) of the Checkbox via two-way binding.
-1. Invoke the Dialog's `Refresh` method in the [`OnChange` event]({%slug checkbox-events%}#onchange) of the Checkbox.
+1. Include the [Telerik Checkbox](slug://checkbox-overview) as `DialogContent`.
+1. Set the [`Value` parameter](slug://checkbox-overview#checkbox-parameters) of the Checkbox via two-way binding.
+1. Invoke the Dialog's `Refresh` method in the [`OnChange` event](slug://checkbox-events#onchange) of the Checkbox.
 
 >caption Using Checkbox in Dialog
 
@@ -55,9 +55,9 @@ To integrate the Checkbox in the Dialog:
 
 To integrate the Filter in the Dialog:
 
-1. Include the [Telerik Filter]({%slug filter-overview%}) as `DialogContent`.
-1. Set the [`Value` parameter]({%slug filter-overview%}#filter-parameters) of the Filter via one-way binding.
-1. Invoke the Dialog's `Refresh` method in the [`ValueChanged` event]({%slug filter-events%}#valuechanged) of the Filter.
+1. Include the [Telerik Filter](slug://filter-overview) as `DialogContent`.
+1. Set the [`Value` parameter](slug://filter-overview#filter-parameters) of the Filter via one-way binding.
+1. Invoke the Dialog's `Refresh` method in the [`ValueChanged` event](slug://filter-events#valuechanged) of the Filter.
 1. Update the `Value` parameter of the Filter manually in the `ValueChanged` event of the Filter.
 
 >caption Using Filter in Dialog
diff --git a/components/dialog/overview.md b/components/dialog/overview.md
index 3b7eb3b61d..b0c5d3e27d 100644
--- a/components/dialog/overview.md
+++ b/components/dialog/overview.md
@@ -12,7 +12,7 @@ position: 0
 
 The <a href="https://www.telerik.com/blazor-ui/dialog" target="_blank">Blazor Dialog component</a> is a modal popup that brings information to the user. It provides actions through its action buttons to prompt the user for input or to ask for a decision. The component can also contain more complex UI elements that require the attention of the user.
 
-The Dialog component and its [predefined options]({%slug dialog-predefined%}) aim to deliver user experience similar to default browser dialogs. For more functionalities such as drag and resize, use the [Window]({%slug window-overview%}) component.
+The Dialog component and its [predefined options](slug://dialog-predefined) aim to deliver user experience similar to default browser dialogs. For more functionalities such as drag and resize, use the [Window](slug://window-overview) component.
 
 ## Creating Blazor Dialog
 
@@ -24,7 +24,7 @@ The Dialog component and its [predefined options]({%slug dialog-predefined%}) ai
 
 4. Set the Dialog content through the `DialogContent` RenderFragment parameter
 
-5. (optional) Configure the [`DialogButtons`]({%slug  dialog-action-buttons%}) inside the `TelerikDialog` tag.
+5. (optional) Configure the [`DialogButtons`](slug://dialog-action-buttons) inside the `TelerikDialog` tag.
 
 >caption A basic configuration of the Telerik Dialog.
 
@@ -51,19 +51,19 @@ The Dialog component and its [predefined options]({%slug dialog-predefined%}) ai
 
 ## Predefined Dialogs
 
-Predefined Dialogs are styled substitutes to the standard browser dialogs - confirm, alert and prompt. [Read more about the Blazor Predefined Dialogs]({%slug dialog-predefined%}).
+Predefined Dialogs are styled substitutes to the standard browser dialogs - confirm, alert and prompt. [Read more about the Blazor Predefined Dialogs](slug://dialog-predefined).
 
 ## Header
 
-The Dialog allows header customization and gives the option to toggle the close button. [Read more about the Dialog Header]({%slug dialog-header%}).
+The Dialog allows header customization and gives the option to toggle the close button. [Read more about the Dialog Header](slug://dialog-header).
 
 ## Action Buttons
 
-The Dialog provides options for rendering action buttons and customizing their text and layout. [Read more about the Dialog Action Buttons]({%slug dialog-action-buttons%}).
+The Dialog provides options for rendering action buttons and customizing their text and layout. [Read more about the Dialog Action Buttons](slug://dialog-action-buttons).
 
 ## Events
 
-The Blazor Dialog fires a `VisibleChanged` event to customize the application behavior and respond to user actions. [Read more about the Blazor Dialog events]({%slug dialog-events%}).
+The Blazor Dialog fires a `VisibleChanged` event to customize the application behavior and respond to user actions. [Read more about the Blazor Dialog events](slug://dialog-events).
 
 ## Dialog Parameters
 
@@ -73,16 +73,16 @@ The Blazor Dialog provides various parameters to configure the component. Also c
 
 | Parameter | Type and Default Value | Description |
 | --- | --- | --- |
-| `ButtonsLayout` | `DialogButtonsLayout` enum <br /> (`Stretch`) | The layout of the actions button in the footer. See more in the [Action Buttons article]({%slug  dialog-action-buttons%})). |
+| `ButtonsLayout` | `DialogButtonsLayout` enum <br /> (`Stretch`) | The layout of the actions button in the footer. See more in the [Action Buttons article](slug://dialog-action-buttons)). |
 | `Class` | `string` | A custom CSS class to the `<div class="k-window k-dialog">` element. |
 | `CloseOnOverlayClick` | `bool` | Defines if clicking on the modal overlay should close the Dialog. |
 | `FocusedElementSelector` | `string` | The CSS selector of the initially focused item on open. By default, it is the first focusable item in the Dialog. |
-| `Height` | `string` | The height of the Dialog in any [supported CSS unit]({%slug common-features/dimensions%}). |
-| `ShowCloseButton` | `bool` <br /> (`true`) | Defines if the component will render a Close button in the titlebar. See more in the [Header article]({%slug  dialog-header%}). |
+| `Height` | `string` | The height of the Dialog in any [supported CSS unit](slug://common-features/dimensions). |
+| `ShowCloseButton` | `bool` <br /> (`true`) | Defines if the component will render a Close button in the titlebar. See more in the [Header article](slug://dialog-header). |
 | `ThemeColor` | `string` | A predefined color scheme for the Dialog, especially the titlebar. Use the available members of the static class [`ThemeConstants.Dialog.ThemeColor`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.Dialog.ThemeColor). |
 | `Title` | `string` | The Dialog title. |
 | `Visible` | `bool` | Defines the Dialog visibility. |
-| `Width` | `string` | The width of the Dialog in any [supported CSS unit]({%slug common-features/dimensions%}). |
+| `Width` | `string` | The width of the Dialog in any [supported CSS unit](slug://common-features/dimensions). |
 
 
 ## Dialog Reference and Methods
@@ -91,7 +91,7 @@ The Dialog methods are accessible through its reference.
 
 | Method | Description |
 | --- | --- |
-| `Refresh` | Re-renders the Dialog. <br /> The Dialog is rendered as a child of the [`TelerikRootComponent`]({%slug rootcomponent-overview%}), instead of where it is declared. As a result, it doesn't automatically refresh when its content is updated. In such cases, the `Refresh` method comes in handy to ensure that the Dialog content is up-to-date. |
+| `Refresh` | Re-renders the Dialog. <br /> The Dialog is rendered as a child of the [`TelerikRootComponent`](slug://rootcomponent-overview), instead of where it is declared. As a result, it doesn't automatically refresh when its content is updated. In such cases, the `Refresh` method comes in handy to ensure that the Dialog content is up-to-date. |
 
 >caption Get a reference to the Dialog and use its methods.
 
@@ -133,16 +133,16 @@ The Dialog methods are accessible through its reference.
 
 ## Next Steps
 
-* [Customize the Dialog Header]({%slug dialog-header%})
+* [Customize the Dialog Header](slug://dialog-header)
 
-* [Customize the Dialog Action Buttons]({%slug dialog-action-buttons%})
+* [Customize the Dialog Action Buttons](slug://dialog-action-buttons)
 
-* [Explore the Predefined Dialogs]({%slug dialog-predefined%})
+* [Explore the Predefined Dialogs](slug://dialog-predefined)
 
-* [Handle the Dialog Events]({%slug dialog-events%})
+* [Handle the Dialog Events](slug://dialog-events)
 
 ## See Also
 
 * [Live Dialog Demos](https://demos.telerik.com/blazor-ui/dialog/overview)
 * [Dialog API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikDialog)
-* [Comparison between All Popup Components]({%slug common-kb-popup-component-comparison%})
+* [Comparison between All Popup Components](slug://common-kb-popup-component-comparison)
diff --git a/components/dialog/predefined.md b/components/dialog/predefined.md
index 68ade02e2e..121ef4a701 100644
--- a/components/dialog/predefined.md
+++ b/components/dialog/predefined.md
@@ -32,25 +32,25 @@ There are three available ready-made dialogs:
 
 ### TelerikRootComponent Dependency
 
-The `DialogFactory` cascading parameter can only be consumed inside child Razor components of the [`TelerikRootComponent`]({%slug rootcomponent-overview%}#purpose). This is easily achieved in standard Blazor apps where the `TelerikRootComponent` resides inside the layout file.
+The `DialogFactory` cascading parameter can only be consumed inside child Razor components of the [`TelerikRootComponent`](slug://rootcomponent-overview#purpose). This is easily achieved in standard Blazor apps where the `TelerikRootComponent` resides inside the layout file.
 
-* To show predefined dialogs in `MainLayout.razor`, [add the `TelerikRootComponent` in a parent layout]({%slug rootcomponent-overview%}#using-telerikrootcomponent).
-* When [using UI for Blazor in ASP.NET apps]({%slug telerik-blazor-in-asp-net-app%}), an additional child component is needed.
+* To show predefined dialogs in `MainLayout.razor`, [add the `TelerikRootComponent` in a parent layout](slug://rootcomponent-overview#using-telerikrootcomponent).
+* When [using UI for Blazor in ASP.NET apps](slug://telerik-blazor-in-asp-net-app), an additional child component is needed.
 
-If the `TelerikRootComponent` is not available, or if it's at the wrong place in the app, [the `DialogFactory` will trigger a `NullReferenceException`]({%slug dialog-kb-dialogfactory-null%}).
+If the `TelerikRootComponent` is not available, or if it's at the wrong place in the app, [the `DialogFactory` will trigger a `NullReferenceException`](slug://dialog-kb-dialogfactory-null).
 
 ### Using await
 
-The `DialogFactory` methods must be awaited. Do not use them with [discard variables (`_`)](https://learn.microsoft.com/en-us/dotnet/csharp/fundamentals/functional/discards). If you don't need to await the user response, then [use the `<TelerikDialog>` component]({%slug dialog-overview%}) declaratively. 
+The `DialogFactory` methods must be awaited. Do not use them with [discard variables (`_`)](https://learn.microsoft.com/en-us/dotnet/csharp/fundamentals/functional/discards). If you don't need to await the user response, then [use the `<TelerikDialog>` component](slug://dialog-overview) declaratively. 
 
 ### Showing Multiple Predefined Dialogs
 
-The `DialogFactory` supports only one open popup dialog at a time. Showing multiple predefined dialogs simultaneously can result in unexpected app behavior. If a long asynchronous operation can end with the display of a `DialogFactory` popup, the application should prevent the user from triggering additional predefined dialogs before the time consuming operation completes. Consider a [LoaderContainer]({%slug loadercontainer-overview%}) to block the whole user interface or a [specific component]({%slug loadercontainer-overview%}#fill-a-parent-container).
+The `DialogFactory` supports only one open popup dialog at a time. Showing multiple predefined dialogs simultaneously can result in unexpected app behavior. If a long asynchronous operation can end with the display of a `DialogFactory` popup, the application should prevent the user from triggering additional predefined dialogs before the time consuming operation completes. Consider a [LoaderContainer](slug://loadercontainer-overview) to block the whole user interface or a [specific component](slug://loadercontainer-overview#fill-a-parent-container).
 
 
 ## Alert
 
-The alert dialog is a Blazor popup message. It shows the user that something went wrong, such as a major error that requires their attention and blocks the UI, as opposed to a [notification]({%slug notification-overview%}) that is not modal and is small.
+The alert dialog is a Blazor popup message. It shows the user that something went wrong, such as a major error that requires their attention and blocks the UI, as opposed to a [notification](slug://notification-overview) that is not modal and is small.
 
 >caption Use an Alert dialog
 
@@ -196,5 +196,5 @@ The prompt dialog returns a `string` that the user enters when they press `OK`,
 ## See Also
 
 * [Live Demo: Predefined Dialogs](https://demos.telerik.com/blazor-ui/dialog/predefined-dialogs)
-* [Using the `<TelerikDialog>` Component Declaratively]({%slug dialog-overview%})
-* [Setting Width to Predefined Dialogs]({%slug dialog-kb-dialogfactory-alert-confirm-prompt-width%})
+* [Using the `<TelerikDialog>` Component Declaratively](slug://dialog-overview)
+* [Setting Width to Predefined Dialogs](slug://dialog-kb-dialogfactory-alert-confirm-prompt-width)
diff --git a/components/drawer/accessibility/wai-aria-support.md b/components/drawer/accessibility/wai-aria-support.md
index fe9b09a939..9119d8c9db 100644
--- a/components/drawer/accessibility/wai-aria-support.md
+++ b/components/drawer/accessibility/wai-aria-support.md
@@ -65,4 +65,4 @@ For details on how the Drawer keyboard navigation works, refer to the [Blazor Dr
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/drawer/data-bind.md b/components/drawer/data-bind.md
index 1b49e326fa..1444da7782 100644
--- a/components/drawer/data-bind.md
+++ b/components/drawer/data-bind.md
@@ -25,7 +25,7 @@ This article has the following sections:
 The drawer items provide the following features that you control through the corresponding fields in their data binding:
 
 * `Text` - the text that will be shown on the item.
-* `Icon` - the [Telerik Font or SVG icon]({%slug common-features-icons%}) that will be rendered in the item. Read more in the [Icons article]({%slug breadcrumb-icons%}).
+* `Icon` - the [Telerik Font or SVG icon](slug://common-features-icons) that will be rendered in the item. Read more in the [Icons article](slug://breadcrumb-icons).
 * `Url` - the view the item will navigate to by generating a link.
 * `Separator` - whether the item will be a separator line instead of a clickable item.
 
@@ -92,4 +92,4 @@ https://docs.telerik.com/blazor-ui/components/drawer/navigation
 ## See Also
 
 * [Drawer Demos](https://demos.telerik.com/blazor-ui/drawer/overview)
-* [Drawer Navigation]({% slug drawer-navigation%})
+* [Drawer Navigation](slug://drawer-navigation)
diff --git a/components/drawer/events.md b/components/drawer/events.md
index ae86293844..2565d2746b 100644
--- a/components/drawer/events.md
+++ b/components/drawer/events.md
@@ -19,7 +19,7 @@ This article explains the events available in the Telerik Drawer for Blazor:
 
 ## SelectedItemChanged
 
-The `SelectedItemChanged` event fires every time the user clicks on a new item from the Drawer. You can use it with one-way data binding to respond to the user [selection]({%slug drawer-selection%}). It receives an argument of the Drawer data model type.
+The `SelectedItemChanged` event fires every time the user clicks on a new item from the Drawer. You can use it with one-way data binding to respond to the user [selection](slug://drawer-selection). It receives an argument of the Drawer data model type.
 
 >caption Handle SelectedItemChanged event
 
@@ -135,7 +135,7 @@ The `ExpandedChanged` event fires every time the component's state is changed -
 
 ## OnItemRender
 
-The `OnItemRender` event fires when each item in the Drawer renders. It allows you to customize the appearance of an item. Note that the event does not work alongside a [`<Template>`]({%slug drawer-templates%}#template), as the template disables all item related built-in features of the Drawer.
+The `OnItemRender` event fires when each item in the Drawer renders. It allows you to customize the appearance of an item. Note that the event does not work alongside a [`<Template>`](slug://drawer-templates#template), as the template disables all item related built-in features of the Drawer.
 
 As an argument, the event handler receives an object of type `DrawerItemRenderEventArgs` that contains the following properties: 
 
diff --git a/components/drawer/icons.md b/components/drawer/icons.md
index 614652f105..7ce6393bf4 100644
--- a/components/drawer/icons.md
+++ b/components/drawer/icons.md
@@ -10,7 +10,7 @@ position: 22
 
 # Drawer Icons
 
-You can add [Telerik Font or SVG icons]({%slug common-features-icons%}) to the Drawer items. The component also supports custom icons.
+You can add [Telerik Font or SVG icons](slug://common-features-icons) to the Drawer items. The component also supports custom icons.
 
 To use Drawer item icons, define a property in the component model class and assign the property name to the `IconField` parameter of the Drawer.
 
@@ -89,5 +89,5 @@ If the icon property name in the Drawer model is `Icon`, there is no need to set
 
 ## See Also
 
-* [Drawer Data Binding]({%slug drawer-data-binding%})
+* [Drawer Data Binding](slug://drawer-data-binding)
 * [Drawer Demos](https://demos.telerik.com/blazor-ui/drawer/overview)
diff --git a/components/drawer/modes.md b/components/drawer/modes.md
index fa648019c7..6165cadbf1 100644
--- a/components/drawer/modes.md
+++ b/components/drawer/modes.md
@@ -20,11 +20,11 @@ You can choose which mode you want to use though the `Mode` parameter which take
 
 If the `Mode` is not set, by default the Drawer will be in `Overlay` mode.
 
-You can control how large the drawer is by setting its `Width` parameter to a [CSS value]({%slug common-features/dimensions%}). We recommend using pixel values for better control over its size - there are many ways a drawer can be placed in the layout and percentage values depend highly on the DOM hierarchy and CSS rules applied to the elements.
+You can control how large the drawer is by setting its `Width` parameter to a [CSS value](slug://common-features/dimensions). We recommend using pixel values for better control over its size - there are many ways a drawer can be placed in the layout and percentage values depend highly on the DOM hierarchy and CSS rules applied to the elements.
 
 ## Push Mode
 
-When `Mode` is set to `Push`, the Drawer's default width is `240px` when expanded, and `50px` when collapsed in [MiniMode]({%slug drawer-mini-mode%}). When it's state is changed (expanded/collapsed) the content is resized - the width is increased or decreased based on the state.
+When `Mode` is set to `Push`, the Drawer's default width is `240px` when expanded, and `50px` when collapsed in [MiniMode](slug://drawer-mini-mode). When it's state is changed (expanded/collapsed) the content is resized - the width is increased or decreased based on the state.
 
 The drawer's height is dynamic based on the height of the content (you can change it with CSS).
 
@@ -126,6 +126,6 @@ You may want to add padding to the left of the content so that it is not overlap
 
 ## See Also
 
-* [Drawer MiniMode]({%slug drawer-mini-mode%})
-* [Drawer Navigation]({%slug drawer-navigation%})
+* [Drawer MiniMode](slug://drawer-mini-mode)
+* [Drawer Navigation](slug://drawer-navigation)
 * [Drawer Demos](https://demos.telerik.com/blazor-ui/drawer/overview)
diff --git a/components/drawer/navigation.md b/components/drawer/navigation.md
index 1e8105bdd9..fb7046add7 100644
--- a/components/drawer/navigation.md
+++ b/components/drawer/navigation.md
@@ -10,7 +10,7 @@ position: 3
 
 # Drawer for Navigation
 
-The Drawer is a different kind of a [menu]({%slug components/menu/overview%}) that is commonly used to navigate between pages in the app - it can generate the needed links for you through its `UrlField` when [data binding]({%slug drawer-data-binding%}).
+The Drawer is a different kind of a [menu](slug://components/menu/overview) that is commonly used to navigate between pages in the app - it can generate the needed links for you through its `UrlField` when [data binding](slug://drawer-data-binding).
 
 To use the Drawer for navigating between pages:
 
@@ -63,11 +63,11 @@ To use the Drawer for navigating between pages:
 ## Additional Examples
 
 * A GitHub sample project that showcases [Drawer as side navigation](https://github.com/telerik/blazor-ui/tree/master/drawer/sidenav).
-* KB article on [how to select a Drawer item when the page loads]({%slug drawer-kb-sync-selected-item%}).
+* KB article on [how to select a Drawer item when the page loads](slug://drawer-kb-sync-selected-item).
 
 
 ## See Also
 
-* [Drawer Data Binding]({%slug drawer-data-binding%})
-* [Drawer Templates]({%slug drawer-templates%})
+* [Drawer Data Binding](slug://drawer-data-binding)
+* [Drawer Templates](slug://drawer-templates)
 * [Drawer Demos](https://demos.telerik.com/blazor-ui/drawer/overview)
diff --git a/components/drawer/overview.md b/components/drawer/overview.md
index 03d8806ef4..d4bce8042e 100644
--- a/components/drawer/overview.md
+++ b/components/drawer/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Drawer Overview
 
-The <a href="https://www.telerik.com/blazor-ui/drawer" target="_blank">Blazor Drawer component</a> is an interactive side panel for [navigating]({%slug drawer-navigation%}) in responsive web applications. It can be always visible, or expanded and collapsed. The Drawer allows switching the content of different sections on the page. You can customize its [templates]({%slug drawer-templates%}), [expand modes]({%slug drawer-modes%}), [minimize behavior]({%slug drawer-mini-mode%}) and also respond to [events]({%slug drawer-events%}).
+The <a href="https://www.telerik.com/blazor-ui/drawer" target="_blank">Blazor Drawer component</a> is an interactive side panel for [navigating](slug://drawer-navigation) in responsive web applications. It can be always visible, or expanded and collapsed. The Drawer allows switching the content of different sections on the page. You can customize its [templates](slug://drawer-templates), [expand modes](slug://drawer-modes), [minimize behavior](slug://drawer-mini-mode) and also respond to [events](slug://drawer-events).
 
 ## Creating Blazor Drawer
 
@@ -61,44 +61,44 @@ The <a href="https://www.telerik.com/blazor-ui/drawer" target="_blank">Blazor Dr
 
 ## Data Binding
 
-The Blazor Drawer requires a data source so that it can display items to the user. To provide a data source, use the `Data` property. [Read more about the Blazor Drawer data binding]({%slug drawer-data-binding%}).
+The Blazor Drawer requires a data source so that it can display items to the user. To provide a data source, use the `Data` property. [Read more about the Blazor Drawer data binding](slug://drawer-data-binding).
 
 ## Navigation
 
 A Drawer is often used to list pages, views, or sections in an application so the user can navigate between them. To do that with a Drawer, there are two options:
 
-* Use the built-in `UrlField` in the [bound data]({%slug drawer-data-binding%}) to populate the URLs in the anchors that the Drawer will generate if you provide a URL for the given item.
-* Use a [Template]({%slug drawer-templates%}) to generate the desired links (e.g., `NavLink` components) with your own code to enable fine-tuning.
+* Use the built-in `UrlField` in the [bound data](slug://drawer-data-binding) to populate the URLs in the anchors that the Drawer will generate if you provide a URL for the given item.
+* Use a [Template](slug://drawer-templates) to generate the desired links (e.g., `NavLink` components) with your own code to enable fine-tuning.
 
-[Read more about the Blazor Drawer navigation]({%slug drawer-navigation%}).
+[Read more about the Blazor Drawer navigation](slug://drawer-navigation).
 
 ## Modes
 
-The Blazor Drawer provides *Push* and *Overlay* modes of expansion. They determine if the Drawer items push the other content to the side, or cover it temporarily. [Read more about the Blazor Drawer modes]({%slug drawer-modes%}).
+The Blazor Drawer provides *Push* and *Overlay* modes of expansion. They determine if the Drawer items push the other content to the side, or cover it temporarily. [Read more about the Blazor Drawer modes](slug://drawer-modes).
 
 ## Mini View
 
-By default, the Drawer is not visible when collapsed. To leave a small hint for the user, the Drawer provides a Mini View, so that users can navigate with just a single action, without the need to expand the Drawer items. [Read more about the Blazor Drawer mini view]({%slug drawer-mini-mode%}).
+By default, the Drawer is not visible when collapsed. To leave a small hint for the user, the Drawer provides a Mini View, so that users can navigate with just a single action, without the need to expand the Drawer items. [Read more about the Blazor Drawer mini view](slug://drawer-mini-mode).
 
 ## Selection
 
-The Drawer component has an option to pre-select the desired item, then use the highlighted item to load/generate content, or denote the current page. [Read more about the Blazor Drawer selection]({%slug drawer-selection%}).
+The Drawer component has an option to pre-select the desired item, then use the highlighted item to load/generate content, or denote the current page. [Read more about the Blazor Drawer selection](slug://drawer-selection).
 
 ## Templates
 
-The Blazor Drawer allows full control of the item rendering and layout. The component has an *ItemTemplate* and *Template*. [Read more about the Blazor Drawer templates]({%slug drawer-templates%}).
+The Blazor Drawer allows full control of the item rendering and layout. The component has an *ItemTemplate* and *Template*. [Read more about the Blazor Drawer templates](slug://drawer-templates).
 
 ## Drawer Icons
 
-To illustrate the purpose of each Drawer item, the Blazor Drawer has the option to add images, icon classes, or font icons. [Read more about the Blazor Drawer icons]({%slug drawer-icons%}).
+To illustrate the purpose of each Drawer item, the Blazor Drawer has the option to add images, icon classes, or font icons. [Read more about the Blazor Drawer icons](slug://drawer-icons).
 
 ## Refresh Data
 
-The Drawer can refresh its interface, when the data items change. [Read more about the Blazor Drawer data refresh]({%slug drawer-refresh-data%}).
+The Drawer can refresh its interface, when the data items change. [Read more about the Blazor Drawer data refresh](slug://drawer-refresh-data).
 
 ## Events
 
-The Blazor Drawer fires select and expand events. Handle those events to respond to user actions. [Read more about the Blazor Drawer events]({%slug drawer-events%}).
+The Blazor Drawer fires select and expand events. Handle those events to respond to user actions. [Read more about the Blazor Drawer events](slug://drawer-events).
 
 ## Drawer Parameters
 
@@ -109,9 +109,9 @@ The Blazor Drawer provides various parameters to configure the component. Also c
 | Parameter | Type and Default Value | Description |
 | --- | --- | --- |
 | `Class` | `string` | Renders a custom CSS class to the `<div class="k-drawer-container">` element. |
-| `Expanded` | `bool` | Specifies whether the Drawer is expanded or collapsed. If this parameter is used to expand or collapse the component the animations will not be available. To use animations you have to use the Drawer's [Methods](#drawer-reference-and-methods). It is possible, however, to use the value to implement custom layouts in the drawer [templates]({%slug drawer-templates%}) or in your own layout.|
-| `Mode` | `DrawerMode` enum <br /> (`Overlay`) | Controls whether the Drawer is in `Push` or `Overlay` mode. [Read more about the supported modes]({%slug drawer-modes%}). |
-| `MiniMode` | `bool` | Controls whether there is [mini view]({%slug drawer-mini-mode%}) when the Drawer is collapsed. |
+| `Expanded` | `bool` | Specifies whether the Drawer is expanded or collapsed. If this parameter is used to expand or collapse the component the animations will not be available. To use animations you have to use the Drawer's [Methods](#drawer-reference-and-methods). It is possible, however, to use the value to implement custom layouts in the drawer [templates](slug://drawer-templates) or in your own layout.|
+| `Mode` | `DrawerMode` enum <br /> (`Overlay`) | Controls whether the Drawer is in `Push` or `Overlay` mode. [Read more about the supported modes](slug://drawer-modes). |
+| `MiniMode` | `bool` | Controls whether there is [mini view](slug://drawer-mini-mode) when the Drawer is collapsed. |
 | `Position` | `DrawerPosition` enum <br /> (`Start`) | Determines on which side of the `DrawerContent` the item list will render. |
 | `Width` | `string` <br /> (`240px`) | The width of the Drawer when expanded. |
 
@@ -160,13 +160,13 @@ The Drawer methods are accessible through it's reference. These methods change t
 
 ## Next Steps
 
-* [Bind the Drawer to Data]({%slug drawer-data-binding%})
+* [Bind the Drawer to Data](slug://drawer-data-binding)
 
-* [Define Drawer Templates]({%slug drawer-templates%})
+* [Define Drawer Templates](slug://drawer-templates)
 
-* [Use the Drawer for Navigation]({%slug drawer-navigation%})
+* [Use the Drawer for Navigation](slug://drawer-navigation)
 
-* [Handle the Drawer Events]({%slug drawer-events%})
+* [Handle the Drawer Events](slug://drawer-events)
 
 ## See Also
 
diff --git a/components/drawer/refresh-data.md b/components/drawer/refresh-data.md
index 8ba7d7ef47..73e84a44ec 100644
--- a/components/drawer/refresh-data.md
+++ b/components/drawer/refresh-data.md
@@ -95,6 +95,6 @@ In this article:
 
 ## See Also
 
-* [ObservableCollection]({%slug common-features-observable-data%})
+* [ObservableCollection](slug://common-features-observable-data)
 * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
 * [Drawer Demos](https://demos.telerik.com/blazor-ui/drawer/overview)
diff --git a/components/drawer/selection.md b/components/drawer/selection.md
index 125d5302d8..b35d3a3e28 100644
--- a/components/drawer/selection.md
+++ b/components/drawer/selection.md
@@ -12,11 +12,11 @@ position: 10
 
 The Drawer lets the user select an item. You can also pre-select a desired item. You can use this highlighted item to load/generate content, or to denote the current page.
 
-To use the item selection, use set the `SelectedItem` parameter. It allows two-way binding (`@bind-SelectedItem`) and one-way binding + [SelectedItemChanged]({%slug drawer-events%}#selecteditemchanged) event.
+To use the item selection, use set the `SelectedItem` parameter. It allows two-way binding (`@bind-SelectedItem`) and one-way binding + [SelectedItemChanged](slug://drawer-events#selecteditemchanged) event.
 
 The `SelectedItem` is of the same type as the Drawer data model.
 
-If you use the drawer for [page navigation]({%slug drawer-navigation%}), the selected item will remain highlighted as long as the drawer does not get disposed - meaning, it must be outside of the `@Body`.
+If you use the drawer for [page navigation](slug://drawer-navigation), the selected item will remain highlighted as long as the drawer does not get disposed - meaning, it must be outside of the `@Body`.
 
 >caption Use tho way data binding for the SelectedItem.
 
@@ -63,6 +63,6 @@ If you use the drawer for [page navigation]({%slug drawer-navigation%}), the sel
 
 ## See Also
 
-* [Drawer Events]({%slug drawer-events%})
-* [Drawer Navigation]({%slug drawer-navigation%})
+* [Drawer Events](slug://drawer-events)
+* [Drawer Navigation](slug://drawer-navigation)
 * [Drawer Demos](https://demos.telerik.com/blazor-ui/drawer/overview)
diff --git a/components/drawer/templates.md b/components/drawer/templates.md
index 836db75697..a0ed9b7278 100644
--- a/components/drawer/templates.md
+++ b/components/drawer/templates.md
@@ -17,11 +17,11 @@ The Drawer can be customized by using Templates. This article explains the avail
 
 ## ItemTemplate
 
-The `<ItemTemplate>` controls the rendering of the [data bound items]({%slug drawer-data-binding%}) in the Drawer, in case you want to use a rendering different than the default one.
+The `<ItemTemplate>` controls the rendering of the [data bound items](slug://drawer-data-binding) in the Drawer, in case you want to use a rendering different than the default one.
 
 This template receives a `context` argument that is of the data model type and represents the current item.
 
-When using an `ItemTemplate`, the Drawer can still [navigate automatically if the `UrlField` parameter is set, or if the Drawer data items have a populated `Url` property]({%slug drawer-navigation%}).
+When using an `ItemTemplate`, the Drawer can still [navigate automatically if the `UrlField` parameter is set, or if the Drawer data items have a populated `Url` property](slug://drawer-navigation).
 
 >caption Use ItemTemplate to control the rendering of the items in the Drawer.
 
@@ -86,7 +86,7 @@ When using an `ItemTemplate`, the Drawer can still [navigate automatically if th
 
 The `<Template>` allows you to control the whole rendering of the Drawer so you can add extra content and application logic. This template receives a `context` argument that is `IEnumerable<TItem>` - it is the `Data` collection of the component.
 
-When using this template all built-in features of the Drawer are disabled and should be implemented by the application, for example the [item selection]({%slug drawer-selection%}) and rendering, navigation to different pages, etc. Page navigation can be done with `<a>`, `<NavLink>`, `NavigationManager` and so on.
+When using this template all built-in features of the Drawer are disabled and should be implemented by the application, for example the [item selection](slug://drawer-selection) and rendering, navigation to different pages, etc. Page navigation can be done with `<a>`, `<NavLink>`, `NavigationManager` and so on.
 
 The drawer will expand and collapse as usual, but the content has to be controlled by the application entirely.
 
@@ -216,6 +216,6 @@ Using the `<Template>` and `<ItemTemplate>` together is not possible - the Templ
 ## See Also
 
 * [Drawer Templates Demo](https://demos.telerik.com/blazor-ui/drawer/overview)
-* [Drawer Data Binding]({%slug drawer-data-binding%})
-* [Drawer Navigation]({%slug drawer-navigation%})
+* [Drawer Data Binding](slug://drawer-data-binding)
+* [Drawer Navigation](slug://drawer-navigation)
 * [Hierarchical Drawer Demo](https://demos.telerik.com/blazor-ui/drawer/hierarchical-drawer)
diff --git a/components/dropdownbutton/accessibility/wai-aria-support.md b/components/dropdownbutton/accessibility/wai-aria-support.md
index e2dc1a458a..2fad0980fa 100644
--- a/components/dropdownbutton/accessibility/wai-aria-support.md
+++ b/components/dropdownbutton/accessibility/wai-aria-support.md
@@ -81,4 +81,4 @@ For details on how the DropDownButton keyboard navigation works, refer to the [B
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/dropdownbutton/appearance.md b/components/dropdownbutton/appearance.md
index 9f4ec340b2..b169ae751a 100644
--- a/components/dropdownbutton/appearance.md
+++ b/components/dropdownbutton/appearance.md
@@ -12,7 +12,7 @@ position: 10
 
 This article describes the declarative settings of the DropDownButton component, which affect the styling and appearance of the primary button.
 
-The DropDownButton provides the same appearance parameters as the regular [Button component]({%slug button-appearance%}):
+The DropDownButton provides the same appearance parameters as the regular [Button component](slug://button-appearance):
 
 * [FillMode](#fillmode)
 * [Rounded](#rounded)
@@ -230,8 +230,8 @@ The `ThemeColor` parameter sets the background and text color of the DropDownBut
 
 ## Next Steps
 
-* [Handle DropDownButton Events]({%slug dropdownbutton-events%})
-* [Add DropDownButton Icons]({%slug dropdownbutton-icons%})
+* [Handle DropDownButton Events](slug://dropdownbutton-events)
+* [Add DropDownButton Icons](slug://dropdownbutton-icons)
 
 
 ## See Also
diff --git a/components/dropdownbutton/icons.md b/components/dropdownbutton/icons.md
index b95e56b573..66e720efa5 100644
--- a/components/dropdownbutton/icons.md
+++ b/components/dropdownbutton/icons.md
@@ -14,8 +14,8 @@ The `<TelerikDropDownButton>` and `<DropDownButtonItem>` provide an `Icon` param
 
 The `Icon` parameter type is `object` and it accepts:
 
-* A property of the static [`SvgIcon` class]({%slug common-features-icons%}#icons-list)
-* A member of the [`FontIcon` enum]({%slug common-features-icons%}#icons-list)
+* A property of the static [`SvgIcon` class](slug://common-features-icons#icons-list)
+* A member of the [`FontIcon` enum](slug://common-features-icons#icons-list)
 * A `string` that is a CSS class for a custom icon
 
 @[template](/_contentTemplates/common/icons.md#font-icons-css-note)
diff --git a/components/dropdownbutton/overview.md b/components/dropdownbutton/overview.md
index 7207e80d04..7819ba5703 100644
--- a/components/dropdownbutton/overview.md
+++ b/components/dropdownbutton/overview.md
@@ -50,21 +50,21 @@ The <a href = "https://www.telerik.com/blazor-ui/dropdownbutton" target="_blank"
 
 ## Icons
 
-The primary DropDownButton action and each secondary item in the dropdown can [display an icon or an image]({%slug dropdownbutton-icons%}) for better looks and user experience.
+The primary DropDownButton action and each secondary item in the dropdown can [display an icon or an image](slug://dropdownbutton-icons) for better looks and user experience.
 
 ## Appearance
 
-The DropDownButton provides a [variety of settings to control its visual appearance]({%slug dropdownbutton-appearance%}), for example, the colors, borders, and size. This spares the need to use custom CSS code.
+The DropDownButton provides a [variety of settings to control its visual appearance](slug://dropdownbutton-appearance), for example, the colors, borders, and size. This spares the need to use custom CSS code.
 
 >tip To learn more about the appearance, anatomy, and accessibility of the DropDownButton, visit the [Progress Design System Kit documentation](https://www.telerik.com/design-system/docs/components/dropdownbutton/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 
 ## Events
 
-Each DropDownButton action [fires a separate `OnClick` event]({%slug dropdownbutton-events%}) so that the application can react to user behavior.
+Each DropDownButton action [fires a separate `OnClick` event](slug://dropdownbutton-events) so that the application can react to user behavior.
 
 ## DropDownButton Parameters
 
-The following table lists the DropDownButton parameters, except those related to [built-in styling]({%slug dropdownbutton-appearance%}) and [icons]({%slug dropdownbutton-icons%}). Also check the [DropDownButton API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikDropDownButton) for a full list of properties, methods, and events.
+The following table lists the DropDownButton parameters, except those related to [built-in styling](slug://dropdownbutton-appearance) and [icons](slug://dropdownbutton-icons). Also check the [DropDownButton API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikDropDownButton) for a full list of properties, methods, and events.
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
@@ -73,7 +73,7 @@ The following table lists the DropDownButton parameters, except those related to
 | `AriaDescribedBy` | `string` | Sets the `aria-describedby` attribute of the primary button element `<button class="k-button">`.
 | `AriaLabel` | `string` | Sets the `aria-label` attribute of the primary button element `<button class="k-button">`. |
 | `AriaLabelledBy` | `string` | Sets the `aria-labelledby` attribute of the primary button element `<button class="k-button">`.
-| `Class` | `string` | Renders a custom CSS class to the main component element `<div class="k-dropdown-button">`. Use it to [override the theme styles]({%slug themes-override%}) and achieve a specific appearance if none of the [DropDownButton appearance settings]({%slug dropdownbutton-appearance%}) can do this. |
+| `Class` | `string` | Renders a custom CSS class to the main component element `<div class="k-dropdown-button">`. Use it to [override the theme styles](slug://themes-override) and achieve a specific appearance if none of the [DropDownButton appearance settings](slug://dropdownbutton-appearance) can do this. |
 | `Enabled` | `bool`<br />(`true`) | Defines whether the primary button is enabled. |
 | `Id` | `string` | Sets the `id` attribute of the primary button element `<button class="k-button">`. |
 | `ShowArrowButton` | `bool` | Sets the visibility of the Arrow button that displays the popup of the component. |
@@ -118,13 +118,13 @@ The DropDownButton provides the following popup settings:
 | `MaxWidth` | `string` | The maximum width of the popup. |
 | `Width` | `string` | The width of the popup. If you don't specify a value, the dropdown width will match the anchor element width which can help with responsive layouts and 100% widths. |
 
-The parameters that modify the popup dimensions (`Height`, `Width`, `MaxWidth`, etc.) expect [valid CSS values]({%slug common-features/dimensions%}). 
+The parameters that modify the popup dimensions (`Height`, `Width`, `MaxWidth`, etc.) expect [valid CSS values](slug://common-features/dimensions). 
 
 The `MinHeight` and `MaxHeight` have no effect if the `Height` is always within their range. The min and max values are useful only when the dropdown height is set to a relative unit or changes at runtime.
 
 ### Item Settings
 
-The following table lists the `DropDownButtonItem` parameters, except those related to [icons]({%slug dropdownbutton-icons%}).
+The following table lists the `DropDownButtonItem` parameters, except those related to [icons](slug://dropdownbutton-icons).
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
@@ -134,7 +134,7 @@ The following table lists the `DropDownButtonItem` parameters, except those rela
 
 ## DropDownButton Reference and Methods
 
-The DropDownButton exposes a `FocusAsync` method that allows you to focus it programmatically. To use it, define a reference to the component instance with the `@ref` attribute. Consider the Blazor life cycle if you want to [focus the component on page load]({%slug inputs-kb-focus%}#focus-on-page-load).
+The DropDownButton exposes a `FocusAsync` method that allows you to focus it programmatically. To use it, define a reference to the component instance with the `@ref` attribute. Consider the Blazor life cycle if you want to [focus the component on page load](slug://inputs-kb-focus#focus-on-page-load).
 
 >caption Get a reference to the DropDownButton and execute methods
 
@@ -166,9 +166,9 @@ The DropDownButton exposes a `FocusAsync` method that allows you to focus it pro
 
 ## Next Steps
 
-* [Add DropDownButton Icons]({%slug dropdownbutton-icons%})
-* [Handle DropDownButton Events]({%slug dropdownbutton-events%})
-* [Configure the DropDownButton appearance]({%slug dropdownbutton-appearance%})
+* [Add DropDownButton Icons](slug://dropdownbutton-icons)
+* [Handle DropDownButton Events](slug://dropdownbutton-events)
+* [Configure the DropDownButton appearance](slug://dropdownbutton-appearance)
 
 
 ## See Also
diff --git a/components/dropdownlist/accessibility/wai-aria-support.md b/components/dropdownlist/accessibility/wai-aria-support.md
index 92ce57a205..3be9fa1f7e 100644
--- a/components/dropdownlist/accessibility/wai-aria-support.md
+++ b/components/dropdownlist/accessibility/wai-aria-support.md
@@ -115,4 +115,4 @@ For details on how the DropDownList keyboard navigation works, refer to the [Bla
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/dropdownlist/appearance.md b/components/dropdownlist/appearance.md
index 4ff7ad4bd3..8ab1488809 100644
--- a/components/dropdownlist/appearance.md
+++ b/components/dropdownlist/appearance.md
@@ -182,4 +182,4 @@ The `FillMode` controls how the TelerikDropDownList is filled. You can set it to
 
 ## See Also
 
-* [Blazor DropDownList]({%slug components/dropdownlist/overview%})
\ No newline at end of file
+* [Blazor DropDownList](slug://components/dropdownlist/overview)
\ No newline at end of file
diff --git a/components/dropdownlist/data-bind.md b/components/dropdownlist/data-bind.md
index cdd6901eef..17f3d1b3cf 100644
--- a/components/dropdownlist/data-bind.md
+++ b/components/dropdownlist/data-bind.md
@@ -181,5 +181,5 @@ The DropDownList is a generic component and its type depends on the type of its
 
 ## See Also
 
-* [Blazor DropDownList]({%slug components/dropdownlist/overview%})
+* [Blazor DropDownList](slug://components/dropdownlist/overview)
 * [Live Demo: DropDownList](https://demos.telerik.com/blazor-ui/dropdownlist/overview)
\ No newline at end of file
diff --git a/components/dropdownlist/events.md b/components/dropdownlist/events.md
index b84f09b459..94a4514964 100644
--- a/components/dropdownlist/events.md
+++ b/components/dropdownlist/events.md
@@ -20,13 +20,13 @@ This article explains the events available in the Telerik DropDownList for Blazo
 * [OnItemRender](#onitemrender)
 * [OnBlur](#onblur)
 
-The examples in this article use `string` values and simple data sources for brevity. You can use full models, see the [data binding]({%slug components/dropdownlist/databind%}) article for more details.
+The examples in this article use `string` values and simple data sources for brevity. You can use full models, see the [data binding](slug://components/dropdownlist/databind) article for more details.
 
 ## ValueChanged
 
 The `ValueChanged` event fires upon every change of the user selection.
 
-The example below uses [binding]({%slug components/dropdownlist/databind%}) to string data for brevity. You can use full models as well. The type of the argument in the lambda expression must match the `Value` type of the component, and the `ValueField` type (if `ValueField` is set).
+The example below uses [binding](slug://components/dropdownlist/databind) to string data for brevity. You can use full models as well. The type of the argument in the lambda expression must match the `Value` type of the component, and the `ValueField` type (if `ValueField` is set).
 
 >caption Handle DropDownList ValueChanged
 
@@ -66,7 +66,7 @@ The example below uses [binding]({%slug components/dropdownlist/databind%}) to s
 
 ## OnChange
 
-The `OnChange` event represents a user action - confirmation of the current value. In inputs, it fires when the user presses `Enter` in the input, or when the input loses focus. In the DropDownList, it fires when the user selects an item as well. See [here]({%slug ddl-kb-onchange-fires-twice%}) for sample logic on executing it only once per value selection.
+The `OnChange` event represents a user action - confirmation of the current value. In inputs, it fires when the user presses `Enter` in the input, or when the input loses focus. In the DropDownList, it fires when the user selects an item as well. See [here](slug://ddl-kb-onchange-fires-twice) for sample logic on executing it only once per value selection.
 
 >tip The `OnChange` event is a custom event and does not interfere with bindings, so you can use it together with models and forms.
 
@@ -99,19 +99,19 @@ from the model: @MySelectedItem
 
 ## OnRead
 
-You can use the [`OnRead` event]({%slug common-features-data-binding-onread%}) to provide data to the component based on custom logic and the current user input and/or scroll position (when using [virtualization]({%slug dropdownlist-virtualization%})). The event fires when:
+You can use the [`OnRead` event](slug://common-features-data-binding-onread) to provide data to the component based on custom logic and the current user input and/or scroll position (when using [virtualization](slug://dropdownlist-virtualization)). The event fires when:
 
 * The component initializes.
-* The user [filters]({%slug components/dropdownlist/filter%}).
-* The user scrolls with [virtualization]({%slug dropdownlist-virtualization%}) enabled.
+* The user [filters](slug://components/dropdownlist/filter).
+* The user scrolls with [virtualization](slug://dropdownlist-virtualization) enabled.
 
-Find out how to [get the applied filtering and grouping criteria]({%slug common-features-descriptors%}).
+Find out how to [get the applied filtering and grouping criteria](slug://common-features-descriptors).
 
 You can also call remote data through `async` operations.
 
 >caption Custom Data according to the user input in the DropDownList
 
->tip You can also debounce the service calls and implement minimum filter length. An example of such approach is available in [this knowledge base article for the ComboBox]({%slug combo-kb-debounce-onread%}). The same approach is applicable for the DropDownList.
+>tip You can also debounce the service calls and implement minimum filter length. An example of such approach is available in [this knowledge base article for the ComboBox](slug://combo-kb-debounce-onread). The same approach is applicable for the DropDownList.
 
 @[template](/_contentTemplates/common/dropdowns-virtualization.md#value-in-onread)
 
@@ -397,6 +397,6 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
-* [Blazor DropDownList]({%slug components/dropdownlist/overview%})
\ No newline at end of file
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
+* [Blazor DropDownList](slug://components/dropdownlist/overview)
\ No newline at end of file
diff --git a/components/dropdownlist/filter.md b/components/dropdownlist/filter.md
index 56636f8d8b..a292949241 100644
--- a/components/dropdownlist/filter.md
+++ b/components/dropdownlist/filter.md
@@ -14,8 +14,8 @@ The DropDownList filter textbox allows users to filter the available items by th
 
 To enable filtering, set the `Filterable` parameter to `true`. The filtering is case insensitive.
 
-You can also use the [`OnRead` event]({%slug components/dropdownlist/events%}#onread) to:
-* Get the [applied filtering criteria]({%slug common-features-descriptors%}#through-the-onread-event).
+You can also use the [`OnRead` event](slug://components/dropdownlist/events#onread) to:
+* Get the [applied filtering criteria](slug://common-features-descriptors#through-the-onread-event).
 * Implement custom (server) filtering and set data dynamically.
 
 Filtering looks in the `TextField`, and the filter is reset when the dropdown closes.
@@ -26,7 +26,7 @@ The default filter operator is `starts with`. You can choose a different operato
 
 ## Performance
 
-By default, the filtering is debounced with 150ms. Configure that with the [`FilterDebounceDelay`]({%slug components/dropdownlist/overview%}#dropdownlist-parameters) parameter of the component.
+By default, the filtering is debounced with 150ms. Configure that with the [`FilterDebounceDelay`](slug://components/dropdownlist/overview#dropdownlist-parameters) parameter of the component.
 
 ## Placeholder
 
@@ -107,5 +107,5 @@ By default, the filter input in the popup is empty. Set the desired hint in it t
 ## See Also
 
 * [Live Demo: DropDownList Filtering](https://demos.telerik.com/blazor-ui/dropdownlist/filtering)
-* [Custom Filtering by Multiple Fields]({%slug dropdowns-kb-search-in-multiple-fields%})
-* [Blazor DropDownList]({%slug components/dropdownlist/overview%})
\ No newline at end of file
+* [Custom Filtering by Multiple Fields](slug://dropdowns-kb-search-in-multiple-fields)
+* [Blazor DropDownList](slug://components/dropdownlist/overview)
\ No newline at end of file
diff --git a/components/dropdownlist/grouping.md b/components/dropdownlist/grouping.md
index 9ce80b5688..0b6b0049be 100644
--- a/components/dropdownlist/grouping.md
+++ b/components/dropdownlist/grouping.md
@@ -68,9 +68,9 @@ The group headers can stick to the top of the dropdown during scrolling. In othe
 
 * One level of grouping is supported.
 * The `DefaultText` (e.g. "Select item...") is always rendered above the sticky group header in the dropdown.
-* A grouped DropDownList will provide a `Groups` property with a single [`GroupDescriptor`](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) argument of its [OnRead event]({%slug components/dropdownlist/events%}#onread). This will allow the developer to apply grouping with [manual data operations]({%slug components/grid/manual-operations%}).
+* A grouped DropDownList will provide a `Groups` property with a single [`GroupDescriptor`](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) argument of its [OnRead event](slug://components/dropdownlist/events#onread). This will allow the developer to apply grouping with [manual data operations](slug://components/grid/manual-operations).
 
 ## See Also
 
 * [Live Demo: DropDownList Grouping](https://demos.telerik.com/blazor-ui/dropdownlist/grouping)
-* [Blazor DropDownList]({%slug components/dropdownlist/overview%})
\ No newline at end of file
+* [Blazor DropDownList](slug://components/dropdownlist/overview)
\ No newline at end of file
diff --git a/components/dropdownlist/overview.md b/components/dropdownlist/overview.md
index 2b762676c6..909ed76241 100644
--- a/components/dropdownlist/overview.md
+++ b/components/dropdownlist/overview.md
@@ -10,14 +10,14 @@ position: 0
 
 # Blazor DropDownList Overview
 
-The Blazor DropDownList component allows the user to choose an option from a predefined set of choices presented in a dropdown list popup. The developer can control the [data]({%slug components/dropdownlist/databind%}), sizes, and various appearance options like class and [templates]({%slug components/dropdownlist/templates%}).
+The Blazor DropDownList component allows the user to choose an option from a predefined set of choices presented in a dropdown list popup. The developer can control the [data](slug://components/dropdownlist/databind), sizes, and various appearance options like class and [templates](slug://components/dropdownlist/templates).
 
 ## Creating Blazor DropDownList
 
 1. Use the `TelerikDropDownList` tag to add the Blazor dropdown list to your razor page.
 1. Populate its `Data` property with the collection of items you want to appear in the dropdown list.
 1. Set the `TextField` and `ValueField` properties to point to the corresponding names of the model.
-1. [Bind the value of the component]({%slug get-started-value-vs-data-binding %}#value-binding) to a variable of the same type as the type defined in the `ValueField` parameter.
+1. [Bind the value of the component](slug://get-started-value-vs-data-binding #value-binding) to a variable of the same type as the type defined in the `ValueField` parameter.
 1. (optional) Set the `Value` property to the initial value of the model.
 
 >caption DropDownList [data binding](slug://components/dropdownlist/databind), two-way value binding, and main features
@@ -50,19 +50,19 @@ Selected value: @selectedValue
 
 ## Data Binding
 
-The Blazor DropDownList @[template](/_contentTemplates/dropdowns/features.md#data-binding) [Read more about the Blazor DropDownList data binding...]({% slug components/dropdownlist/databind %}).
+The Blazor DropDownList @[template](/_contentTemplates/dropdowns/features.md#data-binding) [Read more about the Blazor DropDownList data binding...](slug://components/dropdownlist/databind).
 
 ## Filtering
 
-The Blazor DropDownList @[template](/_contentTemplates/dropdowns/features.md#filtering) [Read more about the Blazor DropDownList filter...]({% slug components/dropdownlist/filter %}).
+The Blazor DropDownList @[template](/_contentTemplates/dropdowns/features.md#filtering) [Read more about the Blazor DropDownList filter...](slug://components/dropdownlist/filter).
 
 ## Grouping
 
-The Blazor DropDownList @[template](/_contentTemplates/dropdowns/features.md#grouping) [Read more about the Blazor DropDownList grouping...]({% slug components/dropdownlist/grouping %}).
+The Blazor DropDownList @[template](/_contentTemplates/dropdowns/features.md#grouping) [Read more about the Blazor DropDownList grouping...](slug://components/dropdownlist/grouping).
 
 ## Templates
 
-@[template](/_contentTemplates/dropdowns/features.md#templates) [Read more about the Blazor DropDownList templates...]({% slug components/dropdownlist/templates %}).
+@[template](/_contentTemplates/dropdowns/features.md#templates) [Read more about the Blazor DropDownList templates...](slug://components/dropdownlist/templates).
 
 ## Validation
 
@@ -70,7 +70,7 @@ The Blazor DropDownList @[template](/_contentTemplates/dropdowns/features.md#gro
 
 ## Virtualization
 
-@[template](/_contentTemplates/dropdowns/features.md#virtualization) [Read more about the Blazor DropDownList virtualization...]({% slug dropdownlist-virtualization %})
+@[template](/_contentTemplates/dropdowns/features.md#virtualization) [Read more about the Blazor DropDownList virtualization...](slug://dropdownlist-virtualization)
 
 ## Adaptive Rendering
 
@@ -84,20 +84,20 @@ The Blazor DropDownList @[template](/_contentTemplates/dropdowns/features.md#gro
 
 | Parameter      | Type | Description
 | ----------- | ----------- | -----------|
-| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode]({%slug adaptive-rendering%}) of the component. |
+| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode](slug://adaptive-rendering) of the component. |
 | `Data` | `IEnumerable<TItem>` | Allows you to provide the data source. Required. |
-| `DefaultText` | `string` | Simple hint to be displayed when no item is selected yet. In order for it to be shown, the `Value` parameter should be set to a default value depending on the type defined in the `ValueField` parameter. For example, `0` for an `int`, and `null` for an `int?` or `string`. You need to make sure that it does not match the value of an existing item in the data source. See the first example in the [Examples section](#examples) in this article and in the [Input Validation]({%slug common-features/input-validation%}#dropdownlist) article. |
+| `DefaultText` | `string` | Simple hint to be displayed when no item is selected yet. In order for it to be shown, the `Value` parameter should be set to a default value depending on the type defined in the `ValueField` parameter. For example, `0` for an `int`, and `null` for an `int?` or `string`. You need to make sure that it does not match the value of an existing item in the data source. See the first example in the [Examples section](#examples) in this article and in the [Input Validation](slug://common-features/input-validation#dropdownlist) article. |
 | `Enabled` | `bool` | Whether the component is enabled. |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
-|`Filterable` | `bool` | Whether [filtering]({%slug components/dropdownlist/filter%}) is enabled for the end user. |
+|`Filterable` | `bool` | Whether [filtering](slug://components/dropdownlist/filter) is enabled for the end user. |
 | `FilterDebounceDelay` | `int` <br/> 150 | Time in milliseconds between the last typed symbol and the filter input value update. Applicable to filtering only. Use it to balance between client-side performance and number of database queries. |
-| `FilterOperator` | `StringFilterOperator` <br /> (`StartsWith`)| The method of [filtering]({%slug components/dropdownlist/filter%}) the items. |
+| `FilterOperator` | `StringFilterOperator` <br /> (`StartsWith`)| The method of [filtering](slug://components/dropdownlist/filter) the items. |
 | `FilterPlaceholder` |  `string` | The hint that will be displayed in the filter input when it has no value.
 | `Id` | `string` | The `id` attribute rendered on the main wrapping element of the component (`<span class="k-dropdownlist">`). You can use it to attach a `<label for="">` to it. |
 | `InputMode` | `string` | The [`inputmode` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) of the `<input />` element. |
 | `TItem` | `Type`| The type of the model to which the component is bound. Required if you can't provide `Data` or `Value`. Determines the type of the reference object. |
 | `TValue` | `Type` | The type of the value field from the model to which the component is bound. Required if you can't provide `Data` or `Value`. Determines the type of the reference object. The type of the values can be:<br /> - `number` (such as `int`, `double`, and so on)<br /> - `string`<br /> - `Guid`<br /> - `Enum` |
-| `Title` | `string` | The title text rendered in the header of the dropdown list popup (action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`]({%slug adaptive-rendering%}). |
+| `Title` | `string` | The title text rendered in the header of the dropdown list popup (action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`](slug://adaptive-rendering). |
 | `TabIndex` | `int?` | The `tabindex` attribute rendered on the dropdown list. |
 | `TextField` | `string` <br /> (`Text`)| The name of the field from the model that will be shown to the user. |
 | `ValueField` | `string` <br /> (`Value`) | The name of the field from the model that will be the underlying `value`. |
@@ -106,7 +106,7 @@ The Blazor DropDownList @[template](/_contentTemplates/dropdowns/features.md#gro
 
 ### Styling and Appearance
 
-The following parameters enable you to customize the [appearance]({%slug dropdownlist-appearance%}) of the Blazor DropDownList component:
+The following parameters enable you to customize the [appearance](slug://dropdownlist-appearance) of the Blazor DropDownList component:
 
 @[template](/_contentTemplates/dropdowns/features.md#styling)
 
@@ -143,7 +143,7 @@ The DropDownList provides the following popup settings:
 
 ## DropDownList Reference and Methods
 
-The DropDownList is a generic component and its type comes from the model it is bound to and from the value field type. See the [Component Reference]({%slug components/dropdownlist/databind%}#component-reference) section in the Data Binding article for details and examples.
+The DropDownList is a generic component and its type comes from the model it is bound to and from the value field type. See the [Component Reference](slug://components/dropdownlist/databind#component-reference) section in the Data Binding article for details and examples.
 
 Add a reference to the component instance to use the [DropDownList's methods](/blazor-ui/api/Telerik.Blazor.Components.TelerikDropDownList-2).
 
@@ -260,11 +260,11 @@ By default, if no `Value` is provided and no `DefaultText` is defined, the DropD
 
 ## Next Steps
 
-* [Binding the DropDownList to Data]({%slug components/dropdownlist/databind%})
-* [Pre-Selecting Items for the User]({% slug dropdownlist-pre-select-item %})
+* [Binding the DropDownList to Data](slug://components/dropdownlist/databind)
+* [Pre-Selecting Items for the User](slug://dropdownlist-pre-select-item)
 
 ## See Also
 
-* [Data Binding]({%slug components/dropdownlist/databind%})
+* [Data Binding](slug://components/dropdownlist/databind)
 * [Live Demo: DropDownList](https://demos.telerik.com/blazor-ui/dropdownlist/overview)
 * [Live Demo: DropDownList Validation](https://demos.telerik.com/blazor-ui/dropdownlist/validation)
\ No newline at end of file
diff --git a/components/dropdownlist/pre-select-item.md b/components/dropdownlist/pre-select-item.md
index f62eb4de26..5449cf3e41 100644
--- a/components/dropdownlist/pre-select-item.md
+++ b/components/dropdownlist/pre-select-item.md
@@ -49,4 +49,4 @@ Selected value: @selectedValue
 
 ## See Also
 
-* [Blazor DropDownList]({%slug components/dropdownlist/overview%})
\ No newline at end of file
+* [Blazor DropDownList](slug://components/dropdownlist/overview)
\ No newline at end of file
diff --git a/components/dropdownlist/refresh-data.md b/components/dropdownlist/refresh-data.md
index b0b8998433..e6cfdaa1dd 100644
--- a/components/dropdownlist/refresh-data.md
+++ b/components/dropdownlist/refresh-data.md
@@ -21,7 +21,7 @@ In this article:
 
 ## Rebind Method
 
-You can refresh the data of the DropDownList by using the `Rebind` method exposed to the reference of the TelerikDropDownList. If you have manually defined the [OnRead event]({%slug components/dropdownlist/events%}#onread) the business logic defined in its event handler will be executed. 
+You can refresh the data of the DropDownList by using the `Rebind` method exposed to the reference of the TelerikDropDownList. If you have manually defined the [OnRead event](slug://components/dropdownlist/events#onread) the business logic defined in its event handler will be executed. 
 
 ````RAZOR
 @* Clicking on the Rebind button will delete the first option from the dropdown and refresh the data *@
@@ -210,7 +210,7 @@ You can refresh the data of the DropDownList by using the `Rebind` method expose
 
 ## See Also
 
-* [ObservableCollection]({%slug common-features-observable-data%})
+* [ObservableCollection](slug://common-features-observable-data)
 * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
 * [Live Demos](https://demos.telerik.com/blazor-ui)
-* [Blazor DropDownList]({%slug components/dropdownlist/overview%})
\ No newline at end of file
+* [Blazor DropDownList](slug://components/dropdownlist/overview)
\ No newline at end of file
diff --git a/components/dropdownlist/templates.md b/components/dropdownlist/templates.md
index 088df2daac..526989cf75 100644
--- a/components/dropdownlist/templates.md
+++ b/components/dropdownlist/templates.md
@@ -106,4 +106,4 @@ The `ValueTemplate` exposes a `context` which represents the selected item objec
 ## See Also
 
 * [Live Demo: DropDownList Templates](https://demos.telerik.com/blazor-ui/dropdownlist/templates)
-* [Blazor DropDownList]({%slug components/dropdownlist/overview%})
\ No newline at end of file
+* [Blazor DropDownList](slug://components/dropdownlist/overview)
\ No newline at end of file
diff --git a/components/dropdownlist/virtualization.md b/components/dropdownlist/virtualization.md
index bbbe512aa4..e0c7011080 100644
--- a/components/dropdownlist/virtualization.md
+++ b/components/dropdownlist/virtualization.md
@@ -177,4 +177,4 @@ Run this and see how you can display, scroll and filter over 10k records in the
 ## See Also
 
 * [Live Demo: DropDownList Virtualization](https://demos.telerik.com/blazor-ui/dropdownlist/virtualization)
-* [Blazor DropDownList]({%slug components/dropdownlist/overview%})
\ No newline at end of file
+* [Blazor DropDownList](slug://components/dropdownlist/overview)
\ No newline at end of file
diff --git a/components/dropzone/overview.md b/components/dropzone/overview.md
index ee7eb650fb..edc9f3bc9d 100644
--- a/components/dropzone/overview.md
+++ b/components/dropzone/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor DropZone Overview
 
-The <a href="https://www.telerik.com/blazor-ui/dropzone" target="_blank">Telerik UI for Blazor DropZone component</a> allows you to declare an external drop zone for an existing [FileSelect]({%slug fileselect-overview%}) or [Upload]({%slug upload-overview%}) component.
+The <a href="https://www.telerik.com/blazor-ui/dropzone" target="_blank">Telerik UI for Blazor DropZone component</a> allows you to declare an external drop zone for an existing [FileSelect](slug://fileselect-overview) or [Upload](slug://upload-overview) component.
 
 This integration enables the users to drag and drop one or multiple files to a designated space in their viewport. Dropping the files in the connected DropZone area will automatically select or upload them respectively.
 
@@ -18,7 +18,7 @@ This integration enables the users to drag and drop one or multiple files to a d
 
 1. Add the DropZone to your Razor page by using the `TelerikDropZone` tag.
 1. Set the `Id` parameter of the component.
-1. Set the `DropZoneId` of the [FileSelect]({%slug fileselect-overview%}#fileselect-parameters) or [Upload]({%slug upload-overview%}#upload-parameters) component to match the `Id` of the DropZone.
+1. Set the `DropZoneId` of the [FileSelect](slug://fileselect-overview#fileselect-parameters) or [Upload](slug://upload-overview#upload-parameters) component to match the `Id` of the DropZone.
 1. (Optional) Add a note to the DropZone by using the `NoteText` setting.
 
 >caption Basic configuration of the DropZone with the FileSelect component.
@@ -38,15 +38,15 @@ This integration enables the users to drag and drop one or multiple files to a d
 
 ## Integration with the Upload and FileSelect
 
-You can integrate the DropZone with both the [FileSelect]({%slug fileselect-overview%}) or [Upload]({%slug upload-overview%}) components. This will allow users to drop files and automatically select or upload them.
+You can integrate the DropZone with both the [FileSelect](slug://fileselect-overview) or [Upload](slug://upload-overview) components. This will allow users to drop files and automatically select or upload them.
 
 The connection is achieved by simply matching the value of the DropZone `Id` parameter with the `DropZoneId` parameter of the FileSelect or the Upload component.
 
-Once the user drops a file in the external DropZone, the file is automatically sent to the connected FileSelect/Upload. This action effectively raises the `OnSelect` event of the [FileSelect]({%slug fileselect-events%}#onselect) or [Upload]({%slug upload-events%}#onselect). You can handle that to perform further actions with the dropped file(s).
+Once the user drops a file in the external DropZone, the file is automatically sent to the connected FileSelect/Upload. This action effectively raises the `OnSelect` event of the [FileSelect](slug://fileselect-events#onselect) or [Upload](slug://upload-events#onselect). You can handle that to perform further actions with the dropped file(s).
 
 ## Template
 
-The DropZone allows you to customize its rendering and appearance through a `Template` configuration. [Read more about using the DropZone template...]({%slug dropzone-template%})
+The DropZone allows you to customize its rendering and appearance through a `Template` configuration. [Read more about using the DropZone template...](slug://dropzone-template)
 
 ## Parameters
 
@@ -58,8 +58,8 @@ The following table lists DropZone parameters. Check the [DropZone API Reference
 | --- | --- | --- |
 | `Id` | `string` | The id of the DropZone. Assign the same value of the corresponding Upload or FileSelect component to the `DropZoneId`. |
 | `Enabled` | `bool` <br /> (`true`) | Specifies whether the DropZone is enabled. |
-| `HintText` | `string` | The text for the hint of the DropZone. If not provided, the DropZone will render a default value ("Drag and drop files here to upload"). The label text is also [localizable]({%slug globalization-localization%}).|
-| `NoteText` | `string` | Optional content inside the DropZone. Use it to render any additional information below the hint. The label text is also [localizable]({%slug globalization-localization%}). |
+| `HintText` | `string` | The text for the hint of the DropZone. If not provided, the DropZone will render a default value ("Drag and drop files here to upload"). The label text is also [localizable](slug://globalization-localization).|
+| `NoteText` | `string` | Optional content inside the DropZone. Use it to render any additional information below the hint. The label text is also [localizable](slug://globalization-localization). |
 | `Multiple` | `bool` <br /> (`true`) | Enables the user to drop several files at the same time. |
 
 ### Styling and Appearance
@@ -68,14 +68,14 @@ The following parameters enable you to customize the appearance of the Blazor Dr
 
 |  Parameter | Type  | Description |
 | ----------- | ----------- | ----------- |
-| `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the DropZone (`<div class="k-external-dropzone">`). Use it for [overriding the theme or applying custom styles]({%slug themes-override%}). |
+| `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the DropZone (`<div class="k-external-dropzone">`). Use it for [overriding the theme or applying custom styles](slug://themes-override). |
 | `DragOverClass` | `string` | The CSS class that will be rendered on the main wrapping element of the DropZone when a file is dragged over it. Use it for [conditionally styling the component during a dragover action](https://demos.telerik.com/blazor-ui/dropzone/overview). |
-| `Width` | `string` | The width of the DropZone. Accepts a valid CSS value (see the [Dimensions article]({%slug common-features/dimensions%})). |
-| `Height` | `string` | The height of the DropZone. Accepts a valid CSS value (see the [Dimensions article]({%slug common-features/dimensions%})). |
+| `Width` | `string` | The width of the DropZone. Accepts a valid CSS value (see the [Dimensions article](slug://common-features/dimensions)). |
+| `Height` | `string` | The height of the DropZone. Accepts a valid CSS value (see the [Dimensions article](slug://common-features/dimensions)). |
 
 ## Next Steps
 
-* [Using the DropZone Template for custom content]({%slug dropzone-template%})
+* [Using the DropZone Template for custom content](slug://dropzone-template)
 
 ## See Also
 
diff --git a/components/editor/accessibility/wai-aria-support.md b/components/editor/accessibility/wai-aria-support.md
index 134fbc434a..103036aadb 100644
--- a/components/editor/accessibility/wai-aria-support.md
+++ b/components/editor/accessibility/wai-aria-support.md
@@ -63,4 +63,4 @@ For details on how the Editor keyboard navigation works, refer to the [Blazor Ed
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/editor/built-in-tools.md b/components/editor/built-in-tools.md
index e5fca909bd..168d92c79a 100644
--- a/components/editor/built-in-tools.md
+++ b/components/editor/built-in-tools.md
@@ -18,17 +18,17 @@ This article explains which are the built-in tools and commands of the Editor, h
 
 This article describes the Editor *tools* and *commands*.
 
-An Editor *tool* is the visible interface for a given action. For example, the button that bolds text is a tool. Built-in  tools can render as buttons, color pickers or dropdown lists. The Editor also supports [custom tools with custom rendering]({%slug editor-custom-tools%}).
+An Editor *tool* is the visible interface for a given action. For example, the button that bolds text is a tool. Built-in  tools can render as buttons, color pickers or dropdown lists. The Editor also supports [custom tools with custom rendering](slug://editor-custom-tools).
 
 An Editor *command* is the action, which modifies the HTML value in some way. Each built-in Editor tool has an associated command. Custom tools can execute business logic or invoke built-in commands.
 
 The information about the Editor tools and commands is organized in tables below. Here is what the table headers mean:
 
-* `Class Name` - use it to [add the tool to the Editor toolbar]({%slug editor-toolbar%})
+* `Class Name` - use it to [add the tool to the Editor toolbar](slug://editor-toolbar)
 
 * `Command Name` - use it to [execute the command programmatically](#programmatic-execution). In this case, also use the syntax from the `Argument` column.
 
-* `Tool Type` - a tool can be a [button](/blazor-ui/api/Telerik.Blazor.Components.Editor.ButtonTool), a [dropdown list](/blazor-ui/api/Telerik.Blazor.Components.Editor.DropDownListTool) or a [color picker](/blazor-ui/api/Telerik.Blazor.Components.Editor.ColorTool). Each of these three types exposes some customization options. See the examples for the [color tools](#color-tool-customization), [font tools](#font-tool-customization) and the [Format tool](#format-tool-customization). Only *buttons* can be added to tool groups in the [toolbar]({%slug editor-toolbar%}).
+* `Tool Type` - a tool can be a [button](/blazor-ui/api/Telerik.Blazor.Components.Editor.ButtonTool), a [dropdown list](/blazor-ui/api/Telerik.Blazor.Components.Editor.DropDownListTool) or a [color picker](/blazor-ui/api/Telerik.Blazor.Components.Editor.ColorTool). Each of these three types exposes some customization options. See the examples for the [color tools](#color-tool-customization), [font tools](#font-tool-customization) and the [Format tool](#format-tool-customization). Only *buttons* can be added to tool groups in the [toolbar](slug://editor-toolbar).
 
 * `Description` - information about what the tool and command do.
 
@@ -83,7 +83,7 @@ Here is a simple example that demonstrates how to use class names, command names
 * [Commands Without Built-in Tools](#commands-without-built-in-tools)
 * [Programmatic Command Execution](#programmatic-execution)
 
-When [choosing which Editor tools to render]({%slug editor-toolbar%}#choose-toolbar-items), it is possible to [create a tools collection from scratch]({%slug editor-toolbar%}#create-a-toolbar-from-scratch) or [append additional tools to a preset collection]({%slug editor-toolbar%}#add-remove-tools-from-existing-toolbar).
+When [choosing which Editor tools to render](slug://editor-toolbar#choose-toolbar-items), it is possible to [create a tools collection from scratch](slug://editor-toolbar#create-a-toolbar-from-scratch) or [append additional tools to a preset collection](slug://editor-toolbar#add-remove-tools-from-existing-toolbar).
 
 ## Inline Tools
 
@@ -198,7 +198,7 @@ The `ForeColor` and `BackgroundColor` tools expose a few customization propertie
 
 | Property | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Colors` | `IEnumerable<string>`. | The list of available colors to set from the Color tool. You can provide a member of [`ColorPalettePresets`](/blazor-ui/api/Telerik.Blazor.ColorPalettePresets), or a custom list of [RGB(A) or HEX colors in different supported formats]({%slug colorpicker-overview%}#supported-value-formats). |
+| `Colors` | `IEnumerable<string>`. | The list of available colors to set from the Color tool. You can provide a member of [`ColorPalettePresets`](/blazor-ui/api/Telerik.Blazor.ColorPalettePresets), or a custom list of [RGB(A) or HEX colors in different supported formats](slug://colorpicker-overview#supported-value-formats). |
 | `Title` | `string` | The tooltip content that shows on tool mouse over. |
 | `ValueFormat` | `ColorFormat` enum <br /> (`Rgb`) | The format, which the Color tool will set in the generated HTML markup. Use `Rgb` or `Hex`. |
 
@@ -516,9 +516,9 @@ Some Editor commands have no built-in tools. These commands can only be [invoked
 
 ## Programmatic Execution
 
-You can invoke the built-in Editor commands from outside the component or from [custom tools]({%slug editor-custom-tools%}).
+You can invoke the built-in Editor commands from outside the component or from [custom tools](slug://editor-custom-tools).
 
-In order to do so, you need to use the [Editor reference]({%slug editor-overview%}#editor-reference-and-methods) and to call the [ExecuteAsync method]({%slug editor-overview%}#editor-reference-and-methods).
+In order to do so, you need to use the [Editor reference](slug://editor-overview#editor-reference-and-methods) and to call the [ExecuteAsync method](slug://editor-overview#editor-reference-and-methods).
 
 >tip Use the reference tables above to find the command name and its arguments for the command you want to invoke.
 
@@ -572,5 +572,5 @@ In order to do so, you need to use the [Editor reference]({%slug editor-overview
 
 ## See Also
 
-* [Editor Overview]({%slug editor-overview%})
-* [Editor Toolbar]({%slug editor-toolbar%})
+* [Editor Overview](slug://editor-overview)
+* [Editor Toolbar](slug://editor-toolbar)
diff --git a/components/editor/custom-tools.md b/components/editor/custom-tools.md
index a094c8438b..0016975699 100644
--- a/components/editor/custom-tools.md
+++ b/components/editor/custom-tools.md
@@ -12,7 +12,7 @@ previous_url: /components/editor/custom-tool
 
 # Editor Custom Tools
 
-The [Blazor Editor](https://www.telerik.com/blazor-ui/editor) component lets you add custom tools to its [toolbar]({%slug editor-toolbar%}). In those tools, you can use both the [built-in tools and commands]({%slug editor-built-in-tools%}) the editor provides, and also your own custom logic.
+The [Blazor Editor](https://www.telerik.com/blazor-ui/editor) component lets you add custom tools to its [toolbar](slug://editor-toolbar). In those tools, you can use both the [built-in tools and commands](slug://editor-built-in-tools) the editor provides, and also your own custom logic.
 
 In this article:
 
@@ -32,13 +32,13 @@ To create a custom tool:
 
 1. Inside that tag, add your custom content (e.g., buttons, dropdowns, etc.) with their desired rendering, data, logic, event handlers.
 
-1. [Add the custom tool to the Editor toolbar via the `Tools` collection]({%slug editor-toolbar%}#choose-toolbar-items). You can add the custom tools in the desired order and position, regardless of their order in the markup. Custom tools can be added as standalone tools only, not inside an `EditorButtonGroup`.
+1. [Add the custom tool to the Editor toolbar via the `Tools` collection](slug://editor-toolbar#choose-toolbar-items). You can add the custom tools in the desired order and position, regardless of their order in the markup. Custom tools can be added as standalone tools only, not inside an `EditorButtonGroup`.
 
-1. Manipulate the editor content as desired from the custom content events (like clicks) - either through the [editor commands]({%slug editor-built-in-tools%}), or with your own code that manipulates its `Value` field contents.
+1. Manipulate the editor content as desired from the custom content events (like clicks) - either through the [editor commands](slug://editor-built-in-tools), or with your own code that manipulates its `Value` field contents.
 
 ## Examples
 
-When [choosing which Editor tools to render]({%slug editor-toolbar%}#choose-toolbar-items), it is possible to [create a tools collection from scratch]({%slug editor-toolbar%}#create-a-toolbar-from-scratch) or [append additional tools to a preset collection]({%slug editor-toolbar%}#add-remove-tools-from-existing-toolbar).
+When [choosing which Editor tools to render](slug://editor-toolbar#choose-toolbar-items), it is possible to [create a tools collection from scratch](slug://editor-toolbar#create-a-toolbar-from-scratch) or [append additional tools to a preset collection](slug://editor-toolbar#add-remove-tools-from-existing-toolbar).
 
 In this section you can find the following examples:
 
@@ -174,7 +174,7 @@ The [blazor-ui repo]() contains more exmaples of creating custom tools - they al
 
 ## See Also
 
-  * [Editor Overview]({%slug editor-overview%})
-  * [Built-in Tools]({%slug editor-built-in-tools%})
-  * [Toolbar]({%slug editor-toolbar%})
+  * [Editor Overview](slug://editor-overview)
+  * [Built-in Tools](slug://editor-built-in-tools)
+  * [Toolbar](slug://editor-toolbar)
 
diff --git a/components/editor/edit-modes/div.md b/components/editor/edit-modes/div.md
index de53617e05..ef8432a1d5 100644
--- a/components/editor/edit-modes/div.md
+++ b/components/editor/edit-modes/div.md
@@ -11,7 +11,7 @@ position: 3
 
 # Editor Div Edit Mode
 
-The Div [edit mode]({%slug editor-edit-modes-overview%}) uses a `<div>` element for the editable area of the Editor.
+The Div [edit mode](slug://editor-edit-modes-overview) uses a `<div>` element for the editable area of the Editor.
 
 This has the following implications:
 
@@ -107,6 +107,6 @@ The example below shows how you can customize the appearance of elements in the
 
 ## See Also
 
-  * [Editor Overview]({%slug editor-overview%})
-  * [Editor Toolbar]({%slug editor-toolbar%})
+  * [Editor Overview](slug://editor-overview)
+  * [Editor Toolbar](slug://editor-toolbar)
 
diff --git a/components/editor/edit-modes/iframe.md b/components/editor/edit-modes/iframe.md
index 91297f2a4f..3b40992188 100644
--- a/components/editor/edit-modes/iframe.md
+++ b/components/editor/edit-modes/iframe.md
@@ -11,7 +11,7 @@ position: 5
 
 # Editor Iframe Edit Mode
 
-The Iframe mode is the default [edit mode]({%slug editor-edit-modes-overview%}) of the editor. It creates a separate `document` for editing, because the editable area is an `<iframe>` HTML element.
+The Iframe mode is the default [edit mode](slug://editor-edit-modes-overview) of the editor. It creates a separate `document` for editing, because the editable area is an `<iframe>` HTML element.
 
 This has the following implications:
 
@@ -28,6 +28,6 @@ This has the following implications:
 
 ## See Also
 
-  * [Editor Overview]({%slug editor-overview%})
-  * [Editor Toolbar]({%slug editor-toolbar%})
+  * [Editor Overview](slug://editor-overview)
+  * [Editor Toolbar](slug://editor-toolbar)
 
diff --git a/components/editor/edit-modes/overview.md b/components/editor/edit-modes/overview.md
index 51b476732e..dd15e413ec 100644
--- a/components/editor/edit-modes/overview.md
+++ b/components/editor/edit-modes/overview.md
@@ -15,8 +15,8 @@ The Editor provides two different configuration modes you can set that affect th
 
 You control which mode is used through the `EditMode` parameter of the editor which takes a member of the `Telerik.Blazor.EditorEditMode` enum:
 
-* [`Iframe`]({%slug editor-edit-modes-iframe%}) - (the default) - the content area is an editable `<iframe>` element.
-* [`Div`]({%slug editor-edit-modes-div%}) - the content area is an editable `<div>` element.
+* [`Iframe`](slug://editor-edit-modes-iframe) - (the default) - the content area is an editable `<iframe>` element.
+* [`Div`](slug://editor-edit-modes-div) - the content area is an editable `<div>` element.
 
 The key difference is that the `Iframe` mode creates a separate HTML document for editing, and this means that it does not inherit the CSS rules from the current page, and the editor can add some rules of its own to provide styling (for example, for `<table>` elements).
 
@@ -37,8 +37,8 @@ The key difference is that the `Iframe` mode creates a separate HTML document fo
 
 ## See Also
 
-  * [Div Mode]({%slug editor-edit-modes-div%})
-  * [Iframe Mode]({%slug editor-edit-modes-iframe%})
-  * [Editor Overview]({%slug editor-overview%})
-  * [Editor Toolbar]({%slug editor-toolbar%})
+  * [Div Mode](slug://editor-edit-modes-div)
+  * [Iframe Mode](slug://editor-edit-modes-iframe)
+  * [Editor Overview](slug://editor-overview)
+  * [Editor Toolbar](slug://editor-toolbar)
 
diff --git a/components/editor/events.md b/components/editor/events.md
index 8a9ad8000a..b9ef86d721 100644
--- a/components/editor/events.md
+++ b/components/editor/events.md
@@ -46,4 +46,4 @@ When you use that event, you cannot use two-way binding and so you must update t
 
 ## See Also
 
-  * [Editor Overview]({%slug editor-overview%})
+  * [Editor Overview](slug://editor-overview)
diff --git a/components/editor/import-export.md b/components/editor/import-export.md
index bf70fc4667..3298cde982 100644
--- a/components/editor/import-export.md
+++ b/components/editor/import-export.md
@@ -9,7 +9,7 @@ position: 100
 
 # Editor Import and Export
 
-The [Telerik Document Processing tools]({%slug dpl-in-blazor%}) that come with your Blazor license let you import and export the HTML string for the Editor component.
+The [Telerik Document Processing tools](slug://dpl-in-blazor) that come with your Blazor license let you import and export the HTML string for the Editor component.
 
 You can easily import from formats such as `docx`, `rtf`, `txt`, `html` and export to them and to `pdf`.
 
@@ -19,4 +19,4 @@ Allowing the application to decide how to import and export the content makes th
 
 ## See Also
 
-  * [Editor Overview]({%slug editor-overview%})
+  * [Editor Overview](slug://editor-overview)
diff --git a/components/editor/overview.md b/components/editor/overview.md
index 16aab77dc5..29c057a5f6 100644
--- a/components/editor/overview.md
+++ b/components/editor/overview.md
@@ -54,7 +54,7 @@ The <a href = "https://www.telerik.com/blazor-ui/editor" target="_blank">Blazor
 
 The Blazor HTML Editor has a `Value` parameter, similar to other input components. Use the `Value` parameter to get or set the HTML string that shows inside the Editor content area.
 
-An empty string is a valid initial Editor `Value`, but after the user interacts with the component, the minimal component `Value` is at least an empty element (usually `"<p></p>"`). Note that [the Editor and the browser treat empty paragraphs differently]({%slug editor-kb-missing-br-tags-in-value%}).
+An empty string is a valid initial Editor `Value`, but after the user interacts with the component, the minimal component `Value` is at least an empty element (usually `"<p></p>"`). Note that [the Editor and the browser treat empty paragraphs differently](slug://editor-kb-missing-br-tags-in-value).
 
 The Editor manages its content and `Value` depending on a [customizable schema](#prosemirror-schema-and-plugins), which defines the allowed HTML tags and attributes. The component strips all other tags and attributes for compliance and security reasons.
 
@@ -66,7 +66,7 @@ The Editor manages its content and `Value` depending on a [customizable schema](
 
 ## Validation
 
-You can use the standard Data Annotation attributes to validate the content of the Editor. For the performance reasons listed above, validation happens with the `DebounceDelay` delay, not immediately on every keystroke, like simpler inputs. [See the Validation article for an example on how to validate the content of the Editor...]({%slug common-features/input-validation%}#editor)
+You can use the standard Data Annotation attributes to validate the content of the Editor. For the performance reasons listed above, validation happens with the `DebounceDelay` delay, not immediately on every keystroke, like simpler inputs. [See the Validation article for an example on how to validate the content of the Editor...](slug://common-features/input-validation#editor)
 
 ## Large Content Support 
 
@@ -90,7 +90,7 @@ The Telerik UI for [Blazor Editor](https://www.telerik.com/blazor-ui/editor) use
 
 ## ProseMirror Schema and Plugins
 
-The Editor uses a built-in <a href="https://prosemirror.net/docs/guide/#schema" target="_blank">ProseMirror Schema</a> containing some of the most common HTML tags and a set of predefined <a href="https://prosemirror.net/docs/ref/#state.Plugin_System" target="_blank">ProseMirror Plugins</a> for its basic functionalities. You can customize the default ProseMirror [Schema]({%slug editor-prosemirror-schema-overview%}) and [Plugins]({%slug editor-prosemirror-plugins%}) to achieve the desired functionality in the Editor for Blazor. 
+The Editor uses a built-in <a href="https://prosemirror.net/docs/guide/#schema" target="_blank">ProseMirror Schema</a> containing some of the most common HTML tags and a set of predefined <a href="https://prosemirror.net/docs/ref/#state.Plugin_System" target="_blank">ProseMirror Plugins</a> for its basic functionalities. You can customize the default ProseMirror [Schema](slug://editor-prosemirror-schema-overview) and [Plugins](slug://editor-prosemirror-plugins) to achieve the desired functionality in the Editor for Blazor. 
 
 ## Editor Parameters
 
@@ -100,9 +100,9 @@ The following table lists Editor parameters, which are not discussed elsewhere i
 
 | Parameter | Type and Default value | Description |
 |-----------|------------------------|-------------|
-| `Value`  | `string` | The value of the component. It supports two-way binding or alternatively, use it with the [`ValueChanged` event]({%slug editor-events%}#valuechanged). |
+| `Value`  | `string` | The value of the component. It supports two-way binding or alternatively, use it with the [`ValueChanged` event](slug://editor-events#valuechanged). |
 | `DebounceDelay`  | `int` <br /> (`100`) | The time in milliseconds that passes between updates on the `Value`. The default is `100ms` and if that causes performance issues with many repaints on your view, you can increase it. Since the editor is expected to handle longer editing sessions and larger content than regular inputs, we added this parameter to debounce the view-model updates and events. |
-| `Adaptive`  | `bool` | Defines if the [toolbar]({%slug editor-toolbar%}) should adapt to changes in the width of the component and automatically hide and show the overflowing items in a popup. |
+| `Adaptive`  | `bool` | Defines if the [toolbar](slug://editor-toolbar) should adapt to changes in the width of the component and automatically hide and show the overflowing items in a popup. |
 | `Width`  | `string` | Defines the width of the Editor. The default width is `null` but the themes apply `100%`. |
 | `Height`  | `string` <br /> (`250px`) | Defines the height of the Editor. |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
@@ -115,7 +115,7 @@ The Editor provides methods for programmatic operation. To use them, obtain a re
 
 | Method | Description |
 | --- | --- |
-| `ExecuteAsync` | Executes a [built-in Editor command programmatically]({%slug editor-built-in-tools%}#programmatic-execution). You can also use this method to call built-in commands that are part of a [custom tool]({%slug editor-custom-tools%}). |
+| `ExecuteAsync` | Executes a [built-in Editor command programmatically](slug://editor-built-in-tools#programmatic-execution). You can also use this method to call built-in commands that are part of a [custom tool](slug://editor-custom-tools). |
 | `FocusAsync` | Focuses the editable area of the component. Always `await` this call, as it relies on `JSInterop`. @[template](/_contentTemplates/common/inputs.md#focus-kb) |
 
 >caption Paste in the Editor at the cursor position
@@ -144,11 +144,11 @@ You can replace that string with any other content you can generate/obtain accor
 
 ## Next Steps
 
-* [Explore the Built-in Tools and Commands]({%slug editor-built-in-tools%})
-* [Create Custom Tools]({%slug editor-custom-tools%})
-* [Explore the Editor Edit Modes]({%slug editor-edit-modes-overview%})
-* [Import and Export Data]({%slug editor-import-export%})
-* [Learn more about the Editor Events]({%slug editor-events%})
+* [Explore the Built-in Tools and Commands](slug://editor-built-in-tools)
+* [Create Custom Tools](slug://editor-custom-tools)
+* [Explore the Editor Edit Modes](slug://editor-edit-modes-overview)
+* [Import and Export Data](slug://editor-import-export)
+* [Learn more about the Editor Events](slug://editor-events)
 
 ## See Also
 
diff --git a/components/editor/paste-cleanup.md b/components/editor/paste-cleanup.md
index 45104f0ff6..012e1fcef2 100644
--- a/components/editor/paste-cleanup.md
+++ b/components/editor/paste-cleanup.md
@@ -106,5 +106,5 @@ The Editor clears `<script>` tags and removes DOM event handler attributes (e.g.
 
 ## See Also
 
-* [Editor Overview]({%slug editor-overview%})
+* [Editor Overview](slug://editor-overview)
 * [Live Demo: Paste Cleanup](https://demos.telerik.com/blazor-ui/editor/paste-cleanup)
diff --git a/components/editor/prosemirror-plugins.md b/components/editor/prosemirror-plugins.md
index 4ec5a9bca8..c31d4e6c81 100644
--- a/components/editor/prosemirror-plugins.md
+++ b/components/editor/prosemirror-plugins.md
@@ -132,7 +132,7 @@ The Editor will call this function and will pass an argument object that contain
 ## See Also
 
 * [Live Demo: Editor - ProseMirror Plugins](https://demos.telerik.com/blazor-ui/editor/prosemirror-plugins)
-* [ProseMirror Schema]({%slug editor-prosemirror-schema-overview%})
+* [ProseMirror Schema](slug://editor-prosemirror-schema-overview)
 
 
 <!-- # Examples
diff --git a/components/editor/prosemirror-schema/create-new-schema.md b/components/editor/prosemirror-schema/create-new-schema.md
index 3138c5370a..34d062f22d 100644
--- a/components/editor/prosemirror-schema/create-new-schema.md
+++ b/components/editor/prosemirror-schema/create-new-schema.md
@@ -10,7 +10,7 @@ position: 5
 
 # Create a New Schema
 
-This article describes how you can create a new [ProseMirror schema]({%slug editor-prosemirror-schema-overview%}) for the Editor to use. Creating a new schema is useful if you want to change the majority of the default schema.
+This article describes how you can create a new [ProseMirror schema](slug://editor-prosemirror-schema-overview) for the Editor to use. Creating a new schema is useful if you want to change the majority of the default schema.
 
 @[template](/_contentTemplates/editor/general.md#prosemirror-schema-prerequisites)
 
@@ -20,7 +20,7 @@ This article describes how you can create a new [ProseMirror schema]({%slug edit
 
 ## Plugin Dependencies
 
-Some of the ProseMirror plugins that the Editor uses by design depend on specific nodes in the default ProseMirror schema of the Editor. To get a collection of the default plugins, use the [`getPlugins` function]({%slug editor-prosemirror-plugins%}#adding-a-custom-plugin).
+Some of the ProseMirror plugins that the Editor uses by design depend on specific nodes in the default ProseMirror schema of the Editor. To get a collection of the default plugins, use the [`getPlugins` function](slug://editor-prosemirror-plugins#adding-a-custom-plugin).
 
 When creating a new schema from scratch, it is possible to get an exception if you do not include the needed nodes in your custom schema.
 
@@ -28,7 +28,7 @@ You have several options in this case:
 
 * Include the corresponding nodes in your custom schema.
 * Get the collection of default plugins and remove the plugins that require the missing node.
-* Pass a [custom empty collection of plugins to the Editor]({%slug editor-prosemirror-plugins%}) to override the built-in ones.
+* Pass a [custom empty collection of plugins to the Editor](slug://editor-prosemirror-plugins) to override the built-in ones.
 
 Note that with the last two options you will lose the functionality that comes with the plugin(s) you remove.
 
@@ -234,7 +234,7 @@ The below example shows how to:
 ## See Also
 
 * [Live Demo: Editor - ProseMirror Schema](https://demos.telerik.com/blazor-ui/editor/prosemirror-schema)
-* [Modify the Default Schema]({%slug editor-modify-default-schema%})
+* [Modify the Default Schema](slug://editor-modify-default-schema)
 
 
 <!-- # Common Scenarios
diff --git a/components/editor/prosemirror-schema/modify-default-schema.md b/components/editor/prosemirror-schema/modify-default-schema.md
index 34bcf5d01a..74be01cf87 100644
--- a/components/editor/prosemirror-schema/modify-default-schema.md
+++ b/components/editor/prosemirror-schema/modify-default-schema.md
@@ -10,7 +10,7 @@ position: 3
 
 # Modify the Default ProseMirror Schema
 
-This article describes how you can modify the default [ProseMirror schema that the Editor for Blazor uses]({%slug editor-prosemirror-schema-overview%}). Updating the existing schema is useful if you want to:
+This article describes how you can modify the default [ProseMirror schema that the Editor for Blazor uses](slug://editor-prosemirror-schema-overview). Updating the existing schema is useful if you want to:
 
 * Extend the Editor capabilities and allow end users to add more kinds of HTML tags than the predefined ones.
 * Allow adding more attributes to the predefined HTML elements.
@@ -32,7 +32,7 @@ The below example shows how to:
 * Add a `mark` for the `<s>` element.
 * Return the updated schema, so the Editor can use it.
 
->tip The Editor in this example uses the [`Div` edit mode]({%slug editor-edit-modes-iframe%}), so the style for the `<hr>` element is applied. If you use the default [`Iframe` edit mode]({%slug editor-edit-modes-div%}), you have to plug the styles with JavaScript as shown in [this example]({%slug editor-prosemirror-plugins%}).
+>tip The Editor in this example uses the [`Div` edit mode](slug://editor-edit-modes-iframe), so the style for the `<hr>` element is applied. If you use the default [`Iframe` edit mode](slug://editor-edit-modes-div), you have to plug the styles with JavaScript as shown in [this example](slug://editor-prosemirror-plugins).
 
 >caption Modify the default ProseMirror Schema
 
@@ -120,7 +120,7 @@ The below example shows how to:
 ## See Also
 
 * [Live Demo: Editor - ProseMirror Schema](https://demos.telerik.com/blazor-ui/editor/prosemirror-schema)
-* [Create a New Schema]({%slug editor-create-new-schema%})
+* [Create a New Schema](slug://editor-create-new-schema)
 
 
 <!-- # Common Scenarios
diff --git a/components/editor/prosemirror-schema/overview.md b/components/editor/prosemirror-schema/overview.md
index 8cbcf235f0..66be0fd330 100644
--- a/components/editor/prosemirror-schema/overview.md
+++ b/components/editor/prosemirror-schema/overview.md
@@ -28,11 +28,11 @@ The Editor uses a built-in schema with predefined nodes and marks, which describ
 
 To change the existing nodes and marks or define new ones, you can:
 
-* [Modify the Default Schema]({%slug editor-modify-default-schema%})
-* [Create a New Schema]({%slug editor-create-new-schema%})
+* [Modify the Default Schema](slug://editor-modify-default-schema)
+* [Create a New Schema](slug://editor-create-new-schema)
 
 ## See Also
 
 * [Live Demo: Editor - ProseMirror Schema](https://demos.telerik.com/blazor-ui/editor/prosemirror-schema)
-* [Modify the Default Schema]({%slug editor-modify-default-schema%})
-* [Create a New Schema]({%slug editor-create-new-schema%})
+* [Modify the Default Schema](slug://editor-modify-default-schema)
+* [Create a New Schema](slug://editor-create-new-schema)
diff --git a/components/editor/toolbar.md b/components/editor/toolbar.md
index 7bd4b84637..7123b7f959 100644
--- a/components/editor/toolbar.md
+++ b/components/editor/toolbar.md
@@ -11,7 +11,7 @@ position: 20
 
 # Editor Toolbar
 
-The toolbar of the editor is where it command buttons reside and they let the end user apply various formatting and styling - from bold and italic words, to creating lists, tables, inserting images or [custom tools]({%slug editor-custom-tools%}) you can define.
+The toolbar of the editor is where it command buttons reside and they let the end user apply various formatting and styling - from bold and italic words, to creating lists, tables, inserting images or [custom tools](slug://editor-custom-tools) you can define.
 
 ![The Editor Toolbar](images/editor-toolbar-overview.png)
 
@@ -56,7 +56,7 @@ The following example shows how to use the `All` toolset.
 
 ### Predefined Toolset Configurations
 
-The following code snippets show the built-in toolset configurations in `EditorToolSets`. See the [Built-in Editor Tools]({%slug editor-built-in-tools%}) article for more information on each tool.
+The following code snippets show the built-in toolset configurations in `EditorToolSets`. See the [Built-in Editor Tools](slug://editor-built-in-tools) article for more information on each tool.
 
 <div class="skip-repl"></div>
 
@@ -95,13 +95,13 @@ public static List<IEditorTool> All = new List<IEditorTool>()
 
 ## Choose Toolbar Items
 
-To define your own customized collection of tools, you use the `Tools` parameter of the Editor component and populate it with the commands you want available. They can include [custom tools]({%slug editor-custom-tools%}).
+To define your own customized collection of tools, you use the `Tools` parameter of the Editor component and populate it with the commands you want available. They can include [custom tools](slug://editor-custom-tools).
 
 The `Tools` collection is a `List<IEditorTool>`.
 
 Editor tools can be individual buttons (such as Undo, Bold), dropdowns (such as Format or FontSize), and button groups that hold several buttons. 
 
-To add a button, add a `new <Command>()` where `Command` is the name of the tool from [this table]({%slug editor-built-in-tools%}#built-in-tools-and-commands). The VS Intellisense can also show you the classes in the `Telerik.Blazor.Components.Editor.` namespace.
+To add a button, add a `new <Command>()` where `Command` is the name of the tool from [this table](slug://editor-built-in-tools#built-in-tools-and-commands). The VS Intellisense can also show you the classes in the `Telerik.Blazor.Components.Editor.` namespace.
 
 To define a button group, add a `new EditorButtonGroup(comma-separated collection of button commands)`.
 
@@ -292,4 +292,4 @@ When adding a built-in tool to the collection, you can set various parameters to
 
 ## See Also
 
-* [Editor Overview]({%slug editor-overview%})
+* [Editor Overview](slug://editor-overview)
diff --git a/components/filemanager/accessibility/wai-aria-support.md b/components/filemanager/accessibility/wai-aria-support.md
index 707d00c5ce..7ae75bcc47 100644
--- a/components/filemanager/accessibility/wai-aria-support.md
+++ b/components/filemanager/accessibility/wai-aria-support.md
@@ -101,9 +101,9 @@ The FileManager has been tested with the following screen readers and browsers c
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor FileManager Demos](https://demos.telerik.com/blazor-ui/filemanager/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/filemanager/context-menu.md b/components/filemanager/context-menu.md
index 71587da72f..7491c58091 100644
--- a/components/filemanager/context-menu.md
+++ b/components/filemanager/context-menu.md
@@ -23,7 +23,7 @@ The component uses the Telerik UI for Blazor ContextMenu and provides the follow
 
 The `Rename` command of the FileManager ContextMenu allows renaming the selected file or folder. Users can rename one item at a time - the one they open the ContextMenu for.
 
-Clicking the command will fire the [`OnEdit`]({%slug filemanager-events%}#onedit) event. An input with the file/folder name will be rendered, so the user can edit it. Pressing `Enter` or blurring the input will fire the [`OnUpdate`]({%slug filemanager-events%}#onupdate) event allowing you can handle the name update of the actual item in your data source.
+Clicking the command will fire the [`OnEdit`](slug://filemanager-events#onedit) event. An input with the file/folder name will be rendered, so the user can edit it. Pressing `Enter` or blurring the input will fire the [`OnUpdate`](slug://filemanager-events#onupdate) event allowing you can handle the name update of the actual item in your data source.
 
 When an item is renamed, make sure to also update its `Path`. Renaming a directory that has children will require updating their `Path` as well. If the actual file system is modified, then this will be handled out of the box.
 
@@ -31,7 +31,7 @@ When an item is renamed, make sure to also update its `Path`. Renaming a directo
 
 The `Download` command of the FileManager ContextMenu allows downloading of the selected file.
 
-Clicking the command will fire the [`OnDownload`]({%slug filemanager-events%}#ondownload) event, so you can handle the actual download.
+Clicking the command will fire the [`OnDownload`](slug://filemanager-events#ondownload) event, so you can handle the actual download.
 
 The component does not have the actual files, so the `Item` field of the `FileManagerDownloadEventArgs` just provide metadata of the selected file. Based on that, you should find the actual in the file system you are using and provide the following data to the arguments, so the download can be performed:
 
@@ -44,7 +44,7 @@ In addition, you can also provide a custom file name through the `FileName` fiel
 
 The `Delete` command of the FileManager ContextMenu allows deleting of the selected files. Multiple file deletion is supported. It does not matter which item the ContextMenu for, the `Delete` command will handle the deletion of all selected files.
 
-Clicking the command will open a delete confirmation dialog. Pressing the `OK` button will fire the [`OnDelete`]({%slug filemanager-events%}#ondelete) event, so you can handle the deletion of the actual files in the data source. Pressing the `Cancel` button will close the dialog and prevent the deletion.
+Clicking the command will open a delete confirmation dialog. Pressing the `OK` button will fire the [`OnDelete`](slug://filemanager-events#ondelete) event, so you can handle the deletion of the actual files in the data source. Pressing the `Cancel` button will close the dialog and prevent the deletion.
 
 # Example
 
@@ -310,4 +310,4 @@ The following example demonstrates handling of the ContextMenu commends.
 ## See Also
 
 * [Live Demo: FileManager](https://demos.telerik.com/blazor-ui/filemanager/overview)
-* [FileManager Events]({%slug filemanager-events%})
+* [FileManager Events](slug://filemanager-events)
diff --git a/components/filemanager/data-binding/flat-data.md b/components/filemanager/data-binding/flat-data.md
index 9e8e36824a..6e37721f5a 100644
--- a/components/filemanager/data-binding/flat-data.md
+++ b/components/filemanager/data-binding/flat-data.md
@@ -10,7 +10,7 @@ position: 1
 
 # FileManager Data Binding to Flat Data
 
-This article explains how to bind the FileManager for Blazor to flat data. Before continuing, make sure you are familiar with the [FileManager data binding basics]({%slug filemanager-data-binding-overview%}).
+This article explains how to bind the FileManager for Blazor to flat data. Before continuing, make sure you are familiar with the [FileManager data binding basics](slug://filemanager-data-binding-overview).
 
 Flat data means that the entire collection of FileManager items (both files and directories) is available at one level, for example `List<FlatFileEntry>`.
 
@@ -217,7 +217,7 @@ You must also provide the correct value for the `HasDirectories` field - for the
 
 ## See Also
 
-* [FileManager Data Binding Basics]({%slug filemanager-data-binding-overview%})
-* [Binding to Hierarchical Data]({%slug filemanager-data-binding-hierarchical-data%})
+* [FileManager Data Binding Basics](slug://filemanager-data-binding-overview)
+* [Binding to Hierarchical Data](slug://filemanager-data-binding-hierarchical-data)
 * [Live Demo: FileManager Flat Data](https://demos.telerik.com/blazor-ui/filemanager/flat-data)
 * [Live Demo: FileManager Hierarchical Data](https://demos.telerik.com/blazor-ui/filemanager/hierarchical-data)
diff --git a/components/filemanager/data-binding/hierarchical-data.md b/components/filemanager/data-binding/hierarchical-data.md
index 93f9ab27ce..7a1a25549b 100644
--- a/components/filemanager/data-binding/hierarchical-data.md
+++ b/components/filemanager/data-binding/hierarchical-data.md
@@ -10,11 +10,11 @@ position: 2
 
 # FileManager Data Binding to Hierarchical Data
 
-This article explains how to bind the FileManager for Blazor to hierarchical data. Before continuing, make sure you are familiar with the [FileManager data binding basics]({%slug filemanager-data-binding-overview%}).
+This article explains how to bind the FileManager for Blazor to hierarchical data. Before continuing, make sure you are familiar with the [FileManager data binding basics](slug://filemanager-data-binding-overview).
 
 Hierarchical data means that the collection of child items is provided in a field of its parent's model:
 
-* The `Items` field contains a collection of all children including sub-folders and files. They will be rendered in the [Preview Pane]({%slug filemanager-preview-pane%}) when the parent folder is selected.
+* The `Items` field contains a collection of all children including sub-folders and files. They will be rendered in the [Preview Pane](slug://filemanager-preview-pane) when the parent folder is selected.
 
 * The `Directories` field contains a collection of the subfolders of a directory. They will be rendered in the TreeView navigation pane. If there are `Directories` for a specific folder it will have an expand icon. The `HasDirectories` field can override this, however, but it is not required for hierarchical data binding.
 
@@ -204,7 +204,7 @@ This approach of providing items lets you gather separate collections of data th
 
 ## See Also
 
-* [FileManager Data Binding Basics]({%slug filemanager-data-binding-overview%})
-* [Binding to Flat Data]({%slug filemanager-data-binding-flat-data%})
+* [FileManager Data Binding Basics](slug://filemanager-data-binding-overview)
+* [Binding to Flat Data](slug://filemanager-data-binding-flat-data)
 * [Live Demo: FileManager Hierarchical Data](https://demos.telerik.com/blazor-ui/filemanager/hierarchical-data)
 * [Live Demo: FileManager Flat Data](https://demos.telerik.com/blazor-ui/filemanager/flat-data)
diff --git a/components/filemanager/data-binding/overview.md b/components/filemanager/data-binding/overview.md
index 9d9b3b6af8..f58a22d220 100644
--- a/components/filemanager/data-binding/overview.md
+++ b/components/filemanager/data-binding/overview.md
@@ -21,9 +21,9 @@ First, review:
 
 There are two modes of providing data to a FileManager, and they both use the items' features. Once you are familiar with the current article, choose the data binding more you wish to use:
 
-* [Flat data]({%slug filemanager-data-binding-flat-data%}) - a collection of self-referencing items with parent-child relationships See the `Id` and `ParentId` settings.
+* [Flat data](slug://filemanager-data-binding-flat-data) - a collection of self-referencing items with parent-child relationships See the `Id` and `ParentId` settings.
 
-* [Hierarchical data]({%slug filemanager-data-binding-hierarchical-data%}) - each item holds its children in a nested property. See the `Directories` setting.
+* [Hierarchical data](slug://filemanager-data-binding-hierarchical-data) - each item holds its children in a nested property. See the `Directories` setting.
 
 ## FileManager Item Features
 
@@ -243,10 +243,10 @@ The above model properties have the following meaning for the FileManager:
 | `DateModified` | The modification date of the file.
 | `DateModifiedUtc` | The modification date of the file in UTC. Required.
 | **Item relations** | |
-| `Id `| The unique identifier of the file. Required for [**binding to flat data**]({%slug filemanager-data-binding-flat-data%}).
-| `ParentId` | Identifies the file's parent. Required for [**binding to flat data**]({%slug filemanager-data-binding-flat-data%}). Set to `null` for root items. Do *not* use `ParentId` with hierarchical data.
-| `HasDirectories` | Determines whether the item has subdirectories. Required for binding to [**flat data**]({%slug filemanager-data-binding-flat-data%}) If `true`, the directory will show an expand arrow. With [**hierarchical data**]({%slug filemanager-data-binding-hierarchical-data%}), the FileManager renders expand icons based on `Directories`, but `HasDirectories` will take precedence.
-| `Directories` | Defines the item subdirectories. Required for [binding to **hierarchical data**]({%slug filemanager-data-binding-hierarchical-data%}).
+| `Id `| The unique identifier of the file. Required for [**binding to flat data**](slug://filemanager-data-binding-flat-data).
+| `ParentId` | Identifies the file's parent. Required for [**binding to flat data**](slug://filemanager-data-binding-flat-data). Set to `null` for root items. Do *not* use `ParentId` with hierarchical data.
+| `HasDirectories` | Determines whether the item has subdirectories. Required for binding to [**flat data**](slug://filemanager-data-binding-flat-data) If `true`, the directory will show an expand arrow. With [**hierarchical data**](slug://filemanager-data-binding-hierarchical-data), the FileManager renders expand icons based on `Directories`, but `HasDirectories` will take precedence.
+| `Directories` | Defines the item subdirectories. Required for [binding to **hierarchical data**](slug://filemanager-data-binding-hierarchical-data).
 | `Items` | Defines all the subitems (directories and files) of the item.
 
 ## Data Bindings
@@ -278,13 +278,13 @@ All [FileManager item features](#fileManager-item-features) map to model propert
 
 Learn the different ways to provide data to a TreeView:
 
-* [Use flat data]({%slug filemanager-data-binding-flat-data%})
-* [Use hierarchical data]({%slug filemanager-data-binding-hierarchical-data%}) - each item holds its children in a nested property
+* [Use flat data](slug://filemanager-data-binding-flat-data)
+* [Use hierarchical data](slug://filemanager-data-binding-hierarchical-data) - each item holds its children in a nested property
 
 
 ## See Also
 
-* [Binding to Flat Data]({%slug filemanager-data-binding-flat-data%})
-* [Binding to Hierarchical Data]({%slug filemanager-data-binding-hierarchical-data%})
+* [Binding to Flat Data](slug://filemanager-data-binding-flat-data)
+* [Binding to Hierarchical Data](slug://filemanager-data-binding-hierarchical-data)
 * [Live Demo: FileManager Flat Data](https://demos.telerik.com/blazor-ui/filemanager/flat-data)
 * [Live Demo: FileManager Hierarchical Data](https://demos.telerik.com/blazor-ui/filemanager/hierarchical-data)
diff --git a/components/filemanager/events.md b/components/filemanager/events.md
index d3a866c5f0..62a2ad2e7c 100644
--- a/components/filemanager/events.md
+++ b/components/filemanager/events.md
@@ -351,7 +351,7 @@ A FileManager in a WebAssembly app usually displays files from a remote server.
 
 ### PathChanged
 
-The `PathChanged` event fires when the user navigates to a different folder through the TreeView or by double-clicking a folder item in the [FileManager View]({%slug filemanager-views%}). The event handler receives the new path as a `string` argument.
+The `PathChanged` event fires when the user navigates to a different folder through the TreeView or by double-clicking a folder item in the [FileManager View](slug://filemanager-views). The event handler receives the new path as a `string` argument.
 
 ### SelectedItemsChanged
 
@@ -359,7 +359,7 @@ The `SelectedItemChanged` event fires every time the user clicks on a new file/f
 
 ### ViewChanged
 
-The `ViewChanged` event fires when the user toggles between the [two FileManager views (`Grid` and `ListView`)]({%slug filemanager-views%}). If you are using the event, make sure to update the value of the `View` parameter, otherwise the user action will have no effect.
+The `ViewChanged` event fires when the user toggles between the [two FileManager views (`Grid` and `ListView`)](slug://filemanager-views). If you are using the event, make sure to update the value of the `View` parameter, otherwise the user action will have no effect.
 
 ## Example
 
diff --git a/components/filemanager/navigation.md b/components/filemanager/navigation.md
index 0394856422..3978d09df7 100644
--- a/components/filemanager/navigation.md
+++ b/components/filemanager/navigation.md
@@ -14,11 +14,11 @@ The navigation within the file structure of the `FileManager` is achieved with t
 
 ## TreeView
 
-On the left-hand side of the `FileManager`, there is a nested [Blazor UI TreeView]({%slug treeview-overview%}) component, listing all folders loaded in the `FileManager`. The `TreeView` provides you the possibility to rename files or folders, as well as execute commands with the inbuilt ContextMenu.
+On the left-hand side of the `FileManager`, there is a nested [Blazor UI TreeView](slug://treeview-overview) component, listing all folders loaded in the `FileManager`. The `TreeView` provides you the possibility to rename files or folders, as well as execute commands with the inbuilt ContextMenu.
 
 ## Breadcrumb
 
-On the right side of the `TreeView`, there is a [Blazor UI Breadcrumb]({%slug breadcrumb-overview%}) component that shows the current folder path. The `Breadcrumb` allows you to navigate between the folders in the displayed path.
+On the right side of the `TreeView`, there is a [Blazor UI Breadcrumb](slug://breadcrumb-overview) component that shows the current folder path. The `Breadcrumb` allows you to navigate between the folders in the displayed path.
 
 ## See Also
 
diff --git a/components/filemanager/overview.md b/components/filemanager/overview.md
index 145d6aaff0..75dbfa5d02 100644
--- a/components/filemanager/overview.md
+++ b/components/filemanager/overview.md
@@ -10,15 +10,15 @@ position: 0
 
 # Blazor FileManager Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/file-manager" target="_blank">Blazor FileManager component</a> is an Explorer-like component that enables you to [upload]({%slug filemanager-upload%}), [download]({%slug filemanager-context-menu%}#download), [rename]({%slug filemanager-context-menu%}#rename) and manage file and folders.
+The <a href = "https://www.telerik.com/blazor-ui/file-manager" target="_blank">Blazor FileManager component</a> is an Explorer-like component that enables you to [upload](slug://filemanager-upload), [download](slug://filemanager-context-menu#download), [rename](slug://filemanager-context-menu#rename) and manage file and folders.
 
 
 ## Creating Blazor FileManager
 
 1. Add the `TelerikFileManager` tag.
-2. Set FileManager `Data` attribute to an `IEnumerable<TItem>`. [Read more for the component data binding]({%slug filemanager-data-binding-overview%}).
+2. Set FileManager `Data` attribute to an `IEnumerable<TItem>`. [Read more for the component data binding](slug://filemanager-data-binding-overview).
 3. Set the `Path` parameter via one-way or two-way binding.
-4. To allow file operations such as rename, delete, and create new folder, handle the following FileManager [events]({%slug filemanager-events%}): ([`OnModelInit`]({%slug filemanager-events%}#onmodelinit), [`OnCreate`]({%slug filemanager-events%}#oncreate), [`OnUpdate`]({%slug filemanager-events%}#onupdate), [`OnDelete`]({%slug filemanager-events%}#ondelete), [`OnDownload`]({%slug filemanager-events%}#ondownload)).
+4. To allow file operations such as rename, delete, and create new folder, handle the following FileManager [events](slug://filemanager-events): ([`OnModelInit`](slug://filemanager-events#onmodelinit), [`OnCreate`](slug://filemanager-events#oncreate), [`OnUpdate`](slug://filemanager-events#onupdate), [`OnDelete`](slug://filemanager-events#ondelete), [`OnDownload`](slug://filemanager-events#ondownload)).
 
 >caption Telerik Blazor FileManager
 
@@ -330,33 +330,33 @@ The FileManager allows data binding to flat and hierarchical data. There are two
 
 The following list of resources provides details and examples for data binding a FileManager in various scenarios:
 
-* General information on how data binding works - [FileManager Data Binding Overview]({%slug filemanager-data-binding-overview%}).
+* General information on how data binding works - [FileManager Data Binding Overview](slug://filemanager-data-binding-overview).
 
-* Binding to a self-referencing flat data source - [Bind FileManager to Flat Self-Referencing Data]({%slug filemanager-data-binding-flat-data%}).
+* Binding to a self-referencing flat data source - [Bind FileManager to Flat Self-Referencing Data](slug://filemanager-data-binding-flat-data).
 
-* Using hierarchical data source with item collections nested in each item - [Bind FileManager to Hierarchical Data]({%slug filemanager-data-binding-hierarchical-data%}).
+* Using hierarchical data source with item collections nested in each item - [Bind FileManager to Hierarchical Data](slug://filemanager-data-binding-hierarchical-data).
 
-* Handling the `OnRead` event to provide only the current folder data - [FileManager `OnRead`]({%slug filemanager-events%}#read-event).
+* Handling the `OnRead` event to provide only the current folder data - [FileManager `OnRead`](slug://filemanager-events#read-event).
 
 ## Views
 
-The FileManager can [show files and folders in a Grid or in a ListView]({%slug filemanager-views%}). The default mode is ListView, which displays files and folders as thumbnails.
+The FileManager can [show files and folders in a Grid or in a ListView](slug://filemanager-views). The default mode is ListView, which displays files and folders as thumbnails.
 
 ## Toolbar
 
-The FileManger integrates a Toolbar with various commands. [Read more about the available FileManager Toolbar commands...]({%slug filemanager-toolbar%})
+The FileManger integrates a Toolbar with various commands. [Read more about the available FileManager Toolbar commands...](slug://filemanager-toolbar)
 
 ## Navigation
 
-The FileManger allows navigating through the file system in a couple ways - TreeView in a dedicated pane and a Breadcrumb. [Read more about the FileManager Navigation...]({%slug filemanager-navigation%})
+The FileManger allows navigating through the file system in a couple ways - TreeView in a dedicated pane and a Breadcrumb. [Read more about the FileManager Navigation...](slug://filemanager-navigation)
 
 ## Preview Pane
 
-A dedicated Preview Pane can be toggled to display details for the selected file or folder. Its visibility is controlled via a Switch in the Toolbar. [Read more about the FileManager Preview Pane...]({%slug filemanager-preview-pane%})
+A dedicated Preview Pane can be toggled to display details for the selected file or folder. Its visibility is controlled via a Switch in the Toolbar. [Read more about the FileManager Preview Pane...](slug://filemanager-preview-pane)
 
 ## Context Menu
 
-The FileManager displays a Context Menu on right click of an item. The menu provides several built-in commands. [Read more about the Context Menu options...]({%slug filemanager-context-menu%})
+The FileManager displays a Context Menu on right click of an item. The menu provides several built-in commands. [Read more about the Context Menu options...](slug://filemanager-context-menu)
 
 
 ## Reference and Methods
@@ -386,10 +386,10 @@ The following table lists the FileManager parameters. Also check the [FileManage
 
 | Parameter | Type and &nbsp; DefaultValue | Description |
 | --- | --- | --- |
-| `Data` | `IEnumerable<TItem>` | Allows providing data source to the component. See [data bindnig]({%slug filemanager-data-binding-overview%}).
+| `Data` | `IEnumerable<TItem>` | Allows providing data source to the component. See [data bindnig](slug://filemanager-data-binding-overview).
 | `EnableLoaderContainer` | `bool` |  Specifies if loader container should be shown on slow async operations
-| `Path` | `string` | The current path. Updated when the user navigates. Two-way bindale. Handle the [`PathChanged`]({%slug filemanager-events%}#pathchanged) event if you need to react to the user navigation.
-| `View` | `FileManagerViewType` enum <br /> (`ListView`) | The layout of the FileManager main section. It can [show the files and folders as table rows or as thumbnails]({%slug filemanager-views%}). |
+| `Path` | `string` | The current path. Updated when the user navigates. Two-way bindale. Handle the [`PathChanged`](slug://filemanager-events#pathchanged) event if you need to react to the user navigation.
+| `View` | `FileManagerViewType` enum <br /> (`ListView`) | The layout of the FileManager main section. It can [show the files and folders as table rows or as thumbnails](slug://filemanager-views). |
 
 ### Styling and Appearance
 
@@ -403,8 +403,8 @@ The following parameters enable you to customize the appearance of the Blazor Fi
 
 ## Next Steps
 
-* [Data bind the FileManager]({%slug filemanager-data-binding-overview%})
-* [Explore FileManager Events]({%slug filemanager-events%})
+* [Data bind the FileManager](slug://filemanager-data-binding-overview)
+* [Explore FileManager Events](slug://filemanager-events)
 
 
 ## See Also
diff --git a/components/filemanager/selection.md b/components/filemanager/selection.md
index 3ae148a35b..ffc65757fa 100644
--- a/components/filemanager/selection.md
+++ b/components/filemanager/selection.md
@@ -14,7 +14,7 @@ The FileManager lets the user select one or multiple files and folders in its ma
 
 To get or set the selected items, use the `SelectedItems` parameter. It is a collection of items from the FileManager's `Data`.
 
-The `SelectedItems` parameter supports two-way binding (`@bind-SelectedItems`) and one-way binding together with the [`SelectedItemsChanged`]({%slug filemanager-events%}#selecteditemschanged) event.
+The `SelectedItems` parameter supports two-way binding (`@bind-SelectedItems`) and one-way binding together with the [`SelectedItemsChanged`](slug://filemanager-events#selecteditemschanged) event.
 
 See examples of both approaches:
 * [Two-way binding of the SelectedItems](#two-way-binding-of-the-selecteditems)
@@ -232,7 +232,7 @@ When using two-way binding, the selected items will be automatically updated in
 
 ## One-Way Binding of the SelectedItems
 
-You can use one-way binding of the `SelectedItems` in combination with handling the [`SelectedItemsChanged` event]({%slug filemanager-events%}#selecteditemschanged) when you need to respond to the user action of selecting a file/folder.
+You can use one-way binding of the `SelectedItems` in combination with handling the [`SelectedItemsChanged` event](slug://filemanager-events#selecteditemschanged) when you need to respond to the user action of selecting a file/folder.
 
 In this case, you need to manually update the view-model as the framework does not do that automatically when using one-way binding.
 
diff --git a/components/filemanager/toolbar.md b/components/filemanager/toolbar.md
index 7e181d04f8..0f6cedae52 100644
--- a/components/filemanager/toolbar.md
+++ b/components/filemanager/toolbar.md
@@ -20,13 +20,13 @@ By default, the Blazor FileManager displays all its built-in tools in the order
 
 | Tool Name | Tool Tag | Description |
 | --- | --- | --- |
-| New Folder | `FileManagerToolBarNewFolderTool` | A button that creates a new folder in the current location. Read how to handle the creation in the [FileManager Events]({%slug filemanager-events%}) article.|
-| Upload | `FileManagerToolBarUploadTool` | A button that opens a dialog with integrated [Upload component]({%slug upload-overview%}). Read more in the [FileManager Upload]({%slug filemanager-upload%}) article. |
-| Sort Direction | `FileManagerToolBarSortDirectionTool` | A ButtonGroup with ToggleButtons that selects the [sort direction (ascending or descending) to sort the files in the current location]({%slug filemanager-sort%}). |
-| Sort By | `FileManagerToolBarSortTool` | A SplitButton that selects the desired [sort member to sort by]({%slug filemanager-sort%}). |
-| Views | `FileManagerToolBarFileViewTool` | A ButtonGroup with ToggleButtons that [toggles the file and folder visualization between a ListView and a Grid]({%slug filemanager-views%}). |
-| View Details | `FileManagerToolBarViewDetailsTool` | A Switch that toggles the visibility of the [FileManager Preview Pane]({%slug filemanager-preview-pane%}). By default, the preview pane is hidden. |
-| Search | `FileManagerToolBarSearchTool` | A TextBox that [filters the files by name]({%slug filemanager-search%}). |
+| New Folder | `FileManagerToolBarNewFolderTool` | A button that creates a new folder in the current location. Read how to handle the creation in the [FileManager Events](slug://filemanager-events) article.|
+| Upload | `FileManagerToolBarUploadTool` | A button that opens a dialog with integrated [Upload component](slug://upload-overview). Read more in the [FileManager Upload](slug://filemanager-upload) article. |
+| Sort Direction | `FileManagerToolBarSortDirectionTool` | A ButtonGroup with ToggleButtons that selects the [sort direction (ascending or descending) to sort the files in the current location](slug://filemanager-sort). |
+| Sort By | `FileManagerToolBarSortTool` | A SplitButton that selects the desired [sort member to sort by](slug://filemanager-sort). |
+| Views | `FileManagerToolBarFileViewTool` | A ButtonGroup with ToggleButtons that [toggles the file and folder visualization between a ListView and a Grid](slug://filemanager-views). |
+| View Details | `FileManagerToolBarViewDetailsTool` | A Switch that toggles the visibility of the [FileManager Preview Pane](slug://filemanager-preview-pane). By default, the preview pane is hidden. |
+| Search | `FileManagerToolBarSearchTool` | A TextBox that [filters the files by name](slug://filemanager-search). |
 
 By default, the FileManager Toolbar also includes a spacer (`<FileManagerToolBarSpacer />`). This spacer consumes the available empty space and pushes the rest of the tools next to one another.
 
@@ -244,7 +244,7 @@ Add a `<FileManagerToolBar>` tag inside `<TelerikFileManager>` to configure a cu
 
 ## Next Steps
 
-* [Handle FileManager Events]({%slug filemanager-events%})
+* [Handle FileManager Events](slug://filemanager-events)
 
 
 ## See Also
diff --git a/components/filemanager/upload.md b/components/filemanager/upload.md
index aee4d8e0bf..880022d6fb 100644
--- a/components/filemanager/upload.md
+++ b/components/filemanager/upload.md
@@ -10,23 +10,23 @@ position: 17
 
 # FileManager Upload
 
-The FileManager allows uploading of files through an integrated Upload component. The Upload shows in a dialog when the user clicks on the [`Upload` Toolbar button]({%slug filemanager-toolbar%}).
+The FileManager allows uploading of files through an integrated Upload component. The Upload shows in a dialog when the user clicks on the [`Upload` Toolbar button](slug://filemanager-toolbar).
 
->tip Before continuing, make sure you are familiar with the features and API of the [Upload component]({%slug upload-overview%}).
+>tip Before continuing, make sure you are familiar with the features and API of the [Upload component](slug://upload-overview).
 
 Configure the integrated Upload through the `FileManagerUploadSettings` child tag of `FileManagerSettings`. The FileManager exposes parameter names that are identical to the respective Upload component API members:
 
-* [Upload parameters]({%slug upload-overview%}#upload-parameters)
-* [Upload validation settings]({%slug upload-validation%})
-* [Upload events]({%slug upload-events%})
+* [Upload parameters](slug://upload-overview#upload-parameters)
+* [Upload validation settings](slug://upload-validation)
+* [Upload events](slug://upload-events)
 
 ## Example
 
 The example below demonstrates how to handle successful upload on the FileManager. Note the following milestones:
 
-* To actually **upload** the file, [implement a controller method]({%slug upload-overview%}#implement-controller-methods).
-* To save the file in the **correct folder**, use the [Upload's `OnUpload` event]({%slug upload-events%}#onupload) and send the FileManager's `Path` value to the controller.
-* To receive an optional **custom response** from the controller, use the [Upload's `OnSuccess` event arguments]({%slug upload-events%}#onsuccess).
+* To actually **upload** the file, [implement a controller method](slug://upload-overview#implement-controller-methods).
+* To save the file in the **correct folder**, use the [Upload's `OnUpload` event](slug://upload-events#onupload) and send the FileManager's `Path` value to the controller.
+* To receive an optional **custom response** from the controller, use the [Upload's `OnSuccess` event arguments](slug://upload-events#onsuccess).
 
 >caption Using FileManager Upload
 
@@ -285,8 +285,8 @@ The example below demonstrates how to handle successful upload on the FileManage
 
 ## Next Steps
 
-* [Upload Events]({%slug upload-events%})
-* [Upload Validation]({%slug upload-validation%})
+* [Upload Events](slug://upload-events)
+* [Upload Validation](slug://upload-validation)
 
 ## See Also
 
diff --git a/components/filemanager/views.md b/components/filemanager/views.md
index 176448f5c2..416fb27089 100644
--- a/components/filemanager/views.md
+++ b/components/filemanager/views.md
@@ -12,15 +12,15 @@ position: 5
 
 The `FileManager` provides two built-in views for content visualization. It can show files and folders as a grid (table) or as a list of thumbnails.
 
-To switch between the views, use the Toolbar button group. The FileManager also provides a `View` parameter and a [`ViewChanged` event]({%slug filemanager-events%}#viewchanged).
+To switch between the views, use the Toolbar button group. The FileManager also provides a `View` parameter and a [`ViewChanged` event](slug://filemanager-events#viewchanged).
 
 ## Grid View
 
-The Grid view uses the [Blazor Grid]({%slug grid-overview%}) component, and it renders the files in a tabular manner. See the [example](#example).
+The Grid view uses the [Blazor Grid](slug://grid-overview) component, and it renders the files in a tabular manner. See the [example](#example).
 
 ## List View (Thumbnails)
 
-The List view uses the [Blazor ListView]({%slug listview-overview%}) component. The files and folders in this view renders as a list of thumbnails (tiles). See the [example](#example).
+The List view uses the [Blazor ListView](slug://listview-overview) component. The files and folders in this view renders as a list of thumbnails (tiles). See the [example](#example).
 
 ## Example
 
diff --git a/components/fileselect/events.md b/components/fileselect/events.md
index ce74ab6bbf..c7647fb501 100644
--- a/components/fileselect/events.md
+++ b/components/fileselect/events.md
@@ -35,7 +35,7 @@ Property | Type | Description
 `InvalidMaxFileSize` | `bool` | A Boolean flag that shows if the file size exceeds the maximum.
 `Stream`| `FileInfoStream` | A [`System.IO.Stream`](https://docs.microsoft.com/en-us/dotnet/api/system.io.stream) that can be used to load the file to memory, file system, or other. Used for **asynchronously** getting the file contents as a byte array.
 
-> Due to the Blazor framework limitations, `FileInfoStream` does not support **synchronous** operations such as `Read`, `Seek`, `Flush`, and `Write`. The methods exist, but will [throw an exception]({%slug fileselect-kb-stream-exception%}). A possible workaround is to copy the `FileInfoStream` **asynchronously** to another `Stream` with `CopyToAsync`, as demonstrated by the `OnSelect` event example below.
+> Due to the Blazor framework limitations, `FileInfoStream` does not support **synchronous** operations such as `Read`, `Seek`, `Flush`, and `Write`. The methods exist, but will [throw an exception](slug://fileselect-kb-stream-exception). A possible workaround is to copy the `FileInfoStream` **asynchronously** to another `Stream` with `CopyToAsync`, as demonstrated by the `OnSelect` event example below.
 
 ## OnSelect
 
@@ -147,5 +147,5 @@ The event handler receives a [`FileSelectEventArgs` object](#fileselectfileinfo)
 ## See Also
 
 * [Live Demo: Blazor FileSelect Events](https://demos.telerik.com/blazor-ui/fileselect/events)
-* [Telerik UI for Blazor FileSelect Overview]({%slug fileselect-overview%})
-* [Blazor FileSelect Validation]({%slug fileselect-validation%})
+* [Telerik UI for Blazor FileSelect Overview](slug://fileselect-overview)
+* [Blazor FileSelect Validation](slug://fileselect-validation)
diff --git a/components/fileselect/initial-files.md b/components/fileselect/initial-files.md
index b869ad6ad5..bf74b8cceb 100644
--- a/components/fileselect/initial-files.md
+++ b/components/fileselect/initial-files.md
@@ -34,8 +34,8 @@ To configure the initially displayed files, use the `Files` parameter of the Fil
 ## Persist Selected Files
 
 The Initial Files feature of the FileSelect allows you to save a list of files that the user has selected. Then, you can display them again when the page is reloaded. To achieve this:
-1. Store the [`FileSelectFileInfo`]({%slug fileselect-events%}#fileselectfileinfo) records received during the [`OnSelect`]({%slug fileselect-events%}#onselect) event.
-1. Load the [`FileSelectFileInfo`]({%slug fileselect-events%}#fileselectfileinfo) records in the FileSelect when the page is loaded.
+1. Store the [`FileSelectFileInfo`](slug://fileselect-events#fileselectfileinfo) records received during the [`OnSelect`](slug://fileselect-events#onselect) event.
+1. Load the [`FileSelectFileInfo`](slug://fileselect-events#fileselectfileinfo) records in the FileSelect when the page is loaded.
 
 >caption How to load files and display them initially in the FileSelect
 
@@ -82,4 +82,4 @@ The Initial Files feature of the FileSelect allows you to save a list of files t
 ## See Also
 
 * [FileSelect API](/blazor-ui/api/Telerik.Blazor.Components.TelerikFileSelect)
-* [FileSelect Overview]({%slug fileselect-overview%})
\ No newline at end of file
+* [FileSelect Overview](slug://fileselect-overview)
\ No newline at end of file
diff --git a/components/fileselect/overview.md b/components/fileselect/overview.md
index ead7accad4..51ec966c68 100644
--- a/components/fileselect/overview.md
+++ b/components/fileselect/overview.md
@@ -24,7 +24,7 @@ The Blazor FileSelect provides a [Stream](https://docs.microsoft.com/en-us/dotne
 1. Set `AllowedExtensions` to a `List<string>`.
 1. Set `MaxFileSize` in bytes.
 1. If you are using a Blazor **Server** app and `MaxFileSize` is greater than **32 KB**, [increase the maximum SignalR message size](#large-file-support).
-1. Implement an [`OnSelect` event handler]({%slug fileselect-events%}#onselect).
+1. Implement an [`OnSelect` event handler](slug://fileselect-events#onselect).
 
 Steps 2 and 3 are optional, but strongly recommended.
 
@@ -55,27 +55,27 @@ Steps 2 and 3 are optional, but strongly recommended.
 
 This section applies only to Blazor **Server** apps. Blazor **WebAssembly** apps do not require additional configuration for the FileSelect to work with large files.
 
-In Blazor **Server** apps, the FileSelect uses the **SignalR WebSocket** to send files from the browser to the server .NET runtime. The default SignalR maximum message size is **32 KB**. To work with larger files, [increase the max WebSocket message size for the Blazor application]({%slug common-kb-increase-signalr-max-message-size%}).
+In Blazor **Server** apps, the FileSelect uses the **SignalR WebSocket** to send files from the browser to the server .NET runtime. The default SignalR maximum message size is **32 KB**. To work with larger files, [increase the max WebSocket message size for the Blazor application](slug://common-kb-increase-signalr-max-message-size).
 
->tip The maximum file size supported by the framework up till .NET 5 was 2 GB and .NET 6 [removed this limit](https://github.com/dotnet/aspnetcore/pull/33900). While [Telerik UI for Blazor supports .NET version 3.1]({%slug system-requirements%}), the FileSelect component will allow maximum file size of 2 GB.
+>tip The maximum file size supported by the framework up till .NET 5 was 2 GB and .NET 6 [removed this limit](https://github.com/dotnet/aspnetcore/pull/33900). While [Telerik UI for Blazor supports .NET version 3.1](slug://system-requirements), the FileSelect component will allow maximum file size of 2 GB.
 
 ## Drag-and-Drop File Support
 
-The FileSelect provides built-in file drag-and-drop support, which allows users to drag one or multiple files and drop them anywhere in the component. The [`OnSelect` event]({%slug fileselect-events%}#onselect) is raised upon dropping the file. You can handle this event to perform further actions with the selected file.
+The FileSelect provides built-in file drag-and-drop support, which allows users to drag one or multiple files and drop them anywhere in the component. The [`OnSelect` event](slug://fileselect-events#onselect) is raised upon dropping the file. You can handle this event to perform further actions with the selected file.
 
-Additionally, you may define an external drop zone by using the [Telerik UI for Blazor DropZone component]({%slug dropzone-overview%}).
+Additionally, you may define an external drop zone by using the [Telerik UI for Blazor DropZone component](slug://dropzone-overview).
 
 ## Validation
 
-The FileSelect includes [built-in client-side validation]({%slug fileselect-validation%}) for the file size and type (extension). Additional custom validation can take place in the [OnSelect event]({%slug fileselect-events%}#onselect).
+The FileSelect includes [built-in client-side validation](slug://fileselect-validation) for the file size and type (extension). Additional custom validation can take place in the [OnSelect event](slug://fileselect-events#onselect).
 
 ## Initial Files
 
-The Initial Files feature allows you to display a set of pre-selected files in the FileSelect when the component loads. This functionality is helpful when you want to show files that were previously provided by the user. [Read more about the FileSelect Initial Files feature...]({%slug fileselect-initial-files%})
+The Initial Files feature allows you to display a set of pre-selected files in the FileSelect when the component loads. This functionality is helpful when you want to show files that were previously provided by the user. [Read more about the FileSelect Initial Files feature...](slug://fileselect-initial-files)
 
 ## Templates
 
-You can use the functionality of the built-in template and modify the appearance of the **Select files...** button. [Read more about the Telerik FileSelect templates...]({%slug fileselect-templates%})
+You can use the functionality of the built-in template and modify the appearance of the **Select files...** button. [Read more about the Telerik FileSelect templates...](slug://fileselect-templates)
 
 ## FileSelect Parameters
 
@@ -86,14 +86,14 @@ The following table lists the FileSelect parameters. Also check the [FileSelect
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
 | `Accept` | `string` | The [`accept` HTML attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept) of the file `<input>`. It controls what file types and MIME types the browser will allow users to select. Compare with `AllowedExtensions`. |
-| `AllowedExtensions` | `List<string>` | The list of allowed file types. The component will check if the selected files are compliant **after selection**. Compare with `Accept`. Read more at [Validation]({%slug fileselect-validation%}). |
+| `AllowedExtensions` | `List<string>` | The list of allowed file types. The component will check if the selected files are compliant **after selection**. Compare with `Accept`. Read more at [Validation](slug://fileselect-validation). |
 | `Capture` | `string` | The [`capture` HTML attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture) of the `<input type="file" />` element. It enables users to provide a file directly from their device camera. |
 | `Class` | `string` | Renders a custom CSS class to the `<div class="k-upload">` element. (The FileSelect reuses the Upload HTML rendering.) |
-| `DropZoneId` | `string` | The id that is used to connect the FileSelect to an external [DropZone]({%slug dropzone-overview%}). Assign a value matching the `Id` of the DropZone you are connecting the component with. |
+| `DropZoneId` | `string` | The id that is used to connect the FileSelect to an external [DropZone](slug://dropzone-overview). Assign a value matching the `Id` of the DropZone you are connecting the component with. |
 | `Enabled` | `bool`<br />(`true`) | Enables file selection. |
 | `Id` | `string` | Renders an `id` attribute to the `<input type="file" />` element. Can be used together with a `<label>`. |
-| `MaxFileSize` | `long?` | Sets the maximum allowed file size in bytes. Read more in the [Large File Support](#large-file-support) section and in the [Validation]({%slug fileselect-validation%}) article. |
-| `MinFileSize` | `long?` | Sets the minimum allowed file size in bytes. Read more in the [Validation]({%slug fileselect-validation%}) article. |
+| `MaxFileSize` | `long?` | Sets the maximum allowed file size in bytes. Read more in the [Large File Support](#large-file-support) section and in the [Validation](slug://fileselect-validation) article. |
+| `MinFileSize` | `long?` | Sets the minimum allowed file size in bytes. Read more in the [Validation](slug://fileselect-validation) article. |
 | `Multiple` | `bool`<br />(`true`) | Sets if the user can select several files at the same time. |
 | `Files` | `IEnumerable<FileSelectFileInfo>` | Collection of files that will be initially displayed in the FileSelect file list. |
 
@@ -105,7 +105,7 @@ The File Select exposes methods for programmatic operation. To use them, define
 | Method | Description |
 | --- | --- |
 | `ClearFiles` | Clears all files from the list. |
-| `OpenSelectFilesDialog` | Shows the browser's file selection dialog. This method [doesn't work in Safari due to browser security restrictions]({%slug upload-kb-openselectfilesdialog-safari%}). |
+| `OpenSelectFilesDialog` | Shows the browser's file selection dialog. This method [doesn't work in Safari due to browser security restrictions](slug://upload-kb-openselectfilesdialog-safari). |
 
 >caption Get reference to the FileSelect and execute methods
 
@@ -135,8 +135,8 @@ The File Select exposes methods for programmatic operation. To use them, define
 
 ## Next Steps
 
-* [Explore FileSelect Validation]({%slug fileselect-validation%})
-* [Use FileSelect Events]({%slug fileselect-events%})
+* [Explore FileSelect Validation](slug://fileselect-validation)
+* [Use FileSelect Events](slug://fileselect-events)
 
 
 ## See Also
diff --git a/components/fileselect/templates.md b/components/fileselect/templates.md
index 7f632152e0..ed71d09666 100644
--- a/components/fileselect/templates.md
+++ b/components/fileselect/templates.md
@@ -10,7 +10,7 @@ position: 30
 
 # FileSelect Templates
 
-The `SelectFilesButtonTemplate` allows you to modify the **Select Files...** button. It lets you change the default text of the button and include custom content like an [icon]({%slug common-features-icons%}) or image.
+The `SelectFilesButtonTemplate` allows you to modify the **Select Files...** button. It lets you change the default text of the button and include custom content like an [icon](slug://common-features-icons) or image.
 
 >caption Using FileSelect SelectFilesButtonTemplate
 
@@ -28,6 +28,6 @@ The `SelectFilesButtonTemplate` allows you to modify the **Select Files...** but
 ## See Also
 
 * [FileSelect API](/blazor-ui/api/Telerik.Blazor.Components.TelerikFileSelect)
-* [FileSelect Overview]({%slug fileselect-overview%})
-* [FileSelect Validation]({%slug fileselect-validation%})
-* [FileSelect Events]({%slug fileselect-events%})
\ No newline at end of file
+* [FileSelect Overview](slug://fileselect-overview)
+* [FileSelect Validation](slug://fileselect-validation)
+* [FileSelect Events](slug://fileselect-events)
\ No newline at end of file
diff --git a/components/fileselect/validation.md b/components/fileselect/validation.md
index 93eb4169df..a8ab8003df 100644
--- a/components/fileselect/validation.md
+++ b/components/fileselect/validation.md
@@ -24,7 +24,7 @@ The Telerik FileSelect component offers parameters to validate the file selectio
 
 >caption Client validation in the Telerik FileSelect component
 
-For brevity, this sample does not showcase actual upload of the files. You can find an example in the [FileSelect Events article]({%slug fileselect-events%}).
+For brevity, this sample does not showcase actual upload of the files. You can find an example in the [FileSelect Events article](slug://fileselect-events).
 
 ````RAZOR
 @* Some images are only allowed, min size 1KB, max size 4MB *@
@@ -54,5 +54,5 @@ For brevity, this sample does not showcase actual upload of the files. You can f
 ## See Also
 
 * [Live Demo: FileSelect Validation](https://demos.telerik.com/blazor-ui/fileselect/validation)
-* [FileSelect Overview]({%slug fileselect-overview%})
-* [FileSelect Events]({%slug fileselect-events%})
+* [FileSelect Overview](slug://fileselect-overview)
+* [FileSelect Events](slug://fileselect-events)
diff --git a/components/filter/accessibility/wai-aria-support.md b/components/filter/accessibility/wai-aria-support.md
index 8f56ae3345..81cf08a788 100644
--- a/components/filter/accessibility/wai-aria-support.md
+++ b/components/filter/accessibility/wai-aria-support.md
@@ -73,4 +73,4 @@ For details on how the Filter keyboard navigation works, refer to the [Blazor Fi
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/filter/fields/operators.md b/components/filter/fields/operators.md
index 805750ba28..28c38fe5b6 100644
--- a/components/filter/fields/operators.md
+++ b/components/filter/fields/operators.md
@@ -15,7 +15,7 @@ The `Operators` parameter takes a literal with the available operators for each
 
 ## Supported Fields Operators
 
-[Read about the supported Filter Fields Operators...]({%slug common-features-filter-operators%})
+[Read about the supported Filter Fields Operators...](slug://common-features-filter-operators)
 
 **To configure a Field Operators:**
 
diff --git a/components/filter/fields/overview.md b/components/filter/fields/overview.md
index 944d2540c4..b72da1782a 100644
--- a/components/filter/fields/overview.md
+++ b/components/filter/fields/overview.md
@@ -9,7 +9,7 @@ position: 0
 ---
 
 # Filter Fields
-You can define different Fields settings. For example, names, labels, and [filter operators]({%slug filter-operators%}).
+You can define different Fields settings. For example, names, labels, and [filter operators](slug://filter-operators).
 
 ## FilterField Parameters
 
@@ -19,9 +19,9 @@ The following parameters enable you to customize the appearance of the Blazor Fi
 
 | Parameter | Type | Description |
 | ----------- | ----------- | ----------- |
-| `DefaultFilterOperator` | `FilterOperator` | Sets the default filter operator for the Field. Accepts a member of the `FilterOperator` enum. The selected operator must be applicable for the specific data type. Check the supported options in the [Filter Operators]({%slug common-features-filter-operators%}) article.
+| `DefaultFilterOperator` | `FilterOperator` | Sets the default filter operator for the Field. Accepts a member of the `FilterOperator` enum. The selected operator must be applicable for the specific data type. Check the supported options in the [Filter Operators](slug://common-features-filter-operators) article.
 | `Label` | `string` | Specifies the string displayed for the given field. |
 | `Name` | `string` | Specifies the field to be used when filtering. |
-| `Operators` | `IEnumerable<FilterListOperator>` | Specifies the [available filter operators]({%slug filter-operators%}#supported-fields-operators). If not defined, the component will use a default list of available operators based on the field type. |
+| `Operators` | `IEnumerable<FilterListOperator>` | Specifies the [available filter operators](slug://filter-operators#supported-fields-operators). If not defined, the component will use a default list of available operators based on the field type. |
 | `Type` | `Type` | Specifies the field type. This will determine the filter value editor. |
 | `ValueTemplate` | `RenderFragment<FilterFieldValueTemplateContext>` | Use to override the default rendering of the filter field value. |
\ No newline at end of file
diff --git a/components/filter/fields/templates.md b/components/filter/fields/templates.md
index 4d55d6a2c3..b8bf9aabbc 100644
--- a/components/filter/fields/templates.md
+++ b/components/filter/fields/templates.md
@@ -25,7 +25,7 @@ The `context` of the`ValueTemplate` is of type [`FilterFieldValueTemplateContext
 > The `FilterDescriptor` `Value` property is of type `object` and is `null` by default. As a result, the `Value` of the component inside the `ValueTemplate` must be `nullable` for all types, except `string`.
 
 
-To use the Filter Field value template, add a `<ValueTemplate>` tag inside the [FilterField]({%slug filter-fields%}).
+To use the Filter Field value template, add a `<ValueTemplate>` tag inside the [FilterField](slug://filter-fields).
 
 >caption Using FilterField ValueTemplate
 
@@ -140,4 +140,4 @@ To use the Filter Field value template, add a `<ValueTemplate>` tag inside the [
 ## See Also
 
   * [Live Demo: Filter](https://demos.telerik.com/blazor-ui/filter/templates)
-  * [FilterField: Overview]({%slug filter-fields%})
+  * [FilterField: Overview](slug://filter-fields)
diff --git a/components/filter/integration.md b/components/filter/integration.md
index dfd3ce1409..ba2f41ce9a 100644
--- a/components/filter/integration.md
+++ b/components/filter/integration.md
@@ -25,7 +25,7 @@ This article contains the following sections:
 
 **To integrate the Filter with the Telerik Grid, you need to:**
 
-1. Set the Value parameter of the Filter via [one-way]({%slug filter-events%}#valuechanged) or two-way binding. If you want to filter at the moment of change, use Filter with a one-way bound value.
+1. Set the Value parameter of the Filter via [one-way](slug://filter-events#valuechanged) or two-way binding. If you want to filter at the moment of change, use Filter with a one-way bound value.
 2. Update the Grid data based on the Filter value.
 
 >caption Filter with two-way bound value in Grid
diff --git a/components/filter/overview.md b/components/filter/overview.md
index e25a46b5da..e1016dd114 100644
--- a/components/filter/overview.md
+++ b/components/filter/overview.md
@@ -11,7 +11,7 @@ position: 0
 # Blazor Filter Overview
 The <a href="https://www.telerik.com/blazor-ui/filter" target="_blank">Blazor Filter component</a> serves as a complementary addition to data-bound components that do not have built-in filtering.
 
-The component gives a unified way to build filter descriptors using its [fields]({%slug filter-fields%}). You can also define different [operators]({%slug filter-operators%}) and use these filter descriptors to filter data.
+The component gives a unified way to build filter descriptors using its [fields](slug://filter-fields). You can also define different [operators](slug://filter-operators) and use these filter descriptors to filter data.
 
 ## Creating Blazor Filter
 1. Use the `TelerikFilter` tag to add the component to your razor page.
@@ -52,10 +52,10 @@ The component gives a unified way to build filter descriptors using its [fields]
 ````
 
 ## Fields
-The fields are responsible for setting up the Filter information. [Read more about the supported Blazor Filter fields...]({%slug filter-fields%})
+The fields are responsible for setting up the Filter information. [Read more about the supported Blazor Filter fields...](slug://filter-fields)
 
 ## Events
-The Blazor Filter generates events that you can handle and further customize its behavior. [Read more about the Blazor Filter events...]({%slug filter-events%}).
+The Blazor Filter generates events that you can handle and further customize its behavior. [Read more about the Blazor Filter events...](slug://filter-events).
 
 ## Filter Parameters
 The Blazor Filter provides parameters that allow you to configure the component:
@@ -63,7 +63,7 @@ The Blazor Filter provides parameters that allow you to configure the component:
 | Parameter | Type | Description |
 | ----------- | ----------- | ----------- |
 | `Class` | `string` | The class that will be rendered on the outermost element. |
-| `Value` | [`CompositeFilterDescriptor`]({%slug common-features-descriptors%}#filtering) | Sets the value of the Filter component. |
+| `Value` | [`CompositeFilterDescriptor`](slug://common-features-descriptors#filtering) | Sets the value of the Filter component. |
 
 ## Filter Reference and Methods
 
@@ -189,9 +189,9 @@ The Filter exposes methods for programmatic operation. To use them, define a ref
 
 
 ## Next Steps
-[Configure the Filter Fields]({%slug filter-fields%})
+[Configure the Filter Fields](slug://filter-fields)
 
-[Using the Filter Events]({%slug filter-events%})
+[Using the Filter Events](slug://filter-events)
 
 ## See Also
 
diff --git a/components/flatcolorpicker/accessibility/wai-aria-support.md b/components/flatcolorpicker/accessibility/wai-aria-support.md
index eca304caa9..181bac7aec 100644
--- a/components/flatcolorpicker/accessibility/wai-aria-support.md
+++ b/components/flatcolorpicker/accessibility/wai-aria-support.md
@@ -79,4 +79,4 @@ For details on how the FlatColorPicker keyboard navigation works, refer to:
 ## See Also
 
 * [Blazor FlatColorPicker Demos](https://demos.telerik.com/blazor-ui/flatcolorpicker/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/flatcolorpicker/events.md b/components/flatcolorpicker/events.md
index acfbcc3165..eb09ae9d9e 100644
--- a/components/flatcolorpicker/events.md
+++ b/components/flatcolorpicker/events.md
@@ -90,5 +90,5 @@ The event type is `EventCallback<ColorPickerView>`. Using `ViewChanged` requires
 
 ## See Also
 
-* [FlatColorPicker Overview]({%slug flatcolorpicker-overview%})
-* [FlatColorPicker Views]({%slug flatcolorpicker-views%})
+* [FlatColorPicker Overview](slug://flatcolorpicker-overview)
+* [FlatColorPicker Views](slug://flatcolorpicker-views)
diff --git a/components/flatcolorpicker/overview.md b/components/flatcolorpicker/overview.md
index 5373156e13..d5e13afdeb 100644
--- a/components/flatcolorpicker/overview.md
+++ b/components/flatcolorpicker/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor FlatColorPicker Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/flatcolorpicker" target="_blank">FlatColorPicker for Blazor</a> is an interactive component that allows color selection from a color palette or a [HSV](https://en.wikipedia.org/wiki/HSL_and_HSV) canvas. Users can also type a specific RGB/HEX color value manually. The FlatColorPicker is practically identical to the [ColorPicker component]({%slug colorpicker-overview%}) with the only difference that the ColorPicker takes up less space and displays the color selection UI in a popup.
+The <a href = "https://www.telerik.com/blazor-ui/flatcolorpicker" target="_blank">FlatColorPicker for Blazor</a> is an interactive component that allows color selection from a color palette or a [HSV](https://en.wikipedia.org/wiki/HSL_and_HSV) canvas. Users can also type a specific RGB/HEX color value manually. The FlatColorPicker is practically identical to the [ColorPicker component](slug://colorpicker-overview) with the only difference that the ColorPicker takes up less space and displays the color selection UI in a popup.
 
 #### In this article:
    * [Basics](#basics)
@@ -24,7 +24,7 @@ The <a href = "https://www.telerik.com/blazor-ui/flatcolorpicker" target="_blank
 To use a Telerik FlatColorPicker for Blazor:
 
 1. Add the `TelerikFlatColorPicker` tag.
-1. Set its `Value` attribute to any of the [supported HEX/RGB formats](#supported-value-formats). Use a `string` property with [one-way]({%slug flatcolorpicker-events%}#valuechanged) or [two-way](#example) binding.
+1. Set its `Value` attribute to any of the [supported HEX/RGB formats](#supported-value-formats). Use a `string` property with [one-way](slug://flatcolorpicker-events#valuechanged) or [two-way](#example) binding.
 1. (optional) Set the `ValueFormat` to `ColorFormat.Hex` or `ColorFormat.Rgb` if the app expects a specific color format.
 
 ## Example
@@ -61,8 +61,8 @@ The FlatColorPicker tag exposes the following features via its attributes:
 
 * `Value` - `string` - sets the FlatColorPicker value in a few [different color formats](#supported-value-formats). Supports two-way binding.
 * `ValueFormat` - `ColorFormat` - sets the color format, which the component will return in the application code. By default, the property is not set and the value format will change depending on the used view: `Rgb` when selecting a color from the GradientView, and `Hex` when selecting a color from the PaletteView.
-* `FlatColorPickerViews` - `RenderFragment` - a nested container to list the [FlatColorPicker views]({%slug flatcolorpicker-views%}). All views are enabled by default and the user can switch between them with buttons. Each view tag has its own configuration attributes.
-* `View` - `ColorPickerView` - sets the default selected [view]({%slug flatcolorpicker-views%}) (`ColorPickerView.Gradient` by default). Supports two-way binding.
+* `FlatColorPickerViews` - `RenderFragment` - a nested container to list the [FlatColorPicker views](slug://flatcolorpicker-views). All views are enabled by default and the user can switch between them with buttons. Each view tag has its own configuration attributes.
+* `View` - `ColorPickerView` - sets the default selected [view](slug://flatcolorpicker-views) (`ColorPickerView.Gradient` by default). Supports two-way binding.
 * `ShowPreview` - `bool` - toggles the [current color box and the color preview box](#interface) in the popup (`true` by default).
 
 * `Class` - `string` - renders a custom CSS class to the `div.k-flatcolorpicker` element.
@@ -83,6 +83,6 @@ Color keywords are not supported.
 
 ## See Also
 
-* [FlatColorPicker Views]({%slug flatcolorpicker-views%})
-* [FlatColorPicker Events]({%slug flatcolorpicker-events%})
+* [FlatColorPicker Views](slug://flatcolorpicker-views)
+* [FlatColorPicker Events](slug://flatcolorpicker-events)
 * [FlatColorPicker Live Demo](https://demos.telerik.com/blazor-ui/flatcolorpicker/overview)
diff --git a/components/flatcolorpicker/views.md b/components/flatcolorpicker/views.md
index ab7d7dc143..9818db3142 100644
--- a/components/flatcolorpicker/views.md
+++ b/components/flatcolorpicker/views.md
@@ -12,14 +12,14 @@ position: 0
 
 The FlatColorPicker can display different views. They allow users to select a color from an interface that matches their preferences. The supported views are:
 
-* [FlatColorPickerGradientView](#flatcolorpickergradientview) - allows unlimited color selection from an [HSVA](https://en.wikipedia.org/wiki/HSL_and_HSV) canvas. This view also renders textboxes for typing a color in [RGB or HEX format]({%slug colorpicker-overview%}#supported-value-formats).
+* [FlatColorPickerGradientView](#flatcolorpickergradientview) - allows unlimited color selection from an [HSVA](https://en.wikipedia.org/wiki/HSL_and_HSV) canvas. This view also renders textboxes for typing a color in [RGB or HEX format](slug://colorpicker-overview#supported-value-formats).
 * [FlatColorPickerPaletteView](#flatcolorpickerpaletteview) - allows color selection from a predefined collection of colors.
 
-By default, both views are enabled and the gradient view is displayed first. Both behaviors can be configured via the FlatColorPicker [`FlatColorPickerViews` container and `View` attribute]({%slug flatcolorpicker-overview%}#flatcolorpicker-parameters).
+By default, both views are enabled and the gradient view is displayed first. Both behaviors can be configured via the FlatColorPicker [`FlatColorPickerViews` container and `View` attribute](slug://flatcolorpicker-overview#flatcolorpicker-parameters).
 
 ## FlatColorPickerGradientView
 
-The GradientView uses a [`TelerikColorGradient` component]({%slug colorgradient-overview%}). The following [ColorGradient attributes]({%slug colorgradient-overview%}#colorgradient-parameters) are exposed in the `FlatColorPickerGradientView` tag:
+The GradientView uses a [`TelerikColorGradient` component](slug://colorgradient-overview). The following [ColorGradient attributes](slug://colorgradient-overview#colorgradient-parameters) are exposed in the `FlatColorPickerGradientView` tag:
 
 * `Format`
 * `Formats`
@@ -27,7 +27,7 @@ The GradientView uses a [`TelerikColorGradient` component]({%slug colorgradient-
 
 ## FlatColorPickerPaletteView
 
-The PaletteView uses a [`TelerikColorPalette` component]({%slug colorpalette-overview%}). The following [ColorPalette attributes]({%slug colorpalette-overview%}#colorpalette-parameters) are exposed in the `FlatColorPickerPaletteView` tag:
+The PaletteView uses a [`TelerikColorPalette` component](slug://colorpalette-overview). The following [ColorPalette attributes](slug://colorpalette-overview#colorpalette-parameters) are exposed in the `FlatColorPickerPaletteView` tag:
 
 * `Columns`
 * `Colors`
@@ -58,5 +58,5 @@ The PaletteView uses a [`TelerikColorPalette` component]({%slug colorpalette-ove
 
 ## See Also
 
-* [FlatColorPicker Events]({%slug flatcolorpicker-events%})
+* [FlatColorPicker Events](slug://flatcolorpicker-events)
 * [FlatColorPicker Views Demo](https://demos.telerik.com/blazor-ui/flatcolorpicker/views)
diff --git a/components/floatinglabel/overview.md b/components/floatinglabel/overview.md
index 9b5d825600..20b91d80e1 100644
--- a/components/floatinglabel/overview.md
+++ b/components/floatinglabel/overview.md
@@ -65,7 +65,7 @@ The FloatingLabel does not support third-party components and generic HTML input
 
 ## Forms and Validation
 
-The FloatingLabel can change its styles, based on validation state. See [Validation]({%slug floatinglabel-validation%}) for details and example.
+The FloatingLabel can change its styles, based on validation state. See [Validation](slug://floatinglabel-validation) for details and example.
 
 
 ## Placeholder Behavior
@@ -89,13 +89,13 @@ The following table lists the FloatingLabel parameters. Also check the [Floating
 
 | Attribute | Type | Description |
 | --- | --- | --- |
-| `Class` | `string` | Renders additional CSS class to the `span.k-floating-label-container` element, which holds the `<label>` child element. Use `Class` to apply custom styles or [override the theme]({%slug themes-override%}). |
+| `Class` | `string` | Renders additional CSS class to the `span.k-floating-label-container` element, which holds the `<label>` child element. Use `Class` to apply custom styles or [override the theme](slug://themes-override). |
 | `Id` | `string` | Renders an `id` attribute to the `label.k-label` element. To improve accessibility, set the same string as floating label `Id` and `AriaLabelledBy` value of the associated Telerik component. |
 
 
 ## Next Steps
 
-* [Review Floating Label integration with form validation]({%slug floatinglabel-validation%})
+* [Review Floating Label integration with form validation](slug://floatinglabel-validation)
 
 
 ## See Also
diff --git a/components/floatinglabel/validation.md b/components/floatinglabel/validation.md
index 3a4dc4cfd9..45f9f5ca77 100644
--- a/components/floatinglabel/validation.md
+++ b/components/floatinglabel/validation.md
@@ -10,7 +10,7 @@ position: 10
 
 # Floating Label Validation
 
-The Blazor FloatingLabel integrates with form validation of [compatible Telerik components]({%slug floatinglabel-overview%}#compatibility). When a form field is invalid, the floating label will change color to suggest user action.
+The Blazor FloatingLabel integrates with form validation of [compatible Telerik components](slug://floatinglabel-overview#compatibility). When a form field is invalid, the floating label will change color to suggest user action.
 
 >caption Floating Label Integration with Forms and Validation
 
@@ -80,4 +80,4 @@ else
 
 ## See Also
 
-* [FloatingLabel Overview]({%slug floatinglabel-overview%})
+* [FloatingLabel Overview](slug://floatinglabel-overview)
diff --git a/components/form/accessibility/wai-aria-support.md b/components/form/accessibility/wai-aria-support.md
index 67f05fa78e..9fc016f637 100644
--- a/components/form/accessibility/wai-aria-support.md
+++ b/components/form/accessibility/wai-aria-support.md
@@ -64,9 +64,9 @@ The Form has been tested with the following screen readers and browsers combinat
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor Form Demos](https://demos.telerik.com/blazor-ui/form/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/form/columns.md b/components/form/columns.md
index c5b759b116..205f88ba18 100644
--- a/components/form/columns.md
+++ b/components/form/columns.md
@@ -46,9 +46,9 @@ You can set the `Columns` parameter when the Form component automatically genera
 
 ## See Also
 
-  * [Overview]({%slug form-overview%})
-  * [FormItems]({%slug form-formitems%})
-  * [FormGroups]({%slug form-formgroups%})
-  * [Orientation]({%slug form-orientation%})
-  * [Events]({%slug form-events%})
+  * [Overview](slug://form-overview)
+  * [FormItems](slug://form-formitems)
+  * [FormGroups](slug://form-formgroups)
+  * [Orientation](slug://form-orientation)
+  * [Events](slug://form-events)
    
diff --git a/components/form/events.md b/components/form/events.md
index 66c568dadc..d743242ffd 100644
--- a/components/form/events.md
+++ b/components/form/events.md
@@ -17,7 +17,7 @@ The Form component for Blazor exposes events that allow you to respond to user a
 * [OnValidSubmit](#onvalidsubmit)
 * [OnInvalidSubmit](#oninvalidsubmit)
 
->note The examples in this article use the `EditContext`, but you can use a [model]({%slug form-overview%}#creating-blazor-form) instead. 
+>note The examples in this article use the `EditContext`, but you can use a [model](slug://form-overview#creating-blazor-form) instead. 
 
 ## OnSubmit
 
@@ -90,9 +90,9 @@ The `OnSubmit` event is mapped to the `OnSubmit` event of the <a target="_blank"
 
 The `OnUpdate` event fires when the user changes a value in the Form. The event is tied to the `FieldChanged` event of the Form's `EditContext`.
 
-By default, `OnUpdate` will fire on each keystroke for [auto-generated form items]({%slug form-overview%}#automatic-generation-of-fields) and [`FormItem` templates]({%slug form-formitems-template%}). To change this behavior, define a `FormItem` `Template` and set [`ValidateOn` to `ValidationEvent.Change`]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs) for the field editor component. In this case, `OnUpdate` will fire when the user blurs the field editor or hits Enter while the editor is focused.
+By default, `OnUpdate` will fire on each keystroke for [auto-generated form items](slug://form-overview#automatic-generation-of-fields) and [`FormItem` templates](slug://form-formitems-template). To change this behavior, define a `FormItem` `Template` and set [`ValidateOn` to `ValidationEvent.Change`](slug://common-features/input-validation#validation-modes-for-simple-inputs) for the field editor component. In this case, `OnUpdate` will fire when the user blurs the field editor or hits Enter while the editor is focused.
 
-You can use the `OnUpdate` event to programmatically [refresh the UI outside the current Form item]({%slug form-formitems%}#ui-rendering-inside-the-form).
+You can use the `OnUpdate` event to programmatically [refresh the UI outside the current Form item](slug://form-formitems#ui-rendering-inside-the-form).
 
 The `OnUpdate` event argument is a [`FormUpdateEventArgs` object](/blazor-ui/api/Telerik.Blazor.Components.FormUpdateEventArgs) with the following properties:
 
@@ -263,9 +263,9 @@ The `OnInvalidSubmit` event fires when there are validation errors in the Form u
 
 ## See Also
 
-  * [Overview]({%slug form-overview%})
-  * [FormItems]({%slug form-formitems%})
-  * [Template]({%slug form-formitems-template%})
-  * [Orientation]({%slug form-orientation%})
-  * [Events]({%slug form-events%})
+  * [Overview](slug://form-overview)
+  * [FormItems](slug://form-formitems)
+  * [Template](slug://form-formitems-template)
+  * [Orientation](slug://form-orientation)
+  * [Events](slug://form-events)
    
diff --git a/components/form/formgroups.md b/components/form/formgroups.md
index f69a617009..984606952b 100644
--- a/components/form/formgroups.md
+++ b/components/form/formgroups.md
@@ -10,7 +10,7 @@ position: 25
 
 # Form Groups
 
-You can group some associated fields in your form (model) by using the [FormItems]({%slug form-formitems%}). and putting them inside `FormGroup` tags.
+You can group some associated fields in your form (model) by using the [FormItems](slug://form-formitems). and putting them inside `FormGroup` tags.
 
 In this article:
 
@@ -82,10 +82,10 @@ You can organize some FormItems into logical groups. You can configure the label
 
 ## See Also
 
-  * [Overview]({%slug form-overview%})
-  * [FormItems]({%slug form-formitems%})
-  * [Template]({%slug form-formitems-template%})
-  * [Orientation]({%slug form-orientation%})
-  * [Events]({%slug form-events%})
+  * [Overview](slug://form-overview)
+  * [FormItems](slug://form-formitems)
+  * [Template](slug://form-formitems-template)
+  * [Orientation](slug://form-orientation)
+  * [Events](slug://form-events)
    
    
diff --git a/components/form/formitems/buttons.md b/components/form/formitems/buttons.md
index f485e2c7f3..157569a7fb 100644
--- a/components/form/formitems/buttons.md
+++ b/components/form/formitems/buttons.md
@@ -12,11 +12,11 @@ position: 3
 
 The [Blazor Form](https://demos.telerik.com/blazor-ui/form/overview) component adds a Submit Button at the end of the Form by default. You can add your own buttons through the `FormButtons` tag.
 
-When you add that template, the form will no longer render the built-in Blazor Form submit Button so you can choose the buttons and layout you want to achieve. We recommend that you add a Submit Button in all cases so the users can save their work and fire the corresponding form [events]({%slug form-events%}).
+When you add that template, the form will no longer render the built-in Blazor Form submit Button so you can choose the buttons and layout you want to achieve. We recommend that you add a Submit Button in all cases so the users can save their work and fire the corresponding form [events](slug://form-events).
 
 ### How to add a Reset (Clear) button to the form
 
-You can provide a standard [Telerik UI for Blazor Button]({%slug components/button/overview%}) to allow the user to clear the contents of the editors in the Telerik Form. Refer to below Blazor Form Submit example for more details.
+You can provide a standard [Telerik UI for Blazor Button](slug://components/button/overview) to allow the user to clear the contents of the editors in the Telerik Form. Refer to below Blazor Form Submit example for more details.
 
 ````RAZOR
 @* Add a Clear Button to the Telerik Form. We also add a Submit button *@
@@ -83,9 +83,9 @@ You can provide a standard [Telerik UI for Blazor Button]({%slug components/butt
 
 ## See Also
 
-  * [Form Overview]({%slug form-overview%})
-  * [Form Items]({%slug form-formitems%})
-  * [Form Groups]({%slug form-formgroups%})
-  * [Orientation]({%slug form-orientation%})
-  * [Events]({%slug form-events%})
+  * [Form Overview](slug://form-overview)
+  * [Form Items](slug://form-formitems)
+  * [Form Groups](slug://form-formgroups)
+  * [Orientation](slug://form-orientation)
+  * [Events](slug://form-events)
    
diff --git a/components/form/formitems/formitemstemplate.md b/components/form/formitems/formitemstemplate.md
index c409c24253..7aaa42a5cb 100644
--- a/components/form/formitems/formitemstemplate.md
+++ b/components/form/formitems/formitemstemplate.md
@@ -10,17 +10,17 @@ position: 6
 
 # Form Template for All Items
 
-This article describes how to create custom Form layouts with components and HTML markup between or around the Form items. To define a custom editor in a specific Form item, see article [Form Item Template]({%slug form-formitems-template%}).
+This article describes how to create custom Form layouts with components and HTML markup between or around the Form items. To define a custom editor in a specific Form item, see article [Form Item Template](slug://form-formitems-template).
 
 >tip The content on this page applies to Telerik UI for Blazor version **4.2.0** and above.
 
 
 ## Background
 
-The `<FormItems>` tag is a standard Blazor `RenderFragment`, which expects only [Form groups]({%slug form-formgroups%}) and [Form items]({%slug form-formitems%}). The Blazor framework does not support tag restrictions inside `RenderFragment`s. As a result, `<FormItems>` allows non-Form child components and arbitrary markup. However, such setup with custom markup was never officially supported before version 4.2.0. Here is the relevant Form behavior timeline:
+The `<FormItems>` tag is a standard Blazor `RenderFragment`, which expects only [Form groups](slug://form-formgroups) and [Form items](slug://form-formitems). The Blazor framework does not support tag restrictions inside `RenderFragment`s. As a result, `<FormItems>` allows non-Form child components and arbitrary markup. However, such setup with custom markup was never officially supported before version 4.2.0. Here is the relevant Form behavior timeline:
 
 1. Until **version 4.0.1** Form items and groups could be mixed with arbitrary content. This worked without explicit intent or support.
-1. **Version 4.1.0** added the ability to [combine auto-generated and declared Form items]({%slug form-formitems%}#add-form-fields-to-autogenerated-ones). The feature required changes in the Form implementation. As a result, custom components inside `<FormItems>` caused unexpected Form item reordering.
+1. **Version 4.1.0** added the ability to [combine auto-generated and declared Form items](slug://form-formitems#add-form-fields-to-autogenerated-ones). The feature required changes in the Form implementation. As a result, custom components inside `<FormItems>` caused unexpected Form item reordering.
 1. **Version 4.2.0** added official support for custom markup and components inside the Form.
 
 
@@ -38,12 +38,12 @@ Telerik UI for Blazor version 4.2.0 introduced one new Form parameter and two ne
 
 The Form setup uses the following architecture:
 
-* [`<FormItems>`]({%slug form-formitems%}) defines the **configuration** of all Form groups and items, including the [`<Template>`s of the form items]({%slug form-formitems-template%}).
+* [`<FormItems>`](slug://form-formitems) defines the **configuration** of all Form groups and items, including the [`<Template>`s of the form items](slug://form-formitems-template).
 * [`<FormItemsTemplate>`](#formitemstemplate) is the optional **rendering container** of all groups and items.
 * [`<TelerikFormGroupRenderer>`](#form-group-renderer) defines the **rendering place** of a specific form **group**.
 * [`<TelerikFormItemRenderer>`](#form-item-renderer) defines the **rendering place** of a specific form **item**.
 
-> As any other template, `FormItemsTemplate` overrides the built-in rendering of Form groups and items. When the `<FormItemsTemplate>` tag is used, the Form component will render only groups and items that have their own *renderer* components. The HTML output *inside* each form item is unrelated to this feature and is not affected. [Form `Columns`]({%slug form-columns%}) and [FormItem `ColSpan`]({%slug form-formitems%}#formitem-parameters) may work differently or stop working, depending on the exact template markup. In such cases, stop using the built-in Form columns and achieve the desired layout with custom HTML and CSS.
+> As any other template, `FormItemsTemplate` overrides the built-in rendering of Form groups and items. When the `<FormItemsTemplate>` tag is used, the Form component will render only groups and items that have their own *renderer* components. The HTML output *inside* each form item is unrelated to this feature and is not affected. [Form `Columns`](slug://form-columns) and [FormItem `ColSpan`](slug://form-formitems#formitem-parameters) may work differently or stop working, depending on the exact template markup. In such cases, stop using the built-in Form columns and achieve the desired layout with custom HTML and CSS.
 
 
 ## FormItemsTemplate
@@ -64,7 +64,7 @@ The `TelerikFormGroupRenderer` component defines the rendering place of a Form g
 
 ### Nested Form Contexts
 
-The `TelerikFormGroupRenderer` `Template` is nested inside another template - `FormItemsTemplate`. Both templates expose a `context`, so **at least one of these contexts must have a custom name**, which is set via the template `Context` parameter. Otherwise you will get an [error about child content using the same parameter name]({%slug nest-renderfragment%}). Check the the snippet below and the [Render Form items in a loop](#render-form-groups-and-items-in-a-loop) example.
+The `TelerikFormGroupRenderer` `Template` is nested inside another template - `FormItemsTemplate`. Both templates expose a `context`, so **at least one of these contexts must have a custom name**, which is set via the template `Context` parameter. Otherwise you will get an [error about child content using the same parameter name](slug://nest-renderfragment). Check the the snippet below and the [Render Form items in a loop](#render-form-groups-and-items-in-a-loop) example.
 
 >caption Setting named contexts in the Form templates
 
@@ -93,7 +93,7 @@ The `TelerikFormItemRenderer` component defines the rendering place of a Form it
 | --- | --- | --- |
 | `Item` | `IFormItem` | A Form item, which is auto-generated or defined in `<FormItems>`. The `IFormItem` interface provides all properties of a `<FormItem>` component, so you can access and reuse the item configuration, which is defined in `<FormItems>`. |
 
->tip `TelerikFormItemRenderer` is unrelated to the [template of a single `<FormItem>`]({%slug form-formitems-template%}). The two features are used separately and independently.
+>tip `TelerikFormItemRenderer` is unrelated to the [template of a single `<FormItem>`](slug://form-formitems-template). The two features are used separately and independently.
 
 
 ## Upgrading from Older Versions
@@ -103,7 +103,7 @@ Here are the steps to migrate custom content inside the Form from version 4.0.1-
 1. Move all custom components and markup from `<FormItems>` to `<FormItemsTemplate>`. The `<FormItems>` tag should hold only `<FormItem>` and `<FormGroup>` tags.
 1. Inside `<FormItemsTemplate>`, define a `<TelerikFormGroupRenderer>` and `<TelerikFormItemRenderer>` for each group and item that exists in `<FormItems>`. Place each Renderer tag at the desired place. This steps also applies to `<FormAutoGeneratedItems />`, which need Renderers too.
 1. If using conditional statements to render `<FormItem>` tags, then define these tags unconditionally. Instead, use conditional logic for `<TelerikFormItemRenderer>` tags inside `<FormItemsTemplate>`.
-1. If [using `<FormItem>` instances inside a nested Razor component]({%slug form-kb-use-items-in-custom-component%}), then see the linked KB article and:
+1. If [using `<FormItem>` instances inside a nested Razor component](slug://form-kb-use-items-in-custom-component), then see the linked KB article and:
     * Move these `<FormItem>` tags inside the Form `<FormItems>` tag.
     * Pass the `FormItemsTemplate` `context` or a specific `IFormItem` as a new parameter of the nested component.
     * Use `<TelerikFormItemRenderer>` inside the nested component. Consume the new `IFormItem` parameter in the `Item` parameter of the Renderer.
@@ -261,7 +261,7 @@ The samples below demonstrate a few different use cases:
 
 Also check the following examples on other pages:
 
-* [How to insert Form items in a custom Razor component inside the Form]({%slug form-kb-use-items-in-custom-component%})
+* [How to insert Form items in a custom Razor component inside the Form](slug://form-kb-use-items-in-custom-component)
 * [Form Templates online demo](https://demos.telerik.com/blazor-ui/form/templates).
 
 ### Render Form Groups and Items in a Loop
@@ -385,7 +385,7 @@ This approach is suitable for scenarios where the application positions each For
 
 `FormItemsTemplateContext.Items` is a generic `List<IFormItemBase>`, so there are [multiple different ways to get each form item (or group) via standard methods](https://learn.microsoft.com/en-us/dotnet/api/system.collections.generic.list-1). The example below shows a few alternatives - `First()`, `Skip()`, and index.
 
-The sample also demonstrates how to display Form items conditionally (in this case, `DriversLicense`), depending on the value of another Form field (`BirthDate`). Note the usage of a [Form item `Template`]({%slug form-formitems-template%}) for `BirthDate`, which enables the Form to re-render and toggle the `DriversLicense` checkbox. See [UI rendering and performance optimization inside the Form]({%slug form-formitems%}#ui-rendering-inside-the-form) for more ways to refresh the Form component.
+The sample also demonstrates how to display Form items conditionally (in this case, `DriversLicense`), depending on the value of another Form field (`BirthDate`). Note the usage of a [Form item `Template`](slug://form-formitems-template) for `BirthDate`, which enables the Form to re-render and toggle the `DriversLicense` checkbox. See [UI rendering and performance optimization inside the Form](slug://form-formitems#ui-rendering-inside-the-form) for more ways to refresh the Form component.
 
 >caption Render defined Form items inside a FormItemsTemplate
 
diff --git a/components/form/formitems/overview.md b/components/form/formitems/overview.md
index 205eda24d8..d4e8f6386c 100644
--- a/components/form/formitems/overview.md
+++ b/components/form/formitems/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Form Items Overview
 
-You can customize the [default editors]({%slug form-overview%}#automatic-generation-of-fields) by using instances of the `FormItem` tag. Those instances should be in the `FormItems` collection.
+You can customize the [default editors](slug://form-overview#automatic-generation-of-fields) by using instances of the `FormItem` tag. Those instances should be in the `FormItems` collection.
 
 In this article:
 
@@ -32,15 +32,15 @@ The `FormItem` tag exposes the following parameters which you can use to customi
 
 * `Enabled` - `bool` - whether the editor is enabled. Defaults to `true`. If it is not specifically defined in the `FormItem` markup, it will take its value from the `[Editable]` data annotation attribute of the item.
 
-* `Field` - `string` - the name of the field in the model that the editor will render for as a string (case-sensitive). You can set its as a plain string (`Field="SomeField"`) or to have .NET extract the field name from the model for flat models (`Field=@nameof(MyModelClass.SomeFIeld)`). If you are using its [Template]({%slug form-formitems-template%}) to provide a custom editor, the `Field` parameter is not required.
+* `Field` - `string` - the name of the field in the model that the editor will render for as a string (case-sensitive). You can set its as a plain string (`Field="SomeField"`) or to have .NET extract the field name from the model for flat models (`Field=@nameof(MyModelClass.SomeFIeld)`). If you are using its [Template](slug://form-formitems-template) to provide a custom editor, the `Field` parameter is not required.
 
 * `FieldType` - `string` - the data type of the `Field`. This parameter should be provided if the type of the property in the model can not be extracted using reflection, for example it is an `object` and you would like to render a `NumericTextBox`. 
 
-* `ColSpan` - `int` - defines the `colspan` attribute. This parameter is applicable when the FormItems are divided in multiple columns in a single group. See the [FormGroups]({%slug form-formgroups%}) article for an example.
+* `ColSpan` - `int` - defines the `colspan` attribute. This parameter is applicable when the FormItems are divided in multiple columns in a single group. See the [FormGroups](slug://form-formgroups) article for an example.
 
 * `Class` - `string` - adds a custom CSS class to the `k-form-field` div tag.
 
-* `Template` - `RenderFragment` - allows you to change the [default editor]({%slug form-overview%}#automatic-generation-of-fields) altogether. For more information see the [Template]({%slug form-formitems-template%}) article.
+* `Template` - `RenderFragment` - allows you to change the [default editor](slug://form-overview#automatic-generation-of-fields) altogether. For more information see the [Template](slug://form-formitems-template) article.
 
 
 
@@ -122,9 +122,9 @@ When the user changes a value in a non-template Form item, the other Form items
 
 In such cases, there are a few ways to trigger re-rendering and UI refresh inside or outside the Form:
 
-* Use a Telerik input component inside a [Form item `<Template>`]({%slug form-formitems-template%}).
-* Call the [`Refresh()` method of the Form]({%slug form-overview%}#form-reference-and-methods). The method will re-render the Form itself.
-* Subscribe to the [`OnUpdate` event of the Form]({%slug form-events%}#onupdate). The event is an `EventCallback`, so it will update the whole Razor component, which holds the Form.
+* Use a Telerik input component inside a [Form item `<Template>`](slug://form-formitems-template).
+* Call the [`Refresh()` method of the Form](slug://form-overview#form-reference-and-methods). The method will re-render the Form itself.
+* Subscribe to the [`OnUpdate` event of the Form](slug://form-events#onupdate). The event is an `EventCallback`, so it will update the whole Razor component, which holds the Form.
 * Call `StateHasChanged()` inside the Razor component, which holds the Form. This will re-render the whole Razor component, including the Form.
 
 >caption How to re-render all Form Items or the Form's parent component
@@ -265,7 +265,7 @@ In such cases, there are a few ways to trigger re-rendering and UI refresh insid
     public Action<string>? OnChange { get; set; }
 
     // Get a validation expression from a parent component.
-    // See https://docs.telerik.com/blazor-ui/{%slug inputs-kb-validate-child-component%}
+    // See https://www.telerik.com/blazor-ui/documentation/knowledge-base/inputs-validation-child-component
     [Parameter]
     public Expression<Func<string>>? ValueExpression { get; set; }
 
@@ -280,13 +280,14 @@ In such cases, there are a few ways to trigger re-rendering and UI refresh insid
 
 ## Next Steps
 
-* [Configure Form button]({%slug form-formitems-buttons%})
-* [Define Form item templates]({%slug form-formitems-template%})
-* [Define a template for all Form groups and items]({%slug form-formitems-template%})
+* [Configure Form button](slug://form-formitems-buttons)
+* [Define Form item templates](slug://form-formitems-template)
+* [Define a template for all Form groups and items](slug://form-formitems-template)
 
 
 ## See Also
 
 * [Online demo: Form Items](https://demos.telerik.com/blazor-ui/form/overview)
-* [Form Groups]({%slug form-formgroups%})
-* [Orientation]({%slug form-orientation%})
+* [Form Groups](slug://form-formgroups)
+* [Form Orientation](slug://form-orientation)
+* [Validate in Child Component](slug://inputs-kb-validate-child-component)
diff --git a/components/form/formitems/template.md b/components/form/formitems/template.md
index 802d5bb17b..5e545d8e1f 100644
--- a/components/form/formitems/template.md
+++ b/components/form/formitems/template.md
@@ -10,16 +10,16 @@ position: 5
 
 # FormItem Template - Custom Editors
 
-This article explains how to customize the editor of a single Form item. To customize the rendering and item structure of the whole Form, check the article [Form Template for All Items]({%slug form-formitems-formitemstemplate%}).
+This article explains how to customize the editor of a single Form item. To customize the rendering and item structure of the whole Form, check the article [Form Template for All Items](slug://form-formitems-formitemstemplate).
 
 ## Basics
 
 Form item templates enables the app to:
 
-* Replace the [default editor that the Form generates for a given data type]({%slug form-overview%}#automatic-generation-of-fields) with a different component.
+* Replace the [default editor that the Form generates for a given data type](slug://form-overview#automatic-generation-of-fields) with a different component.
 * Use the usual editor component for a given data type, but customize the editor or handle additional events.
 
-To use a form item template, add a `<Template>` tag inside the [FormItem]({%slug form-formitems%}).
+To use a form item template, add a `<Template>` tag inside the [FormItem](slug://form-formitems).
 
 When using a Form item template, the following `FormItem` parameters are ignored, because the Form expects the template content to provide suitable replacements:
 
@@ -32,11 +32,11 @@ When using a Form item template, the following `FormItem` parameters are ignored
 
 ## Validation Messages and Styling
 
-The `FormItem` `Template` replaces all the Form item's built-in rendering, which includes validation messages and form item labels. You can use the [Telerik validation tools]({%slug validation-tools-overview%}) to display the desired validation UI, or even use the standard Blazor `ValidationMessage` component.
+The `FormItem` `Template` replaces all the Form item's built-in rendering, which includes validation messages and form item labels. You can use the [Telerik validation tools](slug://validation-tools-overview) to display the desired validation UI, or even use the standard Blazor `ValidationMessage` component.
 
 The Telerik Blazor Form applies red color to the labels of invalid Form items. To preserve this behavior in Form item templates:
 
-1. Set the `FormItem` [`Field` parameter]({%slug form-formitems%}#formitem-parameters), which is otherwise not required when using a `Template`.
+1. Set the `FormItem` [`Field` parameter](slug://form-formitems#formitem-parameters), which is otherwise not required when using a `Template`.
 1. Use a `<label class="k-label k-form-label">` element inside the `<Template>`.
 
 ## Example
@@ -145,6 +145,6 @@ The sample below shows how to:
 ## See Also
 
 * [Live Demo: Form Item Templates](https://demos.telerik.com/blazor-ui/form/templates)
-* [Form Items]({%slug form-formitems%})
-* [Form Groups]({%slug form-formgroups%})
-* [Form Events]({%slug form-events%})
+* [Form Items](slug://form-formitems)
+* [Form Groups](slug://form-formgroups)
+* [Form Events](slug://form-events)
diff --git a/components/form/orientation.md b/components/form/orientation.md
index b0100ce69b..5756e997cc 100644
--- a/components/form/orientation.md
+++ b/components/form/orientation.md
@@ -59,9 +59,9 @@ The Form component for Blazor allows you control its orientation through the `Or
 
 ## See Also
   
-  * [Overview]({%slug form-overview%})
-  * [FormItems]({%slug form-formitems%})
-  * [FormGroups]({%slug form-formgroups%})
-  * [Columns]({%slug form-columns%})
-  * [Events]({%slug form-events%})
+  * [Overview](slug://form-overview)
+  * [FormItems](slug://form-formitems)
+  * [FormGroups](slug://form-formgroups)
+  * [Columns](slug://form-columns)
+  * [Events](slug://form-events)
    
diff --git a/components/form/overview.md b/components/form/overview.md
index 795108a22e..17c6634b6c 100644
--- a/components/form/overview.md
+++ b/components/form/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Form Overview
 
-The <a href = "https://demos.telerik.com/blazor-ui/form/overview" target="_blank">Form for Blazor</a> allows you to generate and customize a form based on your model. You can control the component through various [parameters](#form-parameters), use [default editors](#automatic-generation-of-fields) or [custom ones]({%slug form-formitems%}), set the [orientation]({%slug form-orientation%}) and organize the form fields in [groups]({%slug form-formgroups%}) and [columns]({%slug form-columns%}).
+The <a href = "https://demos.telerik.com/blazor-ui/form/overview" target="_blank">Form for Blazor</a> allows you to generate and customize a form based on your model. You can control the component through various [parameters](#form-parameters), use [default editors](#automatic-generation-of-fields) or [custom ones](slug://form-formitems), set the [orientation](slug://form-orientation) and organize the form fields in [groups](slug://form-formgroups) and [columns](slug://form-columns).
 
 
 ## Creating Blazor Form
@@ -18,8 +18,8 @@ The <a href = "https://demos.telerik.com/blazor-ui/form/overview" target="_blank
 1. Add the `TelerikForm` tag to a razor file.
 1. Bind the Form to data by using only one of the following two options:
     * Set the Form `Model` parameter to an object.
-    * Set the `EditContext` parameter to an [`EditContext` instance](https://learn.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.forms.editcontext). The object instance from which the `EditContext` is created is important, especially when using [FormItem templates]({%slug form-formitems-template%}) and [validation messages]({%slug form-validation%}).
-1. (optional) To enable [form validation]({%slug form-validation%}), add the `<FormValidation>` tag. Define a validator component inside, for example the [`DataAnnotationsValidator`](https://learn.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.forms.dataannotationsvalidator) that is part of .NET Core.
+    * Set the `EditContext` parameter to an [`EditContext` instance](https://learn.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.forms.editcontext). The object instance from which the `EditContext` is created is important, especially when using [FormItem templates](slug://form-formitems-template) and [validation messages](slug://form-validation).
+1. (optional) To enable [form validation](slug://form-validation), add the `<FormValidation>` tag. Define a validator component inside, for example the [`DataAnnotationsValidator`](https://learn.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.forms.dataannotationsvalidator) that is part of .NET Core.
 
 <div class="skip-repl"></div>
 ````RAZOR Model
@@ -105,12 +105,12 @@ The <a href = "https://demos.telerik.com/blazor-ui/form/overview" target="_blank
 There are three ways to generate fields in the Blazor Form:
 
 * Allow the [Form to automatically generate items](#automatic-generation-of-fields). In this case, each editor component type will depend on the model property type.
-* [Define `FormItems`]({%slug form-formitems%}) manually. This allows more configuration flexibility and [changing the editor type]({%slug form-formitems%}). You can also control when [changes in one Form item cause other Form items to re-render]({%slug form-formitems%}#ui-rendering-inside-the-form).
-* [Combine the above two options]({%slug form-formitems%}#add-form-fields-to-autogenerated-ones).
+* [Define `FormItems`](slug://form-formitems) manually. This allows more configuration flexibility and [changing the editor type](slug://form-formitems). You can also control when [changes in one Form item cause other Form items to re-render](slug://form-formitems#ui-rendering-inside-the-form).
+* [Combine the above two options](slug://form-formitems#add-form-fields-to-autogenerated-ones).
 
 ### Automatic Generation of Fields
 
-The Telerik Form can generate [editors]({%slug form-formitems%}) for you based on the model fields. It can take them from both a `Model`, or the `EditContext`, whichever you provide to it. You can use [data annotation attributes](#data-annotation-attributes) to validate the field values and customize the auto-generated form fields, for example set labels, visibility and editability.
+The Telerik Form can generate [editors](slug://form-formitems) for you based on the model fields. It can take them from both a `Model`, or the `EditContext`, whichever you provide to it. You can use [data annotation attributes](#data-annotation-attributes) to validate the field values and customize the auto-generated form fields, for example set labels, visibility and editability.
 
 The following data types are supported out-of-the box and they use the following default editors:
 
@@ -118,16 +118,16 @@ The following data types are supported out-of-the box and they use the following
 
 | Data Type | Default Editor |
 |-----------|----------|
-| `string`  | [Telerik TextBox]({%slug components/textbox/overview%}) |
-| `int`, `double`, `float`, `decimal`  | [Telerik NumericTextBox]({%slug components/numerictextbox/overview%}) |
-| `Enum`  | [Telerik DropDownList]({%slug components/dropdownlist/overview%}) |
-| `DateTime`  | [Telerik DatePicker]({%slug components/datepicker/overview%}) |
-| `bool`  | [Telerik CheckBox]({%slug checkbox-overview%}) |
+| `string`  | [Telerik TextBox](slug://components/textbox/overview) |
+| `int`, `double`, `float`, `decimal`  | [Telerik NumericTextBox](slug://components/numerictextbox/overview) |
+| `Enum`  | [Telerik DropDownList](slug://components/dropdownlist/overview) |
+| `DateTime`  | [Telerik DatePicker](slug://components/datepicker/overview) |
+| `bool`  | [Telerik CheckBox](slug://checkbox-overview) |
 
 
 #### Customize the Automatically Generated Field Editors
 
-You can customize the automatically generated field editors by providing the `EditorType` attribute, exposed on the `<FormItem>`, or by using the [FormItem Template]({%slug form-formitems-template%}). The `EditorType` attribute accepts a member of the `FormEditorType` enum:
+You can customize the automatically generated field editors by providing the `EditorType` attribute, exposed on the `<FormItem>`, or by using the [FormItem Template](slug://form-formitems-template). The `EditorType` attribute accepts a member of the `FormEditorType` enum:
 
 | Field data type | FormEditorType enum members              |
 |-----------------|------------------------------------------|
@@ -187,7 +187,7 @@ The Form also uses the the following attributes from the model:
 
 * `[Editable(false)]` - to render the built-in editor as disabled so the user cannot change its value.
 
-You can customize the editors further through the [form items]({%slug form-formitems%}). Explicit settings you provide through the parameters will take precedence over data annotation attributes.
+You can customize the editors further through the [form items](slug://form-formitems). Explicit settings you provide through the parameters will take precedence over data annotation attributes.
 
 ## Form Parameters
 
@@ -195,20 +195,20 @@ You can customize the editors further through the [form items]({%slug form-formi
 | --- | --- | --- |
 | `AutoComplete` | `string` | The [`autocomplete` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) of the `<form>` element. |
 | `EditContext`  | `EditContext` | The [EditContext](https://learn.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.forms.editcontext) of the form. |
-| `Id`  | `string` | The `id` attribute of the `<form>` element. You can use it together with the [`Form` parameter of a submit button]({%slug button-type%}). Set both parameters to the same `string` value to submit the form from a button, which is outside the form. |
+| `Id`  | `string` | The `id` attribute of the `<form>` element. You can use it together with the [`Form` parameter of a submit button](slug://button-type). Set both parameters to the same `string` value to submit the form from a button, which is outside the form. |
 | `Model`  | `object` | The object bound to the Form. It will automatically create the `EditContext` and using both parameters together is not supported. |
-| `ValidationMessageType`  | `FormValidationMessageType` enum <br /> (`Inline`) | The validation message UI. The other options are `Tooltip` and `None`. See the [Validation]({%slug form-validation%}) article. |
+| `ValidationMessageType`  | `FormValidationMessageType` enum <br /> (`Inline`) | The validation message UI. The other options are `Tooltip` and `None`. See the [Validation](slug://form-validation) article. |
 
 ### Form Layout Customization
 
-The [Blazor Form](https://demos.telerik.com/blazor-ui/form/overview) exposes multiple parameters that allow you to customize its layout. Besides the parameters below, the Form component also allows you to [define a completely custom layout with HTML markup and Razor components]({%slug form-formitems-formitemstemplate%}).
+The [Blazor Form](https://demos.telerik.com/blazor-ui/form/overview) exposes multiple parameters that allow you to customize its layout. Besides the parameters below, the Form component also allows you to [define a completely custom layout with HTML markup and Razor components](slug://form-formitems-formitemstemplate).
 
 | Parameter | Type and Default value | Description |
 |-----------|------------------------|-------------|
-| `ButtonsLayout` | `FormButtonsLayout` enum <br /> (`Start`) | Determines the position and width of all Form buttons. See [Form Buttons]({%slug form-formitems-buttons%}). |
-| `Columns`  | `int` | Defines the number of columns in the Form. See the [Columns]({%slug form-columns%}) article for more information |
-| `ColumnSpacing`  | `string` | Defines the amout of vertical space between the Columns. See the [Columns]({%slug form-columns%}) article for more information. |
-| `Orientation`  | `FormOrientation` enum <br /> (`Vertical`) | Determines the position of each label with regard to its editor. See [Orientation]({%slug form-orientation%}) for more information. |
+| `ButtonsLayout` | `FormButtonsLayout` enum <br /> (`Start`) | Determines the position and width of all Form buttons. See [Form Buttons](slug://form-formitems-buttons). |
+| `Columns`  | `int` | Defines the number of columns in the Form. See the [Columns](slug://form-columns) article for more information |
+| `ColumnSpacing`  | `string` | Defines the amout of vertical space between the Columns. See the [Columns](slug://form-columns) article for more information. |
+| `Orientation`  | `FormOrientation` enum <br /> (`Vertical`) | Determines the position of each label with regard to its editor. See [Orientation](slug://form-orientation) for more information. |
 
 ### Styling and Appearance
 
@@ -218,9 +218,9 @@ The following parameters enable you to customize the appearance of the [Blazor F
 | --- | --- | --- |
 | `Class` | `string` | A custom CSS class for the `<form>` element. |
 | `Size` | `string` | Determines the size and font size of the Form editors, and the spacing between them. |
-| `Width`  | `string` | Controls the width of the Form in any [CSS length unit]({%slug common-features/dimensions%}). |
+| `Width`  | `string` | Controls the width of the Form in any [CSS length unit](slug://common-features/dimensions). |
 
-You can find more information for customizing the Form appearance in the [Appearance article]({%slug form-appearance%}).
+You can find more information for customizing the Form appearance in the [Appearance article](slug://form-appearance).
 
 ## Form Reference and Methods
 
@@ -269,10 +269,10 @@ The Form also exposes a `Refresh()` method that calls `StateHasChanged()` only f
 
 ## Next Steps
 
-* [Validate the Form]({%slug form-validation%})
-* [Explore the Form events]({%slug form-events%})
-* [Learn more about the Form Buttons]({%slug form-formitems-buttons%})
-* [Group the FormItems]({%slug form-formgroups%})
+* [Validate the Form](slug://form-validation)
+* [Explore the Form events](slug://form-events)
+* [Learn more about the Form Buttons](slug://form-formitems-buttons)
+* [Group the FormItems](slug://form-formgroups)
 
 ## See Also
 
diff --git a/components/form/validation.md b/components/form/validation.md
index 1a4b4962c5..d4cea01822 100644
--- a/components/form/validation.md
+++ b/components/form/validation.md
@@ -63,8 +63,8 @@ To enable validation in the Telerik Form for Blazor add the `<FormValidation>` t
 @[template](/_contentTemplates/common/form-validation.md#note-validation)
 
 When you provide an `EditContext` to the form, you can use its [`EnableDataAnnotationsValidation(IServiceProvider serviceProvider)`](https://learn.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.forms.editcontextdataannotationsextensions.enabledataannotationsvalidation?view=aspnetcore-8.0#microsoft-aspnetcore-components-forms-editcontextdataannotationsextensions-enabledataannotationsvalidation(microsoft-aspnetcore-components-forms-editcontext-system-iserviceprovider)) method to add the data annotation validation instead of using the markup. This is useful in the following cases:
-* When the model the form is bound to changes at runtime. For example, when you [have a reset button]({%slug form-formitems-buttons%}#how-to-add-a-reset-clear-button-to-the-form).
-* When you need to re-attach the validation after changing the `Model`. In this case you need to use the [reference to the Form component]({%slug form-overview%}#form-reference-and-methods)&mdash;`TheFormReference.EditContext.EnableDataAnnotationsValidation(IServiceProvider serviceProvider)`.
+* When the model the form is bound to changes at runtime. For example, when you [have a reset button](slug://form-formitems-buttons#how-to-add-a-reset-clear-button-to-the-form).
+* When you need to re-attach the validation after changing the `Model`. In this case you need to use the [reference to the Form component](slug://form-overview#form-reference-and-methods)&mdash;`TheFormReference.EditContext.EnableDataAnnotationsValidation(IServiceProvider serviceProvider)`.
 
 @[template](/_contentTemplates/common/form-validation.md#note-telerik-role-in-validation)
 
@@ -116,7 +116,7 @@ This section provides the following examples:
 * [Validate a Complex Model](#validate-a-complex-model)
 * [Fluent Validation](#fluent-validation)
 
-It is also possible to [trigger Form validation programmatically]({%slug form-overview%}#form-reference-and-methods) or [use custom DataAnnotations validation]({%slug validation-kb-custom-dataannotations-validator%}).
+It is also possible to [trigger Form validation programmatically](slug://form-overview#form-reference-and-methods) or [use custom DataAnnotations validation](slug://validation-kb-custom-dataannotations-validator).
 
 ### Validate a Model
 
@@ -279,5 +279,5 @@ You can use third-party validation libraries that integrate with the standard `E
 
 ## See Also
 
-* [Custom Form `DataAnnotations` Validation]({%slug validation-kb-custom-dataannotations-validator%})
-* [Conditional Form Validation Options]({%slug form-kb-conditional-validation%})
+* [Custom Form `DataAnnotations` Validation](slug://validation-kb-custom-dataannotations-validator)
+* [Conditional Form Validation Options](slug://form-kb-conditional-validation)
diff --git a/components/gantt/accessibility/overview.md b/components/gantt/accessibility/overview.md
index e968e44693..10858b7b37 100644
--- a/components/gantt/accessibility/overview.md
+++ b/components/gantt/accessibility/overview.md
@@ -15,9 +15,9 @@ The UI for Blazor Gantt component is <a href="https://www.w3.org/TR/WCAG22" targ
 
 WCAG 2.2 introduces the <a href="https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements" target="_blank">"Dragging Movements"</a> criterion as an important part of the Operable principle. Its primary goal is to guarantee that any feature reliant on drag actions offers an alternative method that can be executed with a single click, enhancing user accessibility.
 
-The illustrative example below shows the Gantt tree columns reorder action, achievable through the [Column Menu]({%slug gantt-column-menu%}). Telerik UI for Blazor aims to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
+The illustrative example below shows the Gantt tree columns reorder action, achievable through the [Column Menu](slug://gantt-column-menu). Telerik UI for Blazor aims to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
 
-The following example demonstrates the [accessibility compliance of the Gantt component]({%slug gantt-wai-aria-support%}). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch]({%slug accessibility-overview%}#color-contrast).
+The following example demonstrates the [accessibility compliance of the Gantt component](slug://gantt-wai-aria-support). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch](slug://accessibility-overview#color-contrast).
 
 >caption Gantt accessibility compliance example
 
diff --git a/components/gantt/accessibility/wai-aria-support.md b/components/gantt/accessibility/wai-aria-support.md
index aa188332e2..3d1991b2ea 100644
--- a/components/gantt/accessibility/wai-aria-support.md
+++ b/components/gantt/accessibility/wai-aria-support.md
@@ -87,9 +87,9 @@ The Gantt has been tested with the following screen readers and browsers combina
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor Gantt Demos](https://demos.telerik.com/blazor-ui/gantt/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/gantt/dependencies/databind.md b/components/gantt/dependencies/databind.md
index 370cd6e34f..89eb68f056 100644
--- a/components/gantt/dependencies/databind.md
+++ b/components/gantt/dependencies/databind.md
@@ -178,4 +178,4 @@ To bind a collection of dependencies to the Gantt Chart you should use the `Data
 
 ## Next Steps
 
-* [Explore Gantt dependency editing]({%slug gantt-dependencies-editing%})
+* [Explore Gantt dependency editing](slug://gantt-dependencies-editing)
diff --git a/components/gantt/dependencies/overview.md b/components/gantt/dependencies/overview.md
index d02f70431c..ac66eb9a19 100644
--- a/components/gantt/dependencies/overview.md
+++ b/components/gantt/dependencies/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Gantt Dependencies
 
-The Telerik Gantt for Blazor lets you define dependencies, which are rendered in the [Timeline]({%slug gantt-timeline%}) section of the component. A dependency represents a relation between two tasks. The direction of the arrow indicates which task is dependent on the other. You can bind a [data collection of different dependency types]({%slug gantt-dependencies-databind%}) and allow your users to [edit]({%slug gantt-dependencies-editing%}) the dependencies.
+The Telerik Gantt for Blazor lets you define dependencies, which are rendered in the [Timeline](slug://gantt-timeline) section of the component. A dependency represents a relation between two tasks. The direction of the arrow indicates which task is dependent on the other. You can bind a [data collection of different dependency types](slug://gantt-dependencies-databind) and allow your users to [edit](slug://gantt-dependencies-editing) the dependencies.
 
 ## Basics
 
@@ -21,5 +21,5 @@ To define dependencies in your Gantt Chart:
 
 ## Gantt Dependency Features
 
-* [Dependency Data Binding]({%slug gantt-dependencies-databind%}) allows you to provide a collection of dependencies to the Gantt Chart for Blazor.
-* [Dependency Editing]({%slug gantt-dependencies-editing%}) allows the user to edit the dependencies.
+* [Dependency Data Binding](slug://gantt-dependencies-databind) allows you to provide a collection of dependencies to the Gantt Chart for Blazor.
+* [Dependency Editing](slug://gantt-dependencies-editing) allows the user to edit the dependencies.
diff --git a/components/gantt/events.md b/components/gantt/events.md
index cb744366bc..ae6be16ceb 100644
--- a/components/gantt/events.md
+++ b/components/gantt/events.md
@@ -21,7 +21,7 @@ The `OnCreate`, `OnUpdate` and `OnDelete` events lets you get the data item that
 
 The `OnEdit` event lets you respond to user actions when they want to edit an item. For example, you can use it to prevent editing of certain items based on some condition.
 
-You can read more about the CUD events in the [Gantt Tree Editing Overview]({%slug gantt-tree-editing%}) article.
+You can read more about the CUD events in the [Gantt Tree Editing Overview](slug://gantt-tree-editing) article.
 
 ## TreeListWidthChanged
 
diff --git a/components/gantt/gantt-tree/columns/bound.md b/components/gantt/gantt-tree/columns/bound.md
index 87c63ccafa..177f051d4e 100644
--- a/components/gantt/gantt-tree/columns/bound.md
+++ b/components/gantt/gantt-tree/columns/bound.md
@@ -25,7 +25,7 @@ To show data in a Gantt Chart, you must define `GanttColumn` instances in the `G
 
 Since the Gantt is designed for hierarchical data, you should also define which column will hold the expand/collapse arrow for the child items. It can be any column, not necessarily the first, and you denote it by setting its `Expandable` parameter to `true`.
 
-You can read more details on how to tie the Gantt to your data fields and child elements in the [Data Binding Overview]({%slug gantt-data-binding-overview%}) article. It provides information on the features of the model, and describing the parent-child relationships in two different ways.
+You can read more details on how to tie the Gantt to your data fields and child elements in the [Data Binding Overview](slug://gantt-data-binding-overview) article. It provides information on the features of the model, and describing the parent-child relationships in two different ways.
 
 >caption Provide data to the Gantt and choose which columns (fields) to see
 
@@ -143,13 +143,13 @@ The Blazor Gantt Bound Column provides various parameters to configure the compo
 | Parameter | Type and Default Value | Description |
 | --- | --- | --- |
 | `Title` | `string` | The text that is rendered in the column header. See the Notes below for its behavior. |
-| `DisplayFormat` | `string` | The C# format string that is used to render the field value in the cell when the Gantt is in display mode. Read more in the [Column Display Format]({%slug treelist-columns-displayformat%}) article. |
+| `DisplayFormat` | `string` | The C# format string that is used to render the field value in the cell when the Gantt is in display mode. Read more in the [Column Display Format](slug://treelist-columns-displayformat) article. |
 | `TextAlign` | `ColumnTextAlign` enum <br /> (`Left`) | Specifies the horizontal alignment of the cell text. |
-| `Width` | `string` | The width of the column. See the [Dimensions]({%slug common-features/dimensions%}) article for information about the supported formats. See [Gantt Column Width Behavior]({%slug gantt-columns-width%}) for detailed information about the Gantt behavior with different column width configurations. |
-| `MinResizableWidth` | `int` <br /> (`30`) | The minimum allowed column width during [user resizing]({%slug gantt-columns-resize%}). Unlike the string `Width` property, this one is decimal and expects pixel values. |
-| `MaxResizableWidth` | `int` | The maximum allowed column width during [user resizing]({%slug gantt-columns-resize%}). Unlike the string `Width` property, this one is decimal and expects pixel values. |
+| `Width` | `string` | The width of the column. See the [Dimensions](slug://common-features/dimensions) article for information about the supported formats. See [Gantt Column Width Behavior](slug://gantt-columns-width) for detailed information about the Gantt behavior with different column width configurations. |
+| `MinResizableWidth` | `int` <br /> (`30`) | The minimum allowed column width during [user resizing](slug://gantt-columns-resize). Unlike the string `Width` property, this one is decimal and expects pixel values. |
+| `MaxResizableWidth` | `int` | The maximum allowed column width during [user resizing](slug://gantt-columns-resize). Unlike the string `Width` property, this one is decimal and expects pixel values. |
 | `Visible` | `bool?` <br /> (`null`) | If this parameter is set to `false`, it hides the column from the Gantt Tree. Accepts both `bool` and `bool?` types, and `null` is treated like `true`. |
-| `HeaderClass` | `string` | Adds a custom CSS class to the header cell of the column. Use it to apply custom styles or [override the default Gantt styles]({%slug themes-override%}). |
+| `HeaderClass` | `string` | Adds a custom CSS class to the header cell of the column. Use it to apply custom styles or [override the default Gantt styles](slug://themes-override). |
 
 ## Notes
 
diff --git a/components/gantt/gantt-tree/columns/command.md b/components/gantt/gantt-tree/columns/command.md
index 2753534800..1d822e38ad 100644
--- a/components/gantt/gantt-tree/columns/command.md
+++ b/components/gantt/gantt-tree/columns/command.md
@@ -10,7 +10,7 @@ position: 1
 
 # Gantt Tree Command Column
 
-The command column of a Gantt Tree allows you to initiate [editing]({%slug gantt-tree-editing%}), or to execute your own commands.
+The command column of a Gantt Tree allows you to initiate [editing](slug://gantt-tree-editing), or to execute your own commands.
 
 To define it, add a `GanttCommandColumn` in the `GanttColumns` collection of a Gantt Chart. The command column takes a collection of `GanttCommandButton` instances that invoke the commands.
 
@@ -40,7 +40,7 @@ The Blazor Gantt Command Column provides various parameters to configure the com
 | `ShowInEdit` | Defines if the button is visible only when the user is editing or inserting data. |
 | `ChildContent` | The text of the button. You can also place it between the command button's opening and closing tags. |
 
-See also Appearance properties like `Icon`, `Class`, `Enabled` that are coming from the underlying [Telerik UI for Blazor Button Component features]({%slug components/button/overview%}).
+See also Appearance properties like `Icon`, `Class`, `Enabled` that are coming from the underlying [Telerik UI for Blazor Button Component features](slug://components/button/overview).
 
 ### Built-in Commands
 
@@ -67,7 +67,7 @@ The `OnClick` handler of the commands receives an argument of type `GanttTaskCom
 
 The command column provides access to the data item via `context`. This may be useful for conditional statements or passing parameters to custom business logic.
 
-Use a **named** context variable to avoid errors when nesting components or `RenderFragment`s in general. In such cases, the exception will be similar to ["Child content element ... uses the same parameter name ('context') as enclosing child content element ..."]({%slug nest-renderfragment%}).
+Use a **named** context variable to avoid errors when nesting components or `RenderFragment`s in general. In such cases, the exception will be similar to ["Child content element ... uses the same parameter name ('context') as enclosing child content element ..."](slug://nest-renderfragment).
 
 <div class="skip-repl"></div>
 ````RAZOR
diff --git a/components/gantt/gantt-tree/columns/menu.md b/components/gantt/gantt-tree/columns/menu.md
index 51344ebdf4..11f54ae592 100644
--- a/components/gantt/gantt-tree/columns/menu.md
+++ b/components/gantt/gantt-tree/columns/menu.md
@@ -10,7 +10,7 @@ position: 20
 
 # Column Menu
 
-The Gantt allows you to set up a menu for its columns. The Column Menu enables you to perform high-level customization like [sorting]({%slug gantt-sorting%}), [filtering]({%slug gantt-filtering-overview%}), and [showing or hiding]({%slug gantt-columns-visible%}) columns.
+The Gantt allows you to set up a menu for its columns. The Column Menu enables you to perform high-level customization like [sorting](slug://gantt-sorting), [filtering](slug://gantt-filtering-overview), and [showing or hiding](slug://gantt-columns-visible) columns.
 
 >caption In this article:
 * [Basics](#basics)
@@ -138,7 +138,7 @@ The **Apply** button sets the column visibility according to the current checkbo
 
 To control whether filtering is possible from the Column Menu, set the `FilterMode` parameter of the `GanttColumnMenuSettings` tag to a member of the `ColumnMenuFilterMode` enum:
 
-* `None`—disables the filtering from the Column Menu. This is the recommended option if you use the [`FilterRow` mode]({%slug gantt-filter-row%}).
+* `None`—disables the filtering from the Column Menu. This is the recommended option if you use the [`FilterRow` mode](slug://gantt-filter-row).
 * `FilterMenu`—enables filtering from a filter menu.
 
 ### Frozen Columns
@@ -159,7 +159,7 @@ The Gantt Column Menu lets you group the columns in the [Column Chooser](#column
 
 1. Use the `GanttColumnMenuChooser` tag (child to the `GanttColumnMenuSettings`).
 
-1. Add the [Template]({%slug gantt-templates-column-chooser%}) tag.
+1. Add the [Template](slug://gantt-templates-column-chooser) tag.
 
 1. Provide a `GanttColumnMenuChooserGroup`, which is a collection of the columns that will be in the section. To render a title for the section, use the `Title` parameter.
     
@@ -283,7 +283,7 @@ The example shows the following things:
 
 * The settings applied to a Gantt column take precedence over the settings applied to the Column Menu through the `<GanttColumnMenuSettings>` tag. For example, if you set `Lockable="false"` to a Gantt column and `Lockable="true"` to the Gantt Column Menu, the Frozen Columns functionality will be disabled.
 
-* When using the [Column Chooser Template]({%slug gantt-templates-column-chooser%}) or grouping the columns into [sections](#column-sections), add the `Title` parameter to all Gantt Columns.
+* When using the [Column Chooser Template](slug://gantt-templates-column-chooser) or grouping the columns into [sections](#column-sections), add the `Title` parameter to all Gantt Columns.
 
 ## See Also
   * [Live Demo: Gantt Column Menu](https://demos.telerik.com/blazor-ui/gantt/column-menu)
diff --git a/components/gantt/gantt-tree/columns/visible.md b/components/gantt/gantt-tree/columns/visible.md
index 238829f316..793d51132e 100644
--- a/components/gantt/gantt-tree/columns/visible.md
+++ b/components/gantt/gantt-tree/columns/visible.md
@@ -118,7 +118,7 @@ To hide a Gantt Tree column set its `Visible` parameter to `false`. To hide a co
 
 Non-visible columns (`Visible="false"`) will have the following behavior:
 
-* Will not be [editable]({%slug gantt-tree-editing%}).
+* Will not be [editable](slug://gantt-tree-editing).
 
 
 ## Examples
diff --git a/components/gantt/gantt-tree/data-binding/flat-data.md b/components/gantt/gantt-tree/data-binding/flat-data.md
index fc136bbe1d..9a54400dc7 100644
--- a/components/gantt/gantt-tree/data-binding/flat-data.md
+++ b/components/gantt/gantt-tree/data-binding/flat-data.md
@@ -114,6 +114,6 @@ If there are child items for a certain node (items whose `ParentId` points to th
 
 ## See Also
 
-  * [TreeList Data Binding Basics]({%slug gantt-data-binding-overview%})
-  * [Binding to Hierarchical Data]({%slug gantt-data-binding-hierarchical-data%})
+  * [TreeList Data Binding Basics](slug://gantt-data-binding-overview)
+  * [Binding to Hierarchical Data](slug://gantt-data-binding-hierarchical-data)
 
diff --git a/components/gantt/gantt-tree/data-binding/hierarchical-data.md b/components/gantt/gantt-tree/data-binding/hierarchical-data.md
index a1c2040ffc..ebbe3987db 100644
--- a/components/gantt/gantt-tree/data-binding/hierarchical-data.md
+++ b/components/gantt/gantt-tree/data-binding/hierarchical-data.md
@@ -264,6 +264,6 @@ If there are items for a certain node, it will have an expand icon. The `HasChil
 
 ## See Also
 
-  * [Gantt Data Binding Basics]({%slug gantt-data-binding-overview%})
-  * [Binding to Flat Data]({%slug gantt-data-binding-flat-data%})
+  * [Gantt Data Binding Basics](slug://gantt-data-binding-overview)
+  * [Binding to Flat Data](slug://gantt-data-binding-flat-data)
 
diff --git a/components/gantt/gantt-tree/data-binding/overview.md b/components/gantt/gantt-tree/data-binding/overview.md
index 53db09344b..6028787984 100644
--- a/components/gantt/gantt-tree/data-binding/overview.md
+++ b/components/gantt/gantt-tree/data-binding/overview.md
@@ -21,9 +21,9 @@ First, review:
 
 There are two modes of providing data to a Gantt Tree, and they all use the items' features. Once you are familiar with the current article, choose the data binding you wish to use more:
 
-* [Flat data]({%slug gantt-data-binding-flat-data%}) - a single collection of items with defined parent-child relationships. See the `Id` and `ParentId` settings.
+* [Flat data](slug://gantt-data-binding-flat-data) - a single collection of items with defined parent-child relationships. See the `Id` and `ParentId` settings.
 
-* [Hierarchical data]({%slug gantt-data-binding-hierarchical-data%}) - separate collections of items and their child items. This is the default mode of the component. See the `Items` setting.
+* [Hierarchical data](slug://gantt-data-binding-hierarchical-data) - separate collections of items and their child items. This is the default mode of the component. See the `Items` setting.
 
 ## Gantt Tree Item Features
 
@@ -64,6 +64,6 @@ The properties of a Gantt Tree item match directly to a field of the model the t
 
 ## See Also
 
-  * [Binding to Flat Data]({%slug gantt-data-binding-flat-data%})
-  * [Binding to Hierarchical Data]({%slug gantt-data-binding-hierarchical-data%})
+  * [Binding to Flat Data](slug://gantt-data-binding-flat-data)
+  * [Binding to Hierarchical Data](slug://gantt-data-binding-hierarchical-data)
   
diff --git a/components/gantt/gantt-tree/editing/inline.md b/components/gantt/gantt-tree/editing/inline.md
index 315455c291..b5522b57f6 100644
--- a/components/gantt/gantt-tree/editing/inline.md
+++ b/components/gantt/gantt-tree/editing/inline.md
@@ -10,7 +10,7 @@ position: 10
 
 # Gantt Tree Inline Editing
 
-Inline editing lets the user click an [Edit command button]({%slug gantt-columns-command%}) on the row, and all its editable columns open up for changes. They can then click a `Save` command button to submit the changes to the data access layer. This fires the `OnUpdate` event where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service).
+Inline editing lets the user click an [Edit command button](slug://gantt-columns-command) on the row, and all its editable columns open up for changes. They can then click a `Save` command button to submit the changes to the data access layer. This fires the `OnUpdate` event where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service).
 
 In a similar fashion, the `Cancel` and `Delete` command buttons fire events to let you handle the data source operations.
 
diff --git a/components/gantt/gantt-tree/editing/overview.md b/components/gantt/gantt-tree/editing/overview.md
index 6fb9874958..6ca83ea1ef 100644
--- a/components/gantt/gantt-tree/editing/overview.md
+++ b/components/gantt/gantt-tree/editing/overview.md
@@ -28,15 +28,15 @@ Sections in this article:
 
 The Gantt Tree offers several editing modes with different user experience. Set the `TreeListEditMode` property to a member of the `GanttTreeListEditMode` enum:
 
-* `None` - The built-in [`Add` and `Edit` commands]({%slug gantt-columns-command%}#built-in-commands) don't work in this mode.
-* `Incell` - the default `TreeListEditMode` value. [Edit a single cell]({%slug gant-tree-incell-editing%}) by clicking on it or tabbing
-* `Inline` - [edit a row]({%slug gant-tree-inline-editing%}) by clicking on an [Edit command button]({%slug gantt-columns-command%})
-* `Popup` - [edit a row in a popup form]({%slug gant-tree-popup-editing%}) by clicking on an Edit button
+* `None` - The built-in [`Add` and `Edit` commands](slug://gantt-columns-command#built-in-commands) don't work in this mode.
+* `Incell` - the default `TreeListEditMode` value. [Edit a single cell](slug://gant-tree-incell-editing) by clicking on it or tabbing
+* `Inline` - [edit a row](slug://gant-tree-inline-editing) by clicking on an [Edit command button](slug://gantt-columns-command)
+* `Popup` - [edit a row in a popup form](slug://gant-tree-popup-editing) by clicking on an Edit button
 
 
 ## Events
 
-* `OnCreate` - fires when the `Save` [command button]({%slug gantt-columns-command%}) button for a newly added item is clicked. The event handler receives an argument of type `GanttCreateEventArgs` that exposes the following fields:
+* `OnCreate` - fires when the `Save` [command button](slug://gantt-columns-command) button for a newly added item is clicked. The event handler receives an argument of type `GanttCreateEventArgs` that exposes the following fields:
 
     * `Item` - an object you can cast to your model class to obtain the current data item.
 
diff --git a/components/gantt/gantt-tree/editing/popup.md b/components/gantt/gantt-tree/editing/popup.md
index b17f901855..9a3319302b 100644
--- a/components/gantt/gantt-tree/editing/popup.md
+++ b/components/gantt/gantt-tree/editing/popup.md
@@ -17,7 +17,7 @@ In this article:
 
 ## Basics
 
-Popup editing lets the user click an [Edit command button]({%slug components/grid/columns/command%}) on the row, and a popup shows up with the editable fields associated with a Gantt Task. They can then click the `Save` button in the dialog to submit the changes to the model. This fires the `OnUpdate` event where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service).
+Popup editing lets the user click an [Edit command button](slug://components/grid/columns/command) on the row, and a popup shows up with the editable fields associated with a Gantt Task. They can then click the `Save` button in the dialog to submit the changes to the model. This fires the `OnUpdate` event where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service).
 
 In a similar fashion, the `Cancel` and `Delete` command buttons and the `Add` toolbar button fire events to let you handle the data source operations.
 
@@ -27,13 +27,13 @@ To enable Popup editing in the Gantt Tree, set its `TreeListEditMode` property t
 
 The popup editing dialog renders up to four tabs that allow you to edit:
 
-* `General`—The fields that are used in the [data-binding schema]({%slug gantt-data-binding-overview%}#gantt-tree-item-features).
-* `Other`—The fields that are not included in the [data-binding schema]({%slug gantt-data-binding-overview%}#gantt-tree-item-features) but are present in the bound model.
-* `Predecessor` and `Successor` - render if you have defined [dependencies]({%slug gantt-dependencies-overview%}) in the Gantt component. You can use these tabs as an alternative to the standard [dependency editing]({%slug gantt-dependencies-editing%})
+* `General`—The fields that are used in the [data-binding schema](slug://gantt-data-binding-overview#gantt-tree-item-features).
+* `Other`—The fields that are not included in the [data-binding schema](slug://gantt-data-binding-overview#gantt-tree-item-features) but are present in the bound model.
+* `Predecessor` and `Successor` - render if you have defined [dependencies](slug://gantt-dependencies-overview) in the Gantt component. You can use these tabs as an alternative to the standard [dependency editing](slug://gantt-dependencies-editing)
 
 ## Event Arguments
 
-In Telerik UI for Blazor version 4.5.0, the `GanttUpdateEventArgs` received three new collections as fields. They are populated when you define [Dependencies]({%slug gantt-dependencies-overview%}) in the Gantt.
+In Telerik UI for Blazor version 4.5.0, the `GanttUpdateEventArgs` received three new collections as fields. They are populated when you define [Dependencies](slug://gantt-dependencies-overview) in the Gantt.
 
 | Field | Type | Description |
 |----------|----------|----------|
@@ -49,7 +49,7 @@ The `GanttDependencyDescriptor` exposes four fields that describe the mutated de
 |----------|----------|----------|
 | `PredecessorId` | `object`  | The Id of the predecessor of the mutated dependency. |
 | `SuccessorId` | `object`  | The Id of the successor of the mutated dependency. |
-| `Type` | `GanttDependencyType` enum | The [type of the dependency]({%slug gantt-dependencies-databind%}). |
+| `Type` | `GanttDependencyType` enum | The [type of the dependency](slug://gantt-dependencies-databind). |
 | `DataItem` | `object`  | The model associated with this dependency. |
 
 >caption The Command buttons and the Gantt events let you handle data operations in Popup edit mode.
diff --git a/components/gantt/gantt-tree/filter/checkboxlist.md b/components/gantt/gantt-tree/filter/checkboxlist.md
index 1e05be4be6..5cd145769e 100644
--- a/components/gantt/gantt-tree/filter/checkboxlist.md
+++ b/components/gantt/gantt-tree/filter/checkboxlist.md
@@ -10,7 +10,7 @@ position: 15
 
 # Gantt CheckBoxList Filtering
 
-You can change the [filter menu]({%slug gantt-filter-menu%}) to show a list of checkboxes with the distinct values from the data source. This lets your users filter records by a commonly found value quickly, and select multiple values with ease. The behavior is similar to Excel filtering.
+You can change the [filter menu](slug://gantt-filter-menu) to show a list of checkboxes with the distinct values from the data source. This lets your users filter records by a commonly found value quickly, and select multiple values with ease. The behavior is similar to Excel filtering.
 
 To enable the checkbox list filtering in the Gantt:
 
diff --git a/components/gantt/gantt-tree/filter/filter-menu.md b/components/gantt/gantt-tree/filter/filter-menu.md
index 122bf71f61..5db069e329 100644
--- a/components/gantt/gantt-tree/filter/filter-menu.md
+++ b/components/gantt/gantt-tree/filter/filter-menu.md
@@ -23,7 +23,7 @@ To enable the filter menu, set the `FilterMode` property of the grid to `Telerik
 
 The Gantt will render a button in the column header that you click to get a popup with filtering options. The popup lets you choose filter operator, filter criteria, to apply and clear the filter.
 
-A key difference in the behavior from the [filter row]({%slug gantt-filter-row%}) is that the filter is now applied only upon a button click, not upon input change. This may improve performance with large data sets.
+A key difference in the behavior from the [filter row](slug://gantt-filter-row) is that the filter is now applied only upon a button click, not upon input change. This may improve performance with large data sets.
 
 >caption Filter Menu in Telerik Gantt
 
@@ -233,5 +233,5 @@ You can customize the default Filter Menu behavior for each column through the f
 
 ## See Also
 
-  * [Gantt Filtering Overview]({%slug gantt-filtering-overview%})
+  * [Gantt Filtering Overview](slug://gantt-filtering-overview)
   * [Live Demo: Gantt Filter Menu](https://demos.telerik.com/blazor-ui/gantt/filter-menu)
\ No newline at end of file
diff --git a/components/gantt/gantt-tree/filter/filter-row.md b/components/gantt/gantt-tree/filter/filter-row.md
index e790765ea2..ccc0104998 100644
--- a/components/gantt/gantt-tree/filter/filter-row.md
+++ b/components/gantt/gantt-tree/filter/filter-row.md
@@ -243,5 +243,5 @@ You can customize the default Filter Row behavior for each Gantt Tree column thr
 
 ## See Also
 
-  * [Gantt Filtering Overview]({%slug gantt-filtering-overview%})
+  * [Gantt Filtering Overview](slug://gantt-filtering-overview)
   * [Live Demo: Gantt Filter Row](https://demos.telerik.com/blazor-ui/gantt/filter-row)
\ No newline at end of file
diff --git a/components/gantt/gantt-tree/filter/overview.md b/components/gantt/gantt-tree/filter/overview.md
index 4b6ca1e69f..5f62851f29 100644
--- a/components/gantt/gantt-tree/filter/overview.md
+++ b/components/gantt/gantt-tree/filter/overview.md
@@ -16,9 +16,9 @@ The Gantt Tree component offers built-in support for filtering.
 
 To enable filtering, set the grid's `FilterMode` property to one of the following values:
 
-* [`Telerik.Blazor.GanttFilterMode.FilterRow`]({%slug gantt-filter-row%}) - a row of filter options is rendered below the column headers
+* [`Telerik.Blazor.GanttFilterMode.FilterRow`](slug://gantt-filter-row) - a row of filter options is rendered below the column headers
 
-* [`Telerik.Blazor.GanttFilterMode.FilterMenu`]({%slug gantt-filter-menu%}) - the column headers render a button that shows a popup with filtering options
+* [`Telerik.Blazor.GanttFilterMode.FilterMenu`](slug://gantt-filter-menu) - the column headers render a button that shows a popup with filtering options
 
 The behavior of the filter input and the available filter operators will depend on the column data type. For example, a `boolean` field will only have the options `"is true"` and `"is false"` and will not have operators like `"contains"` or `"greater than"`.
 
@@ -26,7 +26,7 @@ You can filter more than one column at a time, and all filter rules will be appl
 
 ## Filter Descriptors
 
-You can get the applied filtering criteria for each filtered field. Use the [Gantt state]({%slug gantt-state%}) to obtain the user input, the filter operator and other filtering properties. Find out how in the [Data Operation Descriptors article]({%slug common-features-descriptors%}#filtering).
+You can get the applied filtering criteria for each filtered field. Use the [Gantt state](slug://gantt-state) to obtain the user input, the filter operator and other filtering properties. Find out how in the [Data Operation Descriptors article](slug://common-features-descriptors#filtering).
 
 ## Customize The Filter Editors
 
diff --git a/components/gantt/gantt-tree/overview.md b/components/gantt/gantt-tree/overview.md
index 5f0de215f8..d31b8e427d 100644
--- a/components/gantt/gantt-tree/overview.md
+++ b/components/gantt/gantt-tree/overview.md
@@ -10,15 +10,15 @@ position: 0
 
 # Gantt Tree
 
-The Gantt Tree is the left part of the [Gantt Chart]({%slug gantt-overview%}). The component exposes `TreeListWidth` (string, default `30`) parameter for changing the width of the TreeList pane in the splitter. 
+The Gantt Tree is the left part of the [Gantt Chart](slug://gantt-overview). The component exposes `TreeListWidth` (string, default `30`) parameter for changing the width of the TreeList pane in the splitter. 
 
-Set data to the component through its [data binding]({%slug gantt-data-binding-overview%}) options. You can also use the [filtering]({%slug gantt-filtering-overview%}), [sorting]({%slug gantt-sorting%}), and [editing]({%slug gantt-tree-editing%}) capabilities of the Telerik Gantt for Blazor.
+Set data to the component through its [data binding](slug://gantt-data-binding-overview) options. You can also use the [filtering](slug://gantt-filtering-overview), [sorting](slug://gantt-sorting), and [editing](slug://gantt-tree-editing) capabilities of the Telerik Gantt for Blazor.
 
 ## List of available features for the Gantt Tree
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
-* `Gantt Columns` - The main building blocks of the Gantt Tree. They are used to render data in the component. Read more information in the [Bound Column]({%slug gantt-columns-bound%}) article.
-* `Editing` - Allows you to create new records, update the existing or deleting them. Read more on this topic in the [Editing]({%slug gantt-tree-editing%}) article.
-* `Filtering` - The Gantt can filter data automatically. Read more about this feature in the [Filtering]({%slug gantt-filtering-overview%}) article.
-* `Sorting` - Allows you to sort the data in ascending and descending order. Read more about this feature in the [Sorting]({%slug gantt-sorting%}) article.
+* `Gantt Columns` - The main building blocks of the Gantt Tree. They are used to render data in the component. Read more information in the [Bound Column](slug://gantt-columns-bound) article.
+* `Editing` - Allows you to create new records, update the existing or deleting them. Read more on this topic in the [Editing](slug://gantt-tree-editing) article.
+* `Filtering` - The Gantt can filter data automatically. Read more about this feature in the [Filtering](slug://gantt-filtering-overview) article.
+* `Sorting` - Allows you to sort the data in ascending and descending order. Read more about this feature in the [Sorting](slug://gantt-sorting) article.
diff --git a/components/gantt/gantt-tree/sorting.md b/components/gantt/gantt-tree/sorting.md
index 10ee2e9ac9..0cefc5977d 100644
--- a/components/gantt/gantt-tree/sorting.md
+++ b/components/gantt/gantt-tree/sorting.md
@@ -24,7 +24,7 @@ Sorting keeps the expanded/collapsed state of items. For example, if filtering b
 
 You can let the user sort by more than one field by setting the `SortMode` parameter to `Telerik.Blazor.SortMode.Multiple`.
 
-The sorting criteria are stored in a [collection of `SortDescriptor`]({%slug common-features-descriptors%}#sorting).
+The sorting criteria are stored in a [collection of `SortDescriptor`](slug://common-features-descriptors#sorting).
 
 >caption Enable Sorting in Telerik TreeList
 
diff --git a/components/gantt/gantt-tree/templates/column-chooser.md b/components/gantt/gantt-tree/templates/column-chooser.md
index d0810d04be..f95395fffd 100644
--- a/components/gantt/gantt-tree/templates/column-chooser.md
+++ b/components/gantt/gantt-tree/templates/column-chooser.md
@@ -10,7 +10,7 @@ position: 40
 
 # Column Chooser Template
 
-The Column Chooser Template lets you control the rendering of the [ColumnChooser]({%slug gantt-column-menu%}#column-chooser). It exposes a [`context`](/blazor-ui/api/Telerik.Blazor.Components.ColumnMenuChooserTemplateContext) object that contains a list of all columns in the Gantt. 
+The Column Chooser Template lets you control the rendering of the [ColumnChooser](slug://gantt-column-menu#column-chooser). It exposes a [`context`](/blazor-ui/api/Telerik.Blazor.Components.ColumnMenuChooserTemplateContext) object that contains a list of all columns in the Gantt. 
 
 When you set up the Column Chooser Template, the list of columns that are rendered by default will not be present.
 
@@ -131,4 +131,4 @@ When you set up the Column Chooser Template, the list of columns that are render
  * [Live Demo: Gantt Templates](https://demos.telerik.com/blazor-ui/gantt/templates)
  * [Live Demo: Gantt Column Menu](https://demos.telerik.com/blazor-ui/treelist/column-menu)
  * [Live Demo: Gantt Custom Column Menu](https://demos.telerik.com/blazor-ui/gantt/custom-column-menu)
- * [Columns Menu]({%slug gantt-column-menu%})
\ No newline at end of file
+ * [Columns Menu](slug://gantt-column-menu)
\ No newline at end of file
diff --git a/components/gantt/gantt-tree/templates/editor.md b/components/gantt/gantt-tree/templates/editor.md
index 742109c33e..b9d4de26c6 100644
--- a/components/gantt/gantt-tree/templates/editor.md
+++ b/components/gantt/gantt-tree/templates/editor.md
@@ -9,7 +9,7 @@ position: 15
 
 # Editor Template
 
-The column's `EditorTemplate` defines the inline template or component that will be rendered when the user is [editing]({%slug gantt-tree-editing%}) the field. It is also used when inserting a new item. The template receives a copy of the model, so that changes can be canceled with the `Cancel` command.
+The column's `EditorTemplate` defines the inline template or component that will be rendered when the user is [editing](slug://gantt-tree-editing) the field. It is also used when inserting a new item. The template receives a copy of the model, so that changes can be canceled with the `Cancel` command.
 
 In the Editor Template, you can data bind components to the current context, which is an instance to the model the Gantt is bound to.
 
diff --git a/components/gantt/overview.md b/components/gantt/overview.md
index ff1a0d806e..2d70c46095 100644
--- a/components/gantt/overview.md
+++ b/components/gantt/overview.md
@@ -12,10 +12,10 @@ position: 0
 
 The <a href = "https://www.telerik.com/blazor-ui/gantt" target="_blank">Blazor Gantt Chart component</a> allows you to easily illustrate a collection of tasks. The component consists of two areas: 
 
-* The [Gantt Tree]({%slug gantt-tree%}) hosts hierarchical information on the tasks, their start and end time.
-* The [Timeline]({%slug gantt-timeline%}) view illustrates the time-frame and the completeness of the task.
+* The [Gantt Tree](slug://gantt-tree) hosts hierarchical information on the tasks, their start and end time.
+* The [Timeline](slug://gantt-timeline) view illustrates the time-frame and the completeness of the task.
 
-When the data collection is passed to the [Gantt Tree]({%slug gantt-tree%}), the component will automatically render the necessary elements in the [Timeline]({%slug gantt-timeline%}).
+When the data collection is passed to the [Gantt Tree](slug://gantt-tree), the component will automatically render the necessary elements in the [Timeline](slug://gantt-timeline).
 
 ## Creating Blazor Gantt
 
@@ -25,11 +25,11 @@ When the data collection is passed to the [Gantt Tree]({%slug gantt-tree%}), the
 
 3. Set the component dimensions through the `Width` and `Height` properties.
 
-4. Under its `GanttViews` tag, set the desired [views]({%slug gantt-timeline-views%}).
+4. Under its `GanttViews` tag, set the desired [views](slug://gantt-timeline-views).
 
-5. Under its `GanttColumns` tag, set the desired [`GanttColumn`]({%slug gantt-columns-bound%}) instances whose `Field` property points to the name of the model field that you want to show.
+5. Under its `GanttColumns` tag, set the desired [`GanttColumn`](slug://gantt-columns-bound) instances whose `Field` property points to the name of the model field that you want to show.
 
-6. Handle [`OnUpdate` and `OnDelete`]({%slug gantt-events%}) events to react to items changes.
+6. Handle [`OnUpdate` and `OnDelete`](slug://gantt-events) events to react to items changes.
 
 >caption Basic configuration of the Gantt Chart.
 
@@ -154,33 +154,33 @@ When the data collection is passed to the [Gantt Tree]({%slug gantt-tree%}), the
 
 ## Data Binding
 
-To show data in a Telerik Gantt Chart, define [GanttColumn]({%slug gantt-columns-bound%}) instances - they take a model `Field` and expose settings to control the [visibility]({%slug gantt-columns-visible%}) of the column, the [format of the displayed data]({%slug gantt-columns-displayformat%}), and the text alignment.
+To show data in a Telerik Gantt Chart, define [GanttColumn](slug://gantt-columns-bound) instances - they take a model `Field` and expose settings to control the [visibility](slug://gantt-columns-visible) of the column, the [format of the displayed data](slug://gantt-columns-displayformat), and the text alignment.
 
 >tip The Telerik Blazor Gantt Chart is data source agnostic - you can use any database and service according to your project, you only need to get the collection of data models to the Gantt Chart in the view-model of the component hosting it.
 
 The following list of resources provides examples for data binding a Gantt Chart in various scenarios:
 
-* General information on how data binding works - [Gantt Chart Data Binding Overview]({%slug gantt-data-binding-overview%}).
+* General information on how data binding works - [Gantt Chart Data Binding Overview](slug://gantt-data-binding-overview).
 
-* Binding to a self-referencing flat data source - [Bind the Gantt Chart to Flat Self-Referencing Data]({%slug gantt-data-binding-flat-data%}).
+* Binding to a self-referencing flat data source - [Bind the Gantt Chart to Flat Self-Referencing Data](slug://gantt-data-binding-flat-data).
 
-* Using hierarchical data source with item collections nested in each item - [Bind the Gantt Chart to Hierarchical Data]({%slug gantt-data-binding-hierarchical-data%}).
+* Using hierarchical data source with item collections nested in each item - [Bind the Gantt Chart to Hierarchical Data](slug://gantt-data-binding-hierarchical-data).
 
 ## Editing
 
-The Gantt Chart can perform CRUD operations on its current data collection and exposes events that let you control the operations and transfer changes to the actual data source. The component allows you to edit both the tasks in the [TreeList]({%slug gantt-tree-editing%}) and their respective representation in the [Timeline]({%slug gantt-timeline-editing%}).
+The Gantt Chart can perform CRUD operations on its current data collection and exposes events that let you control the operations and transfer changes to the actual data source. The component allows you to edit both the tasks in the [TreeList](slug://gantt-tree-editing) and their respective representation in the [Timeline](slug://gantt-timeline-editing).
 
 ## Sorting
 
-The Gantt Chart can sort data automatically. [Read more about the Blazor Gantt sorting]({%slug gantt-sorting%}).
+The Gantt Chart can sort data automatically. [Read more about the Blazor Gantt sorting](slug://gantt-sorting).
 
 ## Filtering
 
-The Gantt Chart can filter data automatically. [Read more about the Blazor Gantt filtering]({%slug gantt-filtering-overview%}).
+The Gantt Chart can filter data automatically. [Read more about the Blazor Gantt filtering](slug://gantt-filtering-overview).
 
 ## Templates
 
-The Blazor Gantt component exposes templates for customizing the [Timeline]({%slug gantt-timeline%}) items rendering. [Read more about the Blazor Gantt templates]({%slug gantt-timeline-templates%}).
+The Blazor Gantt component exposes templates for customizing the [Timeline](slug://gantt-timeline) items rendering. [Read more about the Blazor Gantt templates](slug://gantt-timeline-templates).
 
 ## Toolbar
 
@@ -193,25 +193,25 @@ When the height of the rows exceeds the height of the Gantt Chart, you will get
 
 ## Gantt Tree
 
-The Gantt Tree is the left part of the Gantt Chart. The part to provide data through its data binding options. [Read more about the Blazor Gantt Tree]({%slug gantt-tree%}).
+The Gantt Tree is the left part of the Gantt Chart. The part to provide data through its data binding options. [Read more about the Blazor Gantt Tree](slug://gantt-tree).
 
 ## Gantt Timeline
 
-The Gantt Timeline provides visual representation of the Gantt records in a timeline view. The right part of the component. It is configured similarly to a [Scheduler Timeline]({%slug scheduler-views-timeline%}) view. [Read more about the Blazor Gantt Timeline]({%slug gantt-timeline%}).
+The Gantt Timeline provides visual representation of the Gantt records in a timeline view. The right part of the component. It is configured similarly to a [Scheduler Timeline](slug://scheduler-views-timeline) view. [Read more about the Blazor Gantt Timeline](slug://gantt-timeline).
 
 ## Gantt Dependencies
 
-The Blazor Gantt allows defining dependencies, which are rendered in the [Timeline]({%slug gantt-timeline%}) section of the component. A dependency represents a relation between two tasks. [Read more about the Blazor Gantt Dependencies]({%slug gantt-dependencies-overview%}).
+The Blazor Gantt allows defining dependencies, which are rendered in the [Timeline](slug://gantt-timeline) section of the component. A dependency represents a relation between two tasks. [Read more about the Blazor Gantt Dependencies](slug://gantt-dependencies-overview).
 
 ## Events
 
-The Blazor Gantt fires CUD, expand/collapse, and TreeList pane width change events. Handle those events to respond to user actions. [Read more about the Blazor Gantt events]({%slug gantt-events%}).
+The Blazor Gantt fires CUD, expand/collapse, and TreeList pane width change events. Handle those events to respond to user actions. [Read more about the Blazor Gantt events](slug://gantt-events).
 
 ## Gantt Reference and Methods
 
 To execute Gantt methods, obtain reference to the component instance via `@ref`.
 
-The Gantt is a generic component. Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters]({%slug common-features-data-binding-overview%}#component-type).
+The Gantt is a generic component. Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters](slug://common-features-data-binding-overview#component-type).
 
 The table below lists the Gantt methods. Also consult the [Gantt API](/blazor-ui/api/Telerik.Blazor.Components.TelerikGantt-1).
 
@@ -219,7 +219,7 @@ The table below lists the Gantt methods. Also consult the [Gantt API](/blazor-ui
 
 | Method | Description |
 | --- | --- |
-| `Rebind` | [Refreshes the component data]({%slug gantt-refresh-data%}#rebind-method). |
+| `Rebind` | [Refreshes the component data](slug://gantt-refresh-data#rebind-method). |
 
 <div class="skip-repl"></div>
 ````RAZOR
@@ -232,13 +232,13 @@ The table below lists the Gantt methods. Also consult the [Gantt API](/blazor-ui
 
 ## Next Steps
 
-[Bind the Gantt to Data]({%slug gantt-data-binding-overview%})
+[Bind the Gantt to Data](slug://gantt-data-binding-overview)
 
-[Explore the Gantt Tree]({%slug gantt-tree%})
+[Explore the Gantt Tree](slug://gantt-tree)
 
-[Explore the Gantt Timeline]({%slug gantt-timeline%})
+[Explore the Gantt Timeline](slug://gantt-timeline)
 
-[Handle the Gantt Events]({%slug gantt-events%})
+[Handle the Gantt Events](slug://gantt-events)
 
 ## See Also
 
diff --git a/components/gantt/refresh-data.md b/components/gantt/refresh-data.md
index c647d6a7e2..6cae921f8e 100644
--- a/components/gantt/refresh-data.md
+++ b/components/gantt/refresh-data.md
@@ -517,6 +517,6 @@ In this article:
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
diff --git a/components/gantt/state.md b/components/gantt/state.md
index a1d2e92b75..ea2af8a3df 100644
--- a/components/gantt/state.md
+++ b/components/gantt/state.md
@@ -70,7 +70,7 @@ If you want to put the Gantt in a certain configuration without preserving the o
 
 To reset the Gantt state, call `SetStateAsync(null)`.
 
-You should avoid calling `SetStateAsync` in the Gantt [CRUD methods]({%slug gantt-tree-editing%}#events) (such as `OnUpdate`, `OnEdit`, `OnCreate`). Doing so may lead to unexpected results because the Gantt has more logic to execute after the event.
+You should avoid calling `SetStateAsync` in the Gantt [CRUD methods](slug://gantt-tree-editing#events) (such as `OnUpdate`, `OnEdit`, `OnCreate`). Doing so may lead to unexpected results because the Gantt has more logic to execute after the event.
 
 ## Information in the Gantt State
 
@@ -84,7 +84,7 @@ The following information is present in the Gantt state:
 
 * **Expanded Items** - list of expanded parent items.
 
-* **View** - the current [`GanttView`]({%slug gantt-timeline-views%})
+* **View** - the current [`GanttView`](slug://gantt-timeline-views)
 
 * **TreeList Width** - the width of the Gantt TreeList.
 
@@ -563,7 +563,7 @@ Sometimes you may want to know what the user changed in the Gantt (e.g., when th
 
 Find out what the user changed in the Gantt through the `PropertyName` of the `GanttStateEventArgs`. Override the user action by changing and then setting your desired state.
 
-Find out how to [get the applied filtering and sorting criteria]({%slug common-features-descriptors%}).
+Find out how to [get the applied filtering and sorting criteria](slug://common-features-descriptors).
 
 >caption Know when the Gantt state changes, which parameter changes, and amend the change
 
@@ -736,9 +736,9 @@ To test it out, try filtering the Title column
 
 ### Initiate Editing or Inserting of an Item
 
-The Gantt state lets you store the item that the user is currently working on - both an existing model that is being edited, and a new item the user is inserting. This happens automatically when you save the Gantt state. If you want to save on every keystroke instead of on `OnChange` - use a custom [EditorTemplate]({%slug gantt-templates-editor%}) and update the `EditItem` or `InsertedItem` of the state object as required, then save the state into your service.
+The Gantt state lets you store the item that the user is currently working on - both an existing model that is being edited, and a new item the user is inserting. This happens automatically when you save the Gantt state. If you want to save on every keystroke instead of on `OnChange` - use a custom [EditorTemplate](slug://gantt-templates-editor) and update the `EditItem` or `InsertedItem` of the state object as required, then save the state into your service.
 
-In addition to that, you can also use the `EditItem`, `OriginalEditItem`, `InsertItem` and `ParentItem` fields of the state object to put the Gantt in edit/insert mode through your own application code, instead of needing the user to initiate this through a [command button]({%slug gantt-columns-command%}).
+In addition to that, you can also use the `EditItem`, `OriginalEditItem`, `InsertItem` and `ParentItem` fields of the state object to put the Gantt in edit/insert mode through your own application code, instead of needing the user to initiate this through a [command button](slug://gantt-columns-command).
 
 >caption Start Gantt Editing or Insertion Programmatically
 
diff --git a/components/gantt/timeline/overview.md b/components/gantt/timeline/overview.md
index 2b407870ae..bf1692e473 100644
--- a/components/gantt/timeline/overview.md
+++ b/components/gantt/timeline/overview.md
@@ -12,11 +12,11 @@ position: 0
 
 The Timeline of the Gantt component provides visual representation of the Gantt records in a timeline view. It is configured similarly to a Scheduler Timeline view, where the horizontal dimension is divided into time slots.
 
-The Timeline exposes four predefined [views]({%slug gantt-timeline-views%}), which dictate how much time a single time slot represents. It also includes two rows of hierarchical slot headers, which show the time divisions
+The Timeline exposes four predefined [views](slug://gantt-timeline-views), which dictate how much time a single time slot represents. It also includes two rows of hierarchical slot headers, which show the time divisions
 
-It is rendered in the right pane of the Gantt component and allows you to interact with the tasks. You can invoke [editing]({%slug gantt-timeline-editing%}) of a task by double click on it. You can drag it to change the time slot in which it will be displayed. You can resize it or delete it.
+It is rendered in the right pane of the Gantt component and allows you to interact with the tasks. You can invoke [editing](slug://gantt-timeline-editing) of a task by double click on it. You can drag it to change the time slot in which it will be displayed. You can resize it or delete it.
 
-You can control the rendering of the tasks and their ToolTip in the Timeline through the [Templates]({%slug gantt-timeline-templates%}) the Gantt exposes. The [`TaskTemplate`]({%slug gantt-task-template%}) will allow to customize the tasks content and the [`ToolTipTemplate`]({%slug gantt-tooltip-template%}) - the rendering of the ToolTip.
+You can control the rendering of the tasks and their ToolTip in the Timeline through the [Templates](slug://gantt-timeline-templates) the Gantt exposes. The [`TaskTemplate`](slug://gantt-task-template) will allow to customize the tasks content and the [`ToolTipTemplate`](slug://gantt-tooltip-template) - the rendering of the ToolTip.
 
 >Simple Gantt with Timeline. The result from the snippet below.
 
diff --git a/components/gantt/timeline/templates/dateheader.md b/components/gantt/timeline/templates/dateheader.md
index fb3474afec..f85cad8e1e 100644
--- a/components/gantt/timeline/templates/dateheader.md
+++ b/components/gantt/timeline/templates/dateheader.md
@@ -20,7 +20,7 @@ The `Date Header` provides you with full control over the rendering for each hea
 | `YearView` | `YearHeaderTemplate` | `MonthHeaderTemplate` |
 
 The templates are `RenderFragment<DateTime>`, so the `context` is of type `DateTime`.
-When both `Template` and [`DateFormat`]({%slug gantt-columns-dateformat%}) are specified, the `Template` will be rendered. 
+When both `Template` and [`DateFormat`](slug://gantt-columns-dateformat) are specified, the `Template` will be rendered. 
 
 
 ### Notes
diff --git a/components/gantt/timeline/templates/overview.md b/components/gantt/timeline/templates/overview.md
index 4c856b82d0..783b94b6c7 100644
--- a/components/gantt/timeline/templates/overview.md
+++ b/components/gantt/timeline/templates/overview.md
@@ -12,15 +12,15 @@ position: 0
 
 Customize the appearance of the Gantt Timeline through its templates. They will enable you to add more details for the users and have full control over the rendering.
 
-Available templates for the [Timeline]({%slug gantt-timeline%}):
+Available templates for the [Timeline](slug://gantt-timeline):
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
 | Template | Description |
 | --- | --- |
-| [TaskTemplate]({%slug gantt-task-template%}) | Allows you to customize the rendering of the tasks in the Timeline. |
-| [TooltipTemplate]({%slug gantt-tooltip-template%}) | Allows you to customize the rendering of the ToolTip in the Timeline. |
-| [Date Header Templates]({%slug gantt-dateheader-template%}) | Allows you to customize the rendering of major and minor slot header for each view in the Timeline. |
+| [TaskTemplate](slug://gantt-task-template) | Allows you to customize the rendering of the tasks in the Timeline. |
+| [TooltipTemplate](slug://gantt-tooltip-template) | Allows you to customize the rendering of the ToolTip in the Timeline. |
+| [Date Header Templates](slug://gantt-dateheader-template) | Allows you to customize the rendering of major and minor slot header for each view in the Timeline. |
 
 ## See Also
 
diff --git a/components/gantt/timeline/templates/task.md b/components/gantt/timeline/templates/task.md
index d8e3ebdcb4..0a0b13c782 100644
--- a/components/gantt/timeline/templates/task.md
+++ b/components/gantt/timeline/templates/task.md
@@ -176,4 +176,4 @@ The `TaskTemplate` is of type `RenderFragment<TItem>`, so the `context` has the
 ## See Also
 
   * [Live Demo: Gantt Templates](https://demos.telerik.com/blazor-ui/gantt/templates)
-  * [How to set different colors for the Gantt tasks]({%slug gantt-kb-different-colors-for-tasks%})
+  * [How to set different colors for the Gantt tasks](slug://gantt-kb-different-colors-for-tasks)
diff --git a/components/gauges/arc/labels.md b/components/gauges/arc/labels.md
index 602dfd8340..9d0b77f6ca 100644
--- a/components/gauges/arc/labels.md
+++ b/components/gauges/arc/labels.md
@@ -10,7 +10,7 @@ position: 20
 
 ## Arc Gauge Labels
 
-You can customize the appearance of the labels rendered on the [scale]({%slug arc-gauge-scale%}) of the Arc Gauge by using the `<ArcGaugeScaleLabels>`, child tag of the `<ArcGaugeScale>`, and the parameters it exposes:
+You can customize the appearance of the labels rendered on the [scale](slug://arc-gauge-scale) of the Arc Gauge by using the `<ArcGaugeScaleLabels>`, child tag of the `<ArcGaugeScale>`, and the parameters it exposes:
 
 * [Format](#format)
 
@@ -178,6 +178,6 @@ The `Visible` (`bool`) parameter controls whether the labels will be rendered. B
 
 * [Live Demo: Arc Gauge](https://demos.telerik.com/blazor-ui/arcgauge/overview)
 * [Live Demo: Arc Gauge - Center Template](https://demos.telerik.com/blazor-ui/arcgauge/center-template)
-* [Arc Gauge: Overview]({%slug arc-gauge-overview%})
-* [Arc Gauge: Scale]({%slug arc-gauge-scale%})
-* [Arc Gauge: Pointers]({%slug arc-gauge-pointers%})
+* [Arc Gauge: Overview](slug://arc-gauge-overview)
+* [Arc Gauge: Scale](slug://arc-gauge-scale)
+* [Arc Gauge: Pointers](slug://arc-gauge-pointers)
diff --git a/components/gauges/arc/overview.md b/components/gauges/arc/overview.md
index 40009c6f19..d699baf731 100644
--- a/components/gauges/arc/overview.md
+++ b/components/gauges/arc/overview.md
@@ -10,14 +10,14 @@ position: 0
 
 # Blazor Arc Gauge Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/arc-gauge" target="_blank">Telerik Arc Gauge for Blazor</a> represents [numerical values]({%slug arc-gauge-pointers%}) on an arc [scale]({%slug arc-gauge-scale%}).
+The <a href = "https://www.telerik.com/blazor-ui/arc-gauge" target="_blank">Telerik Arc Gauge for Blazor</a> represents [numerical values](slug://arc-gauge-pointers) on an arc [scale](slug://arc-gauge-scale).
 
 ## Creating Blazor Arc Gauge
 
 1. Add the `<TelerikArcGauge>` tag.
 1. Add an instance of the `<ArcGaugePointer>` to the `<ArcGaugePointers>` collection.
 1. Provide a `Value` for the `<ArcGaugePointer>`.
-1. (optional) Add a [Center Label Template]({%slug arc-gauge-labels%}#center-template)
+1. (optional) Add a [Center Label Template](slug://arc-gauge-labels#center-template)
 
 
 ````RAZOR
@@ -36,15 +36,15 @@ The <a href = "https://www.telerik.com/blazor-ui/arc-gauge" target="_blank">Tele
 
 ## Scale
 
-The scale of the Arc Gauge renders the values of the [pointers]({%slug arc-gauge-pointers%}) and [labels]({%slug arc-gauge-labels%}). See the [Scale]({%slug arc-gauge-scale%}) article for more information on how to customize the scale of the component.
+The scale of the Arc Gauge renders the values of the [pointers](slug://arc-gauge-pointers) and [labels](slug://arc-gauge-labels). See the [Scale](slug://arc-gauge-scale) article for more information on how to customize the scale of the component.
 
 ## Pointers
 
-The pointers indicate the values on the scale of the component. See the [Pointers]({%slug arc-gauge-pointers%}) article for more information on how to customize the pointers of the component.
+The pointers indicate the values on the scale of the component. See the [Pointers](slug://arc-gauge-pointers) article for more information on how to customize the pointers of the component.
 
 ## Labels
 
-The labels are rendered on the scale of the component to give information to the users. See the [Labels]({%slug arc-gauge-labels%}) article for more information on how to customize the labels on the scale of the component.
+The labels are rendered on the scale of the component to give information to the users. See the [Labels](slug://arc-gauge-labels) article for more information on how to customize the labels on the scale of the component.
 
 ## Arc Gauge Parameters
 
@@ -52,8 +52,8 @@ The labels are rendered on the scale of the component to give information to the
 | Parameter | Type and Default Value | Description |
 | --- | --- | --- |
 | `Class` | `string` | Renders a custom CSS class to the `<div class="k-arcgauge">` element. |
-| `Width` | `string` | Controls the width of the Arc Gauge. You can read more information in the [Dimensions]({%slug common-features/dimensions%}) article.|
-| `Height` | `string` | Controls the height of the Arc Gauge. You can read more information in the [Dimensions]({%slug common-features/dimensions%}) article. |
+| `Width` | `string` | Controls the width of the Arc Gauge. You can read more information in the [Dimensions](slug://common-features/dimensions) article.|
+| `Height` | `string` | Controls the height of the Arc Gauge. You can read more information in the [Dimensions](slug://common-features/dimensions) article. |
 | `Transitions` | `bool?` | Controls if the Arc Gauge uses animations for its value changes. |
 | `RenderAs` | `RenderingMode?` <br /> (`SVG`) | Controls if the gauge renders as `SVG` or `Canvas`. |
 
@@ -94,8 +94,8 @@ The labels are rendered on the scale of the component to give information to the
 
 ## Next Steps
 
-* [Explore the Arc Gauge Scale]({%slug arc-gauge-scale%})
-* [Learn more about the Arc Gauge Pointers]({%slug arc-gauge-pointers%})
+* [Explore the Arc Gauge Scale](slug://arc-gauge-scale)
+* [Learn more about the Arc Gauge Pointers](slug://arc-gauge-pointers)
 
 ## See Also
 
diff --git a/components/gauges/arc/pointers.md b/components/gauges/arc/pointers.md
index da2a3d7b1f..e76755277a 100644
--- a/components/gauges/arc/pointers.md
+++ b/components/gauges/arc/pointers.md
@@ -133,5 +133,5 @@ The `Size` (`double`) parameter controls the size of the pointer.
 ## See Also
 
 * [Live Demo: Arc Gauge](https://demos.telerik.com/blazor-ui/arcgauge/overview)
-* [Arc Gauge: Overview]({%slug arc-gauge-overview%})
-* [Arc Gauge: Scale]({%slug arc-gauge-scale%})
+* [Arc Gauge: Overview](slug://arc-gauge-overview)
+* [Arc Gauge: Scale](slug://arc-gauge-scale)
diff --git a/components/gauges/arc/scale.md b/components/gauges/arc/scale.md
index 9ab37cdec9..589b671688 100644
--- a/components/gauges/arc/scale.md
+++ b/components/gauges/arc/scale.md
@@ -56,7 +56,7 @@ The scale of the arc gauge renders the values, pointers and labels. You can cust
 
 ## MinorUnit and MajorUnit
 
-* The `MajorUnit` (`double`) parameter controls the interval between the major unit divisions of the component. The values provided to the `ArcGaugePointer` will render as a `MajorUnit` tick. The [labels]({%slug arc-gauge-labels%}) will be rendered next to the `MajorUnit` ticks.
+* The `MajorUnit` (`double`) parameter controls the interval between the major unit divisions of the component. The values provided to the `ArcGaugePointer` will render as a `MajorUnit` tick. The [labels](slug://arc-gauge-labels) will be rendered next to the `MajorUnit` ticks.
 
 * The `MinorUnit` (`double`) parameter controls the interval between the minor unit divisions of the component. In order to use the `MinorUnit` ticks you must [enable them](#example-enable-the-minorunit-ticks) explicitly.
 
@@ -177,5 +177,5 @@ You can enable the MinorUnit ticks on the scale by using the `<ArcGaugeScaleMino
 
 * [Live Demo: Arc Gauge](https://demos.telerik.com/blazor-ui/arcgauge/overview)
 * [Live Demo: Arc Gauge - Scale Options](https://demos.telerik.com/blazor-ui/arcgauge/scale-options)
-* [Arc Gauge: Overview]({%slug arc-gauge-overview%})
-* [Arc Gauge: Pointers]({%slug arc-gauge-pointers%})
+* [Arc Gauge: Overview](slug://arc-gauge-overview)
+* [Arc Gauge: Pointers](slug://arc-gauge-pointers)
diff --git a/components/gauges/circular/labels.md b/components/gauges/circular/labels.md
index 3974b8b4a4..9435087488 100644
--- a/components/gauges/circular/labels.md
+++ b/components/gauges/circular/labels.md
@@ -10,7 +10,7 @@ position: 15
 
 # Circular Gauge Labels
 
-You can customize the appearance of the labels rendered on the [scale]({%slug circular-gauge-scale%}) of the Circular Gauge by using the `<CircularGaugeScaleLabels>`, child tag of the `<CircularGaugeScale>`, and the parameters it exposes:
+You can customize the appearance of the labels rendered on the [scale](slug://circular-gauge-scale) of the Circular Gauge by using the `<CircularGaugeScaleLabels>`, child tag of the `<CircularGaugeScale>`, and the parameters it exposes:
 
 * [Format](#format)
 
@@ -185,6 +185,6 @@ The `Visible` (`bool`) parameter controls whether the labels will be rendered. I
 
 * [Live Demo: Circular Gauge](https://demos.telerik.com/blazor-ui/circulargauge/overview)
 * [Live Demo: Circular Gauge - Center Template](https://demos.telerik.com/blazor-ui/circulargauge/center-template)
-* [Circular Gauge: Overview]({%slug circular-gauge-overview%})
-* [Circular Gauge: Scale]({%slug circular-gauge-scale%})
-* [Circular Gauge: Pointers]({%slug circular-gauge-pointers%})
\ No newline at end of file
+* [Circular Gauge: Overview](slug://circular-gauge-overview)
+* [Circular Gauge: Scale](slug://circular-gauge-scale)
+* [Circular Gauge: Pointers](slug://circular-gauge-pointers)
\ No newline at end of file
diff --git a/components/gauges/circular/overview.md b/components/gauges/circular/overview.md
index 672e93cdf1..11e507596f 100644
--- a/components/gauges/circular/overview.md
+++ b/components/gauges/circular/overview.md
@@ -10,14 +10,14 @@ position: 0
 
 # Blazor Circular Gauge Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/circular-gauge" target="_blank">Telerik Circular Gauge for Blazor</a> represents [numerical values]({%slug circular-gauge-pointers%}) on a circular [scale]({%slug circular-gauge-scale%}).
+The <a href = "https://www.telerik.com/blazor-ui/circular-gauge" target="_blank">Telerik Circular Gauge for Blazor</a> represents [numerical values](slug://circular-gauge-pointers) on a circular [scale](slug://circular-gauge-scale).
 
 ## Creating Blazor Circular Gauge
 
 1. Add the `<TelerikCircularGauge>` tag.
 1. Add an instance of the `<CircularGaugePointer>` to the `<CircularGaugePointers>` collection.
 1. Provide a `Value` for each `<CircularGaugePointer>`.
-1. (optional) You can use the [Center Label Template]({%slug circular-gauge-labels%}#center-template) to display the value of the pointer in the center of the component.
+1. (optional) You can use the [Center Label Template](slug://circular-gauge-labels#center-template) to display the value of the pointer in the center of the component.
 
 >caption Basic Telerik Circular Gauge for Blazor.
 
@@ -45,15 +45,15 @@ The <a href = "https://www.telerik.com/blazor-ui/circular-gauge" target="_blank"
 
 ## Scale
 
-The scale of the circular gauge renders the values of the [pointers]({%slug circular-gauge-pointers%}) and [labels]({%slug circular-gauge-labels%}). See the [Scale]({%slug circular-gauge-scale%}) article for more information on how to customize the scale of the component.
+The scale of the circular gauge renders the values of the [pointers](slug://circular-gauge-pointers) and [labels](slug://circular-gauge-labels). See the [Scale](slug://circular-gauge-scale) article for more information on how to customize the scale of the component.
 
 ## Pointers
 
-The pointers indicate the values on the scale of the component. See the [Pointers]({%slug circular-gauge-pointers%}) article for more information on how to customize the pointers of the component.
+The pointers indicate the values on the scale of the component. See the [Pointers](slug://circular-gauge-pointers) article for more information on how to customize the pointers of the component.
 
 ## Labels
 
-The labels are rendered on the scale of the component to give information to the users. See the [Labels]({%slug circular-gauge-labels%}) article for more information on how to customize the labels on the scale of the component.
+The labels are rendered on the scale of the component to give information to the users. See the [Labels](slug://circular-gauge-labels) article for more information on how to customize the labels on the scale of the component.
 
 ## Circular Gauge Parameters
 
@@ -62,8 +62,8 @@ The labels are rendered on the scale of the component to give information to the
 | Parameter | Type and Default Value | Description |
 | --- | --- | --- |
 | `Class` | `string` | Renders a custom CSS class to the `<div class="k-circulargauge">` element. |
-| `Width` | `string` | Controls the width of the Circular Gauge. You can read more information in the [Dimensions]({%slug common-features/dimensions%}) article.|
-| `Height` | `string` | Controls the height of the Circular Gauge. You can read more information in the [Dimensions]({%slug common-features/dimensions%}) article. |
+| `Width` | `string` | Controls the width of the Circular Gauge. You can read more information in the [Dimensions](slug://common-features/dimensions) article.|
+| `Height` | `string` | Controls the height of the Circular Gauge. You can read more information in the [Dimensions](slug://common-features/dimensions) article. |
 | `Transitions` | `bool?` | Controls if the Circular Gauge uses animations for its value changes. |
 | `RenderAs` | `RenderingMode?` <br /> (`SVG`) | Controls if the gauge renders as `SVG` or `Canvas`. |
 
@@ -105,8 +105,8 @@ The labels are rendered on the scale of the component to give information to the
 
 ## Next Steps
 
-* [Explore the Circular Gauge Scale]({%slug circular-gauge-scale%})
-* [Learn more about the Circular Gauge Pointers]({%slug circular-gauge-pointers%})
+* [Explore the Circular Gauge Scale](slug://circular-gauge-scale)
+* [Learn more about the Circular Gauge Pointers](slug://circular-gauge-pointers)
 
 ## See Also
 
diff --git a/components/gauges/circular/pointers.md b/components/gauges/circular/pointers.md
index adb228682b..86a6a9d884 100644
--- a/components/gauges/circular/pointers.md
+++ b/components/gauges/circular/pointers.md
@@ -141,6 +141,6 @@ The `Size` (`double`) parameter controls the size of the pointer.
 ## See Also
 
 * [Live Demo: Circular Gauge](https://demos.telerik.com/blazor-ui/circulargauge/overview)
-* [Circular Gauge: Overview]({%slug circular-gauge-overview%})
-* [Circular Gauge: Scale]({%slug circular-gauge-scale%})
-* [Circular Gauge: Labels]({%slug circular-gauge-labels%})
+* [Circular Gauge: Overview](slug://circular-gauge-overview)
+* [Circular Gauge: Scale](slug://circular-gauge-scale)
+* [Circular Gauge: Labels](slug://circular-gauge-labels)
diff --git a/components/gauges/circular/scale.md b/components/gauges/circular/scale.md
index d8bdb1485f..09d2899a98 100644
--- a/components/gauges/circular/scale.md
+++ b/components/gauges/circular/scale.md
@@ -95,7 +95,7 @@ The `<CircularGaugeScale>` exposes the following parameters:
 
 ## MinorUnit and MajorUnit
 
-* The `MajorUnit` (`double`) parameter controls the interval between the major unit divisions of the component. The [labels]({%slug circular-gauge-labels%}) will be rendered next to the `MajorUnit` ticks.
+* The `MajorUnit` (`double`) parameter controls the interval between the major unit divisions of the component. The [labels](slug://circular-gauge-labels) will be rendered next to the `MajorUnit` ticks.
 
 * The `MinorUnit` (`double`) parameter controls the interval between the minor unit divisions of the component.
 
@@ -198,6 +198,6 @@ If you set the `Reverse` (`bool`) parameter to `true` the scale direction will b
 
 * [Live Demo: Circular Gauge](https://demos.telerik.com/blazor-ui/circulargauge/overview)
 * [Live Demo: Circular Gauge - Scale Options](https://demos.telerik.com/blazor-ui/circulargauge/scale-options)
-* [Circular Gauge: Overview]({%slug circular-gauge-overview%})
-* [Circular Gauge: Pointers]({%slug circular-gauge-pointers%})
-* [Circular Gauge: Labels]({%slug circular-gauge-labels%})
+* [Circular Gauge: Overview](slug://circular-gauge-overview)
+* [Circular Gauge: Pointers](slug://circular-gauge-pointers)
+* [Circular Gauge: Labels](slug://circular-gauge-labels)
diff --git a/components/gauges/linear/labels.md b/components/gauges/linear/labels.md
index 174b490e5a..64c43502c6 100644
--- a/components/gauges/linear/labels.md
+++ b/components/gauges/linear/labels.md
@@ -10,7 +10,7 @@ position: 20
 
 ## Linear Gauge Labels
 
-You can customize the appearance of the labels rendered on the [scale]({%slug linear-gauge-scale%}) of the Linear Gauge by using the `<LinearGaugeScaleLabels>`, child tag of the `<LinearGaugeScale>`, and the parameters it exposes:
+You can customize the appearance of the labels rendered on the [scale](slug://linear-gauge-scale) of the Linear Gauge by using the `<LinearGaugeScaleLabels>`, child tag of the `<LinearGaugeScale>`, and the parameters it exposes:
 
 * [Format](#format)
 
@@ -160,7 +160,7 @@ The `Visible` (`bool`) parameter controls whether the labels will be rendered.
 ## See Also
 
 * [Live Demo: Linear Gauge](https://demos.telerik.com/blazor-ui/lineargauge/overview)
-* [Linear Gauge: Overview]({%slug linear-gauge-overview%})
-* [Linear Gauge: Scale]({%slug linear-gauge-scale%})
-* [Linear Gauge: Ranges]({%slug linear-gauge-ranges%})
-* [Linear Gauge: Pointers]({%slug linear-gauge-pointers%})
+* [Linear Gauge: Overview](slug://linear-gauge-overview)
+* [Linear Gauge: Scale](slug://linear-gauge-scale)
+* [Linear Gauge: Ranges](slug://linear-gauge-ranges)
+* [Linear Gauge: Pointers](slug://linear-gauge-pointers)
diff --git a/components/gauges/linear/overview.md b/components/gauges/linear/overview.md
index 5b42b1d6f8..ed2f3c569f 100644
--- a/components/gauges/linear/overview.md
+++ b/components/gauges/linear/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Linear Gauge Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/linear-gauge" target="_blank">Telerik Linear Gauge for Blazor</a> represents [numerical values]({%slug linear-gauge-pointers%}) on a [scale]({%slug linear-gauge-scale%}) of ranges in a linear format.
+The <a href = "https://www.telerik.com/blazor-ui/linear-gauge" target="_blank">Telerik Linear Gauge for Blazor</a> represents [numerical values](slug://linear-gauge-pointers) on a [scale](slug://linear-gauge-scale) of ranges in a linear format.
 
 ## Creating Blazor Linear Gauge
 
@@ -35,19 +35,19 @@ The <a href = "https://www.telerik.com/blazor-ui/linear-gauge" target="_blank">T
 
 ## Scale
 
-The scale of the Linear Gauge renders the values of the [pointers]({%slug linear-gauge-pointers%}) and [labels]({%slug linear-gauge-labels%}). [See the Scale article for more information on how to customize the scale of the component...]({%slug linear-gauge-scale%})
+The scale of the Linear Gauge renders the values of the [pointers](slug://linear-gauge-pointers) and [labels](slug://linear-gauge-labels). [See the Scale article for more information on how to customize the scale of the component...](slug://linear-gauge-scale)
 
 ## Pointers
 
-The pointers indicate the values on the scale of the component. [See the Pointers article for more information on how to customize the pointers of the component...]({%slug linear-gauge-pointers%})
+The pointers indicate the values on the scale of the component. [See the Pointers article for more information on how to customize the pointers of the component...](slug://linear-gauge-pointers)
 
 ## Labels
 
-The labels are rendered on the scale of the component to give information to the users. [See the Labels article for more information on how to customize the labels on the scale of the component...]({%slug linear-gauge-labels%})
+The labels are rendered on the scale of the component to give information to the users. [See the Labels article for more information on how to customize the labels on the scale of the component...](slug://linear-gauge-labels)
 
 ## Ranges
 
-The ranges are used to visually distinguish particular values on the scale. [Read the Ranges article for more information...]({%slug linear-gauge-ranges%})
+The ranges are used to visually distinguish particular values on the scale. [Read the Ranges article for more information...](slug://linear-gauge-ranges)
 
 ## Linear Gauge Parameters
 
@@ -99,8 +99,8 @@ The ranges are used to visually distinguish particular values on the scale. [Rea
 
 ## Next Steps
 
-* [Explore the Linear Gauge Scale]({%slug linear-gauge-scale%})
-* [Learn more about the Linear Gauge Pointers]({%slug linear-gauge-pointers%})
+* [Explore the Linear Gauge Scale](slug://linear-gauge-scale)
+* [Learn more about the Linear Gauge Pointers](slug://linear-gauge-pointers)
 
 ## See Also
 
diff --git a/components/gauges/linear/pointers.md b/components/gauges/linear/pointers.md
index 2a4ff5721a..8ea4269c60 100644
--- a/components/gauges/linear/pointers.md
+++ b/components/gauges/linear/pointers.md
@@ -128,7 +128,7 @@ The `Size` (`double`) parameter controls the size of the pointers.
 
 ## Margin
 
-The `Margin` (`double`) parameter controls the margin between the [Scale]({%slug linear-gauge-scale%}) and the pointers.
+The `Margin` (`double`) parameter controls the margin between the [Scale](slug://linear-gauge-scale) and the pointers.
 
 ````RAZOR
 @* Change the margin between the scale and the pointers *@
@@ -177,5 +177,5 @@ The `Margin` (`double`) parameter controls the margin between the [Scale]({%slug
 
 * [Live Demo: Linear Gauge](https://demos.telerik.com/blazor-ui/lineargauge/overview)
 * [Live Demo: Linear Gauge - Multiple Pointers](https://demos.telerik.com/blazor-ui/lineargauge/multiple-pointers)
-* [Linear Gauge: Overview]({%slug linear-gauge-overview%})
-* [Linear Gauge: Scale]({%slug linear-gauge-scale%})
+* [Linear Gauge: Overview](slug://linear-gauge-overview)
+* [Linear Gauge: Scale](slug://linear-gauge-scale)
diff --git a/components/gauges/linear/ranges.md b/components/gauges/linear/ranges.md
index d9b7a7866b..7d69e6fbd7 100644
--- a/components/gauges/linear/ranges.md
+++ b/components/gauges/linear/ranges.md
@@ -135,6 +135,6 @@ The `Opacity` (`double`) parameter controls the of the range. The value passed t
 
 * [Live Demo: Linear Gauge](https://demos.telerik.com/blazor-ui/lineargauge/overview)
 * [Live Demo: Linear Gauge - Scale Ranges](https://demos.telerik.com/blazor-ui/lineargauge/scale-ranges)
-* [Linear Gauge: Overview]({%slug linear-gauge-overview%})
-* [Linear Gauge: Overview]({%slug linear-gauge-scale%})
-* [Linear Gauge: Pointers]({%slug linear-gauge-pointers%})
+* [Linear Gauge: Overview](slug://linear-gauge-overview)
+* [Linear Gauge: Overview](slug://linear-gauge-scale)
+* [Linear Gauge: Pointers](slug://linear-gauge-pointers)
diff --git a/components/gauges/linear/scale.md b/components/gauges/linear/scale.md
index 56b0f86c60..3f58f051e0 100644
--- a/components/gauges/linear/scale.md
+++ b/components/gauges/linear/scale.md
@@ -62,7 +62,7 @@ The scale of the linear gauge renders the values, pointers and labels. You can c
 
 ## MinorUnit and MajorUnit
 
-* The `MajorUnit` (`double`) parameter controls the interval between the major unit divisions of the component. The values provided to the `LinearGaugePointer` will render as a `MajorUnit` tick. The [labels]({%slug linear-gauge-labels%}) will be rendered next to the `MajorUnit` ticks.
+* The `MajorUnit` (`double`) parameter controls the interval between the major unit divisions of the component. The values provided to the `LinearGaugePointer` will render as a `MajorUnit` tick. The [labels](slug://linear-gauge-labels) will be rendered next to the `MajorUnit` ticks.
 
 * The `MinorUnit` (`double`) parameter controls the interval between the minor unit divisions of the component.
 
@@ -194,5 +194,5 @@ You can remove the MinorUnit ticks from the rendering of the scale by using the
 
 * [Live Demo: Linear Gauge](https://demos.telerik.com/blazor-ui/lineargauge/overview)
 * [Live Demo: Linear Gauge - Scale Options](https://demos.telerik.com/blazor-ui/lineargauge/scale-options)
-* [Linear Gauge: Overview]({%slug linear-gauge-overview%})
-* [Linear Gauge: Pointers]({%slug linear-gauge-pointers%})
+* [Linear Gauge: Overview](slug://linear-gauge-overview)
+* [Linear Gauge: Pointers](slug://linear-gauge-pointers)
diff --git a/components/gauges/overview.md b/components/gauges/overview.md
index 92968dd9d6..cb981fe7ee 100644
--- a/components/gauges/overview.md
+++ b/components/gauges/overview.md
@@ -14,18 +14,18 @@ The Telerik UI for Blazor suite offers several gauge components that let you vis
 
 #### There are four different types of gauges available:
 
-* [Circular gauge]({%slug circular-gauge-overview%}) - the dial is a full circle to fit modern dashboard designs, and allows a center template where you can place the value and/or clarifications.
+* [Circular gauge](slug://circular-gauge-overview) - the dial is a full circle to fit modern dashboard designs, and allows a center template where you can place the value and/or clarifications.
 
     ![Basic Circular Gauge](circular/images/basic-circular-gauge.png)
 
-* [Linear gauge]({%slug linear-gauge-overview%}) - the dial is a classic straight ruler scale that resembles a thermometer.
+* [Linear gauge](slug://linear-gauge-overview) - the dial is a classic straight ruler scale that resembles a thermometer.
 
     ![Basic Linear Gauge](linear/images/basic-linear-gauge.png)
 
-* [Radial gauge]({%slug radial-gauge-overview%}) - the dial is a section of a circle with a needle pointing to the value which resembles a car speedometer or old-school physical gauge devices.
+* [Radial gauge](slug://radial-gauge-overview) - the dial is a section of a circle with a needle pointing to the value which resembles a car speedometer or old-school physical gauge devices.
 
     ![Basic Radial Gauge](radial/images/basic-radial-gauge.png)
 
-* [Arc gauge]({%slug arc-gauge-overview%}) - the dial is a section of a circle in a fashion similar to the circular gauge.
+* [Arc gauge](slug://arc-gauge-overview) - the dial is a section of a circle in a fashion similar to the circular gauge.
     
     ![Basic Arc Gauge](arc/images/basic-arc-gauge.png)
diff --git a/components/gauges/radial/labels.md b/components/gauges/radial/labels.md
index 8d5e036229..d993dd8146 100644
--- a/components/gauges/radial/labels.md
+++ b/components/gauges/radial/labels.md
@@ -10,7 +10,7 @@ position: 20
 
 # Radial Gauge Labels
 
-You can customize the appearance of the labels rendered on the [scale]({%slug radial-gauge-scale%}) of the Radial Gauge by using the `<RadialGaugeScaleLabels>`, child tag of the `<RadialGaugeScale>`, and the parameters it exposes:
+You can customize the appearance of the labels rendered on the [scale](slug://radial-gauge-scale) of the Radial Gauge by using the `<RadialGaugeScaleLabels>`, child tag of the `<RadialGaugeScale>`, and the parameters it exposes:
 
 * [Format](#format)
 
@@ -139,7 +139,7 @@ The `Visible` (`bool`) parameter controls whether the labels will be rendered.
 ## See Also
 
 * [Live Demo: Radial Gauge](https://demos.telerik.com/blazor-ui/radialgauge/overview)
-* [Radial Gauge: Overview]({%slug radial-gauge-overview%})
-* [Radial Gauge: Scale]({%slug radial-gauge-scale%})
-* [Radial Gauge: Pointers]({%slug radial-gauge-pointers%})
-* [Radial Gauge: Ranges]({%slug radial-gauge-ranges%})
\ No newline at end of file
+* [Radial Gauge: Overview](slug://radial-gauge-overview)
+* [Radial Gauge: Scale](slug://radial-gauge-scale)
+* [Radial Gauge: Pointers](slug://radial-gauge-pointers)
+* [Radial Gauge: Ranges](slug://radial-gauge-ranges)
\ No newline at end of file
diff --git a/components/gauges/radial/overview.md b/components/gauges/radial/overview.md
index 304b5153c6..f6f878a9dd 100644
--- a/components/gauges/radial/overview.md
+++ b/components/gauges/radial/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Radial Gauge Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/radial-gauge" target="_blank">Telerik Radial Gauge for Blazor</a> represents numerical values on a [scale]({%slug radial-gauge-scale%}) of ranges in a radial format.
+The <a href = "https://www.telerik.com/blazor-ui/radial-gauge" target="_blank">Telerik Radial Gauge for Blazor</a> represents numerical values on a [scale](slug://radial-gauge-scale) of ranges in a radial format.
 
 ## Creating Radial Gauge
 
@@ -35,19 +35,19 @@ The <a href = "https://www.telerik.com/blazor-ui/radial-gauge" target="_blank">T
 
 ## Scale
 
-The scale of the Radial Gauge renders the values of the [pointers]({%slug radial-gauge-pointers%}), the [labels]({%slug radial-gauge-labels%}), and different [ranges]({%slug radial-gauge-ranges%}). [See the Scale article for more information...]({%slug radial-gauge-scale%})
+The scale of the Radial Gauge renders the values of the [pointers](slug://radial-gauge-pointers), the [labels](slug://radial-gauge-labels), and different [ranges](slug://radial-gauge-ranges). [See the Scale article for more information...](slug://radial-gauge-scale)
 
 ## Pointers
 
-The distinct values on the scale of the Radial Gauge. [See the Pointers article for more information...]({%slug radial-gauge-pointers%})
+The distinct values on the scale of the Radial Gauge. [See the Pointers article for more information...](slug://radial-gauge-pointers)
 
 ## Ranges
 
-You can use the ranges to visually distinguish multiple pointers from the others on the scale. [See the Ranges article for more information...]({%slug radial-gauge-ranges%})
+You can use the ranges to visually distinguish multiple pointers from the others on the scale. [See the Ranges article for more information...](slug://radial-gauge-ranges)
 
 ## Labels
 
-The labels are rendered on the scale of the Radial Gauge to give information to the users about the value of the pointers. [See the Labels article for more information...]({%slug radial-gauge-labels%})
+The labels are rendered on the scale of the Radial Gauge to give information to the users about the value of the pointers. [See the Labels article for more information...](slug://radial-gauge-labels)
 
 ## Radial Gauge Parameters
 
diff --git a/components/gauges/radial/pointers.md b/components/gauges/radial/pointers.md
index 6a2d0b3821..36c46639ca 100644
--- a/components/gauges/radial/pointers.md
+++ b/components/gauges/radial/pointers.md
@@ -160,7 +160,7 @@ The pointer caps are rendered as per the order they are declared in the markup -
 
 * [Live Demo: Radial Gauge](https://demos.telerik.com/blazor-ui/radialgauge/overview)
 * [Live Demo: Radial Gauge - Multiple pointers](https://demos.telerik.com/blazor-ui/radialgauge/multiple-pointers)
-* [Radial Gauge: Overview]({%slug radial-gauge-overview%})
-* [Radial Gauge: Scale]({%slug radial-gauge-scale%})
-* [Radial Gauge: Labels]({%slug radial-gauge-labels%})
-* [Radial Gauge: Ranges]({%slug radial-gauge-ranges%})
+* [Radial Gauge: Overview](slug://radial-gauge-overview)
+* [Radial Gauge: Scale](slug://radial-gauge-scale)
+* [Radial Gauge: Labels](slug://radial-gauge-labels)
+* [Radial Gauge: Ranges](slug://radial-gauge-ranges)
diff --git a/components/gauges/radial/ranges.md b/components/gauges/radial/ranges.md
index bb3bb9c3f8..be88f98648 100644
--- a/components/gauges/radial/ranges.md
+++ b/components/gauges/radial/ranges.md
@@ -220,8 +220,8 @@ The `Opacity` (`double`) parameter controls the opacity of the range. The value
 ## See Also
 
 * [Live Demo: Radial Gauge](https://demos.telerik.com/blazor-ui/radialgauge/overview)
-* [Radial Gauge: Overview]({%slug radial-gauge-overview%})
-* [Radial Gauge: Scale]({%slug radial-gauge-scale%})
-* [Radial Gauge: Labels]({%slug radial-gauge-labels%})
-* [Radial Gauge: Pointers]({%slug radial-gauge-pointers%})
+* [Radial Gauge: Overview](slug://radial-gauge-overview)
+* [Radial Gauge: Scale](slug://radial-gauge-scale)
+* [Radial Gauge: Labels](slug://radial-gauge-labels)
+* [Radial Gauge: Pointers](slug://radial-gauge-pointers)
 
diff --git a/components/gauges/radial/scale.md b/components/gauges/radial/scale.md
index eea2fcf308..d2ef953f83 100644
--- a/components/gauges/radial/scale.md
+++ b/components/gauges/radial/scale.md
@@ -61,7 +61,7 @@ The Scale of the Radial Gauge renders the values, pointers and labels. You can c
 
 ## MinorUnit and MajorUnit
 
-* The `MajorUnit` (`double`) parameter controls the interval between the major unit divisions of the component. The [labels]({%slug radial-gauge-labels%}) will be rendered next to the `MajorUnit` ticks.
+* The `MajorUnit` (`double`) parameter controls the interval between the major unit divisions of the component. The [labels](slug://radial-gauge-labels) will be rendered next to the `MajorUnit` ticks.
 
 * The `MinorUnit` (`double`) parameter controls the interval between the minor unit divisions of the component.
 
@@ -182,8 +182,8 @@ You can remove the MinorUnit ticks from the rendering of the scale by using the
 * [Live Demo: Radial Gauge](https://demos.telerik.com/blazor-ui/radialgauge/overview)
 * [Live Demo: Radial Gauge - Scale Ranges](https://demos.telerik.com/blazor-ui/radialgauge/scale-ranges)
 * [Live Demo: Radial Gauge - Scale Options](https://demos.telerik.com/blazor-ui/radialgauge/scale-options)
-* [Radial Gauge: Overview]({%slug radial-gauge-overview%})
-* [Radial Gauge: Pointers]({%slug radial-gauge-pointers%})
-* [Radial Gauge: Labels]({%slug radial-gauge-labels%})
-* [Radial Gauge: Ranges]({%slug radial-gauge-ranges%})
+* [Radial Gauge: Overview](slug://radial-gauge-overview)
+* [Radial Gauge: Pointers](slug://radial-gauge-pointers)
+* [Radial Gauge: Labels](slug://radial-gauge-labels)
+* [Radial Gauge: Ranges](slug://radial-gauge-ranges)
 
diff --git a/components/grid/accessibility/overview.md b/components/grid/accessibility/overview.md
index bbeae69450..1425c6f734 100644
--- a/components/grid/accessibility/overview.md
+++ b/components/grid/accessibility/overview.md
@@ -15,9 +15,9 @@ The UI for Blazor Grid component is [WCAG 2.2 AA](https://www.w3.org/TR/WCAG22)
 
 WCAG 2.2 introduces the ["Dragging Movements"](https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements) criterion as an important part of the Operable principle. Its primary goal is to guarantee that any feature reliant on drag actions offers an alternative method that can be executed with a single click, enhancing user accessibility.
 
-In our illustrative example below, we've showcased the grouping and column reorder actions, both achievable through our Column Menu functionality. We've demonstrated also the row reordering achievable through our [Context Menu]({%slug contextmenu-integration%}#context-menu-for-a-grid-row). Our goal is to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
+In our illustrative example below, we've showcased the grouping and column reorder actions, both achievable through our Column Menu functionality. We've demonstrated also the row reordering achievable through our [Context Menu](slug://contextmenu-integration#context-menu-for-a-grid-row). Our goal is to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
 
-The following example demonstrates the [accessibility compliance of the Grid component]({%slug grid-wai-aria-support%}). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch]({%slug accessibility-overview%}#color-contrast).
+The following example demonstrates the [accessibility compliance of the Grid component](slug://grid-wai-aria-support). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch](slug://accessibility-overview#color-contrast).
 
 >caption Grid accessibility compliance example
 
@@ -465,4 +465,4 @@ The following example demonstrates the [accessibility compliance of the Grid com
 
 ## See also
  * [Live demo: Grid Accessibility](https://demos.telerik.com/blazor-ui/grid/keyboard-navigation)
- * [Blazor Grid]({%slug grid-overview%})
\ No newline at end of file
+ * [Blazor Grid](slug://grid-overview)
\ No newline at end of file
diff --git a/components/grid/accessibility/wai-aria-support.md b/components/grid/accessibility/wai-aria-support.md
index 188516447c..97778b6929 100644
--- a/components/grid/accessibility/wai-aria-support.md
+++ b/components/grid/accessibility/wai-aria-support.md
@@ -202,4 +202,4 @@ For details on how the Grid keyboard navigation works, refer to the [Blazor Grid
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/grid/columns/auto-generated.md b/components/grid/columns/auto-generated.md
index a0eee0dcd0..bd0a0b402f 100644
--- a/components/grid/columns/auto-generated.md
+++ b/components/grid/columns/auto-generated.md
@@ -174,7 +174,7 @@ To set explicit position of the Automatically Generated Columns you can use the
 * You can prevent data mutation by setting the `[Editable]` attribute to `false` on fields of your model.
  * The properties that do not have a `setter` or the `setter` is not accessible (private) will not be editable either.
 * You can set custom width to all auto-generated columns through the `ColumnWidth` parameter of `GridAutoGeneratedColumns`. By default they will be equally distributed to fill the width of the Grid.
-    * To enable horizontal scrolling the `ColumnWidth` parameter has to be set so that the sum of all columns is greater than the Grid width. You can find more information in the [Column Width]({%slug grid-columns-width%}) article.
+    * To enable horizontal scrolling the `ColumnWidth` parameter has to be set so that the sum of all columns is greater than the Grid width. You can find more information in the [Column Width](slug://grid-columns-width) article.
 
 >tip To use the attributes listed above the `System.ComponentModel.DataAnnotations` using statement has to be present in the file with your model. With [Popup editing](https://demos.telerik.com/blazor-ui/grid/editing-popup), you can use validation attributes in addition to the customization attributes.
 
@@ -382,8 +382,8 @@ This example shows how to:
 * @[template](/_contentTemplates/common/grid-treelist-autogenerated-columns.md#grid-treelist-autogenerated-columns-limitation)
 
 ## See also
-* [Column Width]({%slug grid-columns-width%})
+* [Column Width](slug://grid-columns-width)
 * [Live Demo: Auto Generated Columns](https://demos.telerik.com/blazor-ui/grid/column-auto-generation)
-* [Selection]({%slug grid-selection-overview%})
-* [Paging]({%slug components/grid/features/paging%})
-* [Blazor Grid]({%slug grid-overview%})
+* [Selection](slug://grid-selection-overview)
+* [Paging](slug://components/grid/features/paging)
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/bound.md b/components/grid/columns/bound.md
index e9f056ca9b..7900819b25 100644
--- a/components/grid/columns/bound.md
+++ b/components/grid/columns/bound.md
@@ -12,7 +12,7 @@ position: 0
 
 This article explains the basics of showing data in a grid and the features of its bound columns.
 
-Important related information are the [Grid data binding fundamentals]({%slug grid-data-binding%}).
+Important related information are the [Grid data binding fundamentals](slug://grid-data-binding).
 
 @[template](/_contentTemplates/common/general-info.md#valuebind-vs-databind-link)
 
@@ -80,60 +80,60 @@ You can use the following properties on bound columns:
 ### Data Binding
 
 * `Field` - (defaults to `null`) - the name of the field in the data source that the column will render as a string (case-sensitive). You can set its as a plain string (`Field="SomeField"`) or to have .NET extract the field name from the model for flat models (`Field=@nameof(MyModelClass.SomeFIeld)`).
-* `FieldType` - when binding the grid to an `object` rather than a real model, set this to the `typeof` the field the column will be displaying. Such a case would be <a href="https://github.com/telerik/blazor-ui/tree/master/grid/binding-to-expando-object" target="_blank">binding to expando objects</a>, using [OnRead with grouping]({%slug components/grid/manual-operations%}#grouping-with-onread) or <a href="https://demos.telerik.com/blazor-ui/grid/data-table" target="_blank">binding to a DataTable</a>.
+* `FieldType` - when binding the grid to an `object` rather than a real model, set this to the `typeof` the field the column will be displaying. Such a case would be <a href="https://github.com/telerik/blazor-ui/tree/master/grid/binding-to-expando-object" target="_blank">binding to expando objects</a>, using [OnRead with grouping](slug://components/grid/manual-operations#grouping-with-onread) or <a href="https://demos.telerik.com/blazor-ui/grid/data-table" target="_blank">binding to a DataTable</a>.
 
 ### Appearance
 
 * `Title` - the text that is rendered in the column header. See the Notes below for its behavior.
-* `DisplayFormat` - the C# format string that is used to render the field value in the cell when the grid is in display mode. Read more in the [Column Display Format]({%slug grid-columns-displayformat%}) article.
-* `TextAlign` - specifies the horizontal alignment of the **data** cells. For example, you can use this property to right-align numeric columns. The property accepts `ColumnTextAlign` enum values (`Left`, `Right` or `Center`). If not set, the text alignment will depend on existing styles on the page, default browser behavior and the text direction. Header cell alignment requires a different approach with `HeaderClass` and [custom CSS]({%slug themes-override%}) - see [Center Grid column header text]({%slug grid-kb-center-column-header-content%}).
-* `OnCellRender` - an event that fires upon the rendering of the Grids columns. For more information read the columns [events]({%slug grid-column-events%}#oncellrender) article.
-* `HeaderClass` - `string` - adds a custom CSS class to the header cell of the column. Use it to apply custom styles or [override the default Grid styles]({%slug themes-override%}).
-* `Reorderable` - (defaults to `true`) - whether the user can [drag to reorder]({%slug components/grid/columns/reorder%}) this column.
-* `Resizable` - (defaults to `true`) - whether the user can [resize]({%slug components/grid/columns/resize%}) this column.
-* `Width` - (defaults to `null`) - the width of the column. See the [Dimensions]({%slug common-features/dimensions%}) article for information about the supported formats. See [Grid Column Width Behavior]({%slug grid-columns-width%}) for detailed information about the Grid behavior with different column width configurations.
-* `MinResizableWidth` - (defaults to `30` and ignores smaller values) - the minimum allowed column width during [user resizing]({%slug components/grid/columns/resize%}). Unlike the `Width` string property, this one is decimal and expects pixel values.
-* `MaxResizableWidth` - (defaults to `0`) - the maximum allowed column width during [user resizing]({%slug components/grid/columns/resize%}). Unlike the `Width` string property, this one is decimal and expects pixel values.
-* `Lockable` - (defaults to `true`) - determines whether the user can [pin the column]({%slug grid-columns-frozen%}) through the [column menu]({%slug grid-column-menu%}).
-* `Locked` - (defaults to `false`) - if this parameter is set to true it [locks]({%slug grid-columns-frozen%}) the column so it is always visible to the user.
-* `Visible` - (defaults to `null`) - if this parameter is set to `false` it [hides]({%slug grid-columns-visible%}) the column from the Grid. Accepts both `bool` and `bool?` types, and `null` is treated like `true`.
-* `Columns` - a nested tag where you can declare [multiple column headers]({%slug grid-columns-multiple-column-headers%}).
-* `ShowColumnMenu` - (defaults to `true`) - if set to false, disables the [column menu]({%slug grid-column-menu%}) for that particular column.
-* `VisibleInColumnChooser` - (defaults to `true`) - if set to false, removes the column from the Column chooser of the [column menu]({%slug grid-column-menu%}).
+* `DisplayFormat` - the C# format string that is used to render the field value in the cell when the grid is in display mode. Read more in the [Column Display Format](slug://grid-columns-displayformat) article.
+* `TextAlign` - specifies the horizontal alignment of the **data** cells. For example, you can use this property to right-align numeric columns. The property accepts `ColumnTextAlign` enum values (`Left`, `Right` or `Center`). If not set, the text alignment will depend on existing styles on the page, default browser behavior and the text direction. Header cell alignment requires a different approach with `HeaderClass` and [custom CSS](slug://themes-override) - see [Center Grid column header text](slug://grid-kb-center-column-header-content).
+* `OnCellRender` - an event that fires upon the rendering of the Grids columns. For more information read the columns [events](slug://grid-column-events#oncellrender) article.
+* `HeaderClass` - `string` - adds a custom CSS class to the header cell of the column. Use it to apply custom styles or [override the default Grid styles](slug://themes-override).
+* `Reorderable` - (defaults to `true`) - whether the user can [drag to reorder](slug://components/grid/columns/reorder) this column.
+* `Resizable` - (defaults to `true`) - whether the user can [resize](slug://components/grid/columns/resize) this column.
+* `Width` - (defaults to `null`) - the width of the column. See the [Dimensions](slug://common-features/dimensions) article for information about the supported formats. See [Grid Column Width Behavior](slug://grid-columns-width) for detailed information about the Grid behavior with different column width configurations.
+* `MinResizableWidth` - (defaults to `30` and ignores smaller values) - the minimum allowed column width during [user resizing](slug://components/grid/columns/resize). Unlike the `Width` string property, this one is decimal and expects pixel values.
+* `MaxResizableWidth` - (defaults to `0`) - the maximum allowed column width during [user resizing](slug://components/grid/columns/resize). Unlike the `Width` string property, this one is decimal and expects pixel values.
+* `Lockable` - (defaults to `true`) - determines whether the user can [pin the column](slug://grid-columns-frozen) through the [column menu](slug://grid-column-menu).
+* `Locked` - (defaults to `false`) - if this parameter is set to true it [locks](slug://grid-columns-frozen) the column so it is always visible to the user.
+* `Visible` - (defaults to `null`) - if this parameter is set to `false` it [hides](slug://grid-columns-visible) the column from the Grid. Accepts both `bool` and `bool?` types, and `null` is treated like `true`.
+* `Columns` - a nested tag where you can declare [multiple column headers](slug://grid-columns-multiple-column-headers).
+* `ShowColumnMenu` - (defaults to `true`) - if set to false, disables the [column menu](slug://grid-column-menu) for that particular column.
+* `VisibleInColumnChooser` - (defaults to `true`) - if set to false, removes the column from the Column chooser of the [column menu](slug://grid-column-menu).
 
 ### Identification
 
-* `Id` - a unique identifier of the Grid Column. Use to associate the column to the respective item in the column chooser when the columns are organized in [sections]({%slug grid-column-menu%}#sections).  
+* `Id` - a unique identifier of the Grid Column. Use to associate the column to the respective item in the column chooser when the columns are organized in [sections](slug://grid-column-menu#sections).  
 * `ref` - the standard Blazor reference name.
 
 ### Data Operations
 
-* `Editable` - (defaults to `true`) - set it to `true` or `false` to allow or prevent [editing]({%slug components/grid/editing/overview%}) of this field. To edit data, you also need a [CommandColumn]({%slug components/grid/columns/command%}).
-* `EditorType` - set the [editor component for `string` or `DateTime` columns]({%slug components/grid/editing/overview%}#customize-the-editor-fields) when an [`EditorTemplate`]({%slug grid-templates-editor%}) is not used.
-* `Filterable` - (defaults to `true`) - set this to `false` so a [filterable]({%slug components/grid/filtering%}) Grid will not let the user filter that particular column.
+* `Editable` - (defaults to `true`) - set it to `true` or `false` to allow or prevent [editing](slug://components/grid/editing/overview) of this field. To edit data, you also need a [CommandColumn](slug://components/grid/columns/command).
+* `EditorType` - set the [editor component for `string` or `DateTime` columns](slug://components/grid/editing/overview#customize-the-editor-fields) when an [`EditorTemplate`](slug://grid-templates-editor) is not used.
+* `Filterable` - (defaults to `true`) - set this to `false` so a [filterable](slug://components/grid/filtering) Grid will not let the user filter that particular column.
 * `FilterEditorType` - (defaults to `GridFilterEditorType.DatePicker`) - determines if the default filtering component of a `DateTime` column will be a DatePicker or a DateTimePicker.
 * `FilterEditorFormat` - sets the `Format` of the filtering component as a `string`. Works for DateTime and numeric columns. Do not use a placeholder (e.g. set `"D"`, not `"{0:D}"`).
-* `Sortable` - (defaults to `true`) - set it to `false` so the user cannot [sort]({%slug components/grid/features/sorting%}) this column.
-* `Groupable` - (defaults to `true`) - whether the user can [group]({%slug components/grid/features/grouping%}) the grid by this column.
+* `Sortable` - (defaults to `true`) - set it to `false` so the user cannot [sort](slug://components/grid/features/sorting) this column.
+* `Groupable` - (defaults to `true`) - whether the user can [group](slug://components/grid/features/grouping) the grid by this column.
 
 ### Templates
 
-* `Template` - this property can also be used as an inner tag and it lets you define the [column display content]({%slug grid-templates-column%}). It can also point to a component name.
+* `Template` - this property can also be used as an inner tag and it lets you define the [column display content](slug://grid-templates-column). It can also point to a component name.
 * `Context` - the standard Blazor context variable name for use inside the inline template.
-* `EditorTemplate` - this property can also be used as an inner tag and it lets you define the [column edit content]({%slug grid-templates-editor%}). It can also point to a component name.
-* `FilterCellTemplate` - this property can also be used as an inner tag and it lets you customize [the Grid Filter Row]({%slug grid-templates-filter%}#filter-row-template). It can also point to a component name.
-* `FilterMenuTemplate` - this property can also be used as an inner tag and it lets you customize [the Grid Filter Menu]({%slug grid-templates-filter%}#filter-menu-template). It can also point to a component name.
+* `EditorTemplate` - this property can also be used as an inner tag and it lets you define the [column edit content](slug://grid-templates-editor). It can also point to a component name.
+* `FilterCellTemplate` - this property can also be used as an inner tag and it lets you customize [the Grid Filter Row](slug://grid-templates-filter#filter-row-template). It can also point to a component name.
+* `FilterMenuTemplate` - this property can also be used as an inner tag and it lets you customize [the Grid Filter Menu](slug://grid-templates-filter#filter-menu-template). It can also point to a component name.
 
 >tip You can find more examples in the rest of the grid documentation and in our [live demos](https://demos.telerik.com/blazor-ui/grid/overview).
 
->tip The Grid can [automatically generate]({%slug grid-columns-automatically-generated%}) its columns out of the public properties of the model.
+>tip The Grid can [automatically generate](slug://grid-columns-automatically-generated) its columns out of the public properties of the model.
 
 ## Notes
 
 * For advanced operations such as grouping, filtering, sorting, you *must* set a `Field` to the column, and the field it points to must be a string or a value type (such as a number, string, DateTime, boolean).
     * If a `Field` is not set the column will not allow filtering, grouping, sorting and editing for the column.
     * If the `Field` points to a custom object or something like an `IDictionary`, `List`, and `Array` errors will be thrown upon those actions because there are no known data operations for reference types in .NET, except for strings. To handle such scenarios you could flatten the collection and the underlying model.
-    * To bind to nested (complex) models (also called navigation properties), use only the name of the field that holds the child class and its own field. For an example, see the [Bind to navigation properties in complex objects]({%slug grid-use-navigation-properties%}) article.
+    * To bind to nested (complex) models (also called navigation properties), use only the name of the field that holds the child class and its own field. For an example, see the [Bind to navigation properties in complex objects](slug://grid-use-navigation-properties) article.
 
 * The `Field` of the column must point to a property in the model that has a public getter so that the grid can display data. For editing to be enabled, the property must have a public setter. For example:
 
@@ -144,7 +144,7 @@ You can use the following properties on bound columns:
             public int NonWorkingField // no public getter, so the grid cannot display this
         }
 
-* **Foreign Keys** - using foreign tables and keys is usually done through the grid templates. You can read more and find examples in the [Grid - Foreign Key]({%slug grids-foreign-key%}) KnowledgeBase article.
+* **Foreign Keys** - using foreign tables and keys is usually done through the grid templates. You can read more and find examples in the [Grid - Foreign Key](slug://grids-foreign-key) KnowledgeBase article.
 
 * The grid skips fields marked with the [`IgnoreDataMemberAttribute`](https://docs.microsoft.com/en-us/dotnet/api/system.runtime.serialization.ignoredatamemberattribute) when performing CUD operations. Its presence indicates that this property does not need to be part of the serialized data anyway, and skipping such fields allows [Lazy Loading Proxies in EF](https://docs.microsoft.com/en-us/dotnet/api/microsoft.entityframeworkcore.proxiesextensions.uselazyloadingproxies?view=efcore-3.1) to work.
 
@@ -155,7 +155,7 @@ You can use the following properties on bound columns:
 * If you want to prevent data mutation for a specific property you can set the `Editable` parameter of the GridColumn or the `[Editable]` data annotation attribute to `false` for the desired model field.
     * Columns generated out of model properties that do not have a `setter` or it is not accessible (private) will not be editable too.
 
-* The Grid uses `Activator.CreateInstance<TItem>();` to generate a new item when an Insert action is invoked, so the Model should have a Parameterless constructor defined. A workaround might be [invoking Insert through the grid state]({%slug grid-kb-add-edit-state%}) and creating the object with your own code.
+* The Grid uses `Activator.CreateInstance<TItem>();` to generate a new item when an Insert action is invoked, so the Model should have a Parameterless constructor defined. A workaround might be [invoking Insert through the grid state](slug://grid-kb-add-edit-state) and creating the object with your own code.
 
 * The `Data` collection of the grid must contain instances of only one model type. You cannot bind the grid to a base class and populate its data with instances of inherited classes (neither one, nor more than one type) - extra fields from such inherited classes may not work or may even throw exceptions because the grid will not know about them when its `Data` collection is of the base class type.
 
@@ -167,4 +167,4 @@ You can use the following properties on bound columns:
 ## See Also
 
   * [Live Demo: Grid Columns](https://demos.telerik.com/blazor-ui/grid/columns)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/checkbox.md b/components/grid/columns/checkbox.md
index 089b752afe..33bf56702a 100644
--- a/components/grid/columns/checkbox.md
+++ b/components/grid/columns/checkbox.md
@@ -12,21 +12,21 @@ position: 2
 
 This article describes the configuration parameters of the Blazor `GridCheckboxColumn`.
 
-The `GridCheckboxColumn` provides an additional way for users to [select Grid rows]({%slug grid-selection-overview%}). By default, users can select and unselect rows by clicking anywhere on them.
+The `GridCheckboxColumn` provides an additional way for users to [select Grid rows](slug://grid-selection-overview). By default, users can select and unselect rows by clicking anywhere on them.
 
-If you need checkboxes to display or edit boolean values, then use a [Grid column template]({%slug grid-templates-column%}) instead.
+If you need checkboxes to display or edit boolean values, then use a [Grid column template](slug://grid-templates-column) instead.
 
 ## Parameters
 
-The Grid checkbox column has the following exclusive parameters. For other available parameters, see the [appearance settings of bound columns]({%slug components/grid/columns/bound%}#appearance).
+The Grid checkbox column has the following exclusive parameters. For other available parameters, see the [appearance settings of bound columns](slug://components/grid/columns/bound#appearance).
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
 | `CheckBoxOnlySelection` | `bool` | Determines if row selection occurs only on checkbox clicks. By default, user can select rows by clicking anywhere, except on command buttons. |
-| `SelectAll` | `bool` <br /> (`true`) | Determines if the column header renders a checkbox to select all rows. Set this to `false` if the [Grid `SelectionMode` is `Single`]({%slug grid-selection-overview%}#use-single-or-multiple-selection). The `SelectAll` parameter has no effect when the checkbox column has a [`HeaderTemplate`](#header-template). |
-| `SelectAllMode` | `GridSelectAllMode` enum <br /> (`Current`) | Determines if the header cell checkbox selects all rows on the current page, or all rows in the Grid. `Current` selects the visible rows on the current page. `All` selects all the data items, including ones that may be currently filtered out. `All` requires the [Grid to be data-bound via its `Data` parameter, and not `OnRead`]({%slug common-features-data-binding-overview%}#how-to-provide-data). When using `OnRead`, the two `SelectAllMode`s behave identically, because the Grid controls only one page of items. |
+| `SelectAll` | `bool` <br /> (`true`) | Determines if the column header renders a checkbox to select all rows. Set this to `false` if the [Grid `SelectionMode` is `Single`](slug://grid-selection-overview#use-single-or-multiple-selection). The `SelectAll` parameter has no effect when the checkbox column has a [`HeaderTemplate`](#header-template). |
+| `SelectAllMode` | `GridSelectAllMode` enum <br /> (`Current`) | Determines if the header cell checkbox selects all rows on the current page, or all rows in the Grid. `Current` selects the visible rows on the current page. `All` selects all the data items, including ones that may be currently filtered out. `All` requires the [Grid to be data-bound via its `Data` parameter, and not `OnRead`](slug://common-features-data-binding-overview#how-to-provide-data). When using `OnRead`, the two `SelectAllMode`s behave identically, because the Grid controls only one page of items. |
 | `Title` | `string` | The text in the checkbox column's header. The title renders only when `SelectAll` is `false`. |
 
 >note  If the Grid is bound to `IQueriable`, a header checkbox with an `All` option will execute the query over all the data. This may be a performance hit.
@@ -35,9 +35,9 @@ The Grid checkbox column has the following exclusive parameters. For other avail
 
 The `HeaderTemplate` of the Grid checkbox column enables developers to customize the header cell's rendering and checkbox behavior.
 
-On a side note, it is possible to [center the checkboxes in the `GridCheckboxColumn`]({%slug grid-kb-center-checkbox-column%}) without using a template.
+On a side note, it is possible to [center the checkboxes in the `GridCheckboxColumn`](slug://grid-kb-center-checkbox-column) without using a template.
 
-The example below doesn't take into account sorting, filtering and paging. If the Grid has any data operations enabled, replace `GridData` in the custom logic below with the [data collection, which the Grid is currently showing]({%slug grid-kb-get-filtered-data%}).
+The example below doesn't take into account sorting, filtering and paging. If the Grid has any data operations enabled, replace `GridData` in the custom logic below with the [data collection, which the Grid is currently showing](slug://grid-kb-get-filtered-data).
 
 >caption Grid Checkbox Column Header Template
 
@@ -185,6 +185,6 @@ The example below doesn't take into account sorting, filtering and paging. If th
 ## See Also
 
 * [Live Demo: Grid Selection](https://demos.telerik.com/blazor-ui/grid/row-selection)
-* [Grid Selection Overview]({%slug grid-selection-overview%})
-* [Blazor Grid]({%slug grid-overview%})
+* [Grid Selection Overview](slug://grid-selection-overview)
+* [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/columns/command.md b/components/grid/columns/command.md
index 081cb8d418..284c684897 100644
--- a/components/grid/columns/command.md
+++ b/components/grid/columns/command.md
@@ -10,7 +10,7 @@ position: 1
 
 # Grid Command Column
 
-The command column of a grid allows you to initiate [inline]({%slug components/grid/editing/inline%}) or [popup]({%slug components/grid/editing/popup%}) editing, or to execute your own commands.
+The command column of a grid allows you to initiate [inline](slug://components/grid/editing/inline) or [popup](slug://components/grid/editing/popup) editing, or to execute your own commands.
 
 To define it, add a `GridCommandColumn` in the `GridColumns` collection of a grid. The command column takes a collection of `GridCommandButton` instances that invoke the commands. It also provides the data item `context` and a `Title` property to set its header text.
 
@@ -32,11 +32,11 @@ The section describes the available features and their use.
 The `GridCommandButton` tag offers the following features:
 
 * `Command` - the command that will be invoked. Can be one of the built-in commands (see below), or a custom command name.
-* `Icon` - the command button icon, which can be a font icon, an SVG icon or a custom icon. Use in the same way as the [Button component `Icon`]({%slug button-icons%}).
-* `OnClick` - the event handler that the button will fire. If used on a built-in command, this handler will fire before the [corresponding CRUD event]({%slug components/grid/editing/overview%}). Cancelling it will prevent the built-in CRUD event from firing.
+* `Icon` - the command button icon, which can be a font icon, an SVG icon or a custom icon. Use in the same way as the [Button component `Icon`](slug://button-icons).
+* `OnClick` - the event handler that the button will fire. If used on a built-in command, this handler will fire before the [corresponding CRUD event](slug://components/grid/editing/overview). Cancelling it will prevent the built-in CRUD event from firing.
 * `ShowInEdit` - a boolean property indicating whether the button is only visible while the user is editing/inserting data.
 * `ChildContent` - the text the button will render. You can also place it between the command button's opening and closing tags.
-* You can customize the appearance of the `GridCommandButton` by applying the [appearance attributes available for the TelerikButton]({%slug button-appearance%}).
+* You can customize the appearance of the `GridCommandButton` by applying the [appearance attributes available for the TelerikButton](slug://button-appearance).
 
 ### Built-in Commands
 
@@ -44,11 +44,11 @@ There are four built-in commands:
 
 * `Add` - initiates the creation of a new item.
 * `Edit` - initiates the inline or popup editing (depending on the GridEditMode configuration of the grid).
-* `Delete` - initiates the deletion of an existing item. You can also enable a [delete confirmation dialog]({%slug grid-delete-confirmation%}).
+* `Delete` - initiates the deletion of an existing item. You can also enable a [delete confirmation dialog](slug://grid-delete-confirmation).
 * `Save` - performs the actual update operation after the data has been changed. Triggers the `OnUpdate` or `OnCreate` event so you can perform the data source operation. Which event is triggered depends on whether the item was created or edited.
 * `Cancel` - aborts the current operation (edit or insert).
 
-> The `Add` and `Edit` commands require [enabled editing]({%slug components/grid/editing/overview%}).
+> The `Add` and `Edit` commands require [enabled editing](slug://components/grid/editing/overview).
 
 ### The OnClick handler
 
@@ -64,7 +64,7 @@ The `OnClick` handler of the commands receives an argument of type `GridCommandE
 
 The command column provides access to the data item via `context`. This may be useful for conditional statements or passing parameters to custom business logic.
 
-Use a **named** context variable to avoid errors when nesting components or `RenderFragment`s in general. In such cases, the exception will be similar to ["Child content element ... uses the same parameter name ('context') as enclosing child content element ..."]({%slug nest-renderfragment%}).
+Use a **named** context variable to avoid errors when nesting components or `RenderFragment`s in general. In such cases, the exception will be similar to ["Child content element ... uses the same parameter name ('context') as enclosing child content element ..."](slug://nest-renderfragment).
 
 >caption Using GridCommandColumn context
 
@@ -226,4 +226,4 @@ The following code example demonstrates declarations and handling.
 ## See Also
 
   * [Live Demo: Grid Command Column](https://demos.telerik.com/blazor-ui/grid/editing-inline)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/display-format.md b/components/grid/columns/display-format.md
index e317dc1d42..8d0f61c4ea 100644
--- a/components/grid/columns/display-format.md
+++ b/components/grid/columns/display-format.md
@@ -65,4 +65,4 @@ position: 2
 ## See Also
 
   * [Live Demo: Cell Formatting](https://demos.telerik.com/blazor-ui/grid/cell-formatting)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/events.md b/components/grid/columns/events.md
index 2ed2fd2bfe..47c132def8 100644
--- a/components/grid/columns/events.md
+++ b/components/grid/columns/events.md
@@ -146,7 +146,7 @@ This event fires upon the rendering of the Grids columns. It receives an argumen
 
 ## See Also
 
-  * [Grid Overview]({%slug grid-overview%})
-  * [Grid Events]({%slug grid-events%})
-  * [Manual Data Source Operations]({%slug components/grid/manual-operations%})
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Grid Overview](slug://grid-overview)
+  * [Grid Events](slug://grid-events)
+  * [Manual Data Source Operations](slug://components/grid/manual-operations)
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/frozen.md b/components/grid/columns/frozen.md
index 922e4b1f6f..963cbdb736 100644
--- a/components/grid/columns/frozen.md
+++ b/components/grid/columns/frozen.md
@@ -14,7 +14,7 @@ The Grid lets you freeze one or more columns. This will allow the user to scroll
 
 To enable the column freezing, set the `Locked` parameter of the column to `true`.
 
-If the column you want to freeze is not the first in the list, the grid must be scrollable. This requires that there are enough columns with their `Width` set so that the grid has a horizontal scrollbar (the sum of the Widths of the columns exceeds the Width of the grid). You can read more about the scrolling behavior of the grid in the [Grid Column Width Behavior]({%slug grid-columns-width%}) article.
+If the column you want to freeze is not the first in the list, the grid must be scrollable. This requires that there are enough columns with their `Width` set so that the grid has a horizontal scrollbar (the sum of the Widths of the columns exceeds the Width of the grid). You can read more about the scrolling behavior of the grid in the [Grid Column Width Behavior](slug://grid-columns-width) article.
 
 This article you can observe Freezing different columns. The examples are separated into types for clarity:
 * [Frozen first and last columns](#frozen-first-and-last-columns)
@@ -175,4 +175,4 @@ The frozen columns pose some requirements:
 
 ## See also
  * [Live demo: Frozen Columns](https://demos.telerik.com/blazor-ui/grid/frozen-columns)
- * [Blazor Grid]({%slug grid-overview%})
+ * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/menu.md b/components/grid/columns/menu.md
index 5e0a14a63b..2fe48117e0 100644
--- a/components/grid/columns/menu.md
+++ b/components/grid/columns/menu.md
@@ -10,7 +10,7 @@ position: 20
 
 # Column Menu
 
-The Grid allows you to set up a menu for its columns. It enables you to perform high-level customization like [sorting]({%slug components/grid/features/sorting%}), [filtering]({%slug components/grid/filtering%}), [showing or hiding]({%slug grid-columns-visible%}) columns and [freezing or unfreezing]({%slug grid-columns-frozen%}) them.
+The Grid allows you to set up a menu for its columns. It enables you to perform high-level customization like [sorting](slug://components/grid/features/sorting), [filtering](slug://components/grid/filtering), [showing or hiding](slug://grid-columns-visible) columns and [freezing or unfreezing](slug://grid-columns-frozen) them.
 
 >caption In this article:
 * [Basics](#basics)
@@ -97,7 +97,7 @@ The **Apply** button sets the column visibility according to the current checkbo
 
 To control whether filtering is possible from the Column Menu set the `FilterMode` parameter of the `GridColumnMenuSettings` tag to a member of the `ColumnMenuFilterMode` enum:
 
-* `None`—disables the filtering from the Column Menu. This is the recommended option if you use the [`FilterRow` mode]({%slug grid-filter-row%}).
+* `None`—disables the filtering from the Column Menu. This is the recommended option if you use the [`FilterRow` mode](slug://grid-filter-row).
 * `FilterMenu`—enables a filter menu to apply filtering.
 
 ### Groupable
@@ -122,7 +122,7 @@ You can organize the columns in the [Column Chooser](#column-chooser) in differe
 
 1. Use the `GridColumnMenuChooser` tag (child to the `GridColumnMenuSettings`)
 
-1. Add the [Template]({%slug grid-templates-column-chooser%}) tag
+1. Add the [Template](slug://grid-templates-column-chooser) tag
 
 1. Provide `GridColumnMenuChooserGroup` which is a collection of the columns that should be in the section
     
@@ -130,7 +130,7 @@ You can organize the columns in the [Column Chooser](#column-chooser) in differe
 
 1. Use the `GridColumnMenuChooserItem` to denote the columns that should be in the group
 
-    * You must use set the `ColumnId` parameter of the `GridColumnMenuChooserItem` to the value of the [`Id`]({%slug components/grid/columns/bound%}#grid-bound-column-parameters) parameter of the corresponding Grid Column.
+    * You must use set the `ColumnId` parameter of the `GridColumnMenuChooserItem` to the value of the [`Id`](slug://components/grid/columns/bound#grid-bound-column-parameters) parameter of the corresponding Grid Column.
     
     * If you set the `Title` parameter of the `GridColumnMenuChooserItem` it will override the value of the `Title` parameter of the corresponding Grid Column. 
 
@@ -250,11 +250,11 @@ The columns in the Column Chooser are divided into sections. The Lockable option
 
 * Applying settings to a Grid column like `Filterable="false"`, `Sortable="false"`, `Lockable="false"` will take precedence over the common settings applied in the `<GridColumnMenuSettings>` and disable the above-mentioned functionalities for the corresponding column.
 
-* If the Grid has a [frozen]({%slug grid-columns-frozen%}) column (`Locked="true"`), that column cannot be unfrozen from the column menu.
+* If the Grid has a [frozen](slug://grid-columns-frozen) column (`Locked="true"`), that column cannot be unfrozen from the column menu.
 
-* If you are using the [Column Chooser Template]({%slug grid-templates-column-chooser%}) or you are grouping the columns into [sections](#sections), it is recommended to add the `Title` parameter to all Grid Columns.
+* If you are using the [Column Chooser Template](slug://grid-templates-column-chooser) or you are grouping the columns into [sections](#sections), it is recommended to add the `Title` parameter to all Grid Columns.
 
 ## See Also
   * [Live Demo: Grid Column Menu](https://demos.telerik.com/blazor-ui/grid/column-menu)
   * [Live Demo: Grid Custom Column Menu](https://demos.telerik.com/blazor-ui/grid/custom-column-menu)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/multi-column-headers.md b/components/grid/columns/multi-column-headers.md
index acdaf6f422..aba6b937bd 100644
--- a/components/grid/columns/multi-column-headers.md
+++ b/components/grid/columns/multi-column-headers.md
@@ -14,7 +14,7 @@ The Grid allows you to stack several columns under one header to visually group
 
 To use multiple column headers:
 
-1. Define a `GridColumn` instance for each multi-column header you want. Set its `Title` or [`HeaderTemplate`]({%slug grid-templates-column-header%}).
+1. Define a `GridColumn` instance for each multi-column header you want. Set its `Title` or [`HeaderTemplate`](slug://grid-templates-column-header).
 1. Under its `<Columns>` nested tag, add the columns you want it to contain.
 
 While you can set all the parameters of such a multi-column header column, it only supports and works with the `Title`, and the nested `HeaderTemplate` and `Columns` tags (templates).
@@ -140,4 +140,4 @@ The following code snippet shows how you can group columns in the Grid in multi-
 ## See Also
 
   * [Live Demo: Multi-Column Headers](https://demos.telerik.com/blazor-ui/grid/multi-column-headers)
-  * [Blazor Grid]({%slug grid-overview%})
\ No newline at end of file
+  * [Blazor Grid](slug://grid-overview)
\ No newline at end of file
diff --git a/components/grid/columns/reorder.md b/components/grid/columns/reorder.md
index ec9ada2cbb..2205bfd0bb 100644
--- a/components/grid/columns/reorder.md
+++ b/components/grid/columns/reorder.md
@@ -72,4 +72,4 @@ To prevent the user from moving a certain column, set the column's `Reorderable`
 ## See Also
 
   * [Live Demo: Column Reordering](https://demos.telerik.com/blazor-ui/grid/column-reordering)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/resize.md b/components/grid/columns/resize.md
index cd832dd5cf..c01ee4519b 100644
--- a/components/grid/columns/resize.md
+++ b/components/grid/columns/resize.md
@@ -29,7 +29,7 @@ Here a few notes on the resizing behavior:
 
 * If the column `Width` is less than `MinResizableWidth` and the user tries to resize the column, it will snap to its minimum width.
 * Similarly, if the column `Width` is greater than `MaxResizableWidth`, the column will snap to its maximum width.
-* In [multi-column header scenarios]({%slug grid-columns-multiple-column-headers%}), you may set `MinResizableWidth` or `MaxResizableWidth` to child columns only. Setting these attributes to parent columns will have no effect.
+* In [multi-column header scenarios](slug://grid-columns-multiple-column-headers), you may set `MinResizableWidth` or `MaxResizableWidth` to child columns only. Setting these attributes to parent columns will have no effect.
 
 ## Autofit Columns
 
@@ -37,7 +37,7 @@ When column resizing is enabled, a double click on the resize handle between the
 
 The Grid also exposes methods to programmatically resize columns to fit their contents:
 
-* `AutoFitColumnAsync(string id)`—Autofits the column with the specified [`Id` attribute]({% slug components/grid/columns/bound%}#identification).
+* `AutoFitColumnAsync(string id)`—Autofits the column with the specified [`Id` attribute](slug://components/grid/columns/bound#identification).
 * `AutoFitColumnsAsync(IEnumerable<string> ids)`—Autofits multiple columns at once.
 * `AutoFitAllColumnsAsync()`—Autofits all applicable columns. For example, this method does not affect the hierarchy expand/collapse columns.
 
@@ -50,11 +50,11 @@ Programmatic autofitting works even if column resizing is disabled.
 
 The known limitations of the Autofit Columns feature include:
 
-* Autofitting the columns is not supported with [Virtual Columns]({%slug grid-columns-virtual%}).
+* Autofitting the columns is not supported with [Virtual Columns](slug://grid-columns-virtual).
 
 * Autofitting the columns on initial load of the Grid is not supported.
 
->important Trying to autofit the columns on initial load will throw a `NullReferenceException`. Check the [AutoFit all Grid columns on initial load knowledge-based article]({%slug grid-autofit-columns-on-initial-load%}) to see a possible solution to achieve this behavior. 
+>important Trying to autofit the columns on initial load will throw a `NullReferenceException`. Check the [AutoFit all Grid columns on initial load knowledge-based article](slug://grid-autofit-columns-on-initial-load) to see a possible solution to achieve this behavior. 
 
 
 ## Example
@@ -141,4 +141,4 @@ The known limitations of the Autofit Columns feature include:
 ## See Also
 
   * [Live Demo: Column Resizing](https://demos.telerik.com/blazor-ui/grid/column-resizing)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/virtual.md b/components/grid/columns/virtual.md
index 88779877c2..f8a4cd68f2 100644
--- a/components/grid/columns/virtual.md
+++ b/components/grid/columns/virtual.md
@@ -10,7 +10,7 @@ position: 5
 
 # Virtualized Columns
 
-The Telerik Blazor Grid provides Virtual Scrolling for its Columns. This means that columns and the corresponding data will be rendered only for the currently visible viewport. When changing the [Page]({%slug components/grid/features/paging%}) or [Sorting]({%slug components/grid/features/sorting%}) the Grid, fewer elements are rendered which improves the responsiveness and the overall user experience.
+The Telerik Blazor Grid provides Virtual Scrolling for its Columns. This means that columns and the corresponding data will be rendered only for the currently visible viewport. When changing the [Page](slug://components/grid/features/paging) or [Sorting](slug://components/grid/features/sorting) the Grid, fewer elements are rendered which improves the responsiveness and the overall user experience.
 
 This article provides the following sections:
 * [Basics](#basics)
@@ -28,7 +28,7 @@ To enable Virtualized Columns:
 
 1. Set the `ColumnVirtualization` parameter of the Grid to `true`.
 1. Set the `Width` parameter of all columns in `px` so that the total sum is greater than the `Width` of the Grid.
-    * This will enable horizontal scrollbar which is required. You can read more about the scrolling behavior of the grid in the [Grid Column Width Behavior]({%slug grid-columns-width%}) article.
+    * This will enable horizontal scrollbar which is required. You can read more about the scrolling behavior of the grid in the [Grid Column Width Behavior](slug://grid-columns-width) article.
 1. Set the `RowHeight` so that the content of all cells fits in the row. For more information see the [Notes](#notes) section.
 1. Set the `Height` of the Grid in `px`. For more information see the [Notes](#notes) section.
 1. Set the `Width` parameter of the Grid in `px`.
@@ -132,7 +132,7 @@ The column virtualization can work together with other similar features in the g
 
 ### Virtualized Columns and Rows
 
-You can use Virtualized Columns and Rows together. More information on Virtual Rows can be found in the [Virtual Scrolling]({%slug components/grid/virtual-scrolling%}) article.
+You can use Virtualized Columns and Rows together. More information on Virtual Rows can be found in the [Virtual Scrolling](slug://components/grid/virtual-scrolling) article.
 
 >caption Use Virtualized Columns and Rows together
 
@@ -216,7 +216,7 @@ You can use Virtualized Columns and Rows together. More information on Virtual R
 
 ### Virtualized Autogenerated Columns
 
-Column virtualization is commonly used when you have many columns. You may not have to declare them yourself, the grid can do this for you through its [Automatically Generated Columns]({%slug grid-columns-automatically-generated%}) feature.
+Column virtualization is commonly used when you have many columns. You may not have to declare them yourself, the grid can do this for you through its [Automatically Generated Columns](slug://grid-columns-automatically-generated) feature.
 
 >note In order to add Virtualized Autogenerated Columns, the `ColumnWidth` parameter must be set in pixels.
 
@@ -313,7 +313,7 @@ Column virtualization is commonly used when you have many columns. You may not h
 
 ## See also
  * [Live demo: Virtual Columns](https://demos.telerik.com/blazor-ui/grid/column-virtualization)
- * [Virtual Scrolling]({%slug components/grid/virtual-scrolling%})
- * [Grid Column Width Behavior]({%slug grid-columns-width%})
- * [Automatically Generated Columns]({%slug grid-columns-automatically-generated%})
- * [Blazor Grid]({%slug grid-overview%})
+ * [Virtual Scrolling](slug://components/grid/virtual-scrolling)
+ * [Grid Column Width Behavior](slug://grid-columns-width)
+ * [Automatically Generated Columns](slug://grid-columns-automatically-generated)
+ * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/visible.md b/components/grid/columns/visible.md
index 2653ca2a81..11b868c2da 100644
--- a/components/grid/columns/visible.md
+++ b/components/grid/columns/visible.md
@@ -67,12 +67,12 @@ To hide a Grid column set its `Visible` parameter to `false`. To hide a column b
 
 Non-visible columns (`Visible="false"`) will have the following behavior:
 
-* Will not be [editable]({%slug components/grid/editing/overview%}).
-* Will not be exported in [excel export]({%slug grid-export-excel%}).
-* Will not be visible when the data is [grouped]({%slug components/grid/features/grouping%}).
-* [Templates]({%slug components/grid/features/templates%}) will not be rendered.
-    * When using [Row Template]({%slug grid-templates-row%}) the visiblity of the column should be implemented by the application in the row template itself - the grid can only toggle the visibility of the header.
-* You can control the visibility of the column through the [Grid State]({%slug grid-state%}).
+* Will not be [editable](slug://components/grid/editing/overview).
+* Will not be exported in [excel export](slug://grid-export-excel).
+* Will not be visible when the data is [grouped](slug://components/grid/features/grouping).
+* [Templates](slug://components/grid/features/templates) will not be rendered.
+    * When using [Row Template](slug://grid-templates-row) the visiblity of the column should be implemented by the application in the row template itself - the grid can only toggle the visibility of the header.
+* You can control the visibility of the column through the [Grid State](slug://grid-state).
 
 
 ## Examples
@@ -260,4 +260,4 @@ This example shows hiding a column based on a simple condition in its data. You
 ## See Also
 
   * [Live Demo: Visible Columns](https://demos.telerik.com/blazor-ui/grid/columns)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/columns/width.md b/components/grid/columns/width.md
index 577e3ea76e..048ef29a85 100644
--- a/components/grid/columns/width.md
+++ b/components/grid/columns/width.md
@@ -12,7 +12,7 @@ position: 4
 
 This article explains how the grid column width behaves depending on the settings applied by the developer.
 
-You can set the grid column `Width` parameter in any CSS unit, such as `px`, `%`, `vw`, `em`, `rem`. You can read more on how to set sizes in Telerik components in the [Dimensions]({%slug common-features/dimensions%}) article. You must, however, provide the unit so that the browser can understand it.
+You can set the grid column `Width` parameter in any CSS unit, such as `px`, `%`, `vw`, `em`, `rem`. You can read more on how to set sizes in Telerik components in the [Dimensions](slug://common-features/dimensions) article. You must, however, provide the unit so that the browser can understand it.
 
 With regard to the widths of its columns, the scrollable (default) Grid typically behaves as any regular HTML table with a `table-layout: fixed` and `width: 100%`.
 
@@ -26,9 +26,9 @@ With regard to the widths of its columns, the scrollable (default) Grid typicall
 
 * When no column widths are set, the available width is distributed evenly between all Grid columns.
 
-* To allow the users to auto-fit the column widths to the content, enable [column resizing]({%slug components/grid/columns/resize%}) - a double click on the border between the headers will have the grid adjust the column width according to the size of the data, headers and footers content. It is also possible to [auto-fit columns programmatically]({%slug components/grid/columns/resize%}#autofit-columns).
+* To allow the users to auto-fit the column widths to the content, enable [column resizing](slug://components/grid/columns/resize) - a double click on the border between the headers will have the grid adjust the column width according to the size of the data, headers and footers content. It is also possible to [auto-fit columns programmatically](slug://components/grid/columns/resize#autofit-columns).
 
 # See Also
 
-* [Column Resizing]({%slug components/grid/columns/resize%})
-* [Blazor Grid]({%slug grid-overview%})
+* [Column Resizing](slug://components/grid/columns/resize)
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/data-binding.md b/components/grid/data-binding.md
index 1541aeee5f..e6c5c058d9 100644
--- a/components/grid/data-binding.md
+++ b/components/grid/data-binding.md
@@ -19,23 +19,23 @@ There are two main steps to data bind a Grid:
 
 1. **Provide the data.** There are two ways to do this:
     * Set the Grid **`Data`** parameter. In this case, the Grid will hold **all the data** and will perform all data operations internally (sorting, paging, filtering, grouping, aggregates, etc.). This approach provides **simplicity**.
-    * Use the Grid [`OnRead` event]({%slug common-features-data-binding-onread%}) and pass the data to the event argument. In this case, the Grid will hold **only the current page** of data items. The component will fire `OnRead` again for every data operation and expect to receive the expected items. This approach provides **flexibility** and **performance** if the total number of data items is large. Also check the [Grid-specific **`OnRead`** event article]({%slug components/grid/manual-operations%}).
+    * Use the Grid [`OnRead` event](slug://common-features-data-binding-onread) and pass the data to the event argument. In this case, the Grid will hold **only the current page** of data items. The component will fire `OnRead` again for every data operation and expect to receive the expected items. This approach provides **flexibility** and **performance** if the total number of data items is large. Also check the [Grid-specific **`OnRead`** event article](slug://components/grid/manual-operations).
 1. **Configure the Grid to display the data.** Again, there are two ways to do this:
-    * [Generate some or all columns automatically]({%slug grid-columns-automatically-generated%}). The autogenerated columns will depend on the Model properties and Data Annotations.
-    * Define [GridColumn]({%slug components/grid/columns/bound%}) instances and set their `Field` parameter. The field is required for data and CRUD operations. The field type determines the sorting, filtering and editing behavior. Some columns do not need a field, for example the [CommandColumn]({%slug components/grid/columns/command%}). To customize data rendering and column behavior, use [templates]({%slug components/grid/features/templates%}) and all the [column settings]({%slug components/grid/columns/bound%}#grid-bound-column-parameters). 
+    * [Generate some or all columns automatically](slug://grid-columns-automatically-generated). The autogenerated columns will depend on the Model properties and Data Annotations.
+    * Define [GridColumn](slug://components/grid/columns/bound) instances and set their `Field` parameter. The field is required for data and CRUD operations. The field type determines the sorting, filtering and editing behavior. Some columns do not need a field, for example the [CommandColumn](slug://components/grid/columns/command). To customize data rendering and column behavior, use [templates](slug://components/grid/features/templates) and all the [column settings](slug://components/grid/columns/bound#grid-bound-column-parameters). 
 
 
 ## Data Sources and Scenarios
 
 The following list of resources provides examples for data binding a grid in various scenarios:
 
-* Basic **example**, tutorial **video** and **notes** - [Grid Bound Columns Overview]({%slug components/grid/columns/bound%}). Also lists the features (parameters) of a bound column.
+* Basic **example**, tutorial **video** and **notes** - [Grid Bound Columns Overview](slug://components/grid/columns/bound). Also lists the features (parameters) of a bound column.
 
-* **Optimizing the data source queries** - see the [Notes]({%slug components/grid/columns/bound%}#notes) section in the article above. In a server-side app, an `IQueryable` that ties to an appropriate context (such as EntityFramework) that can optimize the LINQ queries the grid generates is a quick option. For full control, use the [OnRead event]({%slug components/grid/manual-operations%}).
+* **Optimizing the data source queries** - see the [Notes](slug://components/grid/columns/bound#notes) section in the article above. In a server-side app, an `IQueryable` that ties to an appropriate context (such as EntityFramework) that can optimize the LINQ queries the grid generates is a quick option. For full control, use the [OnRead event](slug://components/grid/manual-operations).
 
-* **SQL** (or any other) **database** - you can find examples in our [online demos](https://demos.telerik.com/blazor-ui/grid/overview). You can see an offline version of the demos project in the `demos` folder of your installation ([automated]({%slug installation/msi%}) or [archive]({%slug installation/zip%})). They showcase an EntityFramework context using an SQL database that provides data to a grid through a service, which is a common architecture for decoupling the front-end from the actual data source that you can apply to any database.
+* **SQL** (or any other) **database** - you can find examples in our [online demos](https://demos.telerik.com/blazor-ui/grid/overview). You can see an offline version of the demos project in the `demos` folder of your installation ([automated](slug://installation/msi) or [archive](slug://installation/zip)). They showcase an EntityFramework context using an SQL database that provides data to a grid through a service, which is a common architecture for decoupling the front-end from the actual data source that you can apply to any database.
 
-    * The **CRUD sample project** our extensions for [Visual Studio]({%slug getting-started-vs-integration-new-project%}) and [Visual Studio Code]({%slug getting-started-vs-code-integration-overview%}) can generate for you showcases a similar architecture that you can use as a starting point.
+    * The **CRUD sample project** our extensions for [Visual Studio](slug://getting-started-vs-integration-new-project) and [Visual Studio Code](slug://getting-started-vs-code-integration-overview) can generate for you showcases a similar architecture that you can use as a starting point.
     
     * The [Blazing Coffee sample application](https://github.com/telerik/blazor-ui/tree/master/sample-applications/blazing-coffee) shows how to provide data from a SQL (uses SQLite) database to the Grid using Entity Framework Core services.
 
@@ -43,21 +43,21 @@ The following list of resources provides examples for data binding a grid in var
 
 * **OData** data source - an extension method we provide lets you make OData v4 queries as shown in the following example: [Grid and OData](https://github.com/telerik/blazor-ui/tree/master/grid/odata).
 
-* **DataTable**, **ExpandoObject** collection - If you don't have actual strongly typed models (yet) and you use `ExpandoObject`, or your backend comes from an older technology and still returns `DataTable`s, the grid can accommodate such dynamic data types. You can get started from our examples on how to [bind the Grid to ExpandoObject collection]({%slug grid-kb-binding-to-expando-object%}) and [bind the Grid to a DataTable](https://demos.telerik.com/blazor-ui/grid/data-table), which also support [editing]({%slug components/grid/editing/overview%}).
+* **DataTable**, **ExpandoObject** collection - If you don't have actual strongly typed models (yet) and you use `ExpandoObject`, or your backend comes from an older technology and still returns `DataTable`s, the grid can accommodate such dynamic data types. You can get started from our examples on how to [bind the Grid to ExpandoObject collection](slug://grid-kb-binding-to-expando-object) and [bind the Grid to a DataTable](https://demos.telerik.com/blazor-ui/grid/data-table), which also support [editing](slug://components/grid/editing/overview).
 
 * **gRPC** - the gRPC tooling supports .NET Core, and as of mid-June 2020, there is a package that brings it to WebAssembly. You can find a basic example and more resources to get you started with gRPC in Blazor in the [Grid Data from gRPC Sample Project](https://github.com/telerik/blazor-ui/tree/master/common/grpc-example).
 
-* **Foreign Keys** - using foreign tables and keys is usually done through the grid templates. You can read more and find examples in the [Grid - Foreign Key]({%slug grids-foreign-key%}) KnowledgeBase article.
+* **Foreign Keys** - using foreign tables and keys is usually done through the grid templates. You can read more and find examples in the [Grid - Foreign Key](slug://grids-foreign-key) KnowledgeBase article.
 
 ## Binding to Interface
 
 Since version 2.27, the Grid supports binding to a collection of multiple model types that implement the same interface.
 
-Note the usage of [`OnModelInit`]({%slug grid-events%}#onmodelinit) in the example below. The event handler sets the model type to be used for new items in the Grid. One-type model creation is supported out-of-the-box. If you need to support adding instances of different types:
+Note the usage of [`OnModelInit`](slug://grid-events#onmodelinit) in the example below. The event handler sets the model type to be used for new items in the Grid. One-type model creation is supported out-of-the-box. If you need to support adding instances of different types:
 
-* Use custom **Add** buttons in the [Grid Toolbar]({%slug components/grid/features/toolbar%}), one for each model type.
-* In each button click handler, define an `InsertedItem` of the correct type in the [Grid State]({%slug grid-state%}).
-* [Put the Grid in Insert mode]({%slug grid-kb-add-edit-state%}) with the [SetStateAsync method]({%slug grid-state%}#methods).
+* Use custom **Add** buttons in the [Grid Toolbar](slug://components/grid/features/toolbar), one for each model type.
+* In each button click handler, define an `InsertedItem` of the correct type in the [Grid State](slug://grid-state).
+* [Put the Grid in Insert mode](slug://grid-kb-add-edit-state) with the [SetStateAsync method](slug://grid-state#methods).
 
 >caption Data Binding the Grid to an Interface
 
@@ -158,4 +158,4 @@ Note the usage of [`OnModelInit`]({%slug grid-events%}#onmodelinit) in the examp
   * [Live Demo: Bind Grid to Observable Data](https://demos.telerik.com/blazor-ui/grid/observable-data)
   * [Live Demo: Bind Grid to DataTable](https://demos.telerik.com/blazor-ui/grid/data-table)
   * [Live Demo: Manual Grid Data Operations](https://demos.telerik.com/blazor-ui/grid/manual-operations)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/editing/built-in-dialogs/delete-confirmation.md b/components/grid/editing/built-in-dialogs/delete-confirmation.md
index 4ff057edc7..324c2f9069 100644
--- a/components/grid/editing/built-in-dialogs/delete-confirmation.md
+++ b/components/grid/editing/built-in-dialogs/delete-confirmation.md
@@ -106,6 +106,6 @@ The built-in delete confirmation dialog triggers before item deletion. You can e
 * [Live Demo: Grid InCell Editing](https://demos.telerik.com/blazor-ui/grid/editing-incell)
 * [Live Demo: Grid Custom Editor Template](https://demos.telerik.com/blazor-ui/grid/custom-editor)
 * [Live Demo: Grid Custom Edit Form](https://demos.telerik.com/blazor-ui/grid/editing-custom-form)
-* [Customize the Delete Confirmation Dialog]({%slug grid-kb-customize-delete-confirmation-dialog%})
-* [Blazor Grid]({%slug grid-overview%})
+* [Customize the Delete Confirmation Dialog](slug://grid-kb-customize-delete-confirmation-dialog)
+* [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/editing/built-in-dialogs/overview.md b/components/grid/editing/built-in-dialogs/overview.md
index ab7a4854f6..e90e3070d6 100644
--- a/components/grid/editing/built-in-dialogs/overview.md
+++ b/components/grid/editing/built-in-dialogs/overview.md
@@ -14,9 +14,9 @@ You can enable built-in dialogs in Grid to provide an extra step for the end-use
 
 The Grid component can use built-in dialogs for: 
 
-* [delete confirmation]({%slug grid-delete-confirmation%}) - displays a confirmation dialog when the user clicks the "**delete**" command button.
+* [delete confirmation](slug://grid-delete-confirmation) - displays a confirmation dialog when the user clicks the "**delete**" command button.
 
-The default texts of the dialogs are exposed in the [localization]({%slug globalization-localization%}) messages of the component, and you can customize them.
+The default texts of the dialogs are exposed in the [localization](slug://globalization-localization) messages of the component, and you can customize them.
 
 ## See Also
 
@@ -25,6 +25,6 @@ The default texts of the dialogs are exposed in the [localization]({%slug global
 * [Live Demo: Grid InCell Editing](https://demos.telerik.com/blazor-ui/grid/editing-incell)
 * [Live Demo: Grid Custom Editor Template](https://demos.telerik.com/blazor-ui/grid/custom-editor)
 * [Live Demo: Grid Custom Edit Form](https://demos.telerik.com/blazor-ui/grid/editing-custom-form)
-* [How to show a Cancel Confirmation Dialog]({%slug grid-kb-show-confirm-cancel-dialog%})
-* [Blazor Grid]({%slug grid-overview%})
+* [How to show a Cancel Confirmation Dialog](slug://grid-kb-show-confirm-cancel-dialog)
+* [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/editing/incell.md b/components/grid/editing/incell.md
index 720a6a4080..f357a3469b 100644
--- a/components/grid/editing/incell.md
+++ b/components/grid/editing/incell.md
@@ -31,7 +31,7 @@ The InCell edit mode provides a specific user experience and behaves differently
 
 To enable InCell editing mode, set the `EditMode` property of the grid to `Telerik.Blazor.GridEditMode.Incell`. You can handle the `OnUpdate`, `OnCreate` and `OnDelete` events to perform the CUD operations, as shown in the example below. 
 
-To add a new item, you must add a [toolbar]({%slug components/grid/features/toolbar%}) with an `Add` command. `OnCreate` will fire immediately when you click the `Add` button - see [Event Sequence](#event-sequence) below.
+To add a new item, you must add a [toolbar](slug://components/grid/features/toolbar) with an `Add` command. `OnCreate` will fire immediately when you click the `Add` button - see [Event Sequence](#event-sequence) below.
 
 It is up to the data access logic to save the data once it is changed in the data collection. The example below showcases when that happens and adds some code to provide a visual indication of the change. In a real application, the code for handling data updates may be entirely different.
 
@@ -194,9 +194,9 @@ Click a cell, edit it and click outside of the grid to see the change. You can a
 
 ## Event Sequence
 
-* The `OnCreate` event will fire as soon as you click the `Add` button. The Grid will render the new row and enter edit mode for the first editable column (to fire `OnEdit` and let the user alter the column). This means you should have [default values]({%slug grid-kb-default-value-for-new-row%}) that satisfy any initial validation and requirements your models may have.
+* The `OnCreate` event will fire as soon as you click the `Add` button. The Grid will render the new row and enter edit mode for the first editable column (to fire `OnEdit` and let the user alter the column). This means you should have [default values](slug://grid-kb-default-value-for-new-row) that satisfy any initial validation and requirements your models may have.
 
-    * This means that there is no actual inserted item, an item in InCell editing is always in Edit mode, never in Insert mode. Thus, you cannot use the `InsertedItem` field of the Grid [State]({%slug grid-state%}). If you want to insert items programmatically in the Grid, alter the `Data` collection, and use the `OriginalEditItem` feature of the state (see the [Initiate Editing or Inserting of an Item]({%slug grid-kb-add-edit-state%}) example - it can put the InLine and Popup edit modes in Insert mode, but this cannot work for InCell editing).
+    * This means that there is no actual inserted item, an item in InCell editing is always in Edit mode, never in Insert mode. Thus, you cannot use the `InsertedItem` field of the Grid [State](slug://grid-state). If you want to insert items programmatically in the Grid, alter the `Data` collection, and use the `OriginalEditItem` feature of the state (see the [Initiate Editing or Inserting of an Item](slug://grid-kb-add-edit-state) example - it can put the InLine and Popup edit modes in Insert mode, but this cannot work for InCell editing).
 
 * The `OnEdit` event fires every time a cell is opened for editing. Until version **2.27**, the event fired **once per row** - when the user edits a cell from a different row.
 
@@ -209,9 +209,9 @@ Click a cell, edit it and click outside of the grid to see the change. You can a
 
 ## Incell Editing and Selection
 
-* To enable row selection with InCell Edit Mode, add a `<GridCheckboxColumn />` to the `<Columns>` collection. More information on that can be read in the [Row Selection]({%slug grid-selection-row%}#selection-and-editing-modes) article.
+* To enable row selection with InCell Edit Mode, add a `<GridCheckboxColumn />` to the `<Columns>` collection. More information on that can be read in the [Row Selection](slug://grid-selection-row#selection-and-editing-modes) article.
 
-    * To see how to select the row that is being edited in InCell edit mode without using a `<GridCheckboxColumn />` check out the [Row Selection in Edit with InCell EditMode]({%slug grid-kb-row-select-incell-edit%}) Knowledge Base article.
+    * To see how to select the row that is being edited in InCell edit mode without using a `<GridCheckboxColumn />` check out the [Row Selection in Edit with InCell EditMode](slug://grid-kb-row-select-incell-edit) Knowledge Base article.
 
 
 ## Editor Template
@@ -238,5 +238,5 @@ The incell editor template requires a focusable element to maintain the tab orde
 ## See Also
 
 * [Live Demo: Grid InCell Editing](https://demos.telerik.com/blazor-ui/grid/editing-incell)
-* [Grid Selection Documentation]({%slug grid-selection-overview%})
-* [Blazor Grid]({%slug grid-overview%})
+* [Grid Selection Documentation](slug://grid-selection-overview)
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/editing/inline.md b/components/grid/editing/inline.md
index a089f25d0c..6eccedffa3 100644
--- a/components/grid/editing/inline.md
+++ b/components/grid/editing/inline.md
@@ -10,7 +10,7 @@ position: 1
 
 # Grid Inline Editing
 
-Inline editing lets the user click an [Edit command button]({%slug components/grid/columns/command%}) on the row, and all its editable columns open up for changes. They can then click a `Save` command button to submit the changes to the data access layer. This fires the `OnUpdate` event of the grid where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service).
+Inline editing lets the user click an [Edit command button](slug://components/grid/columns/command) on the row, and all its editable columns open up for changes. They can then click a `Save` command button to submit the changes to the data access layer. This fires the `OnUpdate` event of the grid where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service).
 
 In a similar fashion, the `Cancel` and `Delete` command buttons fire events on the grid to let you handle the data source operations.
 
@@ -185,4 +185,4 @@ Use the command buttons to control the CUD operations.
 ## See Also
 
   * [Live Demo: Grid Inline Editing](https://demos.telerik.com/blazor-ui/grid/editing-inline)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/editing/overview.md b/components/grid/editing/overview.md
index 71e6362538..93b1e8b8a5 100644
--- a/components/grid/editing/overview.md
+++ b/components/grid/editing/overview.md
@@ -26,34 +26,34 @@ This page explains how to enable editing, use the relevant events and command bu
 
 The Grid offers several editing modes with different user experience. Set the `EditMode` property to a member of the `GridEditMode` enum:
 
-* `None` - the default `GridEditMode` value. The built-in [`Add` and `Edit` commands]({%slug components/grid/columns/command%}#built-in-commands) don't work in this mode.
-* `Incell` - [edit a single cell]({%slug components/grid/editing/incell%}) by clicking on it or tabbing
-* `Inline` - [edit a row]({%slug components/grid/editing/inline%}) by clicking on an [Edit command button]({%slug components/grid/columns/command%})
-* `Popup` - [edit a row in a popup form]({%slug components/grid/editing/popup%}) by clicking on an Edit button
+* `None` - the default `GridEditMode` value. The built-in [`Add` and `Edit` commands](slug://components/grid/columns/command#built-in-commands) don't work in this mode.
+* `Incell` - [edit a single cell](slug://components/grid/editing/incell) by clicking on it or tabbing
+* `Inline` - [edit a row](slug://components/grid/editing/inline) by clicking on an [Edit command button](slug://components/grid/columns/command)
+* `Popup` - [edit a row in a popup form](slug://components/grid/editing/popup) by clicking on an Edit button
 
 ## Events
 
-* `OnAdd` - fires when the `Add` [command button]({%slug components/grid/columns/command%}) for a newly added item is clicked. The event is cancellable.
-* `OnCreate` - fires when the `Save` [command button]({%slug components/grid/columns/command%}) for a newly added item is clicked. Cancellable (cancelling it keeps the grid in Insert mode).
+* `OnAdd` - fires when the `Add` [command button](slug://components/grid/columns/command) for a newly added item is clicked. The event is cancellable.
+* `OnCreate` - fires when the `Save` [command button](slug://components/grid/columns/command) for a newly added item is clicked. Cancellable (cancelling it keeps the grid in Insert mode).
 * `OnUpdate` - fires when the `Save` command button is clicked on an existing item. Cancellable (cancelling it keeps the grid in Edit mode). The model reference is a copy of the original data source item.
-* `OnDelete` - fires when the `Delete` command button is clicked. You can also display a [delete confirmation dialog]({%slug grid-delete-confirmation%}) before the deletion.
+* `OnDelete` - fires when the `Delete` command button is clicked. You can also display a [delete confirmation dialog](slug://grid-delete-confirmation) before the deletion.
 * `OnEdit` - fires when the user is about to enter edit mode for an existing row. Cancellable (cancelling it prevents the item from opening for editing).
 * `OnCancel` - fires when the user clicks the `Cancel` command button. Allows you to undo the changes to the data in the view data. Cancellable (keeps the grid in Edit/Insert mode).
-* `OnRead` - fires when the grid needs data - after any data source operation like updating, creating, deleting, filtering, sorting. If you cancel the CUD events, the [OnRead]({%slug components/grid/manual-operations%}) event will not fire.
+* `OnRead` - fires when the grid needs data - after any data source operation like updating, creating, deleting, filtering, sorting. If you cancel the CUD events, the [OnRead](slug://components/grid/manual-operations) event will not fire.
 
 The CUD event handlers receive an argument of type `GridCommandEventArgs` that exposes the following fields:
 
 * `IsCancelled` - a boolean field indicating whether the grid operation is to be prevented (for example, prevent a row from opening for edit, or from updating the data layer).
 * `IsNew` - a boolean field indicating whether the item was just added through the grid. Lets you differentiate a data source Create operation from Update operation in the `OnClick` event of a command button.
 * `Item` - an object you can cast to your model class to obtain the current data item.
-* `Field` - specific to [InCell editing]({%slug components/grid/editing/incell%}) - indicates which is the model field the user changed when updating data.
-* `Value` - specific to [InCell editing]({%slug components/grid/editing/incell%}) - indicates what is the new value the user changed when updating data.
+* `Field` - specific to [InCell editing](slug://components/grid/editing/incell) - indicates which is the model field the user changed when updating data.
+* `Value` - specific to [InCell editing](slug://components/grid/editing/incell) - indicates what is the new value the user changed when updating data.
 
-You can initiate editing or inserting of an item from anywhere on the page (buttons outside of the grid, or components in a column template) through the [grid state]({%slug grid-kb-add-edit-state%}).
+You can initiate editing or inserting of an item from anywhere on the page (buttons outside of the grid, or components in a column template) through the [grid state](slug://grid-kb-add-edit-state).
 
 ## Customize The Editor Fields
 
-You can customize the editors rendered in the Grid by providing the `EditorType` attribute, exposed on the `<GridColumn>`, or by using the [Editor Template]({%slug grid-templates-editor%}). The `EditorType` attribute accepts a member of the `GridEditorType` enum:
+You can customize the editors rendered in the Grid by providing the `EditorType` attribute, exposed on the `<GridColumn>`, or by using the [Editor Template](slug://grid-templates-editor). The `EditorType` attribute accepts a member of the `GridEditorType` enum:
 
 | Field data type | GridEditorType enum members              |
 |-----------------|------------------------------------------|
@@ -203,7 +203,7 @@ You can customize the editors rendered in the Grid by providing the `EditorType`
 
 The example below shows how you can handle the events the grid exposes, so you can Create, Update or Delete records in your data source and the view model.
 
->tip You can see the CRUD events in action in our live demos for [Inline](https://demos.telerik.com/blazor-ui/grid/editing-inline), [Popup](https://demos.telerik.com/blazor-ui/grid/editing-popup) and [InCell](https://demos.telerik.com/blazor-ui/grid/editing-incell) editing. You can also use the [Telerik Wizard]({%slug getting-started-vs-integration-new-project%}) project templates to easily create an application that showcases the Telerik Grid with CRUD events implemented.
+>tip You can see the CRUD events in action in our live demos for [Inline](https://demos.telerik.com/blazor-ui/grid/editing-inline), [Popup](https://demos.telerik.com/blazor-ui/grid/editing-popup) and [InCell](https://demos.telerik.com/blazor-ui/grid/editing-incell) editing. You can also use the [Telerik Wizard](slug://getting-started-vs-integration-new-project) project templates to easily create an application that showcases the Telerik Grid with CRUD events implemented.
 
 >caption Handling the CRUD events of the grid to save data to the actual data source (mocked with local methods in this example, see the code comments for details)
 
@@ -411,15 +411,15 @@ There are a few considerations to keep in mind with the CUD operations of the gr
 
     * When the method returns `void`, the execution of the context operations is not actually awaited, and you may get errors from the context (such as "Cannot access a disposed object. A common cause of this error is disposing a context that was resolved from dependency injection and then later trying to use the same context instance elsewhere in your application" or "A second operation started on this context before a previous operation completed. This is usually caused by different threads using the same instance of DbContext"). The grid may also re-render before the actual data update happens and you may not see the result.
 
-* If you are [using the `OnRead` event to optimize the data requests]({%slug components/grid/manual-operations%}), it will fire after the CUD events (`OnCreate`, `OnUpdate`, `OnDelete`, `OnCancel`) so that the grid data can be refreshed properly from the real data source. If you want to avoid such calls to the database, you can raise a flag in those four events to avoid calling your data service in the `OnRead` event, and then you can lower that flag at the end of `OnRead` so subsequent calls can fetch fresh data.
+* If you are [using the `OnRead` event to optimize the data requests](slug://components/grid/manual-operations), it will fire after the CUD events (`OnCreate`, `OnUpdate`, `OnDelete`, `OnCancel`) so that the grid data can be refreshed properly from the real data source. If you want to avoid such calls to the database, you can raise a flag in those four events to avoid calling your data service in the `OnRead` event, and then you can lower that flag at the end of `OnRead` so subsequent calls can fetch fresh data.
 
-* The Grid uses `Activator.CreateInstance<TItem>();` to generate a new item when an Insert or Edit action is invoked, so the Model should have a parameterless constructor defined. If you cannot have such a constructor, you must use the [OnModelInit]({%slug grid-events%}#onmodelinit) event.
-    * Another case when you may need to insert items through the grid state is when you use [OnRead with grouping]({%slug components/grid/manual-operations%}#grouping-with-onread). In such cases the Grid is bound to an `object`, not to a particular model. As a result, it can't create new items for you and errors may be thrown. A workaround might be [invoking Edit/Insert through the grid state]({%slug grid-kb-add-edit-state%}) and creating the object with your own code.
+* The Grid uses `Activator.CreateInstance<TItem>();` to generate a new item when an Insert or Edit action is invoked, so the Model should have a parameterless constructor defined. If you cannot have such a constructor, you must use the [OnModelInit](slug://grid-events#onmodelinit) event.
+    * Another case when you may need to insert items through the grid state is when you use [OnRead with grouping](slug://components/grid/manual-operations#grouping-with-onread). In such cases the Grid is bound to an `object`, not to a particular model. As a result, it can't create new items for you and errors may be thrown. A workaround might be [invoking Edit/Insert through the grid state](slug://grid-kb-add-edit-state) and creating the object with your own code.
 
-* While editing, the Grid creates a **copy of your original object** which has a **different reference**. You receive that copy in the `OnUpdate` event handler. The `OnEdit` event receives the original item from the pristine `Data` collection, because it is a cancellable event and fires before the grid logic creates the copy. The built-in editors and [editor templates]({%slug grid-templates-editor%}) receive the copy for their `context` that the grid will create after `OnEdit`.
+* While editing, the Grid creates a **copy of your original object** which has a **different reference**. You receive that copy in the `OnUpdate` event handler. The `OnEdit` event receives the original item from the pristine `Data` collection, because it is a cancellable event and fires before the grid logic creates the copy. The built-in editors and [editor templates](slug://grid-templates-editor) receive the copy for their `context` that the grid will create after `OnEdit`.
     * For the Grid to successfully create a copy of the original object, all properties must have а setter and must not be `readonly`. Otherwise, editing may stop working.
 
-* If you want to pre-populate values to the user, see the [Setting default values in new row]({%slug grid-kb-default-value-for-new-row%}) KnowledgeBase article.
+* If you want to pre-populate values to the user, see the [Setting default values in new row](slug://grid-kb-default-value-for-new-row) KnowledgeBase article.
 
 * When you are using your Entity Framework models directly in the Grid (especially in a server-side Blazor scenario) and you use the `Item` property of `GridCommandEventArgs` directly in your DataBase update method, you can get one of the following exceptions: `The instance of entity type 'YourModel' cannot be tracked because another instance with the same key value for {'Id'} is already being tracked. When attaching existing entities, ensure that only one entity instance with a given key value is attached...` or `This is a DynamicProxy2 error: The interceptor attempted to 'Proceed' for method 'Microsoft.EntityFrameworkCore.Infrastructure.ILazyLoader get_LazyLoader()' which has no target. When calling method without target there is no implementation to 'proceed' to and it is the responsibility of the interceptor to mimic the implementation (set return value, out arguments etc)`.
     
@@ -429,11 +429,11 @@ There are a few considerations to keep in mind with the CUD operations of the gr
     1. Apply all the changes you need to it one by one - assign the values of all of its properties - `dbObject.Property1 = argsItem.Property1...`
     1. Call `dbContext.SaveChanges()`
 
-* The [Grid validation]({%slug grid-editing-validation%}) is based on the <a href="https://docs.microsoft.com/en-us/aspnet/core/blazor/forms-validation?view=aspnetcore-5.0#validator-components" target="_blank">`DataAnnotationValidator`</a> and creates its own `EditContext` for a row that is in edit/insert mode. When the row is not in edit/insert mode, the `EditContext` is `null`. The `EditContext` is a cascading parameter and overrides any cascading parameters from parent components (such as an `<EditForm>` that may wrap the grid).
+* The [Grid validation](slug://grid-editing-validation) is based on the <a href="https://docs.microsoft.com/en-us/aspnet/core/blazor/forms-validation?view=aspnetcore-5.0#validator-components" target="_blank">`DataAnnotationValidator`</a> and creates its own `EditContext` for a row that is in edit/insert mode. When the row is not in edit/insert mode, the `EditContext` is `null`. The `EditContext` is a cascading parameter and overrides any cascading parameters from parent components (such as an `<EditForm>` that may wrap the grid).
 
     * The validation will not be enabled for Grids bound to Expando objects or Dictionaries (such as DataTable).
 
-    * When an input receives an `EditContext` (usually comes down as a cascading parameter), the framework also requires a `ValueExpression`. If you use two-way binding (the `@bind-Value` syntax), the `ValueExpression` is deducted from there. However, if you use only the `Value` property, you have to pass the `ValueExpression` yourself. This is a lambda expression that tells the framework what field in the model to update. The following sample demonstrates how to achieve that. You can also check the [Requires a value for ValueExpression]({%slug common-kb-requires-valueexpression%}) knowledge base article for more details.
+    * When an input receives an `EditContext` (usually comes down as a cascading parameter), the framework also requires a `ValueExpression`. If you use two-way binding (the `@bind-Value` syntax), the `ValueExpression` is deducted from there. However, if you use only the `Value` property, you have to pass the `ValueExpression` yourself. This is a lambda expression that tells the framework what field in the model to update. The following sample demonstrates how to achieve that. You can also check the [Requires a value for ValueExpression](slug://common-kb-requires-valueexpression) knowledge base article for more details.
 
     <div class="skip-repl"></div>
     ````RAZOR
@@ -446,11 +446,11 @@ There are a few considerations to keep in mind with the CUD operations of the gr
     @* Applies to the other input type components as well *@
     ````
     
-* If you want to perform other data operations while the component is in Edit mode (applicable for [InCell]({%slug components/grid/editing/incell%}) and [Inline]({%slug components/grid/editing/inline%}) editing) the following behavior will occur:
+* If you want to perform other data operations while the component is in Edit mode (applicable for [InCell](slug://components/grid/editing/incell) and [Inline](slug://components/grid/editing/inline) editing) the following behavior will occur:
 
 @[template](/_contentTemplates/common/grid-treelist-editing-notes.md#grid-treelist-data-operations-while-editing)
 
-* When editing a master row in a [hierarchy Grid]({%slug components/grid/features/hierarchy%}), the respective `DetailTemplate` will collapse unless you [override the `Equals()` method of the master data item class]({%slug grid-kb-editing-in-hierarchy%}).
+* When editing a master row in a [hierarchy Grid](slug://components/grid/features/hierarchy), the respective `DetailTemplate` will collapse unless you [override the `Equals()` method of the master data item class](slug://grid-kb-editing-in-hierarchy).
 
 ## See Also
 
@@ -460,5 +460,5 @@ There are a few considerations to keep in mind with the CUD operations of the gr
   * [Live Demo: Grid Custom Editor Template](https://demos.telerik.com/blazor-ui/grid/custom-editor)
   * [Live Demo: Grid Custom Edit Form](https://demos.telerik.com/blazor-ui/grid/editing-custom-form)
   * [Batch Editing Example](https://github.com/telerik/blazor-ui/tree/master/grid/batch-editing)
-  * [Enter and Exit Grid Edit Mode Programmatically]({%slug grid-kb-add-edit-state%})
-  * [Blazor Grid]({%slug grid-overview%})
\ No newline at end of file
+  * [Enter and Exit Grid Edit Mode Programmatically](slug://grid-kb-add-edit-state)
+  * [Blazor Grid](slug://grid-overview)
\ No newline at end of file
diff --git a/components/grid/editing/popup.md b/components/grid/editing/popup.md
index 04f93a0112..7f67774e72 100644
--- a/components/grid/editing/popup.md
+++ b/components/grid/editing/popup.md
@@ -22,7 +22,7 @@ In this article:
 
 ## Basics
 
-Grid popup editing lets the user click an [Edit command button]({%slug components/grid/columns/command%}) on the row, and a popup shows up with all its editable columns open up for changes. They can then click the **Save** button in the dialog to submit the changes to the model. This fires the `OnUpdate` event of the grid where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service).
+Grid popup editing lets the user click an [Edit command button](slug://components/grid/columns/command) on the row, and a popup shows up with all its editable columns open up for changes. They can then click the **Save** button in the dialog to submit the changes to the model. This fires the `OnUpdate` event of the grid where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service).
 
 In a similar fashion, the **Cancel** and **Delete** command buttons, and the **Add** toolbar command button fire events in the Grid to let you handle the data source operations.
 
@@ -30,7 +30,7 @@ You can also cancel the events by setting the `IsCancelled` property of the `Gri
 
 To enable Popup editing in the grid, set its `EditMode` property to `Telerik.Blazor.GridEditMode.Popup`, then handle the CRUD events as shown in the example below.
 
-The Popup editing mode supports [validation]({%slug common-features/input-validation%}). To use it, all you need to do is decorate your model with the desired annotations. Validation errors will be shown in the popup and will prevent the Update operation.
+The Popup editing mode supports [validation](slug://common-features/input-validation). To use it, all you need to do is decorate your model with the desired annotations. Validation errors will be shown in the popup and will prevent the Update operation.
 
 >caption Grid popup editing example. Please review the code comments
 
@@ -201,7 +201,7 @@ The Grid exposes options to customize the edit popup and its form. Define the de
 
 ### Editability of Hidden Columns
 
-Starting with version 7.0, the Grid allows users to edit [hidden columns]({%slug grid-columns-visible%}) by default. To disable editing of a hidden column, set `Editable="false"` to the respective `<GridColumn>` tag.
+Starting with version 7.0, the Grid allows users to edit [hidden columns](slug://grid-columns-visible) by default. To disable editing of a hidden column, set `Editable="false"` to the respective `<GridColumn>` tag.
 
 ### Popup Customization
 
@@ -209,7 +209,7 @@ The `GridPopupEditSettings` nested tag exposes the following parameters to allow
 
 @[template](/_contentTemplates/common/popup-edit-customization.md#popup-settings)
 
-For example, here is [how to set the Grid popup edit form's title, so that it matches a property value of the edited data item]({%slug grid-kb-popup-edit-title%}).
+For example, here is [how to set the Grid popup edit form's title, so that it matches a property value of the edited data item](slug://grid-kb-popup-edit-title).
 
 ### Edit Form Customization
 
@@ -217,7 +217,7 @@ The `GridPopupEditFormSettings` nested tag exposes the following parameters to a
 
 @[template](/_contentTemplates/common/popup-edit-customization.md#edit-form-settings)
 
->important These settings are not applicable if you are using a `<FormTemplate>` with a custom Form component. See more details in [Form Template - Specifics]({%slug grid-templates-popup-form%}#specifics).
+>important These settings are not applicable if you are using a `<FormTemplate>` with a custom Form component. See more details in [Form Template - Specifics](slug://grid-templates-popup-form#specifics).
 
 >caption Customize the popup edit form
 
@@ -273,15 +273,15 @@ The `GridPopupEditFormSettings` nested tag exposes the following parameters to a
 
 ### Popup Form Customization
 
-In the `GridPopupEditFormSettings`, you can declare a `FormTemplate`. This template enables you to fully customize the appearance and content of the create/edit Popup window in the Grid. For more information and examples on customizing the Grid Popup window, refer to the [Popup Form Template]({%slug grid-templates-popup-form%}) article.
+In the `GridPopupEditFormSettings`, you can declare a `FormTemplate`. This template enables you to fully customize the appearance and content of the create/edit Popup window in the Grid. For more information and examples on customizing the Grid Popup window, refer to the [Popup Form Template](slug://grid-templates-popup-form) article.
 
 ### Popup Buttons Customization
 
-You can specify a `ButtonsTemplate` in the `GridPopupEditFormSettings` to customize how the buttons look in the create/edit Popup window of the Grid. To learn more and see an example of customizing the Grid Popup buttons, refer to the [Popup Buttons Template]({%slug grid-templates-popup-buttons%}) article.
+You can specify a `ButtonsTemplate` in the `GridPopupEditFormSettings` to customize how the buttons look in the create/edit Popup window of the Grid. To learn more and see an example of customizing the Grid Popup buttons, refer to the [Popup Buttons Template](slug://grid-templates-popup-buttons) article.
 
 ## See Also
 
 * [Live Demo: Grid Popup Editing](https://demos.telerik.com/blazor-ui/grid/editing-popup)
-* [Custom Editor Template Per Field]({%slug grid-templates-editor%})
+* [Custom Editor Template Per Field](slug://grid-templates-editor)
 * [Custom Editor Layout](https://github.com/telerik/blazor-ui/tree/master/grid/custom-popup-form)
-* [Blazor Grid]({%slug grid-overview%})
\ No newline at end of file
+* [Blazor Grid](slug://grid-overview)
\ No newline at end of file
diff --git a/components/grid/editing/validation.md b/components/grid/editing/validation.md
index c62d3b6b6c..234e359700 100644
--- a/components/grid/editing/validation.md
+++ b/components/grid/editing/validation.md
@@ -10,7 +10,7 @@ position: 40
 
 # Grid Validation
 
-The Telerik UI for Blazor Grid supports built-in validation that is enabled by default. The Grid passes an `EditContext` as a cascading value to the editable cells. When you use [inline]({%slug components/grid/editing/inline%}) or [incell]({%slug components/grid/editing/incell%}) editing, if any validation messages are present, the Grid will render them as [Validation Tooltips]({%slug validation-tools-tooltip%}) on hover of the edited input. 
+The Telerik UI for Blazor Grid supports built-in validation that is enabled by default. The Grid passes an `EditContext` as a cascading value to the editable cells. When you use [inline](slug://components/grid/editing/inline) or [incell](slug://components/grid/editing/incell) editing, if any validation messages are present, the Grid will render them as [Validation Tooltips](slug://validation-tools-tooltip) on hover of the edited input. 
 
 #### In this Article:
 
@@ -319,6 +319,6 @@ You can validate the Grid with any validator that uses the `EditContext`. To cha
 
 ## See Also
 
-* [Grid Editing]({%slug components/grid/editing/overview%})
-* [Custom Grid `DataAnnotations` Validation]({%slug validation-kb-custom-dataannotations-validator%})
-* [Blazor Grid]({%slug grid-overview%})
+* [Grid Editing](slug://components/grid/editing/overview)
+* [Custom Grid `DataAnnotations` Validation](slug://validation-kb-custom-dataannotations-validator)
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/events.md b/components/grid/events.md
index ec2a9080d8..fbdb21f8ef 100644
--- a/components/grid/events.md
+++ b/components/grid/events.md
@@ -37,11 +37,11 @@ The `OnAdd`, `OnCreate`, `OnUpdate` and `OnDelete` events let you get the data i
 
 The `OnEdit` and `OnCancel` events let you respond to user actions - when they want to edit an item and when the want to cancel changes on an item they have been editing. You can use them to, for example, prevent editing of certain items based on some condition.
 
-You can read more about the CUD events in the [Editing Overview]({%slug components/grid/editing/overview%}) article.
+You can read more about the CUD events in the [Editing Overview](slug://components/grid/editing/overview) article.
 
 ## Read Event
 
-In the common case, you provide all the data to the Grid's `Data` collection and the Grid performs operations like paging, filtering, sorting on it for you. In some cases you may want to do this with your own code (for example, to retrieve only a small number of items in order to improve the backend performance). You can do this by handling the `OnRead` event where you can perform all the data read operations in the Grid. Read more about the [`OnRead` event fundamentals]({%slug common-features-data-binding-onread%}) and check the article about [Manual Data Source Operations with the Grid]({%slug components/grid/manual-operations%}).
+In the common case, you provide all the data to the Grid's `Data` collection and the Grid performs operations like paging, filtering, sorting on it for you. In some cases you may want to do this with your own code (for example, to retrieve only a small number of items in order to improve the backend performance). You can do this by handling the `OnRead` event where you can perform all the data read operations in the Grid. Read more about the [`OnRead` event fundamentals](slug://common-features-data-binding-onread) and check the article about [Manual Data Source Operations with the Grid](slug://components/grid/manual-operations).
 
 ## State Events
 
@@ -51,15 +51,15 @@ The grid state lets you control through code the aspects of the grid the user ca
 
 * `OnStateChanged` - fires when the user performs an action so you can see what area was changed and, if needed, alter the grid state.
 
-Review the [grid state]({%slug grid-state%}) article for more details and examples on how the grid state works and what you can do with it.
+Review the [grid state](slug://grid-state) article for more details and examples on how the grid state works and what you can do with it.
 
 ## Column Events
 
-The Grid columns emit the `OnCellRender` event, so you can customize each cell separately. Read more and find examples in the [Grid Column Events]({%slug grid-column-events%}) article.
+The Grid columns emit the `OnCellRender` event, so you can customize each cell separately. Read more and find examples in the [Grid Column Events](slug://grid-column-events) article.
 
 ## Command Button Click
 
-The command buttons of a grid provide an `OnClick` event before firing their built-in command (such as opening a row for editing, or adding a new row). You can do this to implement some additional logic and to also handle custom commands - both from a [Command Column]({%slug components/grid/columns/command%}), and from a [Toolbar Button]({%slug components/grid/features/toolbar%})
+The command buttons of a grid provide an `OnClick` event before firing their built-in command (such as opening a row for editing, or adding a new row). You can do this to implement some additional logic and to also handle custom commands - both from a [Command Column](slug://components/grid/columns/command), and from a [Toolbar Button](slug://components/grid/features/toolbar)
 
 ## Export Events
 
@@ -70,7 +70,7 @@ During export, the Grid will fire events like `OnBeforeExport` and `OnAfterExpor
 * Cancel the export;
 * Get the final file output;
 
-Read more about them and find code examples in the [Grid Export Events]({%slug grid-export-events%}) article.
+Read more about them and find code examples in the [Grid Export Events](slug://grid-export-events) article.
 
 ## OnModelInit
 
@@ -707,7 +707,7 @@ The `OnRowContextMenu` event handler receives a `GridRowClickEventArgs` argument
 
 ## OnRowExpand
 
-The `OnRowExpand` event fires as a response to the user expanding the [`DetailTemplate`]({%slug components/grid/features/hierarchy%}) of the Grid.
+The `OnRowExpand` event fires as a response to the user expanding the [`DetailTemplate`](slug://components/grid/features/hierarchy) of the Grid.
 
 The event handler receives a `GridRowExpandEventArgs` object which provides the model of the clicked row in the `Item` field that you can cast to your model type.
 
@@ -797,7 +797,7 @@ The event handler receives a `GridRowExpandEventArgs` object which provides the
 
 ## OnRowCollapse
 
-The `OnRowCollapse` event fires as a response to the user collapsing the [`DetailTemplate`]({%slug components/grid/features/hierarchy%}) of the Grid.
+The `OnRowCollapse` event fires as a response to the user collapsing the [`DetailTemplate`](slug://components/grid/features/hierarchy) of the Grid.
 
 The event handler receives a `GridRowCollapseEventArgs` object which provides the model of the clicked row in the `Item` field that you can cast to your model type.
 
@@ -957,7 +957,7 @@ This event fires when each Grid row renders. This can happen in the following ca
 
 ## OnRowDrop
 
-The `OnRowDrop` event fires when the user drags and drops rows in the grid or between grids. You can read more on setting it up and using the grid row dragging feature in the [Row Drag and Drop]({%slug grid-drag-drop-overview%}) article.
+The `OnRowDrop` event fires when the user drags and drops rows in the grid or between grids. You can read more on setting it up and using the grid row dragging feature in the [Row Drag and Drop](slug://grid-drag-drop-overview) article.
 
 
 ## PageChanged
@@ -1056,20 +1056,20 @@ Make sure to update the current page size when using the event.
 
 ## SelectedItemsChanged
 
-Fires when [row selection is enabled]({%slug grid-selection-overview%}#enable-row-or-cell-selection) and the user selects or deselects one row or multiple rows, depending on the [selection mode]({%slug grid-selection-overview%}#use-single-or-multiple-selection).
+Fires when [row selection is enabled](slug://grid-selection-overview#enable-row-or-cell-selection) and the user selects or deselects one row or multiple rows, depending on the [selection mode](slug://grid-selection-overview#use-single-or-multiple-selection).
 
-Visit the [Grid Row Selection article to see an example]({%slug grid-selection-row%}#selecteditemschanged-event).
+Visit the [Grid Row Selection article to see an example](slug://grid-selection-row#selecteditemschanged-event).
 
 ## SelectedCellsChanged
 
-Fires when [cell selection is enabled]({%slug grid-selection-overview%}#enable-row-or-cell-selection) and the user selects or deselects one cell or multiple cells, depending on the [selection mode]({%slug grid-selection-overview%}#use-single-or-multiple-selection).
+Fires when [cell selection is enabled](slug://grid-selection-overview#enable-row-or-cell-selection) and the user selects or deselects one cell or multiple cells, depending on the [selection mode](slug://grid-selection-overview#use-single-or-multiple-selection).
 
-Visit the [Grid Cell Selection article to see an example]({%slug grid-selection-cell%}#selectedcellschanged-event).
+Visit the [Grid Cell Selection article to see an example](slug://grid-selection-cell#selectedcellschanged-event).
 
 ## See Also
 
-  * [Grid Overview]({%slug grid-overview%})
-  * [Grid Editing Overview]({%slug components/grid/editing/overview%})
-  * [Grid Column Events]({%slug grid-column-events%})
-  * [Manual Data Source Operations]({%slug components/grid/manual-operations%})
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Grid Overview](slug://grid-overview)
+  * [Grid Editing Overview](slug://components/grid/editing/overview)
+  * [Grid Column Events](slug://grid-column-events)
+  * [Manual Data Source Operations](slug://components/grid/manual-operations)
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/export/csv.md b/components/grid/export/csv.md
index d6863b7b00..51a9468b08 100644
--- a/components/grid/export/csv.md
+++ b/components/grid/export/csv.md
@@ -24,7 +24,7 @@ When you click the Export button, your browser will receive the resulting file.
 
 ## Basics
 
-To enable the grid CSV Export, add a [command button]({%slug components/grid/columns/command%}) with the `CsvExport` command name to the [Grid toolbar]({%slug components/grid/features/toolbar%}).
+To enable the grid CSV Export, add a [command button](slug://components/grid/columns/command) with the `CsvExport` command name to the [Grid toolbar](slug://components/grid/features/toolbar).
 
 ````RAZOR.skip-repl
 <GridToolBarTemplate>
@@ -36,7 +36,7 @@ Optionally, you can also set the `GridCsvExport` tag settings under the `GridExp
 
 * `FileName` - the name of the file. The grid will add the `.csv` extension for you.
 * `AllPages` - whether to export the current page only, or the entire data from the data source.
-* Subscribe to [Grid export events]({%slug grid-export-events%}) that allow further customizations of the exported columns or data.
+* Subscribe to [Grid export events](slug://grid-export-events) that allow further customizations of the exported columns or data.
 
 >caption Export the Grid to CSV - Example
 
@@ -102,7 +102,7 @@ You can programmatically invoke the export feature of the Grid, by using the fol
 * `SaveAsCsvFileAsync` - `ValueTask` - sends the exported CSV file to the browser for download
 * `ExportToCsvAsync` - `Task<MemoryStream>` - returns the exported data as a `MemoryStream`. The stream itself is finalized, so that the resource does not leak. To read and work with the stream, clone its available binary data to a new `MemoryStream` instance.
 
->note The same methods are exposed for exporting an [Excel file]({%slug grid-export-excel%}#programmatic-export).
+>note The same methods are exposed for exporting an [Excel file](slug://grid-export-excel#programmatic-export).
 
 >caption Invoke the export function from code
 
@@ -189,13 +189,13 @@ The component allows you to control the data set that will be exported. It also
 
 For more advanced customizations (such as coloring the headers, bolding the titles, or even changing cell values) the Grid lets you get the `MemoryStream` of the file. Thus, you can customize it using the [`SpreadProcessing`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/overview) or the [`SpreadStreamProcessing`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadstreamprocessing/overview) libraries that are available with your license.
 
-[Read more about how to customize the exported file...]({%slug grid-export-events%})
+[Read more about how to customize the exported file...](slug://grid-export-events)
 
 ## Notes
 
 The CSV export has the following specifics:
 
-* Column widths are not applied because a CSV document does not have such a concept. You can use any units in the grid itself, they will not be reflected in the exported document. If you need to add such structure, consider [exporting to an Excel file]({%slug grid-export-excel%}).
+* Column widths are not applied because a CSV document does not have such a concept. You can use any units in the grid itself, they will not be reflected in the exported document. If you need to add such structure, consider [exporting to an Excel file](slug://grid-export-excel).
 * Templates are not exported, because there is no provision in the framework for getting them at runtime. If a column, header or group header/footer has a template or aggregates, it will be ignored. The headers will be the `Title` of the column, the data is the data from the `Field`. If you need additional information, see if you can add it in a Field in the model, or create your own Excel file. Find a <a href="https://feedback.telerik.com/blazor/1485764-customize-the-excel-file-before-it-gets-to-the-client" target="_blank">project example on how to generate your own exported file</a>.
 
 @[template](/_contentTemplates/grid/export.md#export-common-notes)
@@ -203,8 +203,8 @@ The CSV export has the following specifics:
 ## See Also
 
   * [Live Demo: Grid CSV Export](https://demos.telerik.com/blazor-ui/grid/export-csv)
-  * [Custom cell formatting of the exported file with RadSpreadProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadprocessing%})
-  * [Custom cell formatting of the exported file with RadSpreadStreamProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadstreamprocessing%}) 
-  * [Format numbers and dates in the exported CSV file from the Grid]({%slug grid-kb-number-formatting-of-the-csv-export%})
-  * [Change the default CSV delimiter (comma) during Grid export]({%slug grid-kb-csv-export-change-field-delimiter%})
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Custom cell formatting of the exported file with RadSpreadProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadprocessing)
+  * [Custom cell formatting of the exported file with RadSpreadStreamProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadstreamprocessing) 
+  * [Format numbers and dates in the exported CSV file from the Grid](slug://grid-kb-number-formatting-of-the-csv-export)
+  * [Change the default CSV delimiter (comma) during Grid export](slug://grid-kb-csv-export-change-field-delimiter)
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/export/events.md b/components/grid/export/events.md
index d7ee696dc7..cd5d9fac4e 100644
--- a/components/grid/export/events.md
+++ b/components/grid/export/events.md
@@ -37,7 +37,7 @@ The `OnBeforeExport` event fires after the user clicks the `ExcelExport` or `Csv
 To export a hidden Grid column that has its `Visible` parameter set to `false`, you can manually define an instance of the `GridExcelExportColumn` in the handler for the `OnBeforeExport` event and add that column to the `args.Columns` collection.
     
     
-* `Data` - `IEnumerable<object>` - assign a custom collection of data to be exported to Excel, [for example only the selected items in the Grid]({%slug grid-kb-export-selected-rows%}).
+* `Data` - `IEnumerable<object>` - assign a custom collection of data to be exported to Excel, [for example only the selected items in the Grid](slug://grid-kb-export-selected-rows).
 
 * `isCancelled` -  `bool` - cancel the OnBeforeExcel event by setting the `isCancelled` property to `true`.
 
@@ -150,7 +150,7 @@ To export a hidden Grid column that has its `Visible` parameter set to `false`,
 
 ### For CSV Export
 
-* `Data` - `IEnumerable<object>` - assign a custom collection of data to be exported to CSV, [for example only the selected items in the Grid]({%slug grid-kb-export-selected-rows%}).
+* `Data` - `IEnumerable<object>` - assign a custom collection of data to be exported to CSV, [for example only the selected items in the Grid](slug://grid-kb-export-selected-rows).
 
 * `Columns` - `List<GridCsvExportColumn>` - a collection of all exportable columns in the Grid. These are all visible `GridColumn` instances. You can customize the following attributes of the Grid column before exporting it into Excel:
 
@@ -408,10 +408,10 @@ The `OnAfterExport` event fires after [OnBeforeExport](#onbeforeexport) and befo
 
 ## See Also
 
-* [Grid Excel Export]({%slug grid-export-excel%})
-* [Grid CSV Export]({%slug grid-export-csv%})
-* [Custom cell formatting of the exported file with RadSpreadProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadprocessing%})
-* [Custom cell formatting of the exported file with RadSpreadStreamProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadstreamprocessing%})  
-* [Format numbers and dates in the exported CSV file from the Grid]({%slug grid-kb-number-formatting-of-the-csv-export%})
-* [Change the default CSV delimiter (comma) during Grid export]({%slug grid-kb-csv-export-change-field-delimiter%})
-* [Blazor Grid]({%slug grid-overview%})
+* [Grid Excel Export](slug://grid-export-excel)
+* [Grid CSV Export](slug://grid-export-csv)
+* [Custom cell formatting of the exported file with RadSpreadProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadprocessing)
+* [Custom cell formatting of the exported file with RadSpreadStreamProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadstreamprocessing)  
+* [Format numbers and dates in the exported CSV file from the Grid](slug://grid-kb-number-formatting-of-the-csv-export)
+* [Change the default CSV delimiter (comma) during Grid export](slug://grid-kb-csv-export-change-field-delimiter)
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/export/excel.md b/components/grid/export/excel.md
index 53be381e25..bfd842a649 100644
--- a/components/grid/export/excel.md
+++ b/components/grid/export/excel.md
@@ -24,7 +24,7 @@ When you click the Export button, your browser will receive the resulting file.
 
 ## Basics
 
-To enable the Grid Excel Export, add a [command button]({%slug components/grid/columns/command%}) with the `ExcelExport` command name to the [Grid toolbar]({%slug components/grid/features/toolbar%}).
+To enable the Grid Excel Export, add a [command button](slug://components/grid/columns/command) with the `ExcelExport` command name to the [Grid toolbar](slug://components/grid/features/toolbar).
 
 ````RAZOR.skip-repl
 <GridToolBarTemplate>
@@ -36,7 +36,7 @@ Optionally, you can also set the `GridExcelExport` tag settings under the `GridE
 
 * `FileName` - the name of the file. The grid will add the `.xslx` extension for you.
 * `AllPages` - whether to export the current page only, or the entire data from the data source.
-* Subscribe to [Grid export events]({%slug grid-export-events%}) that allow further customizations of the exported columns or data.
+* Subscribe to [Grid export events](slug://grid-export-events) that allow further customizations of the exported columns or data.
 
 >caption Export the Grid to Excel - Example
 
@@ -102,7 +102,7 @@ You can programmatically invoke the export feature of the Grid, by using the fol
 * `SaveAsExcelFileAsync` - `ValueTask` - sends the exported excel file to the browser for download.
 * `ExportToExcelAsync` - `Task<MemoryStream>` - returns the exported data as a `MemoryStream`. The stream itself is finalized, so that the resource does not leak. To read and work with the stream, clone its available binary data to a new `MemoryStream` instance.
 
->note The same methods are exposed for exporting a [CSV file]({%slug grid-export-csv%}#programmatic-export).
+>note The same methods are exposed for exporting a [CSV file](slug://grid-export-csv#programmatic-export).
 
 >caption Invoke the export function from code
 
@@ -188,16 +188,16 @@ To customize the exported file, handle the `OnBeforeExport` or `OnAfterExport` e
 
 The component allows you to control the data set that will be exported. It also provides built-in customization options for the columns such as `Width`, `Title` and more.
 
-For more advanced customization (such as coloring the headers or bolding the titles) the Grid lets you get the `MemoryStream` of the file. Thus, you can customize it using the [`SpreadProcessing`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/overview) or the [`SpreadStreamProcessing`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadstreamprocessing/overview) libraries that are available with your license. Find examples on how to [format the cells of the exported Excel file with RadSpreadProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadprocessing%}) and how to [format the cells of the exported Excel file with RadSpreadStreamProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadstreamprocessing%}).
+For more advanced customization (such as coloring the headers or bolding the titles) the Grid lets you get the `MemoryStream` of the file. Thus, you can customize it using the [`SpreadProcessing`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/overview) or the [`SpreadStreamProcessing`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadstreamprocessing/overview) libraries that are available with your license. Find examples on how to [format the cells of the exported Excel file with RadSpreadProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadprocessing) and how to [format the cells of the exported Excel file with RadSpreadStreamProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadstreamprocessing).
 
-Read more about how to [customize the exported file]({%slug grid-export-events%}).
+Read more about how to [customize the exported file](slug://grid-export-events).
 
 ## Notes
 
 The Excel export has the following specifics:
 
 * Excel does not understand units different than `px` for the column `Width`, and if you use them (such as `rem` or `%`), it will fail to parse them and will render a collapsed (hidden) column with zero width.
-* Templates are not exported, because there is no provision in the framework for getting them at runtime. If a column, header or group header/footer has a template or aggregates, it will be ignored. The headers will be the `Title` of the column, the data is the data from the `Field`. If you need additional information, see if you can add it in a Field in the model, or create your own Excel file. Find a <a href="https://feedback.telerik.com/blazor/1485764-customize-the-excel-file-before-it-gets-to-the-client" target="_blank">project example on how to generate your own exported file</a>. Find additional information on how to [export an image that is rendered in a Grid column template]({%slug grid-export-image-column-excel%}).
+* Templates are not exported, because there is no provision in the framework for getting them at runtime. If a column, header or group header/footer has a template or aggregates, it will be ignored. The headers will be the `Title` of the column, the data is the data from the `Field`. If you need additional information, see if you can add it in a Field in the model, or create your own Excel file. Find a <a href="https://feedback.telerik.com/blazor/1485764-customize-the-excel-file-before-it-gets-to-the-client" target="_blank">project example on how to generate your own exported file</a>. Find additional information on how to [export an image that is rendered in a Grid column template](slug://grid-export-image-column-excel).
 
 @[template](/_contentTemplates/grid/export.md#export-common-notes)
 
@@ -205,6 +205,6 @@ The Excel export has the following specifics:
 ## See Also
 
   * [Live Demo: Grid Excel Export](https://demos.telerik.com/blazor-ui/grid/export-excel)
-  * [Custom Cell Formatting of the Exported File with RadSpreadProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadprocessing%})
-  * [Custom Cell Formatting of the Exported File with RadSpreadStreamProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadstreamprocessing%})
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Custom Cell Formatting of the Exported File with RadSpreadProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadprocessing)
+  * [Custom Cell Formatting of the Exported File with RadSpreadStreamProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadstreamprocessing)
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/export/pdf.md b/components/grid/export/pdf.md
index 2cf6a2adf8..6a35fc2aaa 100644
--- a/components/grid/export/pdf.md
+++ b/components/grid/export/pdf.md
@@ -10,7 +10,7 @@ position: 1
 
 # PDF Export
 
-The [Telerik Document Processing tools]({%slug dpl-in-blazor%}) that come with your Blazor license let you generate a PDF file based on the data in the grid.
+The [Telerik Document Processing tools](slug://dpl-in-blazor) that come with your Blazor license let you generate a PDF file based on the data in the grid.
 
 The following sample projects show two ways to implement a PDF export
 
@@ -23,4 +23,4 @@ You can also follow the feature request for <a href="https://feedback.telerik.co
 
 ## See Also
 
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/filter/checkboxlist.md b/components/grid/filter/checkboxlist.md
index 429d9521db..8b62eca840 100644
--- a/components/grid/filter/checkboxlist.md
+++ b/components/grid/filter/checkboxlist.md
@@ -10,7 +10,7 @@ position: 15
 
 # Grid CheckBoxList Filtering
 
-You can change the [filter menu]({%slug grid-filter-menu%}) to show a list of checkboxes with the distinct values from the data source. This lets your users filter records by a commonly found value quickly, and select multiple values with ease. The behavior is similar to Excel filtering.
+You can change the [filter menu](slug://grid-filter-menu) to show a list of checkboxes with the distinct values from the data source. This lets your users filter records by a commonly found value quickly, and select multiple values with ease. The behavior is similar to Excel filtering.
 
 ## Enabling CheckBoxList Filtering
 
@@ -67,9 +67,9 @@ To enable the CheckBoxList filtering in the Telerik Grid for Blazor:
 
 By default, the Telerik Grid takes the `Distinct` values from its `Data` to populate the checkbox list filter for each field.
 
-Using the [`OnRead` event]({%slug components/grid/manual-operations%}) to customize or perform data operations on the server/service limits the Grid to the current page of data, restricting user options. You may want to provide the full list.
+Using the [`OnRead` event](slug://components/grid/manual-operations) to customize or perform data operations on the server/service limits the Grid to the current page of data, restricting user options. You may want to provide the full list.
 
-To customize the CheckBoxList behavior, use the [Filter Menu Template]({%slug grid-templates-filter%}#filter-menu-template). Place the `TelerikCheckBoxListFilter` component inside the `FilterMenuTemplate` to get the default CheckBoxList filtering UI. The template provides the following settings:
+To customize the CheckBoxList behavior, use the [Filter Menu Template](slug://grid-templates-filter#filter-menu-template). Place the `TelerikCheckBoxListFilter` component inside the `FilterMenuTemplate` to get the default CheckBoxList filtering UI. The template provides the following settings:
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
@@ -224,6 +224,6 @@ depending on how you filter the data so you may never be able to get back all va
 
 ## See Also
 
-* [Grid Filtering Overview]({%slug components/grid/filtering%})
+* [Grid Filtering Overview](slug://components/grid/filtering)
 * [Live Demo: Grid CheckBox List Filter](https://demos.telerik.com/blazor-ui/grid/filter-checkboxlist)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/filter/filter-menu.md b/components/grid/filter/filter-menu.md
index 1f8bf3e789..11fb3540bb 100644
--- a/components/grid/filter/filter-menu.md
+++ b/components/grid/filter/filter-menu.md
@@ -64,7 +64,7 @@ Set the `FilterMode` parameter of the Telerik Grid to `GridFilterMode.FilterMenu
 
 ## Filter From Code
 
-To learn how to programmatically filter the Grid, refer to the [Grid State]({%slug grid-state%}) documentation article.
+To learn how to programmatically filter the Grid, refer to the [Grid State](slug://grid-state) documentation article.
 
 @[template](/_contentTemplates/grid/state.md#initial-state)
 
@@ -123,19 +123,19 @@ You can override the default Filter Menu behavior for each column through the fo
 
 ### FilterMenuType
 
-You can switch between [CheckBoxList]({%slug grid-checklist-filter%}) and a `Menu` filtering layout for a particular `<GridColumn>` by setting the `FilterMenuType` to `FilterMenuType.Menu` or `FilterMenuType.CheckBoxList`.
+You can switch between [CheckBoxList](slug://grid-checklist-filter) and a `Menu` filtering layout for a particular `<GridColumn>` by setting the `FilterMenuType` to `FilterMenuType.Menu` or `FilterMenuType.CheckBoxList`.
 
 ### CheckBoxList
 
-You can render a list of checkboxes instead of the default menu layout. Read the [CheckBoxList Filtering article]({%slug grid-checklist-filter%}) for more information... 
+You can render a list of checkboxes instead of the default menu layout. Read the [CheckBoxList Filtering article](slug://grid-checklist-filter) for more information... 
 
 ### Filter Menu Template
 
-The template will let you have full control over the Filter Row rendering and behavior. See how you can implement it and explore the example in the [Filter Menu Template]({%slug grid-templates-filter%}#filter-menu-template) article.
+The template will let you have full control over the Filter Row rendering and behavior. See how you can implement it and explore the example in the [Filter Menu Template](slug://grid-templates-filter#filter-menu-template) article.
 
 
 ## See Also
 
-  * [Grid Filtering Overview]({%slug components/grid/filtering%})
+  * [Grid Filtering Overview](slug://components/grid/filtering)
   * [Live Demo: Grid Filter Menu](https://demos.telerik.com/blazor-ui/grid/filter-menu)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/filter/filter-row.md b/components/grid/filter/filter-row.md
index 495fe9d40c..84174b8e59 100644
--- a/components/grid/filter/filter-row.md
+++ b/components/grid/filter/filter-row.md
@@ -68,7 +68,7 @@ Set the `FilterMode` parameter of the Telerik Grid to `GridFilterMode.FilterRow`
 
 ## Filter From Code
 
-To learn how to programmatically filter the Grid, refer to the [Grid State]({%slug grid-state%}) documentation article.
+To learn how to programmatically filter the Grid, refer to the [Grid State](slug://grid-state) documentation article.
 
 @[template](/_contentTemplates/grid/state.md#initial-state)
 
@@ -133,10 +133,10 @@ You can override the default Filter Row behavior for each column through the fol
 
 ### Filter Row Template
 
-The template will let you have full control over the Filter Row rendering and behavior. See how you can implement it and explore the example in the [Filter Row Template]({%slug grid-templates-filter%}#filter-row-template) article.
+The template will let you have full control over the Filter Row rendering and behavior. See how you can implement it and explore the example in the [Filter Row Template](slug://grid-templates-filter#filter-row-template) article.
 
 ## See Also
 
-  * [Grid Filtering Overview]({%slug components/grid/filtering%})
+  * [Grid Filtering Overview](slug://components/grid/filtering)
   * [Live Demo: Grid Filter Row](https://demos.telerik.com/blazor-ui/grid/filter-row)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/filter/overview.md b/components/grid/filter/overview.md
index a305aa9316..643736de8d 100644
--- a/components/grid/filter/overview.md
+++ b/components/grid/filter/overview.md
@@ -15,11 +15,11 @@ This article explains the available filtering modes in the Telerik Grid for Blaz
 
 ## FilterRow
 
-The FilterRow filtering mode renders a row below the column headers, providing a UI where you can fill in the filter criteria. Read more about enabling and fine-tuning the filtering row in the [FilterRow documentation article...]({%slug grid-filter-row%})
+The FilterRow filtering mode renders a row below the column headers, providing a UI where you can fill in the filter criteria. Read more about enabling and fine-tuning the filtering row in the [FilterRow documentation article...](slug://grid-filter-row)
 
 ## FilterMenu
 
-The FilterMenu filter mode renders a button in the column header. Clicking the button opens a popup with filtering options, allowing you to apply two filter criteria, choose a filter operator, and use buttons to apply or clear the filter. Read more about enabling and fine-tuning the filtering menu in the [FilterMenu documentation article...]({%slug grid-filter-menu%})
+The FilterMenu filter mode renders a button in the column header. Clicking the button opens a popup with filtering options, allowing you to apply two filter criteria, choose a filter operator, and use buttons to apply or clear the filter. Read more about enabling and fine-tuning the filtering menu in the [FilterMenu documentation article...](slug://grid-filter-menu)
 
 > You can prevent the user from filtering a certain field by setting `Filterable="false"` on its column.
 
@@ -29,23 +29,23 @@ In addition to the two main filtering modes, the Grid offers two more features t
 
 ### ToolBar SearchBox
 
-The ToolBar of the Telerik Grid for Blazor includes a [SearchBox]({%slug grid-searchbox%}) that lets users amend filters and search across multiple fields simultaneously.
+The ToolBar of the Telerik Grid for Blazor includes a [SearchBox](slug://grid-searchbox) that lets users amend filters and search across multiple fields simultaneously.
 
 ### CheckBoxList
 
-The filter menu can display a [list of checkboxes]({%slug grid-checklist-filter%}) with distinct values from the data, making filtering similar to Excel.
+The filter menu can display a [list of checkboxes](slug://grid-checklist-filter) with distinct values from the data, making filtering similar to Excel.
 
 ## Filter Descriptors
 
-You can get the applied filtering criteria for each filtered field. Use the [Grid state]({%slug grid-state%}) or the [Grid `OnRead` event handler]({%slug grid-events%}#read-event) to obtain the user input, the filter operator and other filtering properties. Find out how in the [Data Operation Descriptors article]({%slug common-features-descriptors%}#filtering).
+You can get the applied filtering criteria for each filtered field. Use the [Grid state](slug://grid-state) or the [Grid `OnRead` event handler](slug://grid-events#read-event) to obtain the user input, the filter operator and other filtering properties. Find out how in the [Data Operation Descriptors article](slug://common-features-descriptors#filtering).
 
 ## Custom Filtering
 
 There are two approaches to customize the Grid filtering behavior, and you can use them together:
 
-* Perform the data operations yourself (e.g., by outsourcing them to some API backend or other service) - to do that, use the [`OnRead` event]({%slug components/grid/manual-operations%}). This will let you fetch only the current page of data for the Grid, instead of pulling the entire data set and storing it in-memory in the view-model.
+* Perform the data operations yourself (e.g., by outsourcing them to some API backend or other service) - to do that, use the [`OnRead` event](slug://components/grid/manual-operations). This will let you fetch only the current page of data for the Grid, instead of pulling the entire data set and storing it in-memory in the view-model.
 
-* Customize the appearance and behavior of the filters - for that, use the [Filter Templates]({%slug grid-templates-filter%}) the Grid provides.
+* Customize the appearance and behavior of the filters - for that, use the [Filter Templates](slug://grid-templates-filter) the Grid provides.
 
 
 ## Customize The Filter Editors
@@ -112,22 +112,22 @@ You can customize the filter editors declaratively for some data types. It is po
 
 The following articles and sample projects can be helpful when implementing filtering:
 
-* [Capture Filtered event]({%slug grid-state%}#onstatechanged) - the grid state lets you know when it changes so you can capture different aspects of the change.
+* [Capture Filtered event](slug://grid-state#onstatechanged) - the grid state lets you know when it changes so you can capture different aspects of the change.
 
-* [Server Filtering]({%slug components/grid/manual-operations%}) - this article explains how to implement manual data source operations so you can offload the work to the server. It provides the overview of how to setup the grid for that, and examples - several with local data and links a repository with examples using REST API endpoints.
+* [Server Filtering](slug://components/grid/manual-operations) - this article explains how to implement manual data source operations so you can offload the work to the server. It provides the overview of how to setup the grid for that, and examples - several with local data and links a repository with examples using REST API endpoints.
 
-* [Filter and Edit Enum fields]({%slug grid-kb-filter-edit-enum%})
+* [Filter and Edit Enum fields](slug://grid-kb-filter-edit-enum)
 
-* [Leave only one option in the Filter Menu]({%slug grid-kb-only-one-filtermenu-option%}) - this is a CSS approach, or you can implement a [custom filter template]({%slug grid-templates-filter%}).
+* [Leave only one option in the Filter Menu](slug://grid-kb-only-one-filtermenu-option) - this is a CSS approach, or you can implement a [custom filter template](slug://grid-templates-filter).
 
 
 ## Notes
 
-The Grid uses `Activator.CreateInstance<TItem>();` to obtain the item's type it is bound to, enabling it to generate accurate filters and filter operators. To facilitate this, ensure you define a parameterless constructor for the model. If your model has no parameterless constructor use the [`OnModelInit` event]({%slug grid-events%}#onmodelinit).
+The Grid uses `Activator.CreateInstance<TItem>();` to obtain the item's type it is bound to, enabling it to generate accurate filters and filter operators. To facilitate this, ensure you define a parameterless constructor for the model. If your model has no parameterless constructor use the [`OnModelInit` event](slug://grid-events#onmodelinit).
 
 ## See Also
 
 * [Live Demo: Grid Filter Row](https://demos.telerik.com/blazor-ui/grid/filter-row)
 * [Live Demo: Grid Filter Menu](https://demos.telerik.com/blazor-ui/grid/filter-menu)
-* [Filter the Grid by Date Only]({%slug grid-kb-filter-date-only%})
-* [Blazor Grid]({%slug grid-overview%})
+* [Filter the Grid by Date Only](slug://grid-kb-filter-date-only)
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/filter/searchbox.md b/components/grid/filter/searchbox.md
index dd770daac2..1d15d39a68 100644
--- a/components/grid/filter/searchbox.md
+++ b/components/grid/filter/searchbox.md
@@ -10,13 +10,13 @@ position: 20
 
 # Toolbar SearchBox
 
-In addition to [Grid filtering]({%slug components/grid/filtering%}), you can enhance functionality by adding a SearchBox to the [Grid Toolbar]({%slug components/grid/features/toolbar%}). This search box filters multiple Grid columns simultaneously.
+In addition to [Grid filtering](slug://components/grid/filtering), you can enhance functionality by adding a SearchBox to the [Grid Toolbar](slug://components/grid/features/toolbar). This search box filters multiple Grid columns simultaneously.
 
 Users type their query, and the Grid performs a case-insensitive Contains search on all visible string columns, adjusting the filters accordingly. To customize the filter delay and selected fields, see the [Customize the SearchBox section](#customize-the-searchbox).
 
-The SearchBox operates independently of Grid filtering, respecting existing filters and adding extra criteria to refine search results. To enable the SearchBox, include the `<GridSearchBox>` tag in the [`<GridToolBarTemplate>`]({%slug components/grid/features/toolbar%}).
+The SearchBox operates independently of Grid filtering, respecting existing filters and adding extra criteria to refine search results. To enable the SearchBox, include the `<GridSearchBox>` tag in the [`<GridToolBarTemplate>`](slug://components/grid/features/toolbar).
 
-To enable the SearchBox, add the `<GridSearchBox>` tag in the [`<GridToolBarTemplate>`]({%slug components/grid/features/toolbar%}).
+To enable the SearchBox, add the `<GridSearchBox>` tag in the [`<GridToolBarTemplate>`](slug://components/grid/features/toolbar).
 
 >caption Grid SearchBox
 
@@ -61,7 +61,7 @@ To enable the SearchBox, add the `<GridSearchBox>` tag in the [`<GridToolBarTemp
 
 ## Search From Code
 
-You can set or remove the search filters programmatically through the `SearchFilter` property of the [Grid state]({%slug grid-state%}).
+You can set or remove the search filters programmatically through the `SearchFilter` property of the [Grid state](slug://grid-state).
 
 >caption Set and clear the Grid SearchBox filter programmatically
 
@@ -80,9 +80,9 @@ The `GridSearchBox` component offers the following parameters to customize its b
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
 | `Class` | `string`| The custom CSS class that renders on the SearchBox wrapper (`<span class="k-searchbox">`). |
-| `DebounceDelay` | `int` <br /> (`300`) | The time in milliseconds between the user typing ends and the search starts. This provides a performance optimization when using the [`OnRead` event]({%slug common-features-data-binding-onread%}). Filtering does not occur on every keystroke during fast typing, unless `DebounceDelay` is set to `0`. |
-| `Fields` | `List<string>` | The collection of model properties to search in. By default, the Grid searches in all visible columns that are bound to `string` fields. You can only define a subset of those fields. It is also possible to programmatically [search in `string` fields, which are not displayed in the Grid]({%slug grid-kb-search-in-hidden-fields%}). |
-| `Placeholder` | `string` <br /> (`"Search..."`) | The textbox placeholder that hints the user what the SearchBox does. The built-in default value is [localized]({%slug globalization-localization%}). |
+| `DebounceDelay` | `int` <br /> (`300`) | The time in milliseconds between the user typing ends and the search starts. This provides a performance optimization when using the [`OnRead` event](slug://common-features-data-binding-onread). Filtering does not occur on every keystroke during fast typing, unless `DebounceDelay` is set to `0`. |
+| `Fields` | `List<string>` | The collection of model properties to search in. By default, the Grid searches in all visible columns that are bound to `string` fields. You can only define a subset of those fields. It is also possible to programmatically [search in `string` fields, which are not displayed in the Grid](slug://grid-kb-search-in-hidden-fields). |
+| `Placeholder` | `string` <br /> (`"Search..."`) | The textbox placeholder that hints the user what the SearchBox does. The built-in default value is [localized](slug://globalization-localization). |
 | `Width` | `string` | Specifies the width of the SearchBox component. |
 
 The example below demonstrates all SearchBox settings in action, and also how to move the SearchBox on the opposite side of the Grid toolbar.
@@ -143,11 +143,11 @@ The example below demonstrates all SearchBox settings in action, and also how to
 ## See Also
 
 * [Live Demo: Grid Filter Searchbox](https://demos.telerik.com/blazor-ui/grid/searchbox)
-* [Highlight or Bold Search Results in the Grid]({%slug grid-kb-search-highlight-results%})
-* [Search the Grid in Numeric and Date Model Fields]({%slug grid-kb-search-numeric-fields%})
-* [Search the Grid in Hidden Fields]({%slug grid-kb-search-in-hidden-fields%})
-* [Change Grid Search Results on Column Hide or Show]({%slug grid-kb-search-match-visible-columns%})
-* [Search the Grid with a `StartsWith` Operator]({%slug grid-kb-search-startswith%})
-* [Search the Grid on Button Click]({%slug grid-kb-search-button-click%})
-* [Grid Filtering Overview]({%slug components/grid/filtering%})
-* [Blazor Grid]({%slug grid-overview%})
+* [Highlight or Bold Search Results in the Grid](slug://grid-kb-search-highlight-results)
+* [Search the Grid in Numeric and Date Model Fields](slug://grid-kb-search-numeric-fields)
+* [Search the Grid in Hidden Fields](slug://grid-kb-search-in-hidden-fields)
+* [Change Grid Search Results on Column Hide or Show](slug://grid-kb-search-match-visible-columns)
+* [Search the Grid with a `StartsWith` Operator](slug://grid-kb-search-startswith)
+* [Search the Grid on Button Click](slug://grid-kb-search-button-click)
+* [Grid Filtering Overview](slug://components/grid/filtering)
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/grouping/aggregates.md b/components/grid/grouping/aggregates.md
index dc292d09e8..f3986af548 100644
--- a/components/grid/grouping/aggregates.md
+++ b/components/grid/grouping/aggregates.md
@@ -11,7 +11,7 @@ position: 5
 
 # Grid Aggregates
 
-The Grid component provides built-in aggregates for column values based on [grouping]({%slug components/grid/features/grouping%}) and also a grand total row.
+The Grid component provides built-in aggregates for column values based on [grouping](slug://components/grid/features/grouping) and also a grand total row.
 
 #### In this article:
 
@@ -37,9 +37,9 @@ The `Count` aggregate can be applied to any type of field. The other aggregates
 
 You can use aggregates in the following templates:
 
-* [`GroupFooterTemplate`]({%slug grid-templates-column-group-footer%}) of a `GridColumn` - a footer in the respective column that renders when the grid is grouped.
-* [`GroupHeaderTemplate`]({%slug grid-templates-group-header%}) of a `GridColumn` - a header in the respective column that renders when the grid is grouped by that column. The `Value` field in the context carries the current group value.
-* [`FooterTemplate`]({%slug grid-templates-column-footer%}) of a `GridColumn` - a grand total row of footers for the entire grid.
+* [`GroupFooterTemplate`](slug://grid-templates-column-group-footer) of a `GridColumn` - a footer in the respective column that renders when the grid is grouped.
+* [`GroupHeaderTemplate`](slug://grid-templates-group-header) of a `GridColumn` - a header in the respective column that renders when the grid is grouped by that column. The `Value` field in the context carries the current group value.
+* [`FooterTemplate`](slug://grid-templates-column-footer) of a `GridColumn` - a grand total row of footers for the entire grid.
 
 ## Access The Aggregate Values
 
@@ -189,9 +189,9 @@ To enable aggregates:
 * If you try to use an aggregate that is not defined, you will get a `null` value.
 * If you try to use an aggregate that is not compatible with `Field` type, a runtime error will occur.
 
-* If you update a field of a model the `Data` collection in the view-model, aggregates will not be updated automatically - the grid needs to re-evaluate that data first, and since this is an expensive operation a UI render does not trigger it. You can [update the data collection]({%slug grid-refresh-data%}) yourself, or fetching it anew from the service (example [here]({%slug components/grid/editing/overview%}), see how the Create/Update/Delete events fetch data anew).
+* If you update a field of a model the `Data` collection in the view-model, aggregates will not be updated automatically - the grid needs to re-evaluate that data first, and since this is an expensive operation a UI render does not trigger it. You can [update the data collection](slug://grid-refresh-data) yourself, or fetching it anew from the service (example [here](slug://components/grid/editing/overview), see how the Create/Update/Delete events fetch data anew).
 
-* If you [bind the Grid via `OnRead` event]({%slug components/grid/manual-operations%}), make sure to set `AggregateResults` in the `GridReadEventArgs` event argument object. Otherwise the Grid will calculate aggregates from the data on the current page only.
+* If you [bind the Grid via `OnRead` event](slug://components/grid/manual-operations), make sure to set `AggregateResults` in the `GridReadEventArgs` event argument object. Otherwise the Grid will calculate aggregates from the data on the current page only.
 
 <div class="skip-repl"></div>
 
@@ -210,4 +210,4 @@ private async Task OnGridRead(GridReadEventArgs args)
 ## See Also
 
 * [Live Demo: Grid Grouping](https://demos.telerik.com/blazor-ui/grid/grouping)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/grouping/load-on-demand.md b/components/grid/grouping/load-on-demand.md
index a89f4772fb..8bbe66df6b 100644
--- a/components/grid/grouping/load-on-demand.md
+++ b/components/grid/grouping/load-on-demand.md
@@ -10,7 +10,7 @@ position: 10
 
 # Load On Demand Group Data
 
-The grid component lets you load the data for each individual [group]({%slug components/grid/features/grouping%}) on demand, instead of having it always present.
+The grid component lets you load the data for each individual [group](slug://components/grid/features/grouping) on demand, instead of having it always present.
 
 In this article:
 
@@ -24,16 +24,16 @@ In this article:
 
 ## Basics
 
-To enable load-on-demand for the groups, set `LoadGroupsOnDemand="true"` for the Grid. In this mode, the Grid behaves as usual when there is no grouping, and you can use this together with [Virtual Scrolling for the rows]({%slug components/grid/virtual-scrolling%}).
+To enable load-on-demand for the groups, set `LoadGroupsOnDemand="true"` for the Grid. In this mode, the Grid behaves as usual when there is no grouping, and you can use this together with [Virtual Scrolling for the rows](slug://components/grid/virtual-scrolling).
 
-Once grouping is applied (either manually by the user, or through the Grid [state]({%slug grid-state%}#setstateasync-examples)), the groups will now show up collapsed by default. When the user expands a group, all its rows will be requested from the data source. If you provide all the `Data` to the Grid, the component will perform the operations for you. For details about server operations, see below.
+Once grouping is applied (either manually by the user, or through the Grid [state](slug://grid-state#setstateasync-examples)), the groups will now show up collapsed by default. When the user expands a group, all its rows will be requested from the data source. If you provide all the `Data` to the Grid, the component will perform the operations for you. For details about server operations, see below.
 
 Each group header, each group footer and the Grid footer will count as rows for the purposes of paging. Until you expand a group, its child items are not counted and shown in the `Total` count for the purposes of paging.
 
 
 ### Server Operations
 
-When loading data on demand through the [OnRead event]({%slug components/grid/manual-operations%}), there can be three different kinds of requests, depending on the needed data:
+When loading data on demand through the [OnRead event](slug://components/grid/manual-operations), there can be three different kinds of requests, depending on the needed data:
 
 * If there is no grouping, the request is as usual - no additional parameters or settings are added by the Grid.
 
@@ -268,9 +268,9 @@ Scroll through the groups or expand them to load their data on demand
 
 To toggle how the Grid loads groups:
 
-1. [Obtain reference to the Grid instance with `@ref`]({%slug grid-overview%}#blazor-grid-reference-and-methods).
+1. [Obtain reference to the Grid instance with `@ref`](slug://grid-overview#blazor-grid-reference-and-methods).
 1. Change the `LoadGroupsOnDemand` parameter value.
-1. [Rebind()]({%slug common-features-data-binding-overview%}#refresh-data) the Grid.
+1. [Rebind()](slug://common-features-data-binding-overview#refresh-data) the Grid.
 
 >caption Switch the Grid group load mode
 
@@ -362,11 +362,11 @@ To toggle how the Grid loads groups:
 
 * Since group headers and footers are treated like rows in the grid, the group headers may remain on a previous page from the data when you page the grid.
 
-* If the group load on demand is used in combination with [virtual scrolling]({%slug components/grid/virtual-scrolling%}):
+* If the group load on demand is used in combination with [virtual scrolling](slug://components/grid/virtual-scrolling):
 
     * All requirements and limitations of virtual scrolling apply.
     
-    * [Aggregates]({%slug grid-aggregates%}) are not supported.
+    * [Aggregates](slug://grid-aggregates) are not supported.
 
 * When exporting only the current Grid page (`AllPages="false"`), the exported file will not contain child data for collapsed groups.
 
@@ -374,4 +374,4 @@ To toggle how the Grid loads groups:
 ## See Also
 
 * [Live Demo: Grid Group Load On Demand](https://demos.telerik.com/blazor-ui/grid/group-loadondemand)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/grouping/overview.md b/components/grid/grouping/overview.md
index 527df125e6..0e41de1ee7 100644
--- a/components/grid/grouping/overview.md
+++ b/components/grid/grouping/overview.md
@@ -31,7 +31,7 @@ To remove a group setting, click the `[x]` button on its indicator in the group
 
 To prevent grouping by a field, set `Groupable="false"` on its column. This can be useful for fields with unique values like IDs or names.
 
-You can also use [aggregates]({%slug grid-aggregates%}) for the grouped data.
+You can also use [aggregates](slug://grid-aggregates) for the grouped data.
 
 >caption Enable grouping in Telerik Grid
 
@@ -81,16 +81,16 @@ Drag the column header of the "Team" and/or "On Vacation" column to the group pa
 
 ## Aggregates
 
-The grid lets you define and use aggregates that it can calculate for you. You can read more about using them in the [Aggregates]({%slug grid-aggregates%}) article.
+The grid lets you define and use aggregates that it can calculate for you. You can read more about using them in the [Aggregates](slug://grid-aggregates) article.
 
 ## Load On Demand
 
-The grid can load the grouped data on demand only. This can be useful if you have many groups and you want the user to first scroll through them without having to load all their data at once. Instead, the child items for a group can be loaded only when the user expands the group. This mode can also be used with Virtual Scrolling. You can read more about this feature in the [Grid - Load Group Data On Demand]({%slug grid-group-lod%}) article.
+The grid can load the grouped data on demand only. This can be useful if you have many groups and you want the user to first scroll through them without having to load all their data at once. Instead, the child items for a group can be loaded only when the user expands the group. This mode can also be used with Virtual Scrolling. You can read more about this feature in the [Grid - Load Group Data On Demand](slug://grid-group-lod) article.
 
 
 ## Group From Code
 
-You can group the Grid from your code through the [Grid state]({%slug grid-state%}). This is possible even if `Groupable="false"` and the group panel is not visible. You can define the list of fields by which the grid is grouped and indexes of groups that will be collapsed (all groups are expanded by default).
+You can group the Grid from your code through the [Grid state](slug://grid-state). This is possible even if `Groupable="false"` and the group panel is not visible. You can define the list of fields by which the grid is grouped and indexes of groups that will be collapsed (all groups are expanded by default).
 
 @[template](/_contentTemplates/grid/state.md#initial-state)
 
@@ -104,16 +104,16 @@ You can group the Grid from your code through the [Grid state]({%slug grid-state
 
 The following articles and sample projects can be helpful when implementing grouping:
 
-* [Capture Group event]({%slug grid-state%}#onstatechanged) - the grid state lets you know when it changes so you can capture different aspects of the change.
+* [Capture Group event](slug://grid-state#onstatechanged) - the grid state lets you know when it changes so you can capture different aspects of the change.
 
-* [Server Grouping]({%slug components/grid/manual-operations%}) - this article explains how to implement manual data source operations so you can offload the work to the server. It provides the overview of how to setup the grid for that, and examples - several with local data and links a repository with examples using REST API endpoints.
+* [Server Grouping](slug://components/grid/manual-operations) - this article explains how to implement manual data source operations so you can offload the work to the server. It provides the overview of how to setup the grid for that, and examples - several with local data and links a repository with examples using REST API endpoints.
 
-* [Static group that is always present]({%slug grid-kb-static-group%})
+* [Static group that is always present](slug://grid-kb-static-group)
 
 ## See Also
 
   * [Live Demo: Grid Grouping](https://demos.telerik.com/blazor-ui/grid/grouping)
-  * [Grid Aggregates]({%slug grid-aggregates%})
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Grid Aggregates](slug://grid-aggregates)
+  * [Blazor Grid](slug://grid-overview)
    
   
diff --git a/components/grid/hierarchy.md b/components/grid/hierarchy.md
index 94f404c460..778ef136e9 100644
--- a/components/grid/hierarchy.md
+++ b/components/grid/hierarchy.md
@@ -86,16 +86,16 @@ Click the + icon to expand the row details
 
 ![Blazor Hierarchy Grid In Grid](images/hierarchy-grid-in-grid.png)
 
->tip To have more levels, simply nest more grids and name the `context` variables. You can find an example in the [Multi-Level Hierarchy]({%slug grid-three-level-hierarchy%}) KB article.
+>tip To have more levels, simply nest more grids and name the `context` variables. You can find an example in the [Multi-Level Hierarchy](slug://grid-three-level-hierarchy) KB article.
 
 
 ## Expand Rows From Code
 
-You can choose which detail templates will be expanded from your code through the grid [state]({%slug grid-state%}). Its `ExpandedItems` field contains a collection of the expanded Grid items (all detail templates are collapsed by default).
+You can choose which detail templates will be expanded from your code through the grid [state](slug://grid-state). Its `ExpandedItems` field contains a collection of the expanded Grid items (all detail templates are collapsed by default).
 
 The `ExpandedItems` collection is compared against the Grid Data collection in order to determine which rows will be expanded. The default behavior of the framework is to compare objects by their reference.
 
-When the `ExpandedItems` are obtained from a different data source to the Grid (e.g., from a separate service method and not from the view-model), the references may not match and so there will be no expanded items. In such cases, you have to override the [`Equals`](https://docs.microsoft.com/en-us/dotnet/api/system.object.equals) method of the underlying model class so that it matches them, for example, by a unique identifier rather than by reference so that two objects can be equal regardless of their origin, but according to their contents. When you are overriding the `Equals` method, it is also recommended to override the [`GetHashCode`](https://docs.microsoft.com/en-us/dotnet/api/system.object.gethashcode) method as well. A similar example is available at [Save and Load Grid State from Browser LocalStorage]({%slug grid-kb-save-load-state-localstorage%}).
+When the `ExpandedItems` are obtained from a different data source to the Grid (e.g., from a separate service method and not from the view-model), the references may not match and so there will be no expanded items. In such cases, you have to override the [`Equals`](https://docs.microsoft.com/en-us/dotnet/api/system.object.equals) method of the underlying model class so that it matches them, for example, by a unique identifier rather than by reference so that two objects can be equal regardless of their origin, but according to their contents. When you are overriding the `Equals` method, it is also recommended to override the [`GetHashCode`](https://docs.microsoft.com/en-us/dotnet/api/system.object.gethashcode) method as well. A similar example is available at [Save and Load Grid State from Browser LocalStorage](slug://grid-kb-save-load-state-localstorage).
 
 @[template](/_contentTemplates/grid/state.md#initial-state)
 
@@ -109,13 +109,13 @@ When the `ExpandedItems` are obtained from a different data source to the Grid (
 
 The following articles and sample projects can be helpful when implementing hierarchy:
 
-* [Editing in Hierarchy]({%slug grid-kb-editing-in-hierarchy%})
+* [Editing in Hierarchy](slug://grid-kb-editing-in-hierarchy)
 
 * [Load Hierarchical Data On Demand](https://github.com/telerik/blazor-ui/tree/master/grid/load-on-demand-hierarchy)
 
-* [Multi-Level Hierarchy]({%slug grid-three-level-hierarchy%})
+* [Multi-Level Hierarchy](slug://grid-three-level-hierarchy)
 
-* [Align Columns in Nested Grids]({%slug grid-kb-align-columns-hierarchy%})
+* [Align Columns in Nested Grids](slug://grid-kb-align-columns-hierarchy)
 
 * [Custom Excel Export that Includes Hierarchy](https://github.com/telerik/blazor-ui/tree/master/grid/export-to-xlsx-hierarchy)
 
@@ -126,7 +126,7 @@ The following articles and sample projects can be helpful when implementing hier
 ## See Also
 
   * [Live Demo: Grid Hierarchy](https://demos.telerik.com/blazor-ui/grid/hierarchy)
-  * [KB: Customize Hierarchy Expand Column in Blazor Grid]({%slug grid-kb-customize-hierarchy-expand-column-blazor-grid%})
-  * [Blazor Grid]({%slug grid-overview%})
+  * [KB: Customize Hierarchy Expand Column in Blazor Grid](slug://grid-kb-customize-hierarchy-expand-column-blazor-grid)
+  * [Blazor Grid](slug://grid-overview)
    
   
diff --git a/components/grid/loading-animation.md b/components/grid/loading-animation.md
index 9a030ad6c0..8476b35ebd 100644
--- a/components/grid/loading-animation.md
+++ b/components/grid/loading-animation.md
@@ -18,22 +18,22 @@ The animation appears as a loading indicator over the Blazor Data Grid.
 
 The Grid `EnableLoaderContainer` parameter determines if the component will show a built-in LoaderContainer for long-running operations. The loading animation is enabled by default. The data operations that trigger the loading animation include:
 
-* [Paging]({%slug components/grid/features/paging%})
-* [Filtering]({%slug components/grid/filtering%})
-* [Sorting]({%slug components/grid/features/sorting%})
-* [Grouping]({%slug components/grid/features/grouping%}) 
-* [Expanding groups with load-on-demand]({%slug grid-group-lod%})
-* [Creating, deleting or editing records]({%slug components/grid/editing/overview%})
+* [Paging](slug://components/grid/features/paging)
+* [Filtering](slug://components/grid/filtering)
+* [Sorting](slug://components/grid/features/sorting)
+* [Grouping](slug://components/grid/features/grouping) 
+* [Expanding groups with load-on-demand](slug://grid-group-lod)
+* [Creating, deleting or editing records](slug://components/grid/editing/overview)
 
 ## Show LoaderContainer on Initial Load
 
 The Grid does not display a loading animation during its initial rendering and data load. The component cannot know when or even if data will be provided to it, especially when using the Grid `Data` parameter. An initial automatic loading sign can either show indefinitely, or it could prevent the user from altering any saved Grid state (such as changing filters).
 
-If you want to display a loading animation on initial load, you can use a [LoaderContainer component]({%slug loadercontainer-overview%}). See the example below or the [Grid Loading Animation Live Demo](https://demos.telerik.com/blazor-ui/grid/loading-animation).
+If you want to display a loading animation on initial load, you can use a [LoaderContainer component](slug://loadercontainer-overview). See the example below or the [Grid Loading Animation Live Demo](https://demos.telerik.com/blazor-ui/grid/loading-animation).
 
 ## Example
 
-The following example binds the Grid with an [`OnRead` event handler]({%slug common-features-data-binding-onread%}). To show an external initial [LoaderContainer over the Grid]({%slug loadercontainer-overview%}#fill-a-parent-container) when using the `Data` parameter, you can control the LoaderContainer's rendering or visibility, depending on whether the data collection is null.
+The following example binds the Grid with an [`OnRead` event handler](slug://common-features-data-binding-onread). To show an external initial [LoaderContainer over the Grid](slug://loadercontainer-overview#fill-a-parent-container) when using the `Data` parameter, you can control the LoaderContainer's rendering or visibility, depending on whether the data collection is null.
 
 >caption Using an external and the built-in Grid loading animation
 
@@ -119,6 +119,6 @@ The following example binds the Grid with an [`OnRead` event handler]({%slug com
 
 ## See Also
 
-* [Grid Data Binding]({%slug grid-data-binding%})
+* [Grid Data Binding](slug://grid-data-binding)
 * [Live Demo: Grid Loading Animation](https://demos.telerik.com/blazor-ui/grid/loading-animation)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/manual-operations.md b/components/grid/manual-operations.md
index 5cfa03c734..c397c600fb 100644
--- a/components/grid/manual-operations.md
+++ b/components/grid/manual-operations.md
@@ -10,11 +10,11 @@ position: 55
 
 # Manual Data Source Operations
 
-By default, the Grid will receive the entire collection of data, and it will perform the necessary operations (like [paging]({%slug components/grid/features/paging%}), [sorting]({%slug components/grid/features/sorting%}), [filtering]({%slug components/grid/filtering%})) internally.
+By default, the Grid will receive the entire collection of data, and it will perform the necessary operations (like [paging](slug://components/grid/features/paging), [sorting](slug://components/grid/features/sorting), [filtering](slug://components/grid/filtering)) internally.
 
-You can perform all data operations yourself (e.g. on the server) and load data on demand by using the `OnRead` event of the Grid. The data source will be read after each [CUD operation]({%slug components/grid/editing/overview%}) as well, to ensure fresh data.
+You can perform all data operations yourself (e.g. on the server) and load data on demand by using the `OnRead` event of the Grid. The data source will be read after each [CUD operation](slug://components/grid/editing/overview) as well, to ensure fresh data.
 
->tip Make sure to get familiar with all the general [`OnRead` event documentation]({%slug common-features-data-binding-onread%}) first.
+>tip Make sure to get familiar with all the general [`OnRead` event documentation](slug://common-features-data-binding-onread) first.
 
 
 ## Examples
@@ -32,7 +32,7 @@ Examples:
 * [Get Information From the DataSourceRequest](#get-information-from-the-datasourcerequest)
 * [Use OData Service](https://github.com/telerik/blazor-ui/tree/master/grid/odata)
 * [Serialize the DataSoureRequest to the server](https://github.com/telerik/blazor-ui/tree/master/grid/datasourcerequest-on-server)
-* [Debounce Data Source Operations and Requests]({%slug grid-kb-debounce-operations%})
+* [Debounce Data Source Operations and Requests](slug://grid-kb-debounce-operations)
 
 ## Custom paging with a remote service
 
@@ -203,7 +203,7 @@ Thus, to use the `OnRead` event with grouping, you must:
 1. Use an `IEnumerable<object>` for the Grid data.
     * This is required so the special data structure for grouped data can be used, otherwise you will get compile-time errors.
 1. Set the `FieldType` of the columns to match the type of the field you will be showing.
-    * If you also use [filtering]({%slug components/grid/filtering%}), do not use nullable types. For example, if the model field is `int?`, set `FieldType="@(typeof(int))"`.
+    * If you also use [filtering](slug://components/grid/filtering), do not use nullable types. For example, if the model field is `int?`, set `FieldType="@(typeof(int))"`.
     * This is required because the grid is not bound to a specific type anymore, but to an `object`, and cannot infer the column type in order to define filters and new items.
 1. Prepare the appropriate group collections.
     * The example below shows a simple way through the Telerik `.ToDataSourceResult` extension method that is easy to use when you have all the data, or when you can pass objects by reference, like in a server-side Blazor app.
@@ -285,12 +285,12 @@ This sample shows how to set up the grid to use grouping with manual data source
 
 >note Since the grid does not have the type of the data models (it is bound to `IEnumerable<object>`), it uses the first item in the available data to infer the type. If there is no data, this type will be unavailable and the grid will be unable to create an item to insert. The filters can get the proper operators list from the `FieldType`, but an entire model cannot be constructed by the grid. 
 >
-> Thus, clicking the built-in Add command button on its toolbar when there is no data will produce a `null` item and if you have editor templates, there may be null reference errors (the `context` will be `null`). To avoid that, you can [initiate insertion of items through the grid state]({%slug grid-kb-add-edit-state%}) in order to ensure a model reference exists.
+> Thus, clicking the built-in Add command button on its toolbar when there is no data will produce a `null` item and if you have editor templates, there may be null reference errors (the `context` will be `null`). To avoid that, you can [initiate insertion of items through the grid state](slug://grid-kb-add-edit-state) in order to ensure a model reference exists.
 
 
 ## Aggregates with OnRead
 
-When using [aggregates]({%slug grid-aggregates%}) with `OnRead`, the Grid expects you to set one more property of the `GridReadEventArgs` object - `AggregateResults`. Otherwise the component will show aggregate values for the current page only.
+When using [aggregates](slug://grid-aggregates) with `OnRead`, the Grid expects you to set one more property of the `GridReadEventArgs` object - `AggregateResults`. Otherwise the component will show aggregate values for the current page only.
 
 <div class="skip-repl"></div>
 
@@ -391,10 +391,10 @@ With a few simple loops, you can extract information from the DataSourceRequest
 
 ## See Also
 
-* [CRUD Operations Overview]({%slug components/grid/editing/overview%})
+* [CRUD Operations Overview](slug://components/grid/editing/overview)
 * [Live Demo: Manual Data Source Operations](https://demos.telerik.com/blazor-ui/grid/manual-operations)
 * [Use OData Service](https://github.com/telerik/blazor-ui/tree/master/grid/odata)
 * [Custom Server Operations](https://github.com/telerik/blazor-ui/tree/master/grid/datasourcerequest-on-server)
 * [DataSourceRequest Object API](/blazor-ui/api/Telerik.DataSource.DataSourceRequest)
 * [DataSourceResult Object API](/blazor-ui/api/Telerik.DataSource.DataSourceResult)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/overview.md b/components/grid/overview.md
index c6bfed5993..2fca0d15ac 100644
--- a/components/grid/overview.md
+++ b/components/grid/overview.md
@@ -20,9 +20,9 @@ The Telerik Blazor grid is built on native Blazor from the ground up, by a compa
 ## Creating Blazor Grid
 
 1. Use the `TelerikGrid` tag.
-1. Assign the Grid `Data` parameter to an `IEnumerable<T>` property, **or** use the [`OnRead` event]({%slug common-features-data-binding-onread%}). We'll go with `Data` this time. The [Grid Data Binding article]({%slug grid-data-binding%}) compares the two alternatives.
+1. Assign the Grid `Data` parameter to an `IEnumerable<T>` property, **or** use the [`OnRead` event](slug://common-features-data-binding-onread). We'll go with `Data` this time. The [Grid Data Binding article](slug://grid-data-binding) compares the two alternatives.
 1. (optional) Enable some data operations like paging, sorting or filtering.
-1. Add [`GridColumn`]({%slug components/grid/columns/bound%}) instances under the `GridColumns` tag. Each column `Field` should point to the model property to display. Use `nameof()` or the plain field name. Define user-friendly column `Title`s or [`DisplayFormat` for numeric and date values]({%slug grid-columns-displayformat%}).
+1. Add [`GridColumn`](slug://components/grid/columns/bound) instances under the `GridColumns` tag. Each column `Field` should point to the model property to display. Use `nameof()` or the plain field name. Define user-friendly column `Title`s or [`DisplayFormat` for numeric and date values](slug://grid-columns-displayformat).
 
 >caption Get started with the Blazor Grid
 
@@ -92,18 +92,18 @@ If you prefer video instructions, watch this short Blazor Grid video tutorial. I
 
 ## Data Binding
 
-The are [two main ways to provide data to the Grid - via the `Data` parameter and via the `OnRead` event]({%slug grid-data-binding%}). `Data` provides **simplicity**, while `OnRead` allows more **flexibility** in complex scenarios, and **performance** when there is a lot of data.
+The are [two main ways to provide data to the Grid - via the `Data` parameter and via the `OnRead` event](slug://grid-data-binding). `Data` provides **simplicity**, while `OnRead` allows more **flexibility** in complex scenarios, and **performance** when there is a lot of data.
 
 
 ## Data Operations
 
 The Blazor Grid supports all fundamental data operations out-of-the-box:
 
-* [Paging]({%slug components/grid/features/paging%}) or alternatively, [virtual scrolling]({%slug components/grid/virtual-scrolling%})
-* [Sorting]({%slug components/grid/features/sorting%})
-* [Filtering]({%slug components/grid/filtering%})
-* [Grouping]({%slug components/grid/features/grouping%}). The Grid can also [load the data for each group on demand]({%slug grid-group-lod%}).
-* [Aggregates]({%slug grid-aggregates%})
+* [Paging](slug://components/grid/features/paging) or alternatively, [virtual scrolling](slug://components/grid/virtual-scrolling)
+* [Sorting](slug://components/grid/features/sorting)
+* [Filtering](slug://components/grid/filtering)
+* [Grouping](slug://components/grid/features/grouping). The Grid can also [load the data for each group on demand](slug://grid-group-lod).
+* [Aggregates](slug://grid-aggregates)
 
 
 ## Editing
@@ -112,44 +112,44 @@ The Grid can perform CRUD operations on its current data - add, edit and delete
 
 The Grid offers several editing modes with different user experience - incell, inline and popup.
 
-See [Grid CRUD Operations Overview]({%slug components/grid/editing/overview%}) for more details.
+See [Grid CRUD Operations Overview](slug://components/grid/editing/overview) for more details.
 
 
 ## Virtualization
 
 The Blazor Grid features UI virtualization to improve browser performance:
 
-* [Row virtualization]({%slug components/grid/virtual-scrolling%})
-* [Column virtualization]({%slug grid-columns-virtual%})
+* [Row virtualization](slug://components/grid/virtual-scrolling)
+* [Column virtualization](slug://grid-columns-virtual)
 
 
 ## Column Features
 
 The Grid columns offer a rich set of functionality to enable immense flexibility for your application scenarios. The main column features include:
 
-* [Display Format]({%slug grid-columns-displayformat%}) for numeric and date values
-* [Resizing]({%slug components/grid/columns/resize%})
-* [Reodering]({%slug components/grid/columns/reorder%})
-* [Column Menu]({%slug grid-column-menu%}) to control data operations and column visibility
-* [Frozen columns]({%slug grid-columns-frozen%}), which do not scroll horizontally (also called locked columns)
-* [Multi-column Headers]({%slug grid-columns-multiple-column-headers%}) to group multiple column headers under a single parent header
-* [Column Events]({%slug grid-column-events%})
-* [Visibility]({%slug grid-columns-visible%}) and [Width]({%slug grid-columns-width%})
+* [Display Format](slug://grid-columns-displayformat) for numeric and date values
+* [Resizing](slug://components/grid/columns/resize)
+* [Reodering](slug://components/grid/columns/reorder)
+* [Column Menu](slug://grid-column-menu) to control data operations and column visibility
+* [Frozen columns](slug://grid-columns-frozen), which do not scroll horizontally (also called locked columns)
+* [Multi-column Headers](slug://grid-columns-multiple-column-headers) to group multiple column headers under a single parent header
+* [Column Events](slug://grid-column-events)
+* [Visibility](slug://grid-columns-visible) and [Width](slug://grid-columns-width)
 
 
 ## Templates
 
-The Grid supports custom content in various parts of the component such as data cells, headers, footers, editors and more. See [Grid Templates]({%slug components/grid/features/templates%}).
+The Grid supports custom content in various parts of the component such as data cells, headers, footers, editors and more. See [Grid Templates](slug://components/grid/features/templates).
 
 
 ## More Blazor Grid Features
 
-* [Selection]({%slug grid-selection-overview%})—select one or multiple rows through clicks or checkboxes or select one or multiple cells through clicks.
-* [State]({%slug grid-state%})—get or set the Grid configuration programmatically.
-* [Toolbar]({%slug components/grid/features/toolbar%})—define user actions in a toolbar above the header cells.
-* [Hierarchy]({%slug components/grid/features/hierarchy%})—nest Grids and visualize parent-child relations between data records.
-* [Drag and drop rows]({%slug grid-drag-drop-overview%})—move rows in a Grid or between different Grids.
-* [Loading animation]({%slug grid-loading%})—show a loading animation to improve user experience during long data operations.
+* [Selection](slug://grid-selection-overview)—select one or multiple rows through clicks or checkboxes or select one or multiple cells through clicks.
+* [State](slug://grid-state)—get or set the Grid configuration programmatically.
+* [Toolbar](slug://components/grid/features/toolbar)—define user actions in a toolbar above the header cells.
+* [Hierarchy](slug://components/grid/features/hierarchy)—nest Grids and visualize parent-child relations between data records.
+* [Drag and drop rows](slug://grid-drag-drop-overview)—move rows in a Grid or between different Grids.
+* [Loading animation](slug://grid-loading)—show a loading animation to improve user experience during long data operations.
 * Scrolling—the Grid will show standard scrollbars automatically if the data does not fit the current component width and height.
 
 
@@ -161,21 +161,21 @@ The following table lists Grid parameters, which are not discussed elsewhere in
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | Additional CSS class for the `<div class="k-grid">` element. Use it to apply custom styles or [override the theme]({%slug themes-override%}). For example, [change the Grid font size]({%slug grid-kb-change-font-size%}). |
-| `Height` | `string` | A height style in [any supported CSS unit]({%slug common-features/dimensions%}). You can also [make the Grid height change automatically with the browser window]({%slug grid-kb-adjust-height-with-browser%}). |
-| `Navigable` | `bool` | Enables [keyboard navigation]({%slug accessibility-overview%}#keyboard-navigation). |
-| `Width` | `string` | A width style in [any supported CSS unit]({%slug common-features/dimensions%}). The Grid has no default width, but expands horizontally to fill its container. |
+| `Class` | `string` | Additional CSS class for the `<div class="k-grid">` element. Use it to apply custom styles or [override the theme](slug://themes-override). For example, [change the Grid font size](slug://grid-kb-change-font-size). |
+| `Height` | `string` | A height style in [any supported CSS unit](slug://common-features/dimensions). You can also [make the Grid height change automatically with the browser window](slug://grid-kb-adjust-height-with-browser). |
+| `Navigable` | `bool` | Enables [keyboard navigation](slug://accessibility-overview#keyboard-navigation). |
+| `Width` | `string` | A width style in [any supported CSS unit](slug://common-features/dimensions). The Grid has no default width, but expands horizontally to fill its container. |
 
 
 ## Blazor Grid Reference and Methods
 
 The Grid has methods to execute actions such as:
 
-* [rebind to refresh the data]({%slug grid-refresh-data%}#rebind-method)
-* [export to Excel]({%slug grid-export-excel%}) and other formats
-* [automatically resize columns to fit their content]({%slug components/grid/columns/resize%}#autofit-columns)
-* [get or set the Grid configuration state]({%slug grid-state%})
-* [get the dragged data item and its drop index from the destination Grid instance]({%slug grid-drag-drop-overview%})
+* [rebind to refresh the data](slug://grid-refresh-data#rebind-method)
+* [export to Excel](slug://grid-export-excel) and other formats
+* [automatically resize columns to fit their content](slug://components/grid/columns/resize#autofit-columns)
+* [get or set the Grid configuration state](slug://grid-state)
+* [get the dragged data item and its drop index from the destination Grid instance](slug://grid-drag-drop-overview)
 
 To execute these methods, obtain reference to the Grid instance via `@ref`.
 
@@ -219,11 +219,11 @@ To execute these methods, obtain reference to the Grid instance via `@ref`.
 
 ## Next Steps
 
-* [Explore Grid data binding]({%slug grid-data-binding%})
-* [Learn about Grid columns]({%slug components/grid/columns/bound%})
+* [Explore Grid data binding](slug://grid-data-binding)
+* [Learn about Grid columns](slug://components/grid/columns/bound)
 
 ## See Also
 
 * [Live Demos: Grid](https://demos.telerik.com/blazor-ui/grid/overview)
 * [Grid API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikGrid-1)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/paging.md b/components/grid/paging.md
index 991d8db6fa..c6d597b22d 100644
--- a/components/grid/paging.md
+++ b/components/grid/paging.md
@@ -44,7 +44,7 @@ Enable paging and start on the second page.
 }
 ````
 
->note If you want to bind the page index to a variable, you must use two-way binding - the `@bind-Page="@MyPageIndexVariable"` syntax. If you only use one-way binding -  `Page="@MyPageIndexVariable"` - the grid will reset to the value of that parameter on every re-render. If you choose to use one-way binding, you must update the field value in the [`PageChanged` event]({%slug grid-events%}#pagechanged) to avoid that.
+>note If you want to bind the page index to a variable, you must use two-way binding - the `@bind-Page="@MyPageIndexVariable"` syntax. If you only use one-way binding -  `Page="@MyPageIndexVariable"` - the grid will reset to the value of that parameter on every re-render. If you choose to use one-way binding, you must update the field value in the [`PageChanged` event](slug://grid-events#pagechanged) to avoid that.
 
 Here is one way to implement a page size choice that puts all records on one page.
 
@@ -89,11 +89,11 @@ Dynamic page size change
 
 ## Events
 
-The Grid exposes several relevant events. You can find related examples in the [Events]({%slug grid-events%}) article.
+The Grid exposes several relevant events. You can find related examples in the [Events](slug://grid-events) article.
 
 * `PageChanged` - you can use this to react to the user changing the page.
 * `PageSizeChanged` - fires when the user changes the page size via the pager DropDownList.
-* `OnRead` - you can use this to perform the read operation yourself on demand, instead of providing the entire data source at once. You can read more about this in the [Manual Data Source Operations]({%slug components/grid/manual-operations%}) article.
+* `OnRead` - you can use this to perform the read operation yourself on demand, instead of providing the entire data source at once. You can read more about this in the [Manual Data Source Operations](slug://components/grid/manual-operations) article.
 
 ## Pager Settings  
 
@@ -132,13 +132,13 @@ In addition to `Page` and `PageSize`, the Grid provides advanced pager configura
 
 The following articles and sample projects can be helpful when implementing paging:
 
-* [Capture PageChanged event]({%slug grid-events%}#pagechanged)
+* [Capture PageChanged event](slug://grid-events#pagechanged)
 
-* [Server Paging]({%slug components/grid/manual-operations%}) - this article explains how to implement manual data source operations so you can offload the work to the server. It provides the overview of how to setup the grid for that, and examples - several with local data and links a repository with examples using REST API endpoints.
+* [Server Paging](slug://components/grid/manual-operations) - this article explains how to implement manual data source operations so you can offload the work to the server. It provides the overview of how to setup the grid for that, and examples - several with local data and links a repository with examples using REST API endpoints.
 
-* [How to increase the pager dropdownlist width]({%slug pager-kb-dropdown-width%})
+* [How to increase the pager dropdownlist width](slug://pager-kb-dropdown-width)
 
 ## See Also
 
   * [Live Demo: Grid Paging](https://demos.telerik.com/blazor-ui/grid/paging)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/refresh-data.md b/components/grid/refresh-data.md
index ff745fa4ba..cbae8196d3 100644
--- a/components/grid/refresh-data.md
+++ b/components/grid/refresh-data.md
@@ -22,7 +22,7 @@ In this article:
 
 ## Rebind Method
 
-You can refresh the Grid data by using the `Rebind` method exposed to the reference of the TelerikGrid. If you have manually defined the [OnRead event]({%slug components/grid/manual-operations%}) the business logic defined in its event handler will be executed. 
+You can refresh the Grid data by using the `Rebind` method exposed to the reference of the TelerikGrid. If you have manually defined the [OnRead event](slug://components/grid/manual-operations) the business logic defined in its event handler will be executed. 
 
 ````RAZOR
 @* Clicking on the Rebind button will change the Name of the first item in the Grid and refresh the data *@
@@ -255,14 +255,14 @@ You can refresh the Grid data by using the `Rebind` method exposed to the refere
 }
 ````
 
->note You can find some more explanations and examples for the Grid component in the [Force a Grid to Refresh]({%slug grid-force-refresh%}) Knowledge Base article.
+>note You can find some more explanations and examples for the Grid component in the [Force a Grid to Refresh](slug://grid-force-refresh) Knowledge Base article.
 
 
 ## Call OnRead
 
-If you are [using the `OnRead` event to optimize the data requests]({%slug components/grid/manual-operations%}), you may want to call that to fetch fresh data from the server. The Grid does that automatically after the [edit operations]({%slug components/grid/editing/overview%}), yet you may need to do it on your own.
+If you are [using the `OnRead` event to optimize the data requests](slug://components/grid/manual-operations), you may want to call that to fetch fresh data from the server. The Grid does that automatically after the [edit operations](slug://components/grid/editing/overview), yet you may need to do it on your own.
 
-To make the Grid fire `OnRead`, execute its [`SetStateAsync` method]({%slug grid-state%})
+To make the Grid fire `OnRead`, execute its [`SetStateAsync` method](slug://grid-state)
 
 >caption Make the grid call OnRead by using its state
 
@@ -365,7 +365,7 @@ The reason for such behavior is that the `Data` collection of the grid is a sepa
 
 This means that you need to ensure that the view-model will be updated as well, so that the `Data` parameter of the grid changes too. There are, generally, two ways to do this:
 
-* Use the [`OnRead` event to perform the grid data operations]({%slug components/grid/manual-operations%}) - the grid will call it after the [CUD events like `OnUpdate`, `OnDelete`, `OnCreate`]({%slug components/grid/editing/overview%}#notes) and it will let you query the database that was already update (which will also bring in other updates that other uses may have made).
+* Use the [`OnRead` event to perform the grid data operations](slug://components/grid/manual-operations) - the grid will call it after the [CUD events like `OnUpdate`, `OnDelete`, `OnCreate`](slug://components/grid/editing/overview#notes) and it will let you query the database that was already update (which will also bring in other updates that other uses may have made).
 
 * Update the local view-model data yourself with the information the grid event gives you (e.g., insert the new item in it, or remove a deleted item, or update the fields of an edited item). You can find similar code used in the [Grid - Inline Editing Live Demo](https://demos.telerik.com/blazor-ui/grid/editing-inline).
 
@@ -374,8 +374,8 @@ This means that you need to ensure that the view-model will be updated as well,
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
-  * [Knowledge Base: Force a Grid to Refresh]({%slug grid-force-refresh%})
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Knowledge Base: Force a Grid to Refresh](slug://grid-force-refresh)
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/row-drag-drop.md b/components/grid/row-drag-drop.md
index 95a83fe4b3..62412be98b 100644
--- a/components/grid/row-drag-drop.md
+++ b/components/grid/row-drag-drop.md
@@ -132,12 +132,12 @@ This section contains the following examples:
 
 ### Drag and Drop a Row between Grids
 
-When you drag and drop items from one Grid to another, the `OnRowDrop` event fires for both Grid instances, so you can update their data sources. All Grid instances must be bound to the same model type. It is also possible to [bind the Grids to different models, but they must be derived from the same interface]({%slug grid-kb-drag-drop-different-models%}).
+When you drag and drop items from one Grid to another, the `OnRowDrop` event fires for both Grid instances, so you can update their data sources. All Grid instances must be bound to the same model type. It is also possible to [bind the Grids to different models, but they must be derived from the same interface](slug://grid-kb-drag-drop-different-models).
 
 The target drop area in the Grid is the `<table>` element. Users cannot drop items in the empty space below the last table row and this includes the `NoDataTemplate` too. There are two ways to prevent possible confusion and enhance the UX:
 
 * Do not set a Grid `Height`, so that there is no empty space below the last table row.
-* Define a [`NoDataTemplate`]({%slug grid-templates-no-data%}), which fills the Grid data area.
+* Define a [`NoDataTemplate`](slug://grid-templates-no-data), which fills the Grid data area.
 
 The following example demonstrates both these options:
 
@@ -248,7 +248,7 @@ The following example demonstrates both these options:
 
 ### Drag and Drop between Grid, TreeList, TreeView and Scheduler
 
-The functionality allows dragging items between Grid, [TreeList]({%slug treelist-drag-drop-overview%}), [TreeView]({%slug treeview-drag-drop-overview%}), and [Scheduler]({%slug scheduler-overview%}). To achieve it, set the `Draggable`/`RowDraggable` parameter, and implement it through an event -  `OnDrop`/`OnRowDrop`.
+The functionality allows dragging items between Grid, [TreeList](slug://treelist-drag-drop-overview), [TreeView](slug://treeview-drag-drop-overview), and [Scheduler](slug://scheduler-overview). To achieve it, set the `Draggable`/`RowDraggable` parameter, and implement it through an event -  `OnDrop`/`OnRowDrop`.
 
 >important Drag and Drop from **Scheduler** to Grid, TreeList, TreeView is **not** yet supported. Only the reversed way.
 
@@ -1691,7 +1691,7 @@ public class Resource
 
 ### Drag and Drop multiple Rows
 
-You can drag and drop multiple rows in one or between multiple instances of the Grid. To enable it, you should set the [`SelectionMode` parameter]({%slug grid-selection-overview%}) of the TelerikGrid to `GridSelectionMode.Multiple`. Then, if you drag a selected row, you will effectively drag all the selected rows.
+You can drag and drop multiple rows in one or between multiple instances of the Grid. To enable it, you should set the [`SelectionMode` parameter](slug://grid-selection-overview) of the TelerikGrid to `GridSelectionMode.Multiple`. Then, if you drag a selected row, you will effectively drag all the selected rows.
 
 When you select multiple rows, the row drag clue will be `N items selected` where `N` is the number of selected rows.
 
@@ -1764,12 +1764,12 @@ When you select multiple rows, the row drag clue will be `N items selected` wher
 
 List on known limitations for the Grid Drag and Drop features:
 
-* [Grouping]({%slug components/grid/features/grouping%}) is not supported.
+* [Grouping](slug://components/grid/features/grouping) is not supported.
 
 ## See Also
 
 * [Live Demo: Grid Drag and Drop](https://demos.telerik.com/blazor-ui/grid/drag-drop)
-* [Drag and Drop between Different Parent Components]({%slug grid-kb-drag-drop-in-different-components%})
+* [Drag and Drop between Different Parent Components](slug://grid-kb-drag-drop-in-different-components)
 * [Grid API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikGrid-1)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/selection/cells.md b/components/grid/selection/cells.md
index 4901bac908..cb0a8d8859 100644
--- a/components/grid/selection/cells.md
+++ b/components/grid/selection/cells.md
@@ -9,7 +9,7 @@ position: 5
 
 # Cell Selection
 
-The Grid component supports [single or multiple cell selection]({%slug grid-selection-overview%}#use-single-or-multiple-selection). You can select a cell with mouse click anywhere in the cell. You can access the collection of selected cells, use this collection and manipulate it. You can subscribe to selection events.
+The Grid component supports [single or multiple cell selection](slug://grid-selection-overview#use-single-or-multiple-selection). You can select a cell with mouse click anywhere in the cell. You can access the collection of selected cells, use this collection and manipulate it. You can subscribe to selection events.
 
 ## Basics
 
@@ -17,7 +17,7 @@ To select a cell, click anywhere in it.
 
 To select a range of cells in one or more columns, hold the **Shift** key, while clicking on the first and last cell of the range. To select or deselect multiple cells that don't belong to a range, hold the **Ctrl** key.
 
-You can also select a cell range by holding and dragging the mouse cursor. The dragging motion defines the diagonal of a rectangle and the Grid will select the cells under this rectangle. This kind of cell selection depends on the `DragToSelect` parameter in [`GridSelectionSettings`]({%slug grid-selection-overview%}#enable-row-or-cell-selection). The default value of `DragToSelect` is `true` and in this case standard browser text selection is not supported.
+You can also select a cell range by holding and dragging the mouse cursor. The dragging motion defines the diagonal of a rectangle and the Grid will select the cells under this rectangle. This kind of cell selection depends on the `DragToSelect` parameter in [`GridSelectionSettings`](slug://grid-selection-overview#enable-row-or-cell-selection). The default value of `DragToSelect` is `true` and in this case standard browser text selection is not supported.
 
 To enable cell selection:
 
@@ -91,7 +91,7 @@ To enable cell selection:
 
 You can respond to user selection actions through the `SelectedCellsChanged` event. The event handler receives a collection of type `IEnumerable<GridSelectedCellDescriptor>`. The collection may have multiple, single, or no objects in it, depending on the `SelectionMode` and the last user selection.
 
-> The `SelectedCellsChanged` event handler cannot be awaited. To execute asynchronous operations when the user selects rows, use the [`OnRowClick`]({%slug grid-events%}#onrowclick) or [`OnRowDoubleClick`]({%slug grid-events%}#onrowdoubleclick) event instead.
+> The `SelectedCellsChanged` event handler cannot be awaited. To execute asynchronous operations when the user selects rows, use the [`OnRowClick`](slug://grid-events#onrowclick) or [`OnRowDoubleClick`](slug://grid-events#onrowdoubleclick) event instead.
 
 >caption Using the Grid SelectedCellsChanged event
 
@@ -180,17 +180,17 @@ The `GridSelectedCellDescriptor` type exposes the following properties:
 
 | Property Name | Type | Description |
 | --- | --- | --- |
-| `ColumnField` | `string` | The value of the [Grid column `Field`]({%slug components/grid/columns/bound%}#data-binding) parameter, if set. |
-| `ColumnId` | `string` | The value of the [Grid column `Id`]({%slug components/grid/columns/bound%}#identification) parameter, if set. |
+| `ColumnField` | `string` | The value of the [Grid column `Field`](slug://components/grid/columns/bound#data-binding) parameter, if set. |
+| `ColumnId` | `string` | The value of the [Grid column `Id`](slug://components/grid/columns/bound#identification) parameter, if set. |
 | `DataItem` | `object` | The Grid data item instance. Cast it to the actual Grid model type before use. |
 
 ## Selection When Data Changes
 
 When the Grid `Data` collection changes, the `SelectedCells` collection has the following behavior:
 
-* When the user updates a selected cell and the item instance is replaced, you have to also replace the `DataItem` object in the `SelectedCells` collection. Do that in the [Grid `OnUpdate` event]({%slug components/grid/editing/overview%}#events).
+* When the user updates a selected cell and the item instance is replaced, you have to also replace the `DataItem` object in the `SelectedCells` collection. Do that in the [Grid `OnUpdate` event](slug://components/grid/editing/overview#events).
 * When the user deletes a row with selected cells, update the `SelectedCells` collection in the the Grid `OnDelete` event handler.
-* To select cells from a new item in the Grid you can use the [`OnCreate` event]({%slug components/grid/editing/overview%}#events) to update the `SelectedCells` collection.
+* To select cells from a new item in the Grid you can use the [`OnCreate` event](slug://components/grid/editing/overview#events) to update the `SelectedCells` collection.
 
 ### Equals Comparison
 
@@ -199,7 +199,7 @@ The items in `SelectedCells` are compared against the items in the Grid data in
 * The Grid is databound through its `OnRead` event and each data request returns different data item instances.
 * The `SelectedCells` are obtained from a different data source than the all Grid items, for example, from a separate service.
 
-In such cases, the selected cells may not appear as expected. You have to [override the `Equals` method of the Grid model class]({%slug grid-state%}#equals-comparison) so that the items are compared by a unique identifier rather than by reference. When you override `Equals`, it is also recommended to override the [`GetHashCode`](https://docs.microsoft.com/en-us/dotnet/api/system.object.gethashcode) method.
+In such cases, the selected cells may not appear as expected. You have to [override the `Equals` method of the Grid model class](slug://grid-state#equals-comparison) so that the items are compared by a unique identifier rather than by reference. When you override `Equals`, it is also recommended to override the [`GetHashCode`](https://docs.microsoft.com/en-us/dotnet/api/system.object.gethashcode) method.
 
 ## Cell Selection and Other Grid Features
 
@@ -209,12 +209,12 @@ The selection feature behavior may vary when the Grid configuration combines cel
 
 When you want to edit a Grid item, the cell selection has the following behavior:
 
-* Cell selection is not supported with [`Incell` edit mode]({%slug components/grid/editing/incell%}) due to the overlapping pointer events that trigger selection and editing.
-* [`Inline` edit mode]({%slug components/grid/editing/inline%}) and [`Popup` edit mode]({%slug components/grid/editing/popup%}) integrate with cell selection without limitations.
+* Cell selection is not supported with [`Incell` edit mode](slug://components/grid/editing/incell) due to the overlapping pointer events that trigger selection and editing.
+* [`Inline` edit mode](slug://components/grid/editing/inline) and [`Popup` edit mode](slug://components/grid/editing/popup) integrate with cell selection without limitations.
 
 ### Selection and Virtual Scrolling
 
-When the Grid has [virtual scrolling]({%slug components/grid/virtual-scrolling%}), the component is able to select a range of cells with **Shift** only if all rows in that range are currently rendered. Consider the following scenario:
+When the Grid has [virtual scrolling](slug://components/grid/virtual-scrolling), the component is able to select a range of cells with **Shift** only if all rows in that range are currently rendered. Consider the following scenario:
 
 1. Select a cell.
 1. Scroll down, so that virtualization kicks in and the rendered rows are no longer the same.
@@ -228,12 +228,12 @@ The `SelectedCells` collection persists across paging.
 
 ### Selection and Templates
 
-When using [Grid templates]({%slug components/grid/features/templates%}) with cell selection:
+When using [Grid templates](slug://components/grid/features/templates) with cell selection:
 
-* If you are using a [Grid column template]({%slug grid-templates-column%}) and you have a clickable element in the template, wrap this element in a container with a `@onclick:stopPropagation` directive. You can check the knowledge base article on [how to prevent row selection when the user clicks another component in the Grid column template]({%slug grid-kb-row-selection-in-column-template%}). It applies for both row and cell selection.
-* If you are using a [row template]({%slug grid-templates-row%}) the Grid does not support cell selection. The row template removes the built-in cell instances and the HTML markup may not even include the expected number of cells.
+* If you are using a [Grid column template](slug://grid-templates-column) and you have a clickable element in the template, wrap this element in a container with a `@onclick:stopPropagation` directive. You can check the knowledge base article on [how to prevent row selection when the user clicks another component in the Grid column template](slug://grid-kb-row-selection-in-column-template). It applies for both row and cell selection.
+* If you are using a [row template](slug://grid-templates-row) the Grid does not support cell selection. The row template removes the built-in cell instances and the HTML markup may not even include the expected number of cells.
 
 ## See Also
 
 * [Live Demo: Grid Cell Selection](https://demos.telerik.com/blazor-ui/grid/cell-selection)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/selection/overview.md b/components/grid/selection/overview.md
index cfc3066b7f..0e72a8bd50 100644
--- a/components/grid/selection/overview.md
+++ b/components/grid/selection/overview.md
@@ -20,7 +20,7 @@ The Grid component supports row and cell selection. When you select a row or a c
 
 ## Enable Row or Cell Selection
 
-You can configure the Grid either for row or cell selection. See [Rows Selection Basics]({%slug grid-selection-row%}#basics) and [Cells Selection Basics]({%slug grid-selection-cell%}#basics) for more details and examples.
+You can configure the Grid either for row or cell selection. See [Rows Selection Basics](slug://grid-selection-row#basics) and [Cells Selection Basics](slug://grid-selection-cell#basics) for more details and examples.
 
 ## Use Single or Multiple Selection
 
@@ -39,23 +39,23 @@ The Grid exposes two parameters to get or set its selected rows and cells.
 
 Both parameters support two-way binding. You can also use the parameters to pre-select rows or cells for your users.
 
-See [Rows Selection Basics]({%slug grid-selection-row%}#basics) and [Cells Selection Basics]({%slug grid-selection-cell%}#basics) for more details.
+See [Rows Selection Basics](slug://grid-selection-row#basics) and [Cells Selection Basics](slug://grid-selection-cell#basics) for more details.
 
 ## Events
 
 You can respond to the user action of selecting a new item through the Grid events:
 
-* Use the [`SelectedItemsChanged` event]({%slug grid-selection-row%}#selecteditemschanged-event) to respond to row selection.
-* Use the [`SelectedCellsChanged` event]({%slug grid-selection-cell%}#selectedcellschanged-event) to respond to cell selection.
+* Use the [`SelectedItemsChanged` event](slug://grid-selection-row#selecteditemschanged-event) to respond to row selection.
+* Use the [`SelectedCellsChanged` event](slug://grid-selection-cell#selectedcellschanged-event) to respond to cell selection.
 
 ## Integration with Other Grid Features
 
 The selection feature behavior may differ when the Grid configuration includes row or cell selection and other Grid features. In these situations, certain limitations might arise, or additional adjustments may be required.
 
-See [Rows Selection and Other Grid Features]({%slug grid-selection-row%}#row-selection-and-other-grid-features) and [Cells Selection and Other Grid Features]({%slug grid-selection-cell%}#cell-selection-and-other-grid-features) for more details.
+See [Rows Selection and Other Grid Features](slug://grid-selection-row#row-selection-and-other-grid-features) and [Cells Selection and Other Grid Features](slug://grid-selection-cell#cell-selection-and-other-grid-features) for more details.
 
 ## See Also
 
 * [Live Demo: Grid Row Selection](https://demos.telerik.com/blazor-ui/grid/row-selection)
 * [Live Demo: Grid Cell Selection](https://demos.telerik.com/blazor-ui/grid/cell-selection)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/selection/rows.md b/components/grid/selection/rows.md
index 9f1f7823ea..6598954aa3 100644
--- a/components/grid/selection/rows.md
+++ b/components/grid/selection/rows.md
@@ -10,7 +10,7 @@ position: 3
 
 # Row Selection
 
-The Grid component supports [single or multiple row selection]({%slug grid-selection-overview%}#use-single-or-multiple-selection). You can select a row with mouse click and through a checkbox column. You can access the collection of selected rows, use this collection and modify it. You can subscribe to selection events.
+The Grid component supports [single or multiple row selection](slug://grid-selection-overview#use-single-or-multiple-selection). You can select a row with mouse click and through a checkbox column. You can access the collection of selected rows, use this collection and modify it. You can subscribe to selection events.
 
 ## Basics
 
@@ -23,10 +23,10 @@ Check the [Grid Keyboard navigation demo](https://demos.telerik.com/blazor-ui/gr
 To enable row selection:
 
 1. Define the selection mode through one of the following options:
-    * Set the [Grid `SelectionMode` parameter]({%slug grid-selection-overview%}#use-single-or-multiple-selection), or
+    * Set the [Grid `SelectionMode` parameter](slug://grid-selection-overview#use-single-or-multiple-selection), or
     * Add a `<GridSelectionSettings>` tag inside the Grid `<GridSettings>` tag, and set the `SelectionType` parameter to `GridSelectionType.Row`.
 1. Set the Grid `SelectedItems` parameter to a collection of type `IEnumerable<TItem>` where `TItem` is the Grid model class. The collection must be initialized in advance.
-1. Optionally, add a [checkbox column]({%slug components/grid/columns/checkbox%}) to the `GridColumns` collection of the Grid. The `GridCheckboxColumn` provides [additional configuration settings related to selection]({%slug components/grid/columns/checkbox%}#parameters).
+1. Optionally, add a [checkbox column](slug://components/grid/columns/checkbox) to the `GridColumns` collection of the Grid. The `GridCheckboxColumn` provides [additional configuration settings related to selection](slug://components/grid/columns/checkbox#parameters).
 
 >caption Grid multiple row selection
 
@@ -84,7 +84,7 @@ To enable row selection:
 
 You can respond to user selection actions through the `SelectedItemsChanged` event. The event handler receives a collection of the Grid data model. The collection may have multiple, single, or no items in it, depending on the `SelectionMode` and the last user selection.
 
-> The `SelectedItemsChanged` event handler cannot be awaited. To execute asynchronous operations when the user selects rows, use the [`OnRowClick`]({%slug grid-events%}#onrowclick) or [`OnRowDoubleClick`]({%slug grid-events%}#onrowdoubleclick) event instead.
+> The `SelectedItemsChanged` event handler cannot be awaited. To execute asynchronous operations when the user selects rows, use the [`OnRowClick`](slug://grid-events#onrowclick) or [`OnRowDoubleClick`](slug://grid-events#onrowdoubleclick) event instead.
 
 >caption Using the Grid SelectedItemsChanged event
 
@@ -158,9 +158,9 @@ You can respond to user selection actions through the `SelectedItemsChanged` eve
 
 When the Grid `Data` collection changes, the `SelectedItems` collection has the following behavior:
 
-* When the user updates a selected item and the item instance is replaced, you have to also replace the selected item object in the `SelectedItems` collection. Do that in the [Grid `OnUpdate` event]({%slug components/grid/editing/overview%}#events).
+* When the user updates a selected item and the item instance is replaced, you have to also replace the selected item object in the `SelectedItems` collection. Do that in the [Grid `OnUpdate` event](slug://components/grid/editing/overview#events).
 * When the user deletes a selected item, the Grid automatically deletes it from the `SelectedItems` collection and the [`SelectedItemsChanged` event](#selecteditemschanged-event) fires.
-* To select a new item in the Grid you can use the [`OnCreate` event]({%slug components/grid/editing/overview%}#events) to update the `SelectedItems` collection.
+* To select a new item in the Grid you can use the [`OnCreate` event](slug://components/grid/editing/overview#events) to update the `SelectedItems` collection.
 
 ## Equals Comparison
 
@@ -169,7 +169,7 @@ The items in `SelectedItems` are compared against the items in the Grid data in
 * The Grid is databound through its `OnRead` event and each data request returns different data item instances.
 * The `SelectedItems` are obtained from a different data source than the all Grid items, for example, from a separate service.
 
-In such cases, the selected rows may not appear as expected. You have to [override the `Equals` method of the Grid model class]({%slug grid-state%}#equals-comparison) so that the items are compared by a unique identifier rather than by reference. When you override `Equals`, it is also recommended to override the [`GetHashCode`](https://docs.microsoft.com/en-us/dotnet/api/system.object.gethashcode) method.
+In such cases, the selected rows may not appear as expected. You have to [override the `Equals` method of the Grid model class](slug://grid-state#equals-comparison) so that the items are compared by a unique identifier rather than by reference. When you override `Equals`, it is also recommended to override the [`GetHashCode`](https://docs.microsoft.com/en-us/dotnet/api/system.object.gethashcode) method.
 
 ## Row Selection and Other Grid Features
 
@@ -179,12 +179,12 @@ The selection behavior may vary when other Grid features are enabled, such as ed
 
 When users edit rows, the row selection has the following behavior:
 
-* In [`Incell` edit mode]({%slug components/grid/editing/incell%}) the row selection can work only through a [checkbox column]({%slug components/grid/columns/checkbox%}). This is required due to the overlapping pointer events that trigger selection and editing. To see how to select the row that is being edited in `InCell` edit mode without using a `<GridCheckboxColumn />` check out the [Row Selection in Edit with InCell EditMode]({%slug grid-kb-row-select-incell-edit%}) KB article.
-* [`Inline` edit mode]({%slug components/grid/editing/inline%}) and [`Popup` edit mode]({%slug components/grid/editing/popup%}) integrate with row selection without limitations.
+* In [`Incell` edit mode](slug://components/grid/editing/incell) the row selection can work only through a [checkbox column](slug://components/grid/columns/checkbox). This is required due to the overlapping pointer events that trigger selection and editing. To see how to select the row that is being edited in `InCell` edit mode without using a `<GridCheckboxColumn />` check out the [Row Selection in Edit with InCell EditMode](slug://grid-kb-row-select-incell-edit) KB article.
+* [`Inline` edit mode](slug://components/grid/editing/inline) and [`Popup` edit mode](slug://components/grid/editing/popup) integrate with row selection without limitations.
 
 ### Selection and Virtual Scrolling
 
-When the Grid has [virtual scrolling]({%slug components/grid/virtual-scrolling%}), the component is able to select a range of rows with **Shift** only if all rows in that range are currently rendered. Consider the following scenario:
+When the Grid has [virtual scrolling](slug://components/grid/virtual-scrolling), the component is able to select a range of rows with **Shift** only if all rows in that range are currently rendered. Consider the following scenario:
 
 1. Select a row.
 1. Scroll down, so that virtualization kicks in and the rendered rows are no longer the same.
@@ -196,14 +196,14 @@ In this case, the range selection will start from the first row that is currentl
 
 The `SelectedItems` collection persists across paging.
 
-The [**Select All** checkbox in the Grid checkbox column]({%slug components/grid/columns/checkbox%}#parameters) cannot select items on other pages when using the Grid `OnRead` event.
+The [**Select All** checkbox in the Grid checkbox column](slug://components/grid/columns/checkbox#parameters) cannot select items on other pages when using the Grid `OnRead` event.
 
 ### Selection and Templates
 
-When using [Grid templates]({%slug components/grid/features/templates%}) with row selection:
+When using [Grid templates](slug://components/grid/features/templates) with row selection:
 
-* If you are using a [Grid column template]({%slug grid-templates-column%}) and you have a clickable element in the template, you can check the knowledge base article on [how to prevent row selection when the user clicks another component in the Grid column template]({%slug grid-kb-row-selection-in-column-template%}).
-* If you are using a [row template]({%slug grid-templates-row%}) the Grid cannot render a built-in [checkbox column]({%slug components/grid/columns/checkbox%}). You have to render checkboxes manually and handle their changed event to populate the `SelectedItems` collection of the Grid. You can find an example to get started in the following knowledge base article: [Implement Built-in Functions when Using Grid Row Template]({%slug grid-kb-row-template-simulate-built-in-functions%}).
+* If you are using a [Grid column template](slug://grid-templates-column) and you have a clickable element in the template, you can check the knowledge base article on [how to prevent row selection when the user clicks another component in the Grid column template](slug://grid-kb-row-selection-in-column-template).
+* If you are using a [row template](slug://grid-templates-row) the Grid cannot render a built-in [checkbox column](slug://components/grid/columns/checkbox). You have to render checkboxes manually and handle their changed event to populate the `SelectedItems` collection of the Grid. You can find an example to get started in the following knowledge base article: [Implement Built-in Functions when Using Grid Row Template](slug://grid-kb-row-template-simulate-built-in-functions).
 
 ### Selection and Row Drag and Drop
 
@@ -212,4 +212,4 @@ The Grid clears the `SelectedItems` collection when the user drags and drops sel
 ## See Also
 
 * [Live Demo: Grid Row Selection](https://demos.telerik.com/blazor-ui/grid/row-selection)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/sizing.md b/components/grid/sizing.md
index 8a73871a32..65efe391f3 100644
--- a/components/grid/sizing.md
+++ b/components/grid/sizing.md
@@ -54,9 +54,9 @@ You can increase or decrease the size of the Grid by setting the `Size` attribut
 
 ## Notes
 
-1. The `Size` option does not affect elements displayed inside a Popup (such as [Filter Menu]({%slug grid-filter-menu%}), [Column Menu]({%slug grid-column-menu%}), etc.). By design, all Popup elements are rendered on root level, so they are not technically inside the Grid. Thus, the `Size` option cannot propagate to them. To change the `Size` options of the elements inside Popups, you can use a template(where available), so you can override the built-in rendering. You can then add custom elements and explicitly specify their `Size`.
+1. The `Size` option does not affect elements displayed inside a Popup (such as [Filter Menu](slug://grid-filter-menu), [Column Menu](slug://grid-column-menu), etc.). By design, all Popup elements are rendered on root level, so they are not technically inside the Grid. Thus, the `Size` option cannot propagate to them. To change the `Size` options of the elements inside Popups, you can use a template(where available), so you can override the built-in rendering. You can then add custom elements and explicitly specify their `Size`.
 
-1. The `Size` option does not propagate to components rendered inside templates (this includes elements in [GridToolBar]({%slug components/grid/features/toolbar%}), [CommandColumn]({%slug components/grid/columns/command%}), etc.). To change the size of the elements in those components you have to set it explicitly.
+1. The `Size` option does not propagate to components rendered inside templates (this includes elements in [GridToolBar](slug://components/grid/features/toolbar), [CommandColumn](slug://components/grid/columns/command), etc.). To change the size of the elements in those components you have to set it explicitly.
 
 >caption Set GridCommandButton Size option
 
@@ -83,6 +83,6 @@ You can increase or decrease the size of the Grid by setting the `Size` attribut
 
 ## See Also
 
-  * [Grid Overview]({%slug grid-overview%})
+  * [Grid Overview](slug://grid-overview)
   * [Live Demo: Grid Sizing](https://demos.telerik.com/blazor-ui/grid/sizing)
-  * [Blazor Grid]({%slug grid-overview%})
\ No newline at end of file
+  * [Blazor Grid](slug://grid-overview)
\ No newline at end of file
diff --git a/components/grid/sorting.md b/components/grid/sorting.md
index 103b497da1..925674e916 100644
--- a/components/grid/sorting.md
+++ b/components/grid/sorting.md
@@ -104,7 +104,7 @@ To allow sorting on more than one column at a time, set the `SortMode` parameter
 
 ## Sort From Code
 
-You can sort the grid from your own code through its [state]({%slug grid-state%}).
+You can sort the grid from your own code through its [state](slug://grid-state).
 
 @[template](/_contentTemplates/grid/state.md#initial-state)
 
@@ -118,12 +118,12 @@ You can sort the grid from your own code through its [state]({%slug grid-state%}
 
 The following articles and sample projects can be helpful when implementing sorting:
 
-* [Capture Sorted event]({%slug grid-state%}#onstatechanged) - the grid state lets you know when it changes so you can capture different aspects of the change
+* [Capture Sorted event](slug://grid-state#onstatechanged) - the grid state lets you know when it changes so you can capture different aspects of the change
 
-* [Server Sorting]({%slug components/grid/manual-operations%}) - this article explains how to implement manual data source operations so you can offload the work to the server. It provides the overview of how to setup the grid for that, and examples - several with local data and links a repository with examples using REST API endpoints.
+* [Server Sorting](slug://components/grid/manual-operations) - this article explains how to implement manual data source operations so you can offload the work to the server. It provides the overview of how to setup the grid for that, and examples - several with local data and links a repository with examples using REST API endpoints.
 
 ## See Also
 
   * [Live Demo: Grid Sorting](https://demos.telerik.com/blazor-ui/grid/sorting)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
    
diff --git a/components/grid/state.md b/components/grid/state.md
index 4f35f35c01..fd93f8024b 100644
--- a/components/grid/state.md
+++ b/components/grid/state.md
@@ -29,20 +29,20 @@ The Grid state is a generic [class `GridState<TItem>`](/blazor-ui/api/Telerik.Bl
 
 | Property | Type | Description |
 | --- | --- | --- |
-| `CollapsedGroups` | `ICollection<int>` | The indexes of all collapsed [groups]({%slug components/grid/features/grouping%}) when `LoadGroupsOnDemand="false"`, i.e. when not [loading groups on demand]({%slug grid-group-lod%}). |
-| `ColumnStates` | `ICollection<GridColumnState>` | Information about each [column's reorder index, width, visibility, locked state, `Id` parameter value and `Field`]({%slug components/grid/columns/bound%}). The column order in the collection matches the column order in the Grid declaration. On the other hand, the `Index` property matches the current column's position in the UI. **`Id` and `Field` are always `null` after deserialization, because these properties have no public setters.** |
-| `EditField` | `string` | The currently edited data item property in [`Incell` edit mode]({%slug components/grid/editing/incell%}). |
-| `EditItem` | `TItem`* | The currently edited data item in [any edit mode]({%slug components/grid/editing/overview%}). |
-| `ExpandedItems` | `ICollection<TItem>` | The expanded data items, when [using `<DetailTemplate>` (hierarchy)]({%slug components/grid/features/hierarchy%}). |
-| `FilterDescriptors` | `ICollection<IFilterDescriptor>` | A collection of [`CompositeFilterDescriptor`]({%slug common-features-descriptors%}#filtering), except the ones that relate to the [`GridSearchBox`]({%slug grid-searchbox%}). |
-| `GroupDescriptors` | `ICollection<GroupDescriptor>` | Information about currently applied [grouping]({%slug components/grid/features/grouping%}). |
-| `InsertedItem` | `TItem`* | The data item that is being added in `Inline` or `Popup` edit mode. [Not applicable for `Incell` editing]({%slug components/grid/editing/incell%}#event-sequence). |
+| `CollapsedGroups` | `ICollection<int>` | The indexes of all collapsed [groups](slug://components/grid/features/grouping) when `LoadGroupsOnDemand="false"`, i.e. when not [loading groups on demand](slug://grid-group-lod). |
+| `ColumnStates` | `ICollection<GridColumnState>` | Information about each [column's reorder index, width, visibility, locked state, `Id` parameter value and `Field`](slug://components/grid/columns/bound). The column order in the collection matches the column order in the Grid declaration. On the other hand, the `Index` property matches the current column's position in the UI. **`Id` and `Field` are always `null` after deserialization, because these properties have no public setters.** |
+| `EditField` | `string` | The currently edited data item property in [`Incell` edit mode](slug://components/grid/editing/incell). |
+| `EditItem` | `TItem`* | The currently edited data item in [any edit mode](slug://components/grid/editing/overview). |
+| `ExpandedItems` | `ICollection<TItem>` | The expanded data items, when [using `<DetailTemplate>` (hierarchy)](slug://components/grid/features/hierarchy). |
+| `FilterDescriptors` | `ICollection<IFilterDescriptor>` | A collection of [`CompositeFilterDescriptor`](slug://common-features-descriptors#filtering), except the ones that relate to the [`GridSearchBox`](slug://grid-searchbox). |
+| `GroupDescriptors` | `ICollection<GroupDescriptor>` | Information about currently applied [grouping](slug://components/grid/features/grouping). |
+| `InsertedItem` | `TItem`* | The data item that is being added in `Inline` or `Popup` edit mode. [Not applicable for `Incell` editing](slug://components/grid/editing/incell#event-sequence). |
 | `OriginalEditItem` | `TItem`* | The original copy of the data item that is currently in edit mode. This `GridState` property holds the unmodified data item values. |
-| `Page` | `int?` | The current [page index]({%slug components/grid/features/paging%}). Some user actions reset the page index to 1, such as filtering or changing the page size. |
-| `SearchFilter` | `IFilterDescriptor` | The [`CompositeFilterDescriptor`]({%slug common-features-descriptors%}#filtering) that holds the filter descriptors for the [`GridSearchBox`]({%slug grid-searchbox%}). |
-| `SelectedItems` | `ICollection<TItem>` | The currently [selected data item(s)]({%slug grid-selection-overview%}). |
-| `Skip` | `int?` | The number of scrolled data items when using [virtual row scrolling]({%slug components/grid/virtual-scrolling%}). In other words, this is the number of rows above the currently visible ones. |
-| `SortDescriptors` | `ICollection<SortDescriptor>` | The currently applied [sorts]({%slug components/grid/features/sorting%}). |
+| `Page` | `int?` | The current [page index](slug://components/grid/features/paging). Some user actions reset the page index to 1, such as filtering or changing the page size. |
+| `SearchFilter` | `IFilterDescriptor` | The [`CompositeFilterDescriptor`](slug://common-features-descriptors#filtering) that holds the filter descriptors for the [`GridSearchBox`](slug://grid-searchbox). |
+| `SelectedItems` | `ICollection<TItem>` | The currently [selected data item(s)](slug://grid-selection-overview). |
+| `Skip` | `int?` | The number of scrolled data items when using [virtual row scrolling](slug://components/grid/virtual-scrolling). In other words, this is the number of rows above the currently visible ones. |
+| `SortDescriptors` | `ICollection<SortDescriptor>` | The currently applied [sorts](slug://components/grid/features/sorting). |
 | `TableWidth` | `string` | The sum of all visible column widths. This property changes together with `ColumnStates`. The `OnStateChanged` event does not fire separately for it. |
 
 \* `TItem` is the Grid model type.
@@ -166,7 +166,7 @@ The example below shows how to apply initial sorting, filtering and grouping.
 Here is some additional information about certain `PropertyName` values:
 
 * `EditItem` is used when the user starts editing an existing item.
-* `InsertedItem` signifies the user adding a new item in inline or popup edit mode. It's [not applicable for `Incell` editing]({%slug components/grid/editing/incell%}#event-sequence).
+* `InsertedItem` signifies the user adding a new item in inline or popup edit mode. It's [not applicable for `Incell` editing](slug://components/grid/editing/incell#event-sequence).
 * `OriginalEditItem` is used when the user exits edit or insert mode via save or cancel.
 * `ColumnStates` is used for several column actions such as hiding, showing, locking, reordering and resizing.
 
@@ -176,7 +176,7 @@ Here is some additional information about certain `PropertyName` values:
 
 To observe the changes in the Grid state more easily, copy and run the following example in a local app and at full screen.
 
-Find out how to [get the applied filtering, sorting and grouping criteria]({%slug common-features-descriptors%}).
+Find out how to [get the applied filtering, sorting and grouping criteria](slug://common-features-descriptors).
 
 >caption Using Grid OnStateChanged
 
@@ -362,9 +362,9 @@ Find out how to [get the applied filtering, sorting and grouping criteria]({%slu
 
 ## Methods
 
-The `GetState` and `SetStateAsync` methods of the [Grid instance]({%slug grid-overview%}#blazor-grid-reference-and-methods) let you get and set the current Grid state on demand at any time *after* [`OnStateInit`](#onstateinit).
+The `GetState` and `SetStateAsync` methods of the [Grid instance](slug://grid-overview#blazor-grid-reference-and-methods) let you get and set the current Grid state on demand at any time *after* [`OnStateInit`](#onstateinit).
 
-* `GetState` returns the current Grid state, so you can save it or [retrieve specific information](#information-in-the-grid-state). For example, you can [use `GetState` to get the current filters, sorts, and page number]({%slug grid-kb-get-filtered-data%}). Or, you can [get the current Grid column properties like order index, width, and others)]({%slug grid-kb-column-state%}).
+* `GetState` returns the current Grid state, so you can save it or [retrieve specific information](#information-in-the-grid-state). For example, you can [use `GetState` to get the current filters, sorts, and page number](slug://grid-kb-get-filtered-data). Or, you can [get the current Grid column properties like order index, width, and others)](slug://grid-kb-column-state).
 
 * `SetStateAsync` receives an instance of a `GridState<TItem>` object and applies it to the Grid. For example, you can have a button that puts the Grid in a certain configuration programmatically, for example sort or filter the data, enter or exit edit mode, expand or collapse groups or detail Grids, etc.
 
@@ -376,7 +376,7 @@ If you want to make changes to the current Grid state:
 
 > Do not use `GetState()` in the [`OnStateInit`](#onstateinit) or [`OnStateChanged`](#onstatechanged) events. Do not use `SetStateAsync()` in `OnStateInit`. Instead, get or set the `GridState` property of the event argument.
 >
-> Avoid calling `SetStateAsync` in the Grid [CRUD methods]({%slug components/grid/editing/overview%}) (such as [`OnRead`]({%slug components/grid/manual-operations%}), `OnUpdate`, `OnEdit`, `OnCreate`, `OnCancel`). Doing so may lead to unexpected results because the Grid has more logic to execute after these events. Setting the Grid state fires `OnRead`, so calling `SetStateAsync()` in this handler can lead to an endless loop.
+> Avoid calling `SetStateAsync` in the Grid [CRUD methods](slug://components/grid/editing/overview) (such as [`OnRead`](slug://components/grid/manual-operations), `OnUpdate`, `OnEdit`, `OnCreate`, `OnCancel`). Doing so may lead to unexpected results because the Grid has more logic to execute after these events. Setting the Grid state fires `OnRead`, so calling `SetStateAsync()` in this handler can lead to an endless loop.
 
 >tip To reset the Grid state to its initial markup configuration, call `SetStateAsync(null)`.
 >
@@ -417,22 +417,22 @@ The tabs below show how to set the Grid state and control filtering, sorting and
 
 ## Equals Comparison
 
-State properties that pertain to data items (for example, edited item or selected items) are typed according to the Grid model. If you restore such data, make sure to implement appropriate comparison checks - by default the [`.Equals()`](https://learn.microsoft.com/en-us/dotnet/api/system.object.equals) check for a class (object) is a reference check and the reference from the restored state is very unlikely to match the current reference in the Grid data. Thus, you may want to [override the `.Equals()` method of the Grid model class]({%slug grid-kb-save-load-state-localstorage%}), so that it compares by ID, or otherwise re-populate the models in the state object with the new model references from the Grid data.
+State properties that pertain to data items (for example, edited item or selected items) are typed according to the Grid model. If you restore such data, make sure to implement appropriate comparison checks - by default the [`.Equals()`](https://learn.microsoft.com/en-us/dotnet/api/system.object.equals) check for a class (object) is a reference check and the reference from the restored state is very unlikely to match the current reference in the Grid data. Thus, you may want to [override the `.Equals()` method of the Grid model class](slug://grid-kb-save-load-state-localstorage), so that it compares by ID, or otherwise re-populate the models in the state object with the new model references from the Grid data.
 
 
 ## Examples
 
 You can find multiple examples for using the Grid state in the following [Knowledge Base articles](/knowledge-base):
 
-* [Save and load the Grid state from `localStorage`]({%slug grid-kb-save-load-state-localstorage%})
-* [Save the Grid state in a WebAssembly app]({%slug grid-kb-save-state-in-webassembly%})
-* [Override a user action that changes the Grid state, for example, sort descending first]({%slug grid-kb-sort-descending%})
-* [Initiate programmatic editing or inserting of a Grid row]({%slug grid-kb-add-edit-state%})
-* [Get current Grid column state (order index, width, and others)]({%slug grid-kb-column-state%})
+* [Save and load the Grid state from `localStorage`](slug://grid-kb-save-load-state-localstorage)
+* [Save the Grid state in a WebAssembly app](slug://grid-kb-save-state-in-webassembly)
+* [Override a user action that changes the Grid state, for example, sort descending first](slug://grid-kb-sort-descending)
+* [Initiate programmatic editing or inserting of a Grid row](slug://grid-kb-add-edit-state)
+* [Get current Grid column state (order index, width, and others)](slug://grid-kb-column-state)
 
 
 ## See Also
 
 * [Live Demo: Grid State](https://demos.telerik.com/blazor-ui/grid/persist-state)
 * [GridState API reference](/blazor-ui/api/Telerik.Blazor.Components.GridState-1)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/templates/column-chooser.md b/components/grid/templates/column-chooser.md
index 12e2ab895e..053d81e72c 100644
--- a/components/grid/templates/column-chooser.md
+++ b/components/grid/templates/column-chooser.md
@@ -10,7 +10,7 @@ position: 40
 
 # Column Chooser Template
 
-The `Column Chooser Template` lets you control the rendering of the [ColumnChooser]({%slug grid-column-menu%}#column-chooser). It exposes a `context` object that contains a List of all columns in the Grid. 
+The `Column Chooser Template` lets you control the rendering of the [ColumnChooser](slug://grid-column-menu#column-chooser). It exposes a `context` object that contains a List of all columns in the Grid. 
 
 When the Template is setup the list of columns, rendered by default, would not be present.
 
@@ -87,6 +87,6 @@ When the Template is setup the list of columns, rendered by default, would not b
 
  * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
  * [Live Demo: Grid Custom Column Menu](https://demos.telerik.com/blazor-ui/grid/custom-column-menu)
- * [Columns Menu]({%slug grid-column-menu%})
- * [Blazor Grid]({%slug grid-overview%})
+ * [Columns Menu](slug://grid-column-menu)
+ * [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/templates/column-footer.md b/components/grid/templates/column-footer.md
index 2f23855e89..1a5258e8fb 100644
--- a/components/grid/templates/column-footer.md
+++ b/components/grid/templates/column-footer.md
@@ -10,9 +10,9 @@ position: 20
 
 # Column Footer Template
 
-You can display a grand total row at the bottom of the grid through the `FooterTemplate` of each [bound]({%slug components/grid/columns/bound%}) column.
+You can display a grand total row at the bottom of the grid through the `FooterTemplate` of each [bound](slug://components/grid/columns/bound) column.
 
-You can use [aggregates]({%slug grid-aggregates%}) for the current field directly from the `context`, and its `AggregateResults` field lets you get aggregates for other fields that you have defined through their field name and aggregate function.
+You can use [aggregates](slug://grid-aggregates) for the current field directly from the `context`, and its `AggregateResults` field lets you get aggregates for other fields that you have defined through their field name and aggregate function.
 
 
 >caption Footer Template with grand total data
@@ -98,5 +98,5 @@ Footer templates usually display aggregates. Here are some things to keep in min
 ## See Also
 
  * [Live Demo: Grid Footer Template](https://demos.telerik.com/blazor-ui/grid/footer-template)
- * [Blazor Grid]({%slug grid-overview%})
+ * [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/templates/column-group-footer.md b/components/grid/templates/column-group-footer.md
index 71b524d327..c1e7b3a484 100644
--- a/components/grid/templates/column-group-footer.md
+++ b/components/grid/templates/column-group-footer.md
@@ -10,7 +10,7 @@ position: 25
 
 # Column Group Footer
 
-When the grid is grouped, the columns can display a footer with information about the column data [aggregates]({%slug grid-aggregates%}) and some custom text/logic. The template is strongly typed and exposes the available aggregates values.
+When the grid is grouped, the columns can display a footer with information about the column data [aggregates](slug://grid-aggregates) and some custom text/logic. The template is strongly typed and exposes the available aggregates values.
 
 >caption Sample Column Group Footer Template
 
@@ -87,5 +87,5 @@ When the grid is grouped, the columns can display a footer with information abou
 
  * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
  * [Live Demo: Grid Custom Editor Template](https://demos.telerik.com/blazor-ui/grid/custom-editor)
- * [Blazor Grid]({%slug grid-overview%})
+ * [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/templates/column-header.md b/components/grid/templates/column-header.md
index d092d860d8..505c00debc 100644
--- a/components/grid/templates/column-header.md
+++ b/components/grid/templates/column-header.md
@@ -12,7 +12,7 @@ position: 20
 
 Bound columns render the name of the field or their `Title` in their header. Through the `HeaderTemplate`, you can define custom content there instead of the title text.
 
->tip If you only want to center or wrap the column header text, you can achieve that with some custom CSS. You can try one of the following approaches depending on the desired result - [Center Grid Column Header content]({%slug grid-kb-center-column-header-content%}) or [Wrap and center the Grid column header text]({%slug grid-kb-wrap-and-center-column-header-text%}).
+>tip If you only want to center or wrap the column header text, you can achieve that with some custom CSS. You can try one of the following approaches depending on the desired result - [Center Grid Column Header content](slug://grid-kb-center-column-header-content) or [Wrap and center the Grid column header text](slug://grid-kb-wrap-and-center-column-header-text).
 
 >caption Sample Header Template
 
@@ -94,4 +94,4 @@ Bound columns render the name of the field or their `Title` in their header. Thr
 
  * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
  * [Live Demo: Grid Custom Editor Template](https://demos.telerik.com/blazor-ui/grid/custom-editor)
- * [Blazor Grid]({%slug grid-overview%})
+ * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/templates/column.md b/components/grid/templates/column.md
index b98626292e..484fff0673 100644
--- a/components/grid/templates/column.md
+++ b/components/grid/templates/column.md
@@ -14,15 +14,15 @@ By default, each Grid cell renders the value of the respective column `Field` of
 
 ## Basics
 
-To define a column template, use a `<Template>` tag inside the `<GridColumn>` tag. The Grid uses the defined `Template` to show the "view" representation of all cells in that column. This also includes cells from [columns that are marked as `Editable="false"`]({%slug components/grid/columns/bound%}#data-operations), while the cells' parent row is in [inline edit mode]({%slug components/grid/editing/inline%}).
+To define a column template, use a `<Template>` tag inside the `<GridColumn>` tag. The Grid uses the defined `Template` to show the "view" representation of all cells in that column. This also includes cells from [columns that are marked as `Editable="false"`](slug://components/grid/columns/bound#data-operations), while the cells' parent row is in [inline edit mode](slug://components/grid/editing/inline).
 
 Visual Studio tends to autocomplete the `<Template>` tag with a lowercase `t` which breaks the template logic and does not allow you to access the `context`. Ensure the `Template` tag uses a capital `T`. 
 
 ### Template Context
 
-The Grid column template exposes a `context` variable, which is the respective item from the Grid data collection. Cast the `context` to your Grid model type in order to access and use its properties. [Rename the `context` variable when using nested templates, for example a Grid column `Template` inside a Grid `DetailTemplate`]({%slug nest-renderfragment%}).
+The Grid column template exposes a `context` variable, which is the respective item from the Grid data collection. Cast the `context` to your Grid model type in order to access and use its properties. [Rename the `context` variable when using nested templates, for example a Grid column `Template` inside a Grid `DetailTemplate`](slug://nest-renderfragment).
 
->tip If you only want to format numbers, dates, enums, you can do so with the [DisplayFormat feature]({%slug grid-columns-displayformat%}) without the need to declare a template.
+>tip If you only want to format numbers, dates, enums, you can do so with the [DisplayFormat feature](slug://grid-columns-displayformat) without the need to declare a template.
 
 ## Example
 
@@ -96,7 +96,7 @@ The example below shows how to:
 }
 ````
 
->tip The above example renders read-only checkboxes to display boolean values. You can also [use checkboxes in display mode and directly change the underlying data source values]({%slug grid-kb-checkbox-editing%}). This can make boolean value editing faster, because the Grid doesn't go into edit mode.
+>tip The above example renders read-only checkboxes to display boolean values. You can also [use checkboxes in display mode and directly change the underlying data source values](slug://grid-kb-checkbox-editing). This can make boolean value editing faster, because the Grid doesn't go into edit mode.
 
 ## Using Components in Grid Column Templates
 
@@ -106,4 +106,4 @@ The example below shows how to:
 
 * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
 * [Live Demo: Grid Custom Editor Template](https://demos.telerik.com/blazor-ui/grid/custom-editor)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/templates/editor.md b/components/grid/templates/editor.md
index eecafb0b92..d17bf7b372 100644
--- a/components/grid/templates/editor.md
+++ b/components/grid/templates/editor.md
@@ -10,15 +10,15 @@ position: 15
 
 # Editor Template
 
-The column's `EditorTemplate` defines the inline template or component that will be rendered when the user is [editing]({%slug components/grid/editing/overview%}) the field. It is also used when inserting a new item.
+The column's `EditorTemplate` defines the inline template or component that will be rendered when the user is [editing](slug://components/grid/editing/overview) the field. It is also used when inserting a new item.
 
 You can data bind components in the editor template to the current `context`. This is the data item instance, which is bound to the currently edited Grid row. Cast `context` to the data item type and store it in a global or local variable. Then, use this variable for one-way or two-way binding in the `EditorTemplate`.
 
-The template receives a **copy** of the original model, so that changes can be canceled with the `Cancel` command. See the [**Notes** section in the Grid Editing Overview]({%slug components/grid/editing/overview%}#notes) for more details on how and when that copy is created.
+The template receives a **copy** of the original model, so that changes can be canceled with the `Cancel` command. See the [**Notes** section in the Grid Editing Overview](slug://components/grid/editing/overview#notes) for more details on how and when that copy is created.
 
-If you need more complex logic inside the editor template, compared to simple data binding, use the `change` event of the custom editor component. You can also use a [custom Grid edit form]({%slug grid-kb-custom-edit-form%}).
+If you need more complex logic inside the editor template, compared to simple data binding, use the `change` event of the custom editor component. You can also use a [custom Grid edit form](slug://grid-kb-custom-edit-form).
 
->tip The Editor Template works in all edit modes (Inline, Popup, InCell). Before using it with InCell mode, review the [pertinent notes]({%slug components/grid/editing/incell%}#editor-template).
+>tip The Editor Template works in all edit modes (Inline, Popup, InCell). Before using it with InCell mode, review the [pertinent notes](slug://components/grid/editing/incell#editor-template).
 
 **In this article:**
 
@@ -32,7 +32,7 @@ If you need more complex logic inside the editor template, compared to simple da
 
 * @[template](/_contentTemplates/common/inputs.md#edit-debouncedelay)
 
-* The Grid row creates an `EditContext` and passes it to the `EditorTemplate`. You can read more about it in the [**Notes** section of the Editing Overview]({%slug components/grid/editing/overview%}#notes) article.
+* The Grid row creates an `EditContext` and passes it to the `EditorTemplate`. You can read more about it in the [**Notes** section of the Editing Overview](slug://components/grid/editing/overview#notes) article.
 
 * We recommend casting the Editor Template context to your model and storing it in a local or a dedicated global variable. Do not share a global variable within multiple templates, like column (cell) template and editor template. Variable sharing can lead to unexpected behavior.
 
@@ -268,9 +268,9 @@ The Grid will save changes and close the current edit row (or edit cell) when th
 
 ## Editor template for a foreign key column
 
-This example uses an ID that represents the foreign key for the grid column `Field`. You may want to use a text field that you can add to your model (or from a [nested model]({%slug grid-use-navigation-properties%})) instead - this will change what renders in the `Template` by default, and will change the rules and operators for filtering, sorting, and so using a field with human-readable information (like strings) might provide better UX.
+This example uses an ID that represents the foreign key for the grid column `Field`. You may want to use a text field that you can add to your model (or from a [nested model](slug://grid-use-navigation-properties)) instead - this will change what renders in the `Template` by default, and will change the rules and operators for filtering, sorting, and so using a field with human-readable information (like strings) might provide better UX.
 
-Also check the [Grid Foreign Key Column]({%slug grids-foreign-key%}) knowledge base article.
+Also check the [Grid Foreign Key Column](slug://grids-foreign-key) knowledge base article.
 
 ````RAZOR
 @* This example shows one way to use a dropdownlist to edit values with a foreign key. *@
@@ -411,4 +411,4 @@ Also check the [Grid Foreign Key Column]({%slug grids-foreign-key%}) knowledge b
 
 * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
 * [Live Demo: Grid Custom Editor Template](https://demos.telerik.com/blazor-ui/grid/custom-editor)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/templates/filter.md b/components/grid/templates/filter.md
index 1593f2ce6e..e3432fc7c8 100644
--- a/components/grid/templates/filter.md
+++ b/components/grid/templates/filter.md
@@ -13,7 +13,7 @@ position: 35
 
 The Filter Template lets you customize the appearance and logic of the built-in filters. It lets you step on the built-in filtering logic of the grid and implement your own design and logic for setting their values.
 
-There are two different templates you can use depending on the [Filter Mode]({%slug components/grid/filtering%}) that you chose:
+There are two different templates you can use depending on the [Filter Mode](slug://components/grid/filtering) that you chose:
 
 * [Filter Row Template](#filter-row-template)
 * [Filter Menu Template](#filter-menu-template)
@@ -26,11 +26,11 @@ By default, the filter row puts an appropriate editor (like a numeric textbox fo
 
 To customize the filter cell, use the `<FilterCellTemplate>` tag of the `<GridColumn>`. It receives a `context` of type `FilterCellTemplateContext` that provides the following members:
 
-* `FilterDescriptor` - a [CompositeFilterDescriptor](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor) object that describes the column filter. By default, its `FilterDescriptors` field contains two `FilterDescriptor` instances and its `LogicalOperator` is `AND`. You can populate the filter values in the existing `FilterDescriptors` and add more instances. You can change their [filter operator]({%slug common-features-filter-operators%}) and the `LogicalOperator` of the `CompositeFilterDescriptor`.
+* `FilterDescriptor` - a [CompositeFilterDescriptor](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor) object that describes the column filter. By default, its `FilterDescriptors` field contains two `FilterDescriptor` instances and its `LogicalOperator` is `AND`. You can populate the filter values in the existing `FilterDescriptors` and add more instances. You can change their [filter operator](slug://common-features-filter-operators) and the `LogicalOperator` of the `CompositeFilterDescriptor`.
 
-* `FilterAsync()` - an `async` method that invokes the built-in grid filtering logic (including a handler to [`OnRead`]({%slug components/grid/manual-operations%}) if you use one) so you can call upon it easily from your template (e.g., when a value changes or a button is clicked).
+* `FilterAsync()` - an `async` method that invokes the built-in grid filtering logic (including a handler to [`OnRead`](slug://components/grid/manual-operations) if you use one) so you can call upon it easily from your template (e.g., when a value changes or a button is clicked).
 
-* `ClearFilterAsync()` - an `async` method that invokes the built-in grid clear filtering logic (including a handler to [`OnRead`]({%slug components/grid/manual-operations%}) if you use one) so you can call upon it easily from your template (e.g., when a value is cleared or a button is clicked).
+* `ClearFilterAsync()` - an `async` method that invokes the built-in grid clear filtering logic (including a handler to [`OnRead`](slug://components/grid/manual-operations) if you use one) so you can call upon it easily from your template (e.g., when a value is cleared or a button is clicked).
 
 You can store a reference to each column's context in a field in the view-model, so you can write the handlers in the standard C# code, instead of using lambdas in the markup. You can also pass the context as a Parameter to your own separate filter component to reduce clutter in the main grid markup and code.
 
@@ -43,7 +43,7 @@ The example below shows a custom filter that:
 * Shows how you can store a reference to the context or use it inline in the template.
 * Showcases building a filter descriptor with two filters and sample logic that always filters the data even if one of the inputs is empty.
 
-You can find more examples in the [Live Demo: Custom Filter Row](https://demos.telerik.com/blazor-ui/grid/custom-filter-row) that is available in your local installation under the `demos` folder. Also check [How to implement a filter operator dropdown list in a Filter Row Template]({%slug grid-kb-filter-operator-dropdown%}) in order to mimic the default filter row UI.
+You can find more examples in the [Live Demo: Custom Filter Row](https://demos.telerik.com/blazor-ui/grid/custom-filter-row) that is available in your local installation under the `demos` folder. Also check [How to implement a filter operator dropdown list in a Filter Row Template](slug://grid-kb-filter-operator-dropdown) in order to mimic the default filter row UI.
 
 
 >caption Custom Filter Row Template - Min and Max filters on OnChange
@@ -182,11 +182,11 @@ The example below shows a custom filter that:
 
 You can find more examples in the [Live Demo: Custom Filter Menu](https://demos.telerik.com/blazor-ui/grid/custom-filter-menu) that is available in your local installation under the `demos` folder.
 
-For an example with the CheckboxList Filter, see the [Custom Data]({%slug grid-checklist-filter%}#custom-data) section in its article.
+For an example with the CheckboxList Filter, see the [Custom Data](slug://grid-checklist-filter#custom-data) section in its article.
 
 >caption Custom Filter Menu Template - Multiple Checkboxes
 
->tip The grid can create a checkbox filter for you, see the [CheckBoxList Filtering]({%slug grid-checklist-filter%}) article.
+>tip The grid can create a checkbox filter for you, see the [CheckBoxList Filtering](slug://grid-checklist-filter) article.
 
 ````RAZOR
 @using Telerik.DataSource
@@ -407,5 +407,5 @@ The template receives a `context` of type `FilterMenuTemplateContext` that provi
 
 * [Live Demo: Grid Custom Filter Row](https://demos.telerik.com/blazor-ui/grid/custom-filter-row)
 * [Live Demo: Grid Custom Filter Menu](https://demos.telerik.com/blazor-ui/grid/custom-filter-menu)
-* [KB: Use Filter Operator DropDown List in Filter Row Template]({%slug grid-kb-filter-operator-dropdown%})
-* [Blazor Grid]({%slug grid-overview%})
+* [KB: Use Filter Operator DropDown List in Filter Row Template](slug://grid-kb-filter-operator-dropdown)
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/templates/group-header.md b/components/grid/templates/group-header.md
index 020b44301b..bdd3ce9b91 100644
--- a/components/grid/templates/group-header.md
+++ b/components/grid/templates/group-header.md
@@ -11,7 +11,7 @@ position: 30
 
 # Group Header
 
-When the grid is grouped, the top row above the group provides information about the current group value by default. You can use this template to add custom content there in addition to the current value. For more information and examples, see the [Aggregates]({%slug grid-aggregates%}) article.
+When the grid is grouped, the top row above the group provides information about the current group value by default. You can use this template to add custom content there in addition to the current value. For more information and examples, see the [Aggregates](slug://grid-aggregates) article.
 
 >caption Sample Group Header Template
 
@@ -87,5 +87,5 @@ When the grid is grouped, the top row above the group provides information about
 
  * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
  * [Live Demo: Grid Custom Editor Template](https://demos.telerik.com/blazor-ui/grid/custom-editor)
- * [Blazor Grid]({%slug grid-overview%})
+ * [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/templates/no-data-template.md b/components/grid/templates/no-data-template.md
index 32856c3f46..65f472c125 100644
--- a/components/grid/templates/no-data-template.md
+++ b/components/grid/templates/no-data-template.md
@@ -13,7 +13,7 @@ position: 38
 
 The `NoDataTemplate` allows you to define custom content when the Grid has no data to show. It lets you change the default **No records available** localizable text.
 
-The Grid will also show its default or custom `NoDataTemplate` while loading its initial data. To help users distinguish between the "no data" and "still loading" states, [display a LoaderContainer over the Grid on initial load]({%slug grid-loading%}#example).
+The Grid will also show its default or custom `NoDataTemplate` while loading its initial data. To help users distinguish between the "no data" and "still loading" states, [display a LoaderContainer over the Grid on initial load](slug://grid-loading#example).
 
 >caption Using NoDataTemplate
 
@@ -63,4 +63,4 @@ The Grid will also show its default or custom `NoDataTemplate` while loading its
 
 * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
 * [Live Demo: Grid - No Data Template](https://demos.telerik.com/blazor-ui/grid/no-data-template)
-* [Blazor Grid]({%slug grid-overview%})
+* [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/templates/overview.md b/components/grid/templates/overview.md
index 0c0f91d191..efa1611208 100644
--- a/components/grid/templates/overview.md
+++ b/components/grid/templates/overview.md
@@ -15,25 +15,25 @@ You can customize the grid appearance and behavior through the various templates
 
 The Grid component can use templates for: 
 
-* [columns (cells)]({%slug grid-templates-column%}) - the rendering of each cell (column). You can, for example, change string formats or add your own components.
+* [columns (cells)](slug://grid-templates-column) - the rendering of each cell (column). You can, for example, change string formats or add your own components.
 
-* [rows]({%slug grid-templates-row%}) - the entire rendering of the `tr` element of the row, so you can fully customize the grid behavior and rendering.
+* [rows](slug://grid-templates-row) - the entire rendering of the `tr` element of the row, so you can fully customize the grid behavior and rendering.
 
-* [editing of a field]({%slug grid-templates-editor%}) - when a cell is in edit mode, it will render this template where you can use custom editors, components and logic.
+* [editing of a field](slug://grid-templates-editor) - when a cell is in edit mode, it will render this template where you can use custom editors, components and logic.
 
-* [column header]({%slug grid-templates-column-header%}) - the title portion of the column.
+* [column header](slug://grid-templates-column-header) - the title portion of the column.
 
-* [column group footer]({%slug grid-templates-column-group-footer%}) - the footer of the column when the grid is [grouped]({%slug components/grid/features/grouping%}). You can use it, for example, to display [aggregates]({%slug grid-aggregates%}).
+* [column group footer](slug://grid-templates-column-group-footer) - the footer of the column when the grid is [grouped](slug://components/grid/features/grouping). You can use it, for example, to display [aggregates](slug://grid-aggregates).
 
-* [group header]({%slug grid-templates-group-header%}) - the shared section that denotes each grid [group]({%slug components/grid/features/grouping%}).
+* [group header](slug://grid-templates-group-header) - the shared section that denotes each grid [group](slug://components/grid/features/grouping).
 
-* [filter]({%slug grid-templates-filter%})  - the content of the filter cell or filter menu where you can implement custom rendering and logic for the filters.
+* [filter](slug://grid-templates-filter)  - the content of the filter cell or filter menu where you can implement custom rendering and logic for the filters.
 
-* [no data available]({%slug grid-templates-no-data%}) - when the Grid Data collection is empty or null, you can customize the content inside.
+* [no data available](slug://grid-templates-no-data) - when the Grid Data collection is empty or null, you can customize the content inside.
 
-* [column chooser]({%slug grid-templates-column-chooser%})  - the contents of the column chooser in the column menu. You can use this template to provide custom rendering.
+* [column chooser](slug://grid-templates-column-chooser)  - the contents of the column chooser in the column menu. You can use this template to provide custom rendering.
 
-* [pager]({%slug grid-templates-pager%}) - the template modifies the layout, content, and functionality of the Pager.
+* [pager](slug://grid-templates-pager) - the template modifies the layout, content, and functionality of the Pager.
 
 
 Like other Blazor content, most of them can receive a `context` argument that is the type of the model. To use templates, you must bind the grid to a named model. The filter and header templates are the exception as they are not related to rows and models.
@@ -44,5 +44,5 @@ You must make sure to provide valid HTML in the templates.
 
  * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
  * [Live Demo: Grid Custom Editor Template](https://demos.telerik.com/blazor-ui/grid/custom-editor)
- * [Blazor Grid]({%slug grid-overview%})
+ * [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/templates/pager.md b/components/grid/templates/pager.md
index cea6ba1546..94b42019a9 100644
--- a/components/grid/templates/pager.md
+++ b/components/grid/templates/pager.md
@@ -11,7 +11,7 @@ position: 40
 
 # Pager Template
 
-The `GridPagerTemplate` allows you to modify the layout, content, and functionality of the Pager. To paginate the data, you can use any set of Blazor components and DOM elements instead of the default Grid [Pager]({%slug pager-overview%}).
+The `GridPagerTemplate` allows you to modify the layout, content, and functionality of the Pager. To paginate the data, you can use any set of Blazor components and DOM elements instead of the default Grid [Pager](slug://pager-overview).
 
 
 >caption Using the Telerik UI for Blazor Slider to paginate the Grid data
@@ -84,5 +84,5 @@ The `GridPagerTemplate` allows you to modify the layout, content, and functional
 ## See Also
 
  * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
- * [Blazor Grid]({%slug grid-overview%})
+ * [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/templates/popup-buttons-template.md b/components/grid/templates/popup-buttons-template.md
index 23ab72d69b..4caabb54d5 100644
--- a/components/grid/templates/popup-buttons-template.md
+++ b/components/grid/templates/popup-buttons-template.md
@@ -158,4 +158,4 @@ With the `ButtonsTemplate`, you can personalize the appearance and behavior of t
 
  * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
  * [Live Demo: Grid Popup Edit Form Template](https://demos.telerik.com/blazor-ui/grid/popup-edit-form-template)
- * [Blazor Grid]({%slug grid-overview%})
+ * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/templates/popup-form-template.md b/components/grid/templates/popup-form-template.md
index 08fb2ef036..7b3cc44957 100644
--- a/components/grid/templates/popup-form-template.md
+++ b/components/grid/templates/popup-form-template.md
@@ -20,17 +20,17 @@ With the `FormTemplate` feature, you can customize the appearance and content of
 
 ## Using the Popup Form Template
 
-1. Declare the desired custom content inside the `<FormTemplate>` inner tag of the `<GridPopupEditFormSettings>`. For example, [`TelerikForm`]({%slug form-overview%}) or [`EditForm`](https://learn.microsoft.com/en-us/aspnet/core/blazor/forms/).
+1. Declare the desired custom content inside the `<FormTemplate>` inner tag of the `<GridPopupEditFormSettings>`. For example, [`TelerikForm`](slug://form-overview) or [`EditForm`](https://learn.microsoft.com/en-us/aspnet/core/blazor/forms/).
 1. The `FormTemplate` provides a `context` of type [`GridPopupEditFormTemplateContext`](/blazor-ui/api/telerik.blazor.components.gridpopupeditformtemplatecontext). It contains a clone of the Grid data item in its `Item` property, and reveals if the user is adding a new item or editing an existing one through its `IsNew` boolean property. Cast `context.Item` to your model type, so you can pass it to the custom form.
 1. (optional) Use the `Context` attribute of the `<FormTemplate>` tag to set the name of the `context` variable.
 
 ## Specifics
 
 When using the template, the default Popup form is replaced by the declared content within the `FormTemplate` tag. This introduces the following specifics:
-* The default **Update** and **Cancel** buttons are removed. This means that the [`OnUpdate` and `OnCancel`]({%slug components/grid/editing/overview%}#events) events cannot be triggered. To modify or cancel the update of a record, you need to include custom controls to manage these actions. 
-* The popup footer remains empty by design. You can [either hide it or place your custom buttons in it]({%slug grid-kb-handle-empty-popup-footer%}).
-* The `FormTemplate` disables the [built-in validation]({%slug grid-editing-validation%}) of the Grid. Implement a [Form Validation]({%slug form-validation%}) instead.
-* The [`<GridPopupEditFormSettings>` parameters]({%slug components/grid/editing/popup%}#edit-form-customization) do not apply to a custom `TelerikForm` that you may render inside the `<FormTemplate>` tag. Set the desired Form configurations such as `Columns`, `Orientation`, and more on the [Form component]({%slug form-overview%}#form-parameters).
+* The default **Update** and **Cancel** buttons are removed. This means that the [`OnUpdate` and `OnCancel`](slug://components/grid/editing/overview#events) events cannot be triggered. To modify or cancel the update of a record, you need to include custom controls to manage these actions. 
+* The popup footer remains empty by design. You can [either hide it or place your custom buttons in it](slug://grid-kb-handle-empty-popup-footer).
+* The `FormTemplate` disables the [built-in validation](slug://grid-editing-validation) of the Grid. Implement a [Form Validation](slug://form-validation) instead.
+* The [`<GridPopupEditFormSettings>` parameters](slug://components/grid/editing/popup#edit-form-customization) do not apply to a custom `TelerikForm` that you may render inside the `<FormTemplate>` tag. Set the desired Form configurations such as `Columns`, `Orientation`, and more on the [Form component](slug://form-overview#form-parameters).
 
 ## Example
 
@@ -236,7 +236,7 @@ Using a `FormTemplate` to modify the Edit/Create Popup window.
 
 ## See Also
 
- * [Grid Popup Buttons Template]({%slug grid-templates-popup-buttons%})
+ * [Grid Popup Buttons Template](slug://grid-templates-popup-buttons)
  * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
  * [Live Demo: Grid Popup Edit Form Template](https://demos.telerik.com/blazor-ui/grid/popup-edit-form-template)
- * [Blazor Grid]({%slug grid-overview%})
+ * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/templates/row.md b/components/grid/templates/row.md
index 179fe6f7d5..9febaba3de 100644
--- a/components/grid/templates/row.md
+++ b/components/grid/templates/row.md
@@ -18,7 +18,7 @@ The contents of the row template must be `<td>` elements and their number (or to
 
 You can use the `Context` attribute of the `<RowTemplate>` tag of the grid to set the name of the context variable. Its type is the model type to which the grid is bound.
 
->important Using the row template takes functionality away from the grid because it no longer controls its own rendering. For example, InCell and Inline editing could not render editors, detail templates will not be available, column resizing, locking, visibility and reordering cannot change the data cells anymore, only the headers, and Checkbox selection must be implemented by the app. You can find an example to get started in the following knowledge base article: [Implement Built-in Functions when Using Grid Row Template]({%slug grid-kb-row-template-simulate-built-in-functions%}).
+>important Using the row template takes functionality away from the grid because it no longer controls its own rendering. For example, InCell and Inline editing could not render editors, detail templates will not be available, column resizing, locking, visibility and reordering cannot change the data cells anymore, only the headers, and Checkbox selection must be implemented by the app. You can find an example to get started in the following knowledge base article: [Implement Built-in Functions when Using Grid Row Template](slug://grid-kb-row-template-simulate-built-in-functions).
 
 >caption Using a row template
 
@@ -66,5 +66,5 @@ Render the entire row with your own code and logic
 
  * [Live Demo: Grid Templates](https://demos.telerik.com/blazor-ui/grid/templates)
  * [Live Demo: Grid Custom Editor Template](https://demos.telerik.com/blazor-ui/grid/custom-editor)
- * [Blazor Grid]({%slug grid-overview%})
+ * [Blazor Grid](slug://grid-overview)
 
diff --git a/components/grid/toolbar.md b/components/grid/toolbar.md
index 063650cae2..4f3f2e3f0e 100644
--- a/components/grid/toolbar.md
+++ b/components/grid/toolbar.md
@@ -12,7 +12,7 @@ position: 45
 
 The grid provides a toolbar where you can add a variety of actions that are not tied to a concrete row.
 
-To use a toolbar, define the `GridToolBarTemplate` tag of the grid. In it, you can use arbitrary HTML and components to get the desired layout, and also `GridCommandButton` instances in (you can read more about the features available in those buttons in the [Command Column]({%slug components/grid/columns/command%}) article).
+To use a toolbar, define the `GridToolBarTemplate` tag of the grid. In it, you can use arbitrary HTML and components to get the desired layout, and also `GridCommandButton` instances in (you can read more about the features available in those buttons in the [Command Column](slug://components/grid/columns/command) article).
 
 >note The toolbar is not associated with an item from the data source. The `Item` field on the click event handler argument of a `GridCommandButton` will always be `null` and the `Edit`, `Update`, `Cancel` commands do not work with it.
 
@@ -27,11 +27,11 @@ In this article, you will learn how to use:
 
 The grid offers built-in commands that you can invoke through its toolbar. To use them, set the `Command` property of the button to the command name. The built-in command names are:
 
-* `Add` - starts [inserting a new item in the grid]({%slug components/grid/editing/overview%}).
+* `Add` - starts [inserting a new item in the grid](slug://components/grid/editing/overview).
 
-* `ExcelExport` - starts an [Excel export of the grid data]({%slug grid-export-excel%}).
+* `ExcelExport` - starts an [Excel export of the grid data](slug://grid-export-excel).
 
-* `CsvExport` - starts an [CSV export of the grid data]({%slug grid-export-csv%}).
+* `CsvExport` - starts an [CSV export of the grid data](slug://grid-export-csv).
 
 
 >caption How to insert a new item in the grid
@@ -288,4 +288,4 @@ You can add your own HTML and components to create a more complex layout in the
 ## See Also
 
   * [Live Demo: Grid Toolbar](https://demos.telerik.com/blazor-ui/grid/editing-inline)
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/grid/virtual-scrolling.md b/components/grid/virtual-scrolling.md
index 7858724d8e..071624eb91 100644
--- a/components/grid/virtual-scrolling.md
+++ b/components/grid/virtual-scrolling.md
@@ -14,7 +14,7 @@ Virtual scrolling provides an alternative to paging. Instead of utilizing a page
 
 To enhance rendering performance, the Grid reuses the same set of HTML elements. As the next data loads, a loading indicator appears on the cells. If the user scrolls back up after scrolling down to the next set of rows, the previous data reloads from the data source, similar to regular paging, with the scroll distance determining the data to be loaded.
 
-You can also use the Blazor Grid virtualization for the Grid columns. See the [Column Virtualization]({%slug grid-columns-virtual%}) article for more information.
+You can also use the Blazor Grid virtualization for the Grid columns. See the [Column Virtualization](slug://grid-columns-virtual) article for more information.
 
 ## Using Virtual Scrolling
 
@@ -243,7 +243,7 @@ Set the `RowHeight` parameter to a `decimal` value which will always be interpre
 Consider the following specifics when setting the row height value:
 
 * The Grid renders padding in the cells by default. The loading skeletons have a line height in order to render. This results in some minimum row heights, which can vary depending on the theme and custom CSS styles on the page.
-* Ensure the height of the `td` element matches the `RowHeight` when using the [Row Template]({%slug grid-templates-row%}).
+* Ensure the height of the `td` element matches the `RowHeight` when using the [Row Template](slug://grid-templates-row).
 * Do not change the value of the `RowHeight` parameter at runtime.
 
 ````RAZOR
@@ -320,20 +320,20 @@ Set the `PageSize` parameter to an `int` value. The `PageSize` determines how ma
 
 ## Limitations
 
-The Blazor Grid virtualization primarily enhances client-side rendering performance and improves the user experience. However, it comes with the trade-off that certain features of the Grid are incompatible with it. An alternative approach is to utilize [regular paging]({%slug components/grid/features/paging%}) combined with [manual data source operations]({%slug components/grid/manual-operations%}) to achieve the desired data retrieval performance.
+The Blazor Grid virtualization primarily enhances client-side rendering performance and improves the user experience. However, it comes with the trade-off that certain features of the Grid are incompatible with it. An alternative approach is to utilize [regular paging](slug://components/grid/features/paging) combined with [manual data source operations](slug://components/grid/manual-operations) to achieve the desired data retrieval performance.
 
 These are the known limitations of the virtual scrolling feature:
 
-* [Hierarchy]({%slug components/grid/features/hierarchy%}) is not supported.
+* [Hierarchy](slug://components/grid/features/hierarchy) is not supported.
 
-* [Grouping]({%slug components/grid/features/grouping%}) is not supported. [Loading Group Data On Demand]({%slug grid-group-lod%}) is supported, however.
+* [Grouping](slug://components/grid/features/grouping) is not supported. [Loading Group Data On Demand](slug://grid-group-lod) is supported, however.
 
 
 ## See Also
 
   * [Live Demo: Grid Virtual Scrolling](https://demos.telerik.com/blazor-ui/grid/virtual-scrolling)
-  * [Selection in Grid with Virtualized Rows]({%slug grid-selection-row%}#selection-and-virtual-scrolling)
-  * [Knowledge Base Article: Virtual Scroll Does Not Show All Items]({%slug grid-kb-virtualization-many-records%})
-  * [Knowledge Base Article: Virtual Scrolling Does Not Work]({%slug grid-kb-virtual-scrolling-troubleshooting%})
-  * [Knowledge Base Article: Setting Too Large Skip]({%slug grid-kb-large-skip-virtualization%})
-  * [Blazor Grid]({%slug grid-overview%})
+  * [Selection in Grid with Virtualized Rows](slug://grid-selection-row#selection-and-virtual-scrolling)
+  * [Knowledge Base Article: Virtual Scroll Does Not Show All Items](slug://grid-kb-virtualization-many-records)
+  * [Knowledge Base Article: Virtual Scrolling Does Not Work](slug://grid-kb-virtual-scrolling-troubleshooting)
+  * [Knowledge Base Article: Setting Too Large Skip](slug://grid-kb-large-skip-virtualization)
+  * [Blazor Grid](slug://grid-overview)
diff --git a/components/gridlayout/items.md b/components/gridlayout/items.md
index 6bfd61821d..6ef927a0c8 100644
--- a/components/gridlayout/items.md
+++ b/components/gridlayout/items.md
@@ -389,4 +389,4 @@ You can use the exposed parameters of the GridLayout items to create more comple
 
 ## See Also
 
-  * [Overview]({%slug gridlayout-overview%})
+  * [Overview](slug://gridlayout-overview)
diff --git a/components/gridlayout/overview.md b/components/gridlayout/overview.md
index fa4833aa37..7bfcd1d8fb 100644
--- a/components/gridlayout/overview.md
+++ b/components/gridlayout/overview.md
@@ -73,7 +73,7 @@ Defining a new `GridLayoutColumn` tag to the GridLayout renders a new column in
 
 ## Items
 
-The GridLayout Item defines the content of the TelerikGridLayout. [See the Items article for more information...]({%slug gridlayout-items%})
+The GridLayout Item defines the content of the TelerikGridLayout. [See the Items article for more information...](slug://gridlayout-items)
 
 ## GridLayout Parameters
 
@@ -90,7 +90,7 @@ The GridLayout Item defines the content of the TelerikGridLayout. [See the Items
 
 ## Next Steps
 
-* [Explore the GridLayout Items]({%slug gridlayout-items%})
+* [Explore the GridLayout Items](slug://gridlayout-items)
 
 ## See Also
 
diff --git a/components/listbox/accessibility/wai-aria-support.md b/components/listbox/accessibility/wai-aria-support.md
index 0d0f543233..2ce3d076da 100644
--- a/components/listbox/accessibility/wai-aria-support.md
+++ b/components/listbox/accessibility/wai-aria-support.md
@@ -83,4 +83,4 @@ For details on how the ListBox keyboard navigation works, refer to the [Blazor L
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/listbox/connect.md b/components/listbox/connect.md
index 49f9d1f4b2..c6427234d2 100644
--- a/components/listbox/connect.md
+++ b/components/listbox/connect.md
@@ -25,11 +25,11 @@ To connect ListBox components:
 
 1. Set the `Id` parameter of all ListBox instances.
 1. Set the `ConnectedListBoxId` parameter of the primary instance to the `Id` value of the secondary instance.
-1. [Hide the transfer buttons]({%slug listbox-toolbar%}) from the secondary instance, unless it's a primary one for another ListBox.
-1. Subscribe to the [`OnTransfer` event handler]({%slug listbox-events%}#ontransfer) of all primary ListBoxes.
-1. [`Rebind()`]({%slug listbox-overview%}#listbox-reference-and-methods) each ListBox after making programmatic changes to its `Data`.
+1. [Hide the transfer buttons](slug://listbox-toolbar) from the secondary instance, unless it's a primary one for another ListBox.
+1. Subscribe to the [`OnTransfer` event handler](slug://listbox-events#ontransfer) of all primary ListBoxes.
+1. [`Rebind()`](slug://listbox-overview#listbox-reference-and-methods) each ListBox after making programmatic changes to its `Data`.
 
-> The object references in `args.Items` in the [`OnTransfer` handler]({%slug listbox-events%}#ontransfer) do not match the object references in the `Data` collection of the source ListBox. To remove items from the source ListBox, search for them by some unique identifier.
+> The object references in `args.Items` in the [`OnTransfer` handler](slug://listbox-events#ontransfer) do not match the object references in the `Data` collection of the source ListBox. To remove items from the source ListBox, search for them by some unique identifier.
 
 
 ## Example
@@ -204,9 +204,9 @@ To connect ListBox components:
 
 ## Next Steps
 
-* [Enable ListBox drag-and-drop]({%slug listbox-dragdrop%})
-* [Implement ListBox templates]({%slug listbox-templates%})
-* [Handle ListBox events]({%slug listbox-events%})
+* [Enable ListBox drag-and-drop](slug://listbox-dragdrop)
+* [Implement ListBox templates](slug://listbox-templates)
+* [Handle ListBox events](slug://listbox-events)
 
 
 ## See Also
diff --git a/components/listbox/drag-drop.md b/components/listbox/drag-drop.md
index cfc23d8f3c..6c7166e48d 100644
--- a/components/listbox/drag-drop.md
+++ b/components/listbox/drag-drop.md
@@ -10,7 +10,7 @@ position: 40
 
 # ListBox Item Drag and Drop
 
-The Telerik Blazor ListBox allows users to drag and drop items within the same component instance or across different instances. This is a more flexible alternative to [reordering]({%slug listbox-overview%}#creating-blazor-listbox) or [moving ListBox items]({%slug listbox-connect%}) with toolbar buttons. As a result, dragging and dropping can be a lot faster and convenient to users when the number of related ListBoxes is three or more.
+The Telerik Blazor ListBox allows users to drag and drop items within the same component instance or across different instances. This is a more flexible alternative to [reordering](slug://listbox-overview#creating-blazor-listbox) or [moving ListBox items](slug://listbox-connect) with toolbar buttons. As a result, dragging and dropping can be a lot faster and convenient to users when the number of related ListBoxes is three or more.
 
 
 ## Configuration
@@ -18,9 +18,9 @@ The Telerik Blazor ListBox allows users to drag and drop items within the same c
 To enable drag and drop between ListBox components:
 
 1. Set `Draggable="true"` to all of them.
-1. Set [`DropSources` to the `Id` values]({%slug listbox-overview%}#listbox-parameters) of the permitted source ListBoxes.
-1. Subscribe to the [`OnDrop` event]({%slug listbox-events%}#ondrop) of each ListBox that users can drag items from. The `OnDrop` event always fires from the source (origin) ListBox instance.
-1. [`Rebind()`]({%slug listbox-overview%}#listbox-reference-and-methods) each ListBox after making programmatic changes to its `Data`.
+1. Set [`DropSources` to the `Id` values](slug://listbox-overview#listbox-parameters) of the permitted source ListBoxes.
+1. Subscribe to the [`OnDrop` event](slug://listbox-events#ondrop) of each ListBox that users can drag items from. The `OnDrop` event always fires from the source (origin) ListBox instance.
+1. [`Rebind()`](slug://listbox-overview#listbox-reference-and-methods) each ListBox after making programmatic changes to its `Data`.
 
 
 ## Example
@@ -208,8 +208,8 @@ To enable drag and drop between ListBox components:
 
 ## Next Steps
 
-* [Implement ListBox templates]({%slug listbox-templates%})
-* [Handle ListBox events]({%slug listbox-events%})
+* [Implement ListBox templates](slug://listbox-templates)
+* [Handle ListBox events](slug://listbox-events)
 
 
 ## See Also
diff --git a/components/listbox/events.md b/components/listbox/events.md
index afb61e6a48..23763aff9e 100644
--- a/components/listbox/events.md
+++ b/components/listbox/events.md
@@ -76,7 +76,7 @@ This technique is used in the [example at the end of this article](#example). Of
 
 The `OnDrop` event fires when the user releases the currently dragged ListBox item. The event fires from the originating (source) ListBox instance.
 
-The event handler receives an argument of type [`ListBoxDropEventArgs<T>`](/blazor-ui/api/Telerik.Blazor.Components.ListBoxDropEventArgs-1). See the [example below](#example) and the [example in article Drag and Drop]({%slug listbox-dragdrop%}#example).
+The event handler receives an argument of type [`ListBoxDropEventArgs<T>`](/blazor-ui/api/Telerik.Blazor.Components.ListBoxDropEventArgs-1). See the [example below](#example) and the [example in article Drag and Drop](slug://listbox-dragdrop#example).
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
@@ -89,9 +89,9 @@ The event handler receives an argument of type [`ListBoxDropEventArgs<T>`](/blaz
 
 ## OnRemove
 
-The `OnRemove` event fires when the user clicks on the Remove button in the [ListBox toolbar]({%slug listbox-toolbar%}).
+The `OnRemove` event fires when the user clicks on the Remove button in the [ListBox toolbar](slug://listbox-toolbar).
 
-The event handler receives an argument of type [`ListBoxRemoveEventArgs<T>`](/blazor-ui/api/Telerik.Blazor.Components.ListBoxRemoveEventArgs-1). See the [example below](#example) and the [example in article ListBox Templates]({%slug listbox-templates%}#example).
+The event handler receives an argument of type [`ListBoxRemoveEventArgs<T>`](/blazor-ui/api/Telerik.Blazor.Components.ListBoxRemoveEventArgs-1). See the [example below](#example) and the [example in article ListBox Templates](slug://listbox-templates#example).
 
 | Property | Type | Description |
 | --- | --- | --- |
@@ -100,9 +100,9 @@ The event handler receives an argument of type [`ListBoxRemoveEventArgs<T>`](/bl
 
 ## OnReorder
 
-The `OnReorder` event fires when the user clicks on a Reorder button in the [ListBox toolbar]({%slug listbox-toolbar%}) (Move Up or Move Down).
+The `OnReorder` event fires when the user clicks on a Reorder button in the [ListBox toolbar](slug://listbox-toolbar) (Move Up or Move Down).
 
-The event handler receives an argument of type [`ListBoxReorderEventArgs<T>`](/blazor-ui/api/Telerik.Blazor.Components.ListBoxReorderEventArgs-1). See the [example below](#example) and the example at [Creating Blazor ListBox]({%slug listbox-overview%}#creating-blazor-listbox).
+The event handler receives an argument of type [`ListBoxReorderEventArgs<T>`](/blazor-ui/api/Telerik.Blazor.Components.ListBoxReorderEventArgs-1). See the [example below](#example) and the example at [Creating Blazor ListBox](slug://listbox-overview#creating-blazor-listbox).
 
 | Property | Type | Description |
 | --- | --- | --- |
@@ -113,9 +113,9 @@ The event handler receives an argument of type [`ListBoxReorderEventArgs<T>`](/b
 
 ## OnTransfer
 
-The `OnTransfer` event fires when the user clicks on any of the Transfer buttons in the [ListBox toolbar]({%slug listbox-toolbar%}) (Transfer To, Transfer From, Transfer All To, and Transfer All From).
+The `OnTransfer` event fires when the user clicks on any of the Transfer buttons in the [ListBox toolbar](slug://listbox-toolbar) (Transfer To, Transfer From, Transfer All To, and Transfer All From).
 
-The event handler receives an argument of type [`ListBoxTransferEventArgs<T>`](/blazor-ui/api/Telerik.Blazor.Components.ListBoxTransferEventArgs-1). See the [example below](#example) and the [example in article Connect ListBoxes]({%slug listbox-connect%}#example).
+The event handler receives an argument of type [`ListBoxTransferEventArgs<T>`](/blazor-ui/api/Telerik.Blazor.Components.ListBoxTransferEventArgs-1). See the [example below](#example) and the [example in article Connect ListBoxes](slug://listbox-connect#example).
 
 | Property | Type | Description |
 | --- | --- | --- |
@@ -134,7 +134,7 @@ The event argument is of type `IEnumerable<T>`. See the example below.
 
 All events in the example below are fired by the first ListBox, except `OnDrop`, which is fired by the originating (source) ListBox instance.
 
-Always [`Rebind()`]({%slug listbox-overview%}#listbox-reference-and-methods) the ListBox after making programmatic changes to its `Data`.
+Always [`Rebind()`](slug://listbox-overview#listbox-reference-and-methods) the ListBox after making programmatic changes to its `Data`.
 
 >caption Using ListBox events
 
diff --git a/components/listbox/overview.md b/components/listbox/overview.md
index 13ee0d3604..425e559b77 100644
--- a/components/listbox/overview.md
+++ b/components/listbox/overview.md
@@ -20,10 +20,10 @@ To use a Telerik ListBox for Blazor:
 1. Add the `TelerikListBox` tag.
 1. Set the `Data` parameter to an `IEnumerable<T>`.
 1. Set `TextField` to the property name that holds the string values to display in the ListBox. Skip this step when [binding the component to a collection of strings or value type data](#data-binding).
-1. Set `SelectedItems` to an `IEnumerable<T>` to store or change the component selection. Optionally, [enable multiple selection]({%slug listbox-selection%}).
-1. Configure the [ListBox toolbar]({%slug listbox-toolbar%}) in `<ListBoxToolBarSettings>` and specify which buttons will be visible. By default, the toolbar shows all buttons. Each button requires an [event handler]({%slug listbox-events%}) to work.
+1. Set `SelectedItems` to an `IEnumerable<T>` to store or change the component selection. Optionally, [enable multiple selection](slug://listbox-selection).
+1. Configure the [ListBox toolbar](slug://listbox-toolbar) in `<ListBoxToolBarSettings>` and specify which buttons will be visible. By default, the toolbar shows all buttons. Each button requires an [event handler](slug://listbox-events) to work.
 1. (optional) Set the `Width` and `Height` parameters, based on the number of toolbar buttons and desired number of visible items. The component will automatically show a vertical scrollbar if needed. Long items will wrap.
-1. Set the `@ref` attribute and obtain [reference to the ListBox instance](#listbox-reference-and-methods). This is necessary to [`Rebind()` the component after programmatic data changes]({%slug common-features-data-binding-overview%}#refresh-data).
+1. Set the `@ref` attribute and obtain [reference to the ListBox instance](#listbox-reference-and-methods). This is necessary to [`Rebind()` the component after programmatic data changes](slug://common-features-data-binding-overview#refresh-data).
 
 >caption Basic Blazor ListBox
 
@@ -115,37 +115,37 @@ The ListBox supports [binding to a model class](#creating-blazor-listbox), which
 
 ## Toolbar
 
-The [ListBox includes a toolbar with some built-in buttons]({%slug listbox-toolbar%}). These tools fire events, which are related to item removal, reordering, or transfer to another ListBox. The component supports removing some of the default buttons or adding custom ones. You can also control the toolbar position with regard to the ListBox item list, or hide the toolbar completely.
+The [ListBox includes a toolbar with some built-in buttons](slug://listbox-toolbar). These tools fire events, which are related to item removal, reordering, or transfer to another ListBox. The component supports removing some of the default buttons or adding custom ones. You can also control the toolbar position with regard to the ListBox item list, or hide the toolbar completely.
 
 
 ## Reordering
 
-The ListBox allows users to move one or multiple items up and down with built-in [toolbar buttons]({%slug listbox-toolbar%}). The component will fire its [`OnReoder` event]({%slug listbox-events%}#onreorder), so that the app can apply the new item order in the ListBox `Data`. See an [example above](#creating-blazor-listbox) or on the [ListBox Events]({%slug listbox-events%}#example) page.
+The ListBox allows users to move one or multiple items up and down with built-in [toolbar buttons](slug://listbox-toolbar). The component will fire its [`OnReoder` event](slug://listbox-events#onreorder), so that the app can apply the new item order in the ListBox `Data`. See an [example above](#creating-blazor-listbox) or on the [ListBox Events](slug://listbox-events#example) page.
 
 
 ## Selection
 
-Users can [select just one ListBox item or multiple items]({%slug listbox-selection%}) with the mouse or keyboard. The behavior depends on the `SelectedItems` parameter value.
+Users can [select just one ListBox item or multiple items](slug://listbox-selection) with the mouse or keyboard. The behavior depends on the `SelectedItems` parameter value.
 
 
 ## Move Items Between ListBoxes
 
-You can [connect several ListBox components and enable users to move items from one ListBox to another]({%slug listbox-connect%}).
+You can [connect several ListBox components and enable users to move items from one ListBox to another](slug://listbox-connect).
 
 
 ## Drag and Drop Items
 
-Users can also [reorder items or move items to another ListBox with drag and drop]({%slug listbox-dragdrop%}).
+Users can also [reorder items or move items to another ListBox with drag and drop](slug://listbox-dragdrop).
 
 
 ## Templates
 
-The [ListBox component provides templates]({%slug listbox-templates%}) to enable developers to customize the rendering and appearance of the component.
+The [ListBox component provides templates](slug://listbox-templates) to enable developers to customize the rendering and appearance of the component.
 
 
 ## Events
 
-The various [ListBox events]({%slug listbox-events%}) allow you to implement custom functionality and handle user interactions with the component's toolbar.
+The various [ListBox events](slug://listbox-events) allow you to implement custom functionality and handle user interactions with the component's toolbar.
 
 
 ## ListBox Parameters
@@ -158,21 +158,21 @@ The table below lists the ListBox parameters. For a full list of the ListBox API
 | --- | --- | --- |
 | `AriaLabel` | `string` | The [`aria-label` attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label) of the `<ul>` element that holds the ListBox items. |
 | `AriaLabelledBy` | `string` | The `aria-labelledby` attribute of the `<ul>` element that holds the ListBox items. |
-| `Class` | `string` | The `class` attribute of the `<div class="k-listbox">` element. Use it to apply custom styles or [override the theme]({%slug themes-override%}). |
-| `ConnectedListBoxId` | `string` | The `Id` value of another ListBox instance. Use it to [connect multiple ListBox instances]({%slug listbox-connect%}) and transfer items between them. |
+| `Class` | `string` | The `class` attribute of the `<div class="k-listbox">` element. Use it to apply custom styles or [override the theme](slug://themes-override). |
+| `ConnectedListBoxId` | `string` | The `Id` value of another ListBox instance. Use it to [connect multiple ListBox instances](slug://listbox-connect) and transfer items between them. |
 | `Data` | `IEnumerable<T>` * | The ListBox component data collection. |
 | `Draggable` | `bool` | Defines if users can drag and drop ListBox items. |
 | `DropSources` | `List<string>` | The `Id` values of the ListBoxes from which users can drag items into the current ListBox. |
 | `Enabled` | `bool` <br /> (`true`) | Defines if the ListBox allows item selection and toolbar operation. |
-| `Height` | `string` | The `height` style of the component in any [supported CSS unit]({%slug common-features/dimensions%}). The default ListBox dimensions depend on the CSS theme. |
-| `Id` | `string` | The `id` attribute of `<div class="k-listbox">`. Use it to [link multiple ListBox instances]({%slug listbox-connect%}) and transfer items between them. |
+| `Height` | `string` | The `height` style of the component in any [supported CSS unit](slug://common-features/dimensions). The default ListBox dimensions depend on the CSS theme. |
+| `Id` | `string` | The `id` attribute of `<div class="k-listbox">`. Use it to [link multiple ListBox instances](slug://listbox-connect) and transfer items between them. |
 | `SelectedItems` | `IEnumerable<T>` * | The selected item(s) of the ListBox. The parameter supports two-way binding. The variable that is used with this parameter must be specifically `IEnumerable<T>` and not `List<T>`. |
 | `SelectionMode` | `ListBoxSelectionMode` enum <br /> (`Single`) | Defines if users can select just one or multiple items. |
 | `Size` | `string` <br /> (`"md"`) | This parameter controls ListBox styles such as paddings or font size. For easier usage, set the parameter to a member of the static class `Telerik.Blazor.ThemeConstants.ListBox.Size`. |
 | `TextField` | `string` <br /> (`"Text"`) | The property name of class `T` that holds the item value to display in the ListBox. |
-| `TItem` | `Type` | The ListBox model type. Although the compiler can usually infer the type from the `Data` parameter, you can set `TItem` for [simpler syntax in the event handler declarations]({%slug listbox-events%}). |
+| `TItem` | `Type` | The ListBox model type. Although the compiler can usually infer the type from the `Data` parameter, you can set `TItem` for [simpler syntax in the event handler declarations](slug://listbox-events). |
 | `ToolBarPosition` | `ListBoxToolBarPosition` enum <br /> (`Right`) | The ListBox toolbar position with relation to the item list. |
-| `Width` | `string` | The `width` style of the component in any [supported CSS unit]({%slug common-features/dimensions%}). The default ListBox dimensions depend on the CSS theme. |
+| `Width` | `string` | The `width` style of the component in any [supported CSS unit](slug://common-features/dimensions). The default ListBox dimensions depend on the CSS theme. |
 
 \* `T` is the ListBox model type.
 
@@ -183,7 +183,7 @@ The ListBox exposes methods for programmatic operation. To use them, define a re
 
 | Method | Description |
 | --- | --- |
-| `Rebind` | Refreshes the ListBox and ensures it displays the current `Data`. [`Rebind` is necessary when the Blazor framework cannot re-render components automatically]({%slug common-features-data-binding-overview%}#refresh-data). |
+| `Rebind` | Refreshes the ListBox and ensures it displays the current `Data`. [`Rebind` is necessary when the Blazor framework cannot re-render components automatically](slug://common-features-data-binding-overview#refresh-data). |
 
 >caption ListBox reference and method usage
 
@@ -225,12 +225,12 @@ The ListBox exposes methods for programmatic operation. To use them, define a re
 
 ## Next Steps
 
-* [Configure the ListBox toolbar]({%slug listbox-toolbar%})
-* [Choose the ListBox selection mode]({%slug listbox-selection%})
-* [Connect Multiple ListBoxes]({%slug listbox-connect%})
-* [Enable ListBox drag-and-drop]({%slug listbox-dragdrop%})
-* [Implement ListBox templates]({%slug listbox-templates%})
-* [Handle ListBox events]({%slug listbox-events%})
+* [Configure the ListBox toolbar](slug://listbox-toolbar)
+* [Choose the ListBox selection mode](slug://listbox-selection)
+* [Connect Multiple ListBoxes](slug://listbox-connect)
+* [Enable ListBox drag-and-drop](slug://listbox-dragdrop)
+* [Implement ListBox templates](slug://listbox-templates)
+* [Handle ListBox events](slug://listbox-events)
 
 ## See Also
 
diff --git a/components/listbox/selection.md b/components/listbox/selection.md
index 8a5422c412..95213d5d28 100644
--- a/components/listbox/selection.md
+++ b/components/listbox/selection.md
@@ -15,19 +15,19 @@ This article describes the ListBox selection feature, including the available se
 
 ## Selection Modes
 
-The ListBox component provides users two ways to select items. This depends on the value of the [`SelectionMode` parameter]({%slug listbox-overview%}#listbox-parameters), which expects a member of the `ListBoxSelectionMode` enum.
+The ListBox component provides users two ways to select items. This depends on the value of the [`SelectionMode` parameter](slug://listbox-overview#listbox-parameters), which expects a member of the `ListBoxSelectionMode` enum.
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
 | Selection&nbsp;Mode | Description |
 | --- | --- |
-| `Single` | Users can select only one ListBox item. They can change the selected item, but cannot deselect the selected one. You can [use a custom toolbar button]({%slug listbox-toolbar%}#custom-tools) to clear the selection. See the [example below](#example). |
+| `Single` | Users can select only one ListBox item. They can change the selected item, but cannot deselect the selected one. You can [use a custom toolbar button](slug://listbox-toolbar#custom-tools) to clear the selection. See the [example below](#example). |
 | `Multiple` | Users can select any number of items. The ListBox supports selection of adjacent items with `Shift` or non-adjacent items with `Ctrl` (`Cmd` on a Mac). Use mouse clicks or the arrow keys, as described on the [ListBox Keyboard Navigation demo](https://demos.telerik.com/blazor-ui/listbox/keyboard-navigation). |
 
 
 ## SelectedItems Parameter
 
-The `SelectedItems` parameter of the ListBox supports two-way binding. In this case, the component will update the `SelectedItems` parameter value automatically when the user changes the current selection. If you use `SelectedItems` with one-way binding, you must subscribe to the [`SelectedItemsChanged` event]({%slug listbox-events%}#selecteditemschanged) to update the `SelectedItems` parameter value manually on each user selection.
+The `SelectedItems` parameter of the ListBox supports two-way binding. In this case, the component will update the `SelectedItems` parameter value automatically when the user changes the current selection. If you use `SelectedItems` with one-way binding, you must subscribe to the [`SelectedItemsChanged` event](slug://listbox-events#selecteditemschanged) to update the `SelectedItems` parameter value manually on each user selection.
 
 > The ListBox `SelectedItems` parameter must be defined as `IEnumerable<T>` in the application. Unlike the `Data` parameter, it cannot be a `List<T>`, because the built-in `SelectedItemsChanged` handler that is used with two-way binding is defined in the ListBox source code as `EventCallback<IEnumerable<T>>`.
 
@@ -109,15 +109,15 @@ The `SelectedItems` parameter of the ListBox supports two-way binding. In this c
 
 ## Next Steps
 
-* [Connect Multiple ListBoxes]({%slug listbox-connect%})
-* [Enable ListBox drag-and-drop]({%slug listbox-dragdrop%})
-* [Implement ListBox templates]({%slug listbox-templates%})
-* [Handle ListBox events]({%slug listbox-events%})
+* [Connect Multiple ListBoxes](slug://listbox-connect)
+* [Enable ListBox drag-and-drop](slug://listbox-dragdrop)
+* [Implement ListBox templates](slug://listbox-templates)
+* [Handle ListBox events](slug://listbox-events)
 
 
 ## See Also
 
 * [Live Demo: ListBox Selection](https://demos.telerik.com/blazor-ui/listbox/selection)
 * [Live Demo: ListBox Keyboard Navigation](https://demos.telerik.com/blazor-ui/listbox/keyboard-navigation)
-* [KB: ListBox CheckBox Selection]({%slug listbox-kb-checkbox-selection%})
-* [KB: Scroll to Selected ListBox Item]({%slug listbox-kb-scroll-to-selected-item%})
+* [KB: ListBox CheckBox Selection](slug://listbox-kb-checkbox-selection)
+* [KB: Scroll to Selected ListBox Item](slug://listbox-kb-scroll-to-selected-item)
diff --git a/components/listbox/templates.md b/components/listbox/templates.md
index cf9afb25d7..1674c5319b 100644
--- a/components/listbox/templates.md
+++ b/components/listbox/templates.md
@@ -30,9 +30,9 @@ The ListBox shows the `NoDataTemplate` when there are no items in the component
 
 ## Example
 
-The following example shows how to place a Button inside the `NoDataTemplate`, which adds new items to the ListBox. Another option for such functionality is to use a [custom toolbar button]({%slug listbox-toolbar%}#custom-tools).
+The following example shows how to place a Button inside the `NoDataTemplate`, which adds new items to the ListBox. Another option for such functionality is to use a [custom toolbar button](slug://listbox-toolbar#custom-tools).
 
-Always [`Rebind()`]({%slug listbox-overview%}#listbox-reference-and-methods) the ListBox after making programmatic changes to its `Data`.
+Always [`Rebind()`](slug://listbox-overview#listbox-reference-and-methods) the ListBox after making programmatic changes to its `Data`.
 
 >caption Using ListBox templates
 
@@ -118,7 +118,7 @@ Always [`Rebind()`]({%slug listbox-overview%}#listbox-reference-and-methods) the
 
 ## Next Steps
 
-* [Handle ListBox events]({%slug listbox-events%})
+* [Handle ListBox events](slug://listbox-events)
 
 
 ## See Also
diff --git a/components/listbox/toolbar.md b/components/listbox/toolbar.md
index 8f6603b09f..4b23b397ba 100644
--- a/components/listbox/toolbar.md
+++ b/components/listbox/toolbar.md
@@ -23,17 +23,17 @@ Each button becomes enabled when it can be used, for example, when the user sele
 
 | Tool Name | Tool Tag | Event On Click | Description |
 | --- | --- | --- | --- |
-| Move Up | `<ListBoxToolBarMoveUpTool />` | [`OnReorder`]({%slug listbox-events%}#onreorder) | Moves the selected item(s) down by one position. |
-| Move Down | `<ListBoxToolBarMoveDownTool />` | [`OnReorder`]({%slug listbox-events%}#onreorder) | Moves the selected items up by one position. |
-| Transfer To | `<ListBoxToolBarTransferToTool />` | [`OnTransfer`]({%slug listbox-events%}#ontransfer) | Moves the selected items to a connected ListBox component. |
-| Transfer From | `<ListBoxToolBarTransferFromTool />` | [`OnTransfer`]({%slug listbox-events%}#ontransfer) | Moves the selected items from a connected ListBox component to the current one. |
-| Transfer All To | `<ListBoxToolBarTransferAllToTool />` | [`OnTransfer`]({%slug listbox-events%}#ontransfer) | Moves all items to a connected ListBox component. |
-| Transfer All From | `<ListBoxToolBarTransferAllFromTool />` | [`OnTransfer`]({%slug listbox-events%}#ontransfer) | Moves all items from the connected ListBox component to the current one. |
-| Remove | `<ListBoxToolBarRemoveTool />` | [`OnRemove`]({%slug listbox-events%}#onremove) | Removes the selected item(s). |
+| Move Up | `<ListBoxToolBarMoveUpTool />` | [`OnReorder`](slug://listbox-events#onreorder) | Moves the selected item(s) down by one position. |
+| Move Down | `<ListBoxToolBarMoveDownTool />` | [`OnReorder`](slug://listbox-events#onreorder) | Moves the selected items up by one position. |
+| Transfer To | `<ListBoxToolBarTransferToTool />` | [`OnTransfer`](slug://listbox-events#ontransfer) | Moves the selected items to a connected ListBox component. |
+| Transfer From | `<ListBoxToolBarTransferFromTool />` | [`OnTransfer`](slug://listbox-events#ontransfer) | Moves the selected items from a connected ListBox component to the current one. |
+| Transfer All To | `<ListBoxToolBarTransferAllToTool />` | [`OnTransfer`](slug://listbox-events#ontransfer) | Moves all items to a connected ListBox component. |
+| Transfer All From | `<ListBoxToolBarTransferAllFromTool />` | [`OnTransfer`](slug://listbox-events#ontransfer) | Moves all items from the connected ListBox component to the current one. |
+| Remove | `<ListBoxToolBarRemoveTool />` | [`OnRemove`](slug://listbox-events#onremove) | Removes the selected item(s). |
 
 The descriptions above mention the typical user operation that each button implies. However, the exact operation depends entirely on the business requirements and event handler implementation. For example:
 
-* Clicking on the Remove button can apply custom disabled styling to an item, instead of removing it. The app may also prevent selection of this item through the [ListBox `SelectedItemsChanged` event]({%slug listbox-events%}#selecteditemschanged).
+* Clicking on the Remove button can apply custom disabled styling to an item, instead of removing it. The app may also prevent selection of this item through the [ListBox `SelectedItemsChanged` event](slug://listbox-events#selecteditemschanged).
 * Transferred items can be copied to another ListBox component, rather than moved.
 * Reordered non-adjacent items can be moved with or without the gap between them.
 
@@ -51,7 +51,7 @@ The following example demonstrates how to:
 * Mimic the default toolbar configuration, except for the custom tool.
 * Enable or disable a custom toolbar button, depending on the current ListBox selection.
 
-The example below omits all required event handlers for brevity. Consult the [ListBox Events article]({%slug listbox-events%}) for more information and complete examples.
+The example below omits all required event handlers for brevity. Consult the [ListBox Events article](slug://listbox-events) for more information and complete examples.
 
 >caption Setting up the ListBox Toolbar
 
@@ -135,11 +135,11 @@ The example below omits all required event handlers for brevity. Consult the [Li
 
 ## Next Steps
 
-* [Choose the ListBox selection mode]({%slug listbox-selection%})
-* [Connect Multiple ListBoxes]({%slug listbox-connect%})
-* [Enable ListBox drag-and-drop]({%slug listbox-dragdrop%})
-* [Implement ListBox templates]({%slug listbox-templates%})
-* [Handle ListBox events]({%slug listbox-events%})
+* [Choose the ListBox selection mode](slug://listbox-selection)
+* [Connect Multiple ListBoxes](slug://listbox-connect)
+* [Enable ListBox drag-and-drop](slug://listbox-dragdrop)
+* [Implement ListBox templates](slug://listbox-templates)
+* [Handle ListBox events](slug://listbox-events)
 
 ## See Also
 
diff --git a/components/listview/accessibility/wai-aria-support.md b/components/listview/accessibility/wai-aria-support.md
index fe43678d8f..ea41749f5c 100644
--- a/components/listview/accessibility/wai-aria-support.md
+++ b/components/listview/accessibility/wai-aria-support.md
@@ -66,9 +66,9 @@ The ListView has been tested with the following screen readers and browsers comb
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor ListView Demos](https://demos.telerik.com/blazor-ui/listview/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/listview/editing.md b/components/listview/editing.md
index 03d1eb7bf4..ab098dd608 100644
--- a/components/listview/editing.md
+++ b/components/listview/editing.md
@@ -10,7 +10,7 @@ position: 3
 
 # Editing
 
-The ListView lets you edit the data through a dedicated [edit template]({%slug listview-templates%}#edit-template). You can put the items in edit/insert mode, as well as delete items through dedicated command buttons from the listview.
+The ListView lets you edit the data through a dedicated [edit template](slug://listview-templates#edit-template). You can put the items in edit/insert mode, as well as delete items through dedicated command buttons from the listview.
 
 To invoke the commands, use the `ListViewCommandButton` component in the templates of the component. It can take the following built-in `Command` values:
 * `Add` - initializes a new item insertion by adding the `EditTemplate` at the top of the listview.
@@ -200,6 +200,6 @@ The CUD operations are implemented through dedicated events that let you alter t
 
 ## See Also
 
-  * [ListView Overview]({%slug listview-overview%})
+  * [ListView Overview](slug://listview-overview)
    
   
diff --git a/components/listview/events.md b/components/listview/events.md
index e70fa54565..412187911c 100644
--- a/components/listview/events.md
+++ b/components/listview/events.md
@@ -24,12 +24,12 @@ The `OnCreate`, `OnUpdate` and `OnDelete` events let you get the data item that
 
 The `OnEdit` and `OnCancel` events let you respond to user actions - when they want to edit an item and when the want to cancel changes on an item they have been editing. You can use them to, for example, prevent editing of certain items based on some condition.
 
-You can read more about the CUD events in the [ListView Editing]({%slug listview-editing%}) article.
+You can read more about the CUD events in the [ListView Editing](slug://listview-editing) article.
 
 
 ## Read Event
 
-In the common case, you provide all the data to the listview's Data collection and the listview performs paging on it for you. In some cases you may want to do this with your own code (for example, to retrieve only a small number of items in order to improve the backend performance). You can do this by attaching to the [`OnRead` event]({%slug common-features-data-binding-onread%}) where you can perform all the data read operations in the listview. You can read more about it in the [Manual Data Source Operations]({%slug listview-manual-operations%}) article.
+In the common case, you provide all the data to the listview's Data collection and the listview performs paging on it for you. In some cases you may want to do this with your own code (for example, to retrieve only a small number of items in order to improve the backend performance). You can do this by attaching to the [`OnRead` event](slug://common-features-data-binding-onread) where you can perform all the data read operations in the listview. You can read more about it in the [Manual Data Source Operations](slug://listview-manual-operations) article.
 
 ### OnModelInit
 
@@ -630,4 +630,4 @@ Make sure to update the current page size when using the event.
 
 ## See Also
 
-* [ListView Overview]({%slug listview-overview%})
+* [ListView Overview](slug://listview-overview)
diff --git a/components/listview/manual-operations.md b/components/listview/manual-operations.md
index d292c2181b..6e9dfad7d7 100644
--- a/components/listview/manual-operations.md
+++ b/components/listview/manual-operations.md
@@ -10,7 +10,7 @@ position: 5
 
 # Manual Data Source Operations
 
-The ListView lets you fetch the current page of data on demand through the [`OnRead` event]({%slug common-features-data-binding-onread%}). This can let you optimize database queries and return only a small number of records.
+The ListView lets you fetch the current page of data on demand through the [`OnRead` event](slug://common-features-data-binding-onread). This can let you optimize database queries and return only a small number of records.
 
 In this article you will find examples how to:
 * implement [custom paging](#custom-paging)
diff --git a/components/listview/overview.md b/components/listview/overview.md
index 42d79498c0..870272e3b3 100644
--- a/components/listview/overview.md
+++ b/components/listview/overview.md
@@ -73,23 +73,23 @@ the rest of the features the component provides further in this article *@
 
 ## Templates
 
-The ListView allows full control of the item rendering and layout. The component has a header, footer, and template for editing items. [Read more about the Blazor ListView templates]({%slug listview-templates%}).
+The ListView allows full control of the item rendering and layout. The component has a header, footer, and template for editing items. [Read more about the Blazor ListView templates](slug://listview-templates).
 
 ## Editing
 
-The ListView component has functionality to put the items in edit/insert mode, as well as delete items through dedicated command buttons. [Read more about the Blazor ListView editing]({%slug listview-editing%}).
+The ListView component has functionality to put the items in edit/insert mode, as well as delete items through dedicated command buttons. [Read more about the Blazor ListView editing](slug://listview-editing).
 
 ## Paging
 
-The ListView supports automatic paging of the provided data, so the user has less scrolling to do. The list also fits better in the layout. [Read more about the Blazor ListView paging]({%slug listview-paging%}).
+The ListView supports automatic paging of the provided data, so the user has less scrolling to do. The list also fits better in the layout. [Read more about the Blazor ListView paging](slug://listview-paging).
 
 ## Refresh Data
 
-The ListView can refresh its data manually so the component can react to changes in the collection. [Read more about the Blazor ListView data refresh]({%slug listview-refresh-data%}).
+The ListView can refresh its data manually so the component can react to changes in the collection. [Read more about the Blazor ListView data refresh](slug://listview-refresh-data).
 
 ## Events
 
-The ListView provides events related to editing and [loading data on demand]({%slug listview-manual-operations%}). [Read more about the Blazor ListView events]({%slug listview-events%}).
+The ListView provides events related to editing and [loading data on demand](slug://listview-manual-operations). [Read more about the Blazor ListView events](slug://listview-events).
 
 ## ListView Parameters
 
@@ -99,22 +99,22 @@ The table below lists the ListView parameters. For a full list of the ListView A
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | The `class` attribute of the `<div class="k-listview">` element. Use it to apply custom styles or [override the theme]({%slug themes-override%}). |
+| `Class` | `string` | The `class` attribute of the `<div class="k-listview">` element. Use it to apply custom styles or [override the theme](slug://themes-override). |
 | `Data` | `IEnumerable<TItem>` | The ListView component data collection. |
 | `EnableLoaderContainer` | `bool` <br /> (`true`) | The ListView loading container that is shown when there are long-running operations. |
-| `Height` | `string` | The `height` style of the component in any [supported CSS unit]({%slug common-features/dimensions%}). The default ListView dimensions depend on the CSS theme. |
+| `Height` | `string` | The `height` style of the component in any [supported CSS unit](slug://common-features/dimensions). The default ListView dimensions depend on the CSS theme. |
 | `Page` | `int` <br /> (`1`) | The current page of the ListView component. |
 | `Pageable` | `bool` <br /> (`false`) | Determines if the ListView allows paging. |
 | `PageSize` | `int` <br /> (`10`) | The number of items to display per page in the ListView. |
-| `Width` | `string` | The `width` style of the component in any [supported CSS unit]({%slug common-features/dimensions%}). The default ListView dimensions depend on the CSS theme. |
+| `Width` | `string` | The `width` style of the component in any [supported CSS unit](slug://common-features/dimensions). The default ListView dimensions depend on the CSS theme. |
 
 ## Next Steps
 
-* [Implement ListView Templates]({%slug listview-templates%})
+* [Implement ListView Templates](slug://listview-templates)
 
-* [Enable ListView Editing]({%slug listview-editing%})
+* [Enable ListView Editing](slug://listview-editing)
 
-* [Explore the ListView Events]({%slug listview-events%})
+* [Explore the ListView Events](slug://listview-events)
 
 ## See Also
 
diff --git a/components/listview/paging.md b/components/listview/paging.md
index b3d8877be8..d4fa504e5b 100644
--- a/components/listview/paging.md
+++ b/components/listview/paging.md
@@ -55,16 +55,16 @@ The ListView component can page the entire data source automatically. Alternativ
 
 ## Events
 
-The ListView exposes three relevant events. You can find related examples in the [Events]({%slug listview-events%}) article.
+The ListView exposes three relevant events. You can find related examples in the [Events](slug://listview-events) article.
 
 * `PageChanged` - you can use this to react to the user changing the page.
 * `PageSizeChanged` - fires when the user changes the page size via the pager DropDownList.
-* `OnRead` - you can use this to perform the read operation yourself on demand, instead of providing the entire data source at once. You can read more about this in the [Manual Data Source Operations]({%slug listview-manual-operations%}) article.
+* `OnRead` - you can use this to perform the read operation yourself on demand, instead of providing the entire data source at once. You can read more about this in the [Manual Data Source Operations](slug://listview-manual-operations) article.
 
 >tip You can optimize database queries in two ways:
 >
 > * Use an `IQueryable<MyModel>` collection for the listview `Data`. The listview will build a LINQ expression internally that will be resolved only when needed. This can be useful when the `Data` comes from something like an EntityFramework context.
-> * Bind the ListView with an [`OnRead` handler]({%slug common-features-data-binding-onread%}) and implement [manual data source operations]({%slug listview-manual-operations%}).
+> * Bind the ListView with an [`OnRead` handler](slug://common-features-data-binding-onread) and implement [manual data source operations](slug://listview-manual-operations).
 
 ## Pager Settings
 
@@ -117,8 +117,8 @@ In addition to `Page` and `PageSize`, the ListView provides advanced pager confi
 
 ## See Also
 
-* [ListView Overview]({%slug listview-overview%})
-* [Manual Data Source Operations]({%slug listview-manual-operations%})
-* [Events]({%slug listview-events%})
-* [How to increase the pager dropdownlist width]({%slug pager-kb-dropdown-width%})
+* [ListView Overview](slug://listview-overview)
+* [Manual Data Source Operations](slug://listview-manual-operations)
+* [Events](slug://listview-events)
+* [How to increase the pager dropdownlist width](slug://pager-kb-dropdown-width)
 * [Live Demo: ListView](https://demos.telerik.com/blazor-ui/listview/overview)
diff --git a/components/listview/refresh-data.md b/components/listview/refresh-data.md
index 7bdd413bbb..91cf68b0bd 100644
--- a/components/listview/refresh-data.md
+++ b/components/listview/refresh-data.md
@@ -20,7 +20,7 @@ In this article:
 
 ## Rebind Method
 
-To refresh the `ListView` data when using [`OnRead`]({%slug listview-manual-operations%}), call the `Rebind` method of the `TelerikListView` reference. This will fire the `OnRead` event and execute the business logic in the handler.
+To refresh the `ListView` data when using [`OnRead`](slug://listview-manual-operations), call the `Rebind` method of the `TelerikListView` reference. This will fire the `OnRead` event and execute the business logic in the handler.
 
 ````RAZOR
 @* Clicking on the Rebind button will delete the first item from the ListView and refresh the data *@
@@ -281,6 +281,6 @@ To refresh the `ListView` data when using [`OnRead`]({%slug listview-manual-oper
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
diff --git a/components/listview/templates.md b/components/listview/templates.md
index 0d70cad569..2d319cadc8 100644
--- a/components/listview/templates.md
+++ b/components/listview/templates.md
@@ -15,7 +15,7 @@ The ListView component is all about your templates - it does not have an item re
 * [Template](#template) - mandatory, this is what is used to display all items
 * [Edit Template](#edit-template) - the rendering of an item in edit or insert mode
 * [Header Template](#header-template) - your own content above the list of items
-* [Footer Template](#footer-template) - your own content after the list of items and before the [pager]({%slug listview-paging%})
+* [Footer Template](#footer-template) - your own content after the list of items and before the [pager](slug://listview-paging)
 
 ## Template
 
@@ -57,7 +57,7 @@ This is the main building block of the listview component. You define the layout
 
 ## Edit Template
 
-This is the template that an item in edit or insert mode renders, instead of its item template. You can use it to add inputs or other editors so the user can modify the data. You can read more about editing data and see examples of using this template in the [ListView Editing]({%slug listview-editing%}) article.
+This is the template that an item in edit or insert mode renders, instead of its item template. You can use it to add inputs or other editors so the user can modify the data. You can read more about editing data and see examples of using this template in the [ListView Editing](slug://listview-editing) article.
 
 @[template](/_contentTemplates/common/inputs.md#edit-debouncedelay)
 
@@ -102,7 +102,7 @@ https://docs.telerik.com/blazor-ui/components/listview/editing
 
 ## Header Template
 
-This piece of code renders just above the items, but within the main listview wrapper. You would commonly use it to show a heading or other description of the data. You can also add buttons or other components that will invoke actions (such as [filter or sort the data source]({%slug listview-manual-operations%}#filter-and-sort), or [edit data]({%slug listview-editing%})).
+This piece of code renders just above the items, but within the main listview wrapper. You would commonly use it to show a heading or other description of the data. You can also add buttons or other components that will invoke actions (such as [filter or sort the data source](slug://listview-manual-operations#filter-and-sort), or [edit data](slug://listview-editing)).
 
 >caption Header Template in the ListView
 
@@ -140,7 +140,7 @@ This piece of code renders just above the items, but within the main listview wr
 
 ## Footer Template
 
-This piece of code renders just below the items, but within the main listview wrapper, and before the [pager]({%slug listview-paging%}). You would commonly use it to show a summary of the data or add components to invoke commands or business logic.
+This piece of code renders just below the items, but within the main listview wrapper, and before the [pager](slug://listview-paging). You would commonly use it to show a summary of the data or add components to invoke commands or business logic.
 
 >caption Footer Template in the ListView
 
diff --git a/components/loader/appearance.md b/components/loader/appearance.md
index b5f755dce6..5c4e13f6c3 100644
--- a/components/loader/appearance.md
+++ b/components/loader/appearance.md
@@ -94,7 +94,7 @@ The `ThemeColor` parameter sets the color of the animated loading indicator. You
 * `Light`
 * `Inverse`
 
-These predefined options match the main [Telerik Theme]({%slug themes-overview%}) and you can see that in action in the [Loader Appearance live demo](https://demos.telerik.com/blazor-ui/loader/appearance).
+These predefined options match the main [Telerik Theme](slug://themes-overview) and you can see that in action in the [Loader Appearance live demo](https://demos.telerik.com/blazor-ui/loader/appearance).
 
 >caption Built-in Theme Colors
 
diff --git a/components/loader/overview.md b/components/loader/overview.md
index 6c2db1b3dd..6027afde7c 100644
--- a/components/loader/overview.md
+++ b/components/loader/overview.md
@@ -17,7 +17,7 @@ The Loader component displays an animated loading indicator, which shows users t
 
 ## Comparison with the LoaderContainer
 
-The **Loader** is placed inside another component or HTML element. Typically, it occupies a relatively small area. On the other hand, the [**LoaderContainer** component]({%slug loadercontainer-overview%}) can cover a bigger part of the page or the whole viewport with a semi-transparent overlay and a loading animation.
+The **Loader** is placed inside another component or HTML element. Typically, it occupies a relatively small area. On the other hand, the [**LoaderContainer** component](slug://loadercontainer-overview) can cover a bigger part of the page or the whole viewport with a semi-transparent overlay and a loading animation.
 
 
 ## Creating Blazor Loader
@@ -51,12 +51,12 @@ The **Loader** is placed inside another component or HTML element. Typically, it
 
 ## Appearance
 
-The Blazor Loader component provides [appearance settings for size, color and loading animation type]({%slug loader-appearance%}).
+The Blazor Loader component provides [appearance settings for size, color and loading animation type](slug://loader-appearance).
 
 
 ## Using In Other Components
 
-It is possible to place the Loader component inside another component for better user experience. Here is an [example that integrates the Loader inside a Button]({%slug loader-kb-inside-button%}).
+It is possible to place the Loader component inside another component for better user experience. Here is an [example that integrates the Loader inside a Button](slug://loader-kb-inside-button).
 
 
 ## Loader Parameters
@@ -67,16 +67,16 @@ The following table lists the Loader parameters. Also check the [Loader API Refe
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | Renders a custom CSS class to the `<div class="k-loader">` element. Use it to [override theme styles]({%slug themes-override%}). |
-| `Size` | `string`<br />(`"md"`) | Sets the [size of the animated graphic]({%slug loader-appearance%}#size). For convenience, use the members of the static class [`ThemeConstants.Loader.Size`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.Loader.Size). |
-| `ThemeColor` | `string`<br />(`"primary"`) | Sets the [color of the animated graphic]({%slug loader-appearance%}#themecolor). For convenience, use the members of the static class [`ThemeConstants.Loader.ThemeColor`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.Loader.ThemeColor). |
-| `Type`| `LoaderType` enum<br />(`Pulsing`) | Defines the [loading animation shape]({%slug loader-appearance%}#type). |
+| `Class` | `string` | Renders a custom CSS class to the `<div class="k-loader">` element. Use it to [override theme styles](slug://themes-override). |
+| `Size` | `string`<br />(`"md"`) | Sets the [size of the animated graphic](slug://loader-appearance#size). For convenience, use the members of the static class [`ThemeConstants.Loader.Size`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.Loader.Size). |
+| `ThemeColor` | `string`<br />(`"primary"`) | Sets the [color of the animated graphic](slug://loader-appearance#themecolor). For convenience, use the members of the static class [`ThemeConstants.Loader.ThemeColor`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.Loader.ThemeColor). |
+| `Type`| `LoaderType` enum<br />(`Pulsing`) | Defines the [loading animation shape](slug://loader-appearance#type). |
 | `Visible` | `bool`<br /> (`true`) | Sets if the Loader is rendered on the page. |
 
 
 ## Next Steps
 
-* [Explore the Loader Appearance Settings]({%slug loader-appearance%})
+* [Explore the Loader Appearance Settings](slug://loader-appearance)
 
 
 ## See Also
diff --git a/components/loadercontainer/appearance.md b/components/loadercontainer/appearance.md
index 6017271baa..97e468ac66 100644
--- a/components/loadercontainer/appearance.md
+++ b/components/loadercontainer/appearance.md
@@ -17,7 +17,7 @@ The LoaderContainer component provides multiple parameters that control its appe
 * [OverlayThemeColor](#overlaythemecolor)
 * [LoaderPosition](#loaderposition)
 
-The LoaderContainer uses a nested internal [Loader component]({%slug loader-overview%}) to show the animated indicator. The LoaderContainer exposes parameters, which directly control the Loader's appearance:
+The LoaderContainer uses a nested internal [Loader component](slug://loader-overview) to show the animated indicator. The LoaderContainer exposes parameters, which directly control the Loader's appearance:
 
 * [LoaderType](#loadertype)
 * [Size](#size)
@@ -89,9 +89,9 @@ The `LoaderPosition` parameter controls the position of the animated loading ind
 
 ## LoaderType
 
-The `LoaderType` parameter of the LoaderContainer will affect the shape of animated loading indicator. The parameter works only when there is **no** [`<Template>`]({%slug loadercontainer-template%}).
+The `LoaderType` parameter of the LoaderContainer will affect the shape of animated loading indicator. The parameter works only when there is **no** [`<Template>`](slug://loadercontainer-template).
 
-See the [Loader `Type` documentation]({%slug loader-appearance%}#type) for the possible values and how the component looks.
+See the [Loader `Type` documentation](slug://loader-appearance#type) for the possible values and how the component looks.
 
 >caption Setting TelerikLoaderContainer LoaderType
 
@@ -102,9 +102,9 @@ See the [Loader `Type` documentation]({%slug loader-appearance%}#type) for the p
 
 ## Size
 
-The `Size` parameter of the LoaderContainer will affect the dimensions of animated loading indicator. The parameter works only when there is **no** [`<Template>`]({%slug loadercontainer-template%}).
+The `Size` parameter of the LoaderContainer will affect the dimensions of animated loading indicator. The parameter works only when there is **no** [`<Template>`](slug://loadercontainer-template).
 
-See [Loader `Size`]({%slug loader-appearance%}#size) for a list of possible values and how to set them more easily.
+See [Loader `Size`](slug://loader-appearance#size) for a list of possible values and how to set them more easily.
 
 >caption Setting TelerikLoaderContainer Size
 
@@ -115,9 +115,9 @@ See [Loader `Size`]({%slug loader-appearance%}#size) for a list of possible valu
 
 ## ThemeColor
 
-The `ThemeColor` parameter of the LoaderContainer will affect the text color and the loading indicator color. The parameter works only when there is **no** [`<Template>`]({%slug loadercontainer-template%}).
+The `ThemeColor` parameter of the LoaderContainer will affect the text color and the loading indicator color. The parameter works only when there is **no** [`<Template>`](slug://loadercontainer-template).
 
-See [Loader `ThemeColor`]({%slug loader-appearance%}#themecolor) for a list of possible values and how the component looks.
+See [Loader `ThemeColor`](slug://loader-appearance#themecolor) for a list of possible values and how the component looks.
 
 >caption Setting TelerikLoaderContainer ThemeColor
 
@@ -127,7 +127,7 @@ See [Loader `ThemeColor`]({%slug loader-appearance%}#themecolor) for a list of p
 
 ### Custom LoaderContainer Colors
 
-The following example shows [how to override the CSS styles in the theme]({%slug themes-override%}) and apply custom colors to all LoaderContainer elements.
+The following example shows [how to override the CSS styles in the theme](slug://themes-override) and apply custom colors to all LoaderContainer elements.
 
 >caption Custom LoaderContainer colors
 
@@ -162,7 +162,7 @@ The following example shows [how to override the CSS styles in the theme]({%slug
 
 ## Next Steps
 
-* [Experiment with LoaderContainer templates]({%slug loadercontainer-template%})
+* [Experiment with LoaderContainer templates](slug://loadercontainer-template)
 
 
 ## See Also
diff --git a/components/loadercontainer/overview.md b/components/loadercontainer/overview.md
index 9c74083b8c..571ee1c68f 100644
--- a/components/loadercontainer/overview.md
+++ b/components/loadercontainer/overview.md
@@ -15,7 +15,7 @@ The <a href = "https://www.telerik.com/blazor-ui/loader-container" target="_blan
 
 ## Comparison with the Loader
 
-The **LoaderContainer** is designed to cover a whole component, HTML element, or the whole page. On the other hand, the [**Loader** component]({%slug loader-overview%}) is more suitable for showing a loading indicator in a smaller area of the page and without an overlay.
+The **LoaderContainer** is designed to cover a whole component, HTML element, or the whole page. On the other hand, the [**Loader** component](slug://loader-overview) is more suitable for showing a loading indicator in a smaller area of the page and without an overlay.
 
 
 ## Creating LoaderContainer
@@ -50,7 +50,7 @@ The **LoaderContainer** is designed to cover a whole component, HTML element, or
 
 ## Appearance
 
-The Blazor LoaderContainer provides various [settings for its visual appearance]({%slug loadercontainer-appearance%}):
+The Blazor LoaderContainer provides various [settings for its visual appearance](slug://loadercontainer-appearance):
 
 * overlay color
 * graphic and text position
@@ -61,7 +61,7 @@ The Blazor LoaderContainer provides various [settings for its visual appearance]
 
 ## Templates
 
-The LoaderContainer can display different nested content. Read more in the [LoaderContainer Template article]({%slug loadercontainer-template%}).
+The LoaderContainer can display different nested content. Read more in the [LoaderContainer Template article](slug://loadercontainer-template).
 
 
 ## Fill a Parent Container
@@ -85,13 +85,13 @@ The following table lists the LoaderContainer parameters. Also check the [Loader
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | Renders a custom CSS class to the `<div class="k-loader-container">` element. Use it to [override theme styles]({%slug themes-override%}). See an example at [Custom LoaderContainer Colors]({%slug loadercontainer-appearance%}#custom-loadercontainer-colors). |
-| `OverlayThemeColor` | `string`<br />(`"dark"`) | Sets the [color of the semi-transparent overlay]({%slug loadercontainer-appearance%}#overlaythemecolor). Use `"light"` or ``"dark"``. |
-| `Size` | `string`<br />(`"md"`) | Sets the [size of the animated graphic]({%slug loadercontainer-appearance%}#size). For convenience, use the members of the static class [`ThemeConstants.Loader.Size`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.Loader.Size). |
+| `Class` | `string` | Renders a custom CSS class to the `<div class="k-loader-container">` element. Use it to [override theme styles](slug://themes-override). See an example at [Custom LoaderContainer Colors](slug://loadercontainer-appearance#custom-loadercontainer-colors). |
+| `OverlayThemeColor` | `string`<br />(`"dark"`) | Sets the [color of the semi-transparent overlay](slug://loadercontainer-appearance#overlaythemecolor). Use `"light"` or ``"dark"``. |
+| `Size` | `string`<br />(`"md"`) | Sets the [size of the animated graphic](slug://loadercontainer-appearance#size). For convenience, use the members of the static class [`ThemeConstants.Loader.Size`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.Loader.Size). |
 | `Text` | `string`<br />(`"Loading..."`) | Sets the text below the loading animation. Set to `null` or `String.Empty` to remove the text and its containing HTML element. |
-| `ThemeColor` | `string`<br />(`"primary"`) | Sets the [color of the animated graphic and text]({%slug loadercontainer-appearance%}#themecolor). For convenience, use the members of the static class [`ThemeConstants.Loader.ThemeColor`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.Loader.ThemeColor). |
-| `LoaderPosition`| `LoaderPosition` enum<br />(`Top`) | Defines the [loading animation position]({%slug loadercontainer-appearance%}#loaderposition) in relation to the loading text. |
-| `LoaderType`| `LoaderType` enum<br />(`Pulsing`) | Defines the [loading animation shape]({%slug loadercontainer-appearance%}#loadertype). |
+| `ThemeColor` | `string`<br />(`"primary"`) | Sets the [color of the animated graphic and text](slug://loadercontainer-appearance#themecolor). For convenience, use the members of the static class [`ThemeConstants.Loader.ThemeColor`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.Loader.ThemeColor). |
+| `LoaderPosition`| `LoaderPosition` enum<br />(`Top`) | Defines the [loading animation position](slug://loadercontainer-appearance#loaderposition) in relation to the loading text. |
+| `LoaderType`| `LoaderType` enum<br />(`Pulsing`) | Defines the [loading animation shape](slug://loadercontainer-appearance#loadertype). |
 | `Visible` | `bool`<br />(`true`) | Controls if the LoaderContainer is rendered on the page. |
 
 
@@ -128,13 +128,13 @@ The panel is the white rectangular area that surrounds the animated loader indic
 </style>
 ````
 
->note The panel is not rendered when using a [LoaderContainer Template]({%slug loadercontainer-template%}).
+>note The panel is not rendered when using a [LoaderContainer Template](slug://loadercontainer-template).
 
 
 ## Next Steps
 
-* [Check the LoaderContainer appearance settings]({%slug loadercontainer-appearance%})
-* [Experiment with LoaderContainer templates]({%slug loadercontainer-template%})
+* [Check the LoaderContainer appearance settings](slug://loadercontainer-appearance)
+* [Experiment with LoaderContainer templates](slug://loadercontainer-template)
 
 
 ## See Also
diff --git a/components/loadercontainer/template.md b/components/loadercontainer/template.md
index cf8c5dfaf2..90b9c51503 100644
--- a/components/loadercontainer/template.md
+++ b/components/loadercontainer/template.md
@@ -145,5 +145,5 @@ You can use CSS to target the DOM elements that create the Panel around the temp
 ## See Also
 
   * [Live Demo: LoaderContainer](https://demos.telerik.com/blazor-ui/loadercontainer/overview)
-  * [Appearance Settings]({%slug loadercontainer-appearance%})
+  * [Appearance Settings](slug://loadercontainer-appearance)
    
diff --git a/components/map/layers/overview.md b/components/map/layers/overview.md
index 05fc4c25b7..82a34e7cdc 100644
--- a/components/map/layers/overview.md
+++ b/components/map/layers/overview.md
@@ -16,10 +16,10 @@ The information that the Map renders is organized into layers. These layers are
 
 The layers in the Map are:
 
-* [Tile]({%slug components/map/layers/tile%})
-* [Marker]({%slug components/map/layers/marker%})
-* [Shape]({%slug components/map/layers/shape%})
-* [Bubble]({%slug components/map/layers/bubble%})
+* [Tile](slug://components/map/layers/tile)
+* [Marker](slug://components/map/layers/marker)
+* [Shape](slug://components/map/layers/shape)
+* [Bubble](slug://components/map/layers/bubble)
 
 ## MapLayer Parameters
 
@@ -44,7 +44,7 @@ The following parameters enable you to customize the appearance of the Blazor Ma
 | `TileSize` | `double` | The size of the image tile in pixels. |
 | `TitleField` | `string` | The data item field which contains the marker title. |
 | `Type` | `MapLayersType` enum | The type of the layer. |
-| `UrlTemplate` | `string` | The URL template for tile layers. The available variables are: <ul><li>`x`&mdash;the X coordinate of the tile;</li><li>`y`&mdash;the Y coordinate of the tile</li><li>`zoom`&mdash;the zoom level</li><li>`subdomain`&mdash;the subdomain for this tile. Also see `Subdomains`. <br />There are [two possible ways to define the `UrlTemplate`]({%slug components/map/overview%}#content-security-policy). |
+| `UrlTemplate` | `string` | The URL template for tile layers. The available variables are: <ul><li>`x`&mdash;the X coordinate of the tile;</li><li>`y`&mdash;the Y coordinate of the tile</li><li>`zoom`&mdash;the zoom level</li><li>`subdomain`&mdash;the subdomain for this tile. Also see `Subdomains`. <br />There are [two possible ways to define the `UrlTemplate`](slug://components/map/overview#content-security-policy). |
 | `ValueField` | `string` | The value field for bubble layer symbols. The data item field should be a number. |
 | `ZIndex` | `double` | The zIndex for this layer. Layers are normally stacked in declaration order (last one is on top). |
 
diff --git a/components/map/overview.md b/components/map/overview.md
index 88044d4c88..b4812aac84 100644
--- a/components/map/overview.md
+++ b/components/map/overview.md
@@ -10,13 +10,13 @@ position: 0
 
 # Blazor Map Overview
 
-The <a href="https://www.telerik.com/blazor-ui/map" target="_blank">Blazor Map component</a> displays geospatial information organized in layers. The component provides [tile layers]({%slug components/map/layers/tile%}), [vector shape layers]({%slug components/map/layers/shape%}), [bubble layers]({%slug components/map/layers/bubble%}), and [marker layers]({%slug components/map/layers/marker%}).
+The <a href="https://www.telerik.com/blazor-ui/map" target="_blank">Blazor Map component</a> displays geospatial information organized in layers. The component provides [tile layers](slug://components/map/layers/tile), [vector shape layers](slug://components/map/layers/shape), [bubble layers](slug://components/map/layers/bubble), and [marker layers](slug://components/map/layers/marker).
 
 ## Creating Blazor Map
 
 1. Use the `TelerikMap` tag to add the component to a Razor file.
 1. Add a `<MapLayer>` tag nested inside `<MapLayers>`. Set its `Type` to `MapLayersType.Tile`.
-1. Set the [`UrlTemplate` parameter]({%slug components/map/layers%}#maplayer-parameters) of the tile layer. Check the [required syntax that complies with Content Security Policy](#content-security-policy).
+1. Set the [`UrlTemplate` parameter](slug://components/map/layers#maplayer-parameters) of the tile layer. Check the [required syntax that complies with Content Security Policy](#content-security-policy).
 1. (optional) Set the Map `Attribution` and `Subdomains` parameters, depending on the specific tile provider.
 
 >caption Basic Telerik Map for Blazor
@@ -41,11 +41,11 @@ The <a href="https://www.telerik.com/blazor-ui/map" target="_blank">Blazor Map c
 
 ## Layers
 
-The layers are responsible for organizing the Map information. [Read more about the supported Blazor Map layers...]({%slug components/map/layers%})
+The layers are responsible for organizing the Map information. [Read more about the supported Blazor Map layers...](slug://components/map/layers)
 
 ## Markers
 
-You can add different points with real coordinates on the map as markers. [Read more about the Blazor Map Markers...]({%slug components/map/layers/marker%})
+You can add different points with real coordinates on the map as markers. [Read more about the Blazor Map Markers...](slug://components/map/layers/marker)
 
 ## Pan and Zoom
 
@@ -59,7 +59,7 @@ Blazor Map also incorporates a navigation tool allowing the end user to easily z
 
 ## Events
 
-The Blazor Map generates events that you can handle and further customize its behavior. [Read more about the Blazor Map events...]({%slug components/map/events%}).
+The Blazor Map generates events that you can handle and further customize its behavior. [Read more about the Blazor Map events...](slug://components/map/events).
 
 ## Content Security Policy
 
@@ -68,7 +68,7 @@ The Map renders with the help of a JavaScript-based rendering engine. This engin
 * [Legacy inline syntax](#creating-blazor-map). In this case, the template parameter is a string that consumes dynamic values <a href="https://docs.telerik.com/kendo-ui/framework/templates/essentials" target="_blank">through `#= ... #` expressions</a>, for example, `UrlTemplate="https://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png"`;
 * JavaScript functions that obtain dynamic values from the function arguments, for example, `UrlTemplate="jsFunctionName"`. This feature was introduced in version **4.5.0** of Telerik UI for Blazor.
 
-Both syntax options provide the same capabilities. The legacy inline syntax depends on JavaScript code evaluation, which is not [compliant with strict Content Security Policy (CSP)]({%slug troubleshooting-csp%}). The function-based approach is CSP-compliant and can be more readable and convenient in complex scenarios.
+Both syntax options provide the same capabilities. The legacy inline syntax depends on JavaScript code evaluation, which is not [compliant with strict Content Security Policy (CSP)](slug://troubleshooting-csp). The function-based approach is CSP-compliant and can be more readable and convenient in complex scenarios.
 
 >caption CSP-compliant Map
 
@@ -176,8 +176,8 @@ The Map exposes a `Refresh` method. Use it to redraw the component after making
 
 ## Next Steps
 
-* [Configure Map Layers]({%slug components/map/layers%})
-* [Handle Map Events]({%slug components/map/events%})
+* [Configure Map Layers](slug://components/map/layers)
+* [Handle Map Events](slug://components/map/events)
 
 ## See Also
 
diff --git a/components/maskedtextbox/accessibility/wai-aria-support.md b/components/maskedtextbox/accessibility/wai-aria-support.md
index 9e4b003945..04b2c16a14 100644
--- a/components/maskedtextbox/accessibility/wai-aria-support.md
+++ b/components/maskedtextbox/accessibility/wai-aria-support.md
@@ -65,9 +65,9 @@ The MaskedTextBox has been tested with the following screen readers and browsers
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor MaskedTextbox Demos](https://demos.telerik.com/blazor-ui/maskedtextbox/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/maskedtextbox/events.md b/components/maskedtextbox/events.md
index de294f9b95..025b474d0d 100644
--- a/components/maskedtextbox/events.md
+++ b/components/maskedtextbox/events.md
@@ -101,5 +101,5 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
diff --git a/components/maskedtextbox/mask-prompt.md b/components/maskedtextbox/mask-prompt.md
index 3938e3e089..d070a9117b 100644
--- a/components/maskedtextbox/mask-prompt.md
+++ b/components/maskedtextbox/mask-prompt.md
@@ -23,7 +23,7 @@ This article contains the following sections:
 
 ## Mask
 
-The `Mask` is the main feature of the component. It defines what input is allowed from the user at what positions so they must obey those requirements. By default, the mask is constantly shown, but you can change that to also show a [FloatingLabel]({%slug floatinglabel-overview%}) or `Placeholder`.
+The `Mask` is the main feature of the component. It defines what input is allowed from the user at what positions so they must obey those requirements. By default, the mask is constantly shown, but you can change that to also show a [FloatingLabel](slug://floatinglabel-overview) or `Placeholder`.
 
 You can use special characters called `Rules` in the Mask to define its behavior. The other characters that have no special meaning but are always shown and the user cannot change them are called `Literal` characters.
 
@@ -48,7 +48,7 @@ The Telerik MaskedTextbox provides a set of built-in rules that it recognizes as
 - `&` - Character (excluding `space`)
 - `C` - Character or `space`
 
->tip You can find some examples of different masks in the [Masks Live Demo](https://demos.telerik.com/blazor-ui/maskedtextbox/masks) and in the [Some Sample Masks]({%slug maskedtextbox-overview%}#mask-examples) section of the documentation.
+>tip You can find some examples of different masks in the [Masks Live Demo](https://demos.telerik.com/blazor-ui/maskedtextbox/masks) and in the [Some Sample Masks](slug://maskedtextbox-overview#mask-examples) section of the documentation.
 
 ### Literals
 
@@ -99,9 +99,9 @@ By default, the `Value` of the component only includes the rules from the mask.
 
 ### Mask on Focus, FloatingLabel and Placeholder
 
-The `MaskOnFocus` parameter lets you instruct the component to show the mask only when the user is about to type in the input - when it is focused. This lets you show the [FloatingLabel]({%slug floatinglabel-overview%}) or `Placeholder` that you can set so you can provide an easier to read prompt first, before you show the actual format to your users.
+The `MaskOnFocus` parameter lets you instruct the component to show the mask only when the user is about to type in the input - when it is focused. This lets you show the [FloatingLabel](slug://floatinglabel-overview) or `Placeholder` that you can set so you can provide an easier to read prompt first, before you show the actual format to your users.
 
-The [FloatingLabel]({%slug floatinglabel-overview%}) will take precedence over the `Placeholder` if the MaskedTextBox is not focused. Neither will be shown if there is a `Value` already. You should use the `Placeholder` instead of a [FloatingLabel]({%slug floatinglabel-overview%}) if you do not want the animated effect or the increased height it causes.
+The [FloatingLabel](slug://floatinglabel-overview) will take precedence over the `Placeholder` if the MaskedTextBox is not focused. Neither will be shown if there is a `Value` already. You should use the `Placeholder` instead of a [FloatingLabel](slug://floatinglabel-overview) if you do not want the animated effect or the increased height it causes.
 
 >caption Showing the mask on focus only
 
@@ -175,6 +175,6 @@ The `PromptPlaceholder` is useful when you need to process the user input at a l
 
 ## See Also
 
-* [MaskedTextbox Overview]({%slug maskedtextbox-overview%})
+* [MaskedTextbox Overview](slug://maskedtextbox-overview)
 * [Live Demo: Masks](https://demos.telerik.com/blazor-ui/maskedtextbox/masks)
 * [Live Demo: Customization](https://demos.telerik.com/blazor-ui/maskedtextbox/customization)
diff --git a/components/maskedtextbox/overview.md b/components/maskedtextbox/overview.md
index fd28bc0744..cd6623139e 100644
--- a/components/maskedtextbox/overview.md
+++ b/components/maskedtextbox/overview.md
@@ -12,13 +12,13 @@ position: 0
 
 The <a href = "https://www.telerik.com/blazor-ui/maskedtextbox" target="_blank">Blazor MaskedTextbox component</a> provides a mask and prompts the user to enter the data in the required format. The component prevents input that does not match the mask. Use it to show the user the required format for values like phone numbers, credit card numbers, ZIP codes, IP addresses, percentage values, and so on.
 
-You can also add standard attributes such as custom CSS classes, `name`, `placeholder`, `tabindex`, and [more](#maskedtextbox-parameters), and also respond to [events]({%slug maskedtextbox-events%}).
+You can also add standard attributes such as custom CSS classes, `name`, `placeholder`, `tabindex`, and [more](#maskedtextbox-parameters), and also respond to [events](slug://maskedtextbox-events).
 
 ## Creating Blazor MaskedTextBox
 
 1. Add the `<TelerikMaskedTextBox>` tag to your razor page.
 1. Set its `Value` parameter to a `string`. The parameter supports two-way binding.
-1. Set the desired [`Mask`]({%slug maskedtextbox-mask-prompt%}) to prompt the user.
+1. Set the desired [`Mask`](slug://maskedtextbox-mask-prompt) to prompt the user.
 
 >caption Basic MaskedTextBox with two-way Value binding and a credit card mask
 
@@ -39,15 +39,15 @@ The component value is: @MaskedValue
 
 ## Validation
 
-You can validate the content of the `TelerikMaskedTextBox` using the Data Annotation attributes. [See the Input Validation article for an example on how to validate the content of the MaskedTextBox]({%slug common-features/input-validation%}#maskedtextbox).
+You can validate the content of the `TelerikMaskedTextBox` using the Data Annotation attributes. [See the Input Validation article for an example on how to validate the content of the MaskedTextBox](slug://common-features/input-validation#maskedtextbox).
 
 ## Events
 
-The [MaskedTextBox component fires events for value changes and blur]({%slug maskedtextbox-events%}). Use them to respond to user actions.
+The [MaskedTextBox component fires events for value changes and blur](slug://maskedtextbox-events). Use them to respond to user actions.
 
 ## Mask-Related Parameters
 
-The table below provides a quick overview of the mask-related parameters. See the [Mask and Prompt article]({%slug maskedtextbox-mask-prompt%}) for additional details.
+The table below provides a quick overview of the mask-related parameters. See the [Mask and Prompt article](slug://maskedtextbox-mask-prompt) for additional details.
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
@@ -55,7 +55,7 @@ The table below provides a quick overview of the mask-related parameters. See th
 |---|---|---|
 | `IncludeLiterals` | `bool` | Controls if the literal characters from the mask are included in the `Value`. These are the characters that don't carry a special meaning such as brackets or dashes. |
 | `Mask` | `string` | The mask (pattern) that the user has to follow. |
-| `MaskOnFocus` | `bool` | Controls if the mask appears only while the input is focused. When `true` and no value is set, the user sees the [FloatingLabel]({%slug floatinglabel-overview%}) or `Placeholder` instead of the mask. When a value is set, the user sees both the mask and value. |
+| `MaskOnFocus` | `bool` | Controls if the mask appears only while the input is focused. When `true` and no value is set, the user sees the [FloatingLabel](slug://floatinglabel-overview) or `Placeholder` instead of the mask. When a value is set, the user sees both the mask and value. |
 | `Prompt` | `char` <br /> (`_`) | The character that will show in the mask where there is no user input already. |
 | `PromptPlaceholder` | `char?` <br /> (` ` space) | The character that is added to the raw `Value` for places where there is no user input yet. |
 
@@ -79,13 +79,13 @@ See the [MaskedTextBox API Reference](/blazor-ui/api/Telerik.Blazor.Components.T
 | `ShowClearButton` | `bool` | Defines if the user can clear the component value through an **x** button rendered inside the input. |
 | `SpellCheck` | `string` | A `string` that maps to the [`spellcheck`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/spellcheck) attribute of the HTML element. Use it to disable browser spellchecking if it's intrusive to the user or due to [privacy and security concerns](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/spellcheck#security_and_privacy_concerns). |
 | `TabIndex` | `int` | The `tabindex` attribute of the `input`. |
-| `Title` | `string` | The `title` attribute of `input`. Use it to add a [Blazor Tooltip]({%slug tooltip-overview%}). |
-| `ValidateOn` | `ValidationEvent` enum <br /> (`Input`) | The event that will trigger validation (if validation is enabled). See [Validation Modes for Simple Inputs]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs). |
+| `Title` | `string` | The `title` attribute of `input`. Use it to add a [Blazor Tooltip](slug://tooltip-overview). |
+| `ValidateOn` | `ValidationEvent` enum <br /> (`Input`) | The event that will trigger validation (if validation is enabled). See [Validation Modes for Simple Inputs](slug://common-features/input-validation#validation-modes-for-simple-inputs). |
 | `Value` | `string` | The value of the component. Supports two-way binding. |
 
 ### Styling and Appearance
 
-The following parameters enable you to customize the [appearance]({%slug maskedtextbox-appearance%}) of the Blazor MaskedTextBox:
+The following parameters enable you to customize the [appearance](slug://maskedtextbox-appearance) of the Blazor MaskedTextBox:
 
 | Parameter | Type and Default value | Description |
 |---|---|---|
@@ -120,7 +120,7 @@ The MaskedTextBox proves a `FocusAsync` method that enables programmatic focus.
 
 ## Mask Examples
 
-The examples below demonstrates how to create a few [masks]({%slug maskedtextbox-mask-prompt%}) for commonly used input types:
+The examples below demonstrates how to create a few [masks](slug://maskedtextbox-mask-prompt) for commonly used input types:
 
 * **phone** - Utilizes literals (the brackets and the plus sign for the country code; and dashes for readability) and rules for numbers.
 
@@ -225,13 +225,13 @@ The examples below demonstrates how to create a few [masks]({%slug maskedtextbox
 
 ## Next Steps
 
-* [Configure the MaskedTextBox mask]({%slug maskedtextbox-mask-prompt%})
-* [Explore the MaskedTextBox behavior when pasting content]({%slug maskedtextbox-paste%})
-* [Handle MaskedTextBox events]({%slug maskedtextbox-events%})
+* [Configure the MaskedTextBox mask](slug://maskedtextbox-mask-prompt)
+* [Explore the MaskedTextBox behavior when pasting content](slug://maskedtextbox-paste)
+* [Handle MaskedTextBox events](slug://maskedtextbox-events)
 
 ## See Also
 
 * [Live Demo: MaskedTextbox](https://demos.telerik.com/blazor-ui/maskedtextbox/overview)
 * [Live Demo: MaskedTextbox Validation](https://demos.telerik.com/blazor-ui/maskedtextbox/validation)
-* [Add Floating Label]({%slug inputs-kb-floating-label%})
+* [Add Floating Label](slug://inputs-kb-floating-label)
 * [MaskedTextBox API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikMaskedTextBox)
diff --git a/components/maskedtextbox/paste.md b/components/maskedtextbox/paste.md
index 062d24841e..a409502f71 100644
--- a/components/maskedtextbox/paste.md
+++ b/components/maskedtextbox/paste.md
@@ -14,7 +14,7 @@ This article explains the behavior the Telerik MaskedTextbox has when the user p
 
 While typing is the most common way people write in textboxes, they can also paste the data from somewhere else.
 
-The user can put the cursor at any place in the textbox and write, and the next [rule]({%slug maskedtextbox-mask-prompt%}) will handle the input.
+The user can put the cursor at any place in the textbox and write, and the next [rule](slug://maskedtextbox-mask-prompt) will handle the input.
 
 With pasting, there are several scenarios depending on the relationship between the rules, the pasted value and what is selected (highlighted) in the input.
 
@@ -66,5 +66,5 @@ For example, if the user has 5 symbols which are matching the input rules in the
 
 ## See Also
 
-* [MaskedTextbox Overview]({%slug maskedtextbox-overview%})
-* [Rules, Masks, Prompts]({%slug maskedtextbox-mask-prompt%})
+* [MaskedTextbox Overview](slug://maskedtextbox-overview)
+* [Rules, Masks, Prompts](slug://maskedtextbox-mask-prompt)
diff --git a/components/mediaquery/events.md b/components/mediaquery/events.md
index e036e7ceef..4d22b784b8 100644
--- a/components/mediaquery/events.md
+++ b/components/mediaquery/events.md
@@ -44,6 +44,6 @@ The `OnChange` event fires to notify you whether the media query string provided
 
 ## See Also
 
-  * [Overview]({%slug mediaquery-overview%})
-  * [Integration]({%slug mediaquery-integration%})
+  * [Overview](slug://mediaquery-overview)
+  * [Integration](slug://mediaquery-integration)
    
diff --git a/components/mediaquery/integration.md b/components/mediaquery/integration.md
index 71da0ced38..8fa39fa1f2 100644
--- a/components/mediaquery/integration.md
+++ b/components/mediaquery/integration.md
@@ -20,11 +20,11 @@ You can integrate the TelerikMediaQuery component with our existing components.
 
 ## Grid Integration
 
-You can hide or more columns in the Grid based on the dimensions of the browser window by using the TelerikMediaQuery component and the [Visible parameter]({%slug components/grid/columns/bound%}#grid-bound-column-parameters) of the Grid column.
+You can hide or more columns in the Grid based on the dimensions of the browser window by using the TelerikMediaQuery component and the [Visible parameter](slug://components/grid/columns/bound#grid-bound-column-parameters) of the Grid column.
 
 >tip You can use similar approach for the Telerik TreeList in order to hide some of the component columns on small devices. You can even replace the entire components with other components that have a simpler layout and limited functionality, such as a ListView, for small devices.
 
->tip If you are [saving the Grid state]({%slug grid-kb-save-load-state-localstorage%}), you need to remove column visibility information in `OnStateChanged`. Otherwise the saved column visibility may conflict with the visibility determined by the MediaQuery component.
+>tip If you are [saving the Grid state](slug://grid-kb-save-load-state-localstorage), you need to remove column visibility information in `OnStateChanged`. Otherwise the saved column visibility may conflict with the visibility determined by the MediaQuery component.
 
 ````RAZOR
 @* Hide Grid columns on small screens - those below 1024px in this example *@
@@ -191,7 +191,7 @@ You can resize the Chart based on the browser size and re-render with the new di
 
 ## Form Integration
 
-You can use the MediaQuery component to set various [layout-related parameters of the Form component]({%slug form-overview%}#form-parameters), such as `Orientation`, `Columns`, `ColumnSpacing`, and `ButtonsLayout`.
+You can use the MediaQuery component to set various [layout-related parameters of the Form component](slug://form-overview#form-parameters), such as `Orientation`, `Columns`, `ColumnSpacing`, and `ButtonsLayout`.
 
 >caption Responsive Form with MediaQuery
 
@@ -328,5 +328,5 @@ You can use the MediaQuery component to set various [layout-related parameters o
 ## See Also
 
 * [Live Demo: MediaQuery and Grid Integration](https://demos.telerik.com/blazor-ui/mediaquery/grid-integration)
-* [MediaQuery Overview]({%slug mediaquery-overview%})
-* [MediaQuery Events]({%slug mediaquery-events%})
+* [MediaQuery Overview](slug://mediaquery-overview)
+* [MediaQuery Events](slug://mediaquery-events)
diff --git a/components/mediaquery/overview.md b/components/mediaquery/overview.md
index 8e57cbb0ce..791c9f6b21 100644
--- a/components/mediaquery/overview.md
+++ b/components/mediaquery/overview.md
@@ -74,8 +74,8 @@ The MediaQuery component facilitates the usage of CSS media queries in your C# c
 
 ## Next Steps
 
-* [Explore the MediaQuery events]({%slug mediaquery-events%})
-* [Integrate the MediaQuery with other Telerik Blazor components]({%slug mediaquery-integration%})
+* [Explore the MediaQuery events](slug://mediaquery-events)
+* [Integrate the MediaQuery with other Telerik Blazor components](slug://mediaquery-integration)
 
 ## See Also
 
diff --git a/components/menu/accessibility/wai-aria-support.md b/components/menu/accessibility/wai-aria-support.md
index e5a2e4c211..610561f72c 100644
--- a/components/menu/accessibility/wai-aria-support.md
+++ b/components/menu/accessibility/wai-aria-support.md
@@ -72,4 +72,4 @@ For details on how the Menu keyboard navigation works, refer to the [Blazor Menu
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/menu/data-binding/flat-data.md b/components/menu/data-binding/flat-data.md
index fce574ee66..d8223c69a5 100644
--- a/components/menu/data-binding/flat-data.md
+++ b/components/menu/data-binding/flat-data.md
@@ -102,7 +102,7 @@ Using a self-referencing flat data source for the menu
 
 ## See Also
 
-  * [Menu Data Binding Basics]({%slug components/menu/data-binding/overview%})
+  * [Menu Data Binding Basics](slug://components/menu/data-binding/overview)
   * [Live Demo: Menu Flat Data](https://demos.telerik.com/blazor-ui/menu/flat-data)
-  * [Binding to Hierarchical Data]({%slug components/menu/data-binding/hierarchical-data%})
+  * [Binding to Hierarchical Data](slug://components/menu/data-binding/hierarchical-data)
 
diff --git a/components/menu/data-binding/hierarchical-data.md b/components/menu/data-binding/hierarchical-data.md
index 4af1acaa80..e17e0cb769 100644
--- a/components/menu/data-binding/hierarchical-data.md
+++ b/components/menu/data-binding/hierarchical-data.md
@@ -103,7 +103,7 @@ This approach of providing nodes lets you gather separate collections of data fo
 
 ## See Also
 
-  * [Menu Data Binding Basics]({%slug components/menu/data-binding/overview%})
+  * [Menu Data Binding Basics](slug://components/menu/data-binding/overview)
   * [Live Demo: Menu Hierarchical Data](https://demos.telerik.com/blazor-ui/menu/hierarchical-data)
-  * [Binding to Flat Data]({%slug components/menu/data-binding/flat-data%})
+  * [Binding to Flat Data](slug://components/menu/data-binding/flat-data)
 
diff --git a/components/menu/data-binding/overview.md b/components/menu/data-binding/overview.md
index b05ddecb57..ba0ac3c5cc 100644
--- a/components/menu/data-binding/overview.md
+++ b/components/menu/data-binding/overview.md
@@ -21,8 +21,8 @@ First, review:
 
 There are two modes of providing data to a menu, and they all use the items' features. Once you are familiar with the current article, choose the data binding more you wish to use:
 
-* [Hierarchical data]({%slug components/menu/data-binding/hierarchical-data%}) - separate collections of items and their child items.
-* [Flat data]({%slug components/menu/data-binding/flat-data%}) - a single collection of items with defined parent-child relationships.
+* [Hierarchical data](slug://components/menu/data-binding/hierarchical-data) - separate collections of items and their child items.
+* [Flat data](slug://components/menu/data-binding/flat-data) - a single collection of items with defined parent-child relationships.
 
 ## Menu Item Features
 
@@ -38,7 +38,7 @@ The menu items provide the following features that you control through the corre
 
 * `Text` - the text that will be shown on the item.
 
-* `Icon` - The [Telerik Font or SVG icon]({%slug common-features-icons%}) that will be rendered in the item. Read more in the [Icons article]({%slug breadcrumb-icons%}).
+* `Icon` - The [Telerik Font or SVG icon](slug://common-features-icons) that will be rendered in the item. Read more in the [Icons article](slug://breadcrumb-icons).
 
 * `Url` - the view the item will navigate to by generating a link.
 
@@ -189,7 +189,7 @@ public class MenuItem
 
 ## See Also
 
-  * [Binding to Flat Data]({%slug components/menu/data-binding/flat-data%})
-  * [Binding to Hierarchical Data]({%slug components/menu/data-binding/hierarchical-data%})
+  * [Binding to Flat Data](slug://components/menu/data-binding/flat-data)
+  * [Binding to Hierarchical Data](slug://components/menu/data-binding/hierarchical-data)
   * [Live Demo: Menu Flat Data](https://demos.telerik.com/blazor-ui/menu/flat-data)
   * [Live Demo: Menu Hierarchical Data](https://demos.telerik.com/blazor-ui/menu/hierarchical-data)
diff --git a/components/menu/events.md b/components/menu/events.md
index 1e9d518aae..e5ba3a4008 100644
--- a/components/menu/events.md
+++ b/components/menu/events.md
@@ -200,4 +200,4 @@ Last clicked item: @ClickedItem?.Text
 
 ## See Also
 
-* [Templates]({%slug components/menu/templates%})
+* [Templates](slug://components/menu/templates)
diff --git a/components/menu/icons.md b/components/menu/icons.md
index 8fe8aa7e3b..2cc213b01d 100644
--- a/components/menu/icons.md
+++ b/components/menu/icons.md
@@ -10,7 +10,7 @@ position: 15
 
 # Menu Icons
 
-You can add [Telerik Font or SVG icons]({%slug common-features-icons%}) to the Menu items. The component also supports custom icons.
+You can add [Telerik Font or SVG icons](slug://common-features-icons) to the Menu items. The component also supports custom icons.
 
 To use Menu item icons, define a property in the component model class and assign the property name to the `IconField` parameter of the Menu.
 
@@ -89,4 +89,4 @@ If the icon property name in the Menu model is `Icon`, there is no need to set t
 ## See Also
 
 * [Online Demo: Menu Icons](https://demos.telerik.com/blazor-ui/menu/images)
-* [Menu Overview]({%slug components/menu/overview%})
+* [Menu Overview](slug://components/menu/overview)
diff --git a/components/menu/navigation.md b/components/menu/navigation.md
index 0e68952605..8a1aeb3133 100644
--- a/components/menu/navigation.md
+++ b/components/menu/navigation.md
@@ -10,7 +10,7 @@ position: 3
 
 # Menu for Navigation
 
-The Menu can be used to navigate between different pages in the application. It can generate the needed links for you through its `UrlField` when [data binding]({%slug components/menu/data-binding/overview%}).
+The Menu can be used to navigate between different pages in the application. It can generate the needed links for you through its `UrlField` when [data binding](slug://components/menu/data-binding/overview).
 
 ## Basics
 
@@ -90,6 +90,6 @@ To use the Blazor Menu for navigating between pages:
 
 ## See Also
 
-* [Menu Overview]({%slug components/menu/overview%})
-* [Menu Data Binding]({%slug components/menu/data-binding/overview%})
-* [Menu Templates]({%slug components/menu/templates%})
+* [Menu Overview](slug://components/menu/overview)
+* [Menu Data Binding](slug://components/menu/data-binding/overview)
+* [Menu Templates](slug://components/menu/templates)
diff --git a/components/menu/orientation.md b/components/menu/orientation.md
index 2b8c58d099..dd6b7c6d99 100644
--- a/components/menu/orientation.md
+++ b/components/menu/orientation.md
@@ -90,5 +90,5 @@ The default orientation is horizontal.
 
 ## See Also
 
-* [Menu Overview]({%slug components/menu/overview%})
+* [Menu Overview](slug://components/menu/overview)
 * [Live Demo: Orientation](https://demos.telerik.com/blazor-ui/menu/orientation)
diff --git a/components/menu/overview.md b/components/menu/overview.md
index 339436723f..58c4d415bc 100644
--- a/components/menu/overview.md
+++ b/components/menu/overview.md
@@ -10,13 +10,13 @@ position: 0
 
 # Blazor Menu Overview
 
-The <a href="https://www.telerik.com/blazor-ui/menu" target="_blank">Blazor Menu component</a> displays data (flat or hierarchical) in a traditional menu-like structure. In addition to built-in navigation capabilities, you can browse through the items and their children, define [templates]({%slug components/menu/templates%}) for the individual nodes, render text and icons/images, and respond to [events]({%slug components/menu/events%}).
+The <a href="https://www.telerik.com/blazor-ui/menu" target="_blank">Blazor Menu component</a> displays data (flat or hierarchical) in a traditional menu-like structure. In addition to built-in navigation capabilities, you can browse through the items and their children, define [templates](slug://components/menu/templates) for the individual nodes, render text and icons/images, and respond to [events](slug://components/menu/events).
 
 ## Creating Blazor Menu
 
 1. Use the `TelerikMenu` tag to add the component to your razor page.
 
-1. Populate the `Data` property with the collection of items that you want to appear in the menu. The Menu will automatically recognize property names like `Id`, `ParentId`, `Text` and a few others. Otherwise, [use bindings to configure custom property names]({%slug components/menu/data-binding/overview%}#data-bindings).
+1. Populate the `Data` property with the collection of items that you want to appear in the menu. The Menu will automatically recognize property names like `Id`, `ParentId`, `Text` and a few others. Otherwise, [use bindings to configure custom property names](slug://components/menu/data-binding/overview#data-bindings).
 
 >caption Basic Menu with hierarchical data binding and built-in navigation
 
@@ -87,36 +87,36 @@ The <a href="https://www.telerik.com/blazor-ui/menu" target="_blank">Blazor Menu
 
 ## Data Binding
 
-To show any items, the Blazor Menu requires a data source that you can provide through the `Data` property. The Menu allows you to display the items both as flat data and hierarchically. [Read more about the Blazor Menu data binding...]({%slug components/menu/data-binding/overview%})
+To show any items, the Blazor Menu requires a data source that you can provide through the `Data` property. The Menu allows you to display the items both as flat data and hierarchically. [Read more about the Blazor Menu data binding...](slug://components/menu/data-binding/overview)
 
 ## Navigate Views
 
 A menu is often used to list pages, views, or sections in an application so the user can navigate through them. To do that with a menu, you have two options:
 
-* Use the built-in `UrlField` in the [bound data]({%slug components/menu/data-binding/overview%}#data-bindings) to populate the URLs in the anchors that the menu will generate if you provide a URL for the given item. This approach is demonstrated in the [Creating Blazor Menu](#creating-blazor-menu) example.
-* Use a [Template]({%slug components/menu/templates%}) to generate the desired links (e.g., `NavLink` components) with your own code to enable fine-tuning.
+* Use the built-in `UrlField` in the [bound data](slug://components/menu/data-binding/overview#data-bindings) to populate the URLs in the anchors that the menu will generate if you provide a URL for the given item. This approach is demonstrated in the [Creating Blazor Menu](#creating-blazor-menu) example.
+* Use a [Template](slug://components/menu/templates) to generate the desired links (e.g., `NavLink` components) with your own code to enable fine-tuning.
 
-[Read more about the Blazor navigation Menu...]({%slug menu-navigation%})
+[Read more about the Blazor navigation Menu...](slug://menu-navigation)
 
 ## Orientation
 
-The Blazor Menu allows you to control its orientation and display the items horizontally or vertically. [Read more about the Blazor Menu orientation...]({%slug components/menu/orientation%})
+The Blazor Menu allows you to control its orientation and display the items horizontally or vertically. [Read more about the Blazor Menu orientation...](slug://components/menu/orientation)
 
 ## Show and Hide Behavior
 
-By default, the Menu child items are displayed on mouse hover over the parent item and hidden on mouse leave. You can configure the Menu to [show and hide child items by clicking or tapping the parent]({%slug menu-show-hide-behavior%}).
+By default, the Menu child items are displayed on mouse hover over the parent item and hidden on mouse leave. You can configure the Menu to [show and hide child items by clicking or tapping the parent](slug://menu-show-hide-behavior).
 
 ## Templates
 
-You can use the functionality of the built-in templates and customize what is rendered in the items. [Read more about the Blazor Menu templates...]({%slug components/menu/templates%})
+You can use the functionality of the built-in templates and customize what is rendered in the items. [Read more about the Blazor Menu templates...](slug://components/menu/templates)
 
 ## Menu Icons
 
-To illustrate the purpose of each menu item, the Blazor Menu allows you to add images, icon classes, or font icons. [Read more about the Blazor Menu icons...]({%slug menu-icons%})
+To illustrate the purpose of each menu item, the Blazor Menu allows you to add images, icon classes, or font icons. [Read more about the Blazor Menu icons...](slug://menu-icons)
 
 ## Events
 
-The Blazor Menu generates events that you can handle and further customize its behavior. [Read more about the Blazor Menu events...]({%slug components/menu/events%})
+The Blazor Menu generates events that you can handle and further customize its behavior. [Read more about the Blazor Menu events...](slug://components/menu/events)
 
 ## Menu Parameters
 
@@ -124,7 +124,7 @@ The following table lists Context Menu parameters, which are not related to othe
 
 | Attribute | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | Renders additional CSS class to the main wrapping element of the component. Use it to apply custom styles or [override the theme]({%slug themes-override%}). |
+| `Class` | `string` | Renders additional CSS class to the main wrapping element of the component. Use it to apply custom styles or [override the theme](slug://themes-override). |
 | `CloseOnClick` | `bool` | Determines whether the Menu popups should close when they are clicked.
 | `ShowOn` | `MenuShowEvent` enum <br /> (`MouseEnter`) | The browser event that will trigger child Menu items to show (mouse enter or click). |
 | `HideOn` | `MenuHideEvent` enum <br /> (`MouseLeave`) | The browser event that will trigger child Menu items to hide (mouse leave or click).
@@ -147,14 +147,14 @@ The Menu provides the following popup settings:
 
 | Parameter | Type | Description |
 | --- | --- | --- |
-| `HorizontalCollision` | `PopupCollision` enum <br /> (`Fit`) | Sets the behavior of the Popup when it doesn't fit in the viewport based on the horizontal plane. [Read more about Popup collision behavior.]({%slug popup-position-collision%}#collision) |
-| `VerticalCollision` | `PopupCollision` enum <br /> (`Fit`) | Defines the behavior of the Popup when it doesn't fit in the viewport based on the vertical plane. [Read more about Popup collision behavior.]({%slug popup-position-collision%}#collision) |
+| `HorizontalCollision` | `PopupCollision` enum <br /> (`Fit`) | Sets the behavior of the Popup when it doesn't fit in the viewport based on the horizontal plane. [Read more about Popup collision behavior.](slug://popup-position-collision#collision) |
+| `VerticalCollision` | `PopupCollision` enum <br /> (`Fit`) | Defines the behavior of the Popup when it doesn't fit in the viewport based on the vertical plane. [Read more about Popup collision behavior.](slug://popup-position-collision#collision) |
 
 ## Next Steps
 
-* [Binding the Menu to Data]({%slug components/menu/data-binding/overview%})
+* [Binding the Menu to Data](slug://components/menu/data-binding/overview)
 
-* [Using the Menu to Navigate between Pages]({%slug menu-navigation%})
+* [Using the Menu to Navigate between Pages](slug://menu-navigation)
 
 ## See Also
 
diff --git a/components/menu/refresh-data.md b/components/menu/refresh-data.md
index c99c2583a9..164367d71f 100644
--- a/components/menu/refresh-data.md
+++ b/components/menu/refresh-data.md
@@ -152,6 +152,6 @@ In this article:
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
\ No newline at end of file
diff --git a/components/menu/show-hide-behavior.md b/components/menu/show-hide-behavior.md
index f0f5975ffc..421ce58272 100644
--- a/components/menu/show-hide-behavior.md
+++ b/components/menu/show-hide-behavior.md
@@ -22,7 +22,7 @@ The `ShownOn` and `HideOn` parameters allow you to set the event that will show
 * The `HideOn` parameter accepts a value from the `Telerik.Blazor.MenuHideEvent` enum:
 
     * `MouseLeave`&mdash;Child Menu items will disappear when the mouse cursor leaves the child item group and their parent.
-    * `Click`&mdash;Child Menu items will disappear when the user clicks or taps on their parent or on another parent, or outside the Menu. Clicking a child item will not close the currently open child item group. To change this behavior, use the [`CloseOnClick`]({%slug components/menu/overview%}#menu-parameters) parameter.
+    * `Click`&mdash;Child Menu items will disappear when the user clicks or taps on their parent or on another parent, or outside the Menu. Clicking a child item will not close the currently open child item group. To change this behavior, use the [`CloseOnClick`](slug://components/menu/overview#menu-parameters) parameter.
 
 By default, the Menu items are shown on hover (mouse enter) over the Menu and hidden on mouse leave.
 
@@ -129,8 +129,8 @@ By default, the Menu items are shown on hover (mouse enter) over the Menu and hi
 
 ## Next Steps
 
-* [Explore the Menu Templates]({%slug components/menu/templates%})
+* [Explore the Menu Templates](slug://components/menu/templates)
 
 ## See Also
 
-* [Menu Overview]({%slug components/menu/overview%})
+* [Menu Overview](slug://components/menu/overview)
diff --git a/components/menu/templates.md b/components/menu/templates.md
index 0b52a26664..5ff44e548b 100644
--- a/components/menu/templates.md
+++ b/components/menu/templates.md
@@ -16,7 +16,7 @@ The Menu component allows you to define a custom template for its items. This ar
 
 The template of all items is defined in the `ItemTemplate` tag of the Menu.
 
-The template receives the respective Menu data item as its `context`. You can use it to render the desired content. You can also set the `Context` parameter of the `ItemTemplate` tag and use a [named context variable. This is useful in nested template scenarios]({%slug nest-renderfragment%}).
+The template receives the respective Menu data item as its `context`. You can use it to render the desired content. You can also set the `Context` parameter of the `ItemTemplate` tag and use a [named context variable. This is useful in nested template scenarios](slug://nest-renderfragment).
 
 The Menu item template can contain arbitrary content according such as HTML markup and other components. You can also use standard event handlers like `@onclick` or `@onmouseover`.
 
@@ -24,7 +24,7 @@ The Menu item template can contain arbitrary content according such as HTML mark
 
 ### Use ItemTemplate for Navigation
 
-The following example shows how to render `<NavLink>` tags inside the Menu and use them for navigation instead of the [built-in Menu navigation mechanism]({%slug menu-navigation%}). This approach requires the URL property name to be different from `Url`. [`<NavLink>` also supports the `target="_blank"` attribute](#use-itemtemplate-for-styling-and-target-_blank).
+The following example shows how to render `<NavLink>` tags inside the Menu and use them for navigation instead of the [built-in Menu navigation mechanism](slug://menu-navigation). This approach requires the URL property name to be different from `Url`. [`<NavLink>` also supports the `target="_blank"` attribute](#use-itemtemplate-for-styling-and-target-_blank).
 
 >caption Use Menu item template for navigation
 
@@ -153,7 +153,7 @@ The following example shows how to render `<NavLink>` tags inside the Menu and u
 
 ### Use ItemTemplate for Styling and target="_blank"
 
-The example below shows a Menu configuration that is suitable for use in `MainLayout.razor`. The implementation disables the [built-in Menu navigation]({%slug menu-navigation%}) because the URL property is not `Url` and `UrlField` is not set. The sample also uses `<NavLink>` tags with `target="_blank"` to open external links in a new browser window.
+The example below shows a Menu configuration that is suitable for use in `MainLayout.razor`. The implementation disables the [built-in Menu navigation](slug://menu-navigation) because the URL property is not `Url` and `UrlField` is not set. The sample also uses `<NavLink>` tags with `target="_blank"` to open external links in a new browser window.
 
 >caption Use Menu item template to distinguish the current page and open external links in new browser windows
 
@@ -287,5 +287,5 @@ The example below shows a Menu configuration that is suitable for use in `MainLa
 
 ## See Also
 
-* [Data Binding a Menu]({%slug components/menu/data-binding/overview%})
+* [Data Binding a Menu](slug://components/menu/data-binding/overview)
 * [Live Demo: Menu Template](https://demos.telerik.com/blazor-ui/menu/template)
diff --git a/components/multicolumncombobox/accessibility/wai-aria-support.md b/components/multicolumncombobox/accessibility/wai-aria-support.md
index ceb5b67503..0c99bd365c 100644
--- a/components/multicolumncombobox/accessibility/wai-aria-support.md
+++ b/components/multicolumncombobox/accessibility/wai-aria-support.md
@@ -59,4 +59,4 @@ For details on how the MultiColumnComboBox keyboard navigation works, refer to t
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/multicolumncombobox/columns/overview.md b/components/multicolumncombobox/columns/overview.md
index bb98e4c24e..7880a9fa54 100644
--- a/components/multicolumncombobox/columns/overview.md
+++ b/components/multicolumncombobox/columns/overview.md
@@ -29,8 +29,8 @@ To bind data to the `<MultiColumnComboBoxColumn>` you can use the `Field`. This
 | `Class` | `string` | The CSS class that will be rendered on the column's content cells. |
 | `HeaderClass` | `string` | The CSS class that will be rendered on the column's header cell. |
 | `Title` | `string` | The string title rendered in the column header. If it is not explicitly declared the value of the `Field` will be rendered. |
-| `HeaderTemplate` | `RenderFragment` | The HeaderTemplate allows you to control the rendering of the column's header cell. Read more in the [Templates]({%slug multicolumncombobox-columns-templates%}#headertemplate ) article. |
-| `Template` | `RenderFragment<object>` | The Template allows you to control the rendering of the column's cells. Read more in the [Templates]({%slug multicolumncombobox-columns-templates%}#template) article. |
+| `HeaderTemplate` | `RenderFragment` | The HeaderTemplate allows you to control the rendering of the column's header cell. Read more in the [Templates](slug://multicolumncombobox-columns-templates#headertemplate ) article. |
+| `Template` | `RenderFragment<object>` | The Template allows you to control the rendering of the column's cells. Read more in the [Templates](slug://multicolumncombobox-columns-templates#template) article. |
 
 >caption MultiColumnComboBoxColumn with its features
 
@@ -98,5 +98,5 @@ To bind data to the `<MultiColumnComboBoxColumn>` you can use the `Field`. This
 
 ## See Also
 
-* [Templates]({% slug multicolumncombobox-templates %})
-* [Use Custom MultiColumnComboBox with Grid]({%slug multicolumncombobox-kb-grid%})
+* [Templates](slug://multicolumncombobox-templates)
+* [Use Custom MultiColumnComboBox with Grid](slug://multicolumncombobox-kb-grid)
diff --git a/components/multicolumncombobox/custom-value.md b/components/multicolumncombobox/custom-value.md
index bef1d76505..e61cb6dcef 100644
--- a/components/multicolumncombobox/custom-value.md
+++ b/components/multicolumncombobox/custom-value.md
@@ -18,9 +18,9 @@ To enable custom user input set the `AllowCustom` parameter to `true`.
 
 > When custom values are enabled, the `TextField`, `ValueField` and the `Value` must be of type `string`. Otherwise an exception will be thrown. Strings are required because the user input can take any form and may not be parsable to other types (such as numbers or GUID).
 
-When custom input is allowed, the [ValueChanged event]({%slug multicolumncombobox-events%}) fires on every keystroke, and not when an item is selected, because the MultiColumnComboBox component acts as a text input.
+When custom input is allowed, the [ValueChanged event](slug://multicolumncombobox-events) fires on every keystroke, and not when an item is selected, because the MultiColumnComboBox component acts as a text input.
 
-When custom values are typed in, there may be no selected item. See [Value and Selected Item]({%slug multicolumncombobox-data-binding%}#value-and-selected-item) for details on how item selection and `Value` work together.
+When custom values are typed in, there may be no selected item. See [Value and Selected Item](slug://multicolumncombobox-data-binding#value-and-selected-item) for details on how item selection and `Value` work together.
 
 >caption Allow custom user input in the combo box
 
@@ -111,7 +111,7 @@ Selected value: @selectedValue
 
 ## Limitations
 
-* `AllowCustom` is not compatible with [Adaptive rendering]({%slug adaptive-rendering%}).
+* `AllowCustom` is not compatible with [Adaptive rendering](slug://adaptive-rendering).
 
 ## See Also
 
diff --git a/components/multicolumncombobox/data-bind.md b/components/multicolumncombobox/data-bind.md
index 1bb922bfa7..9a772f3754 100644
--- a/components/multicolumncombobox/data-bind.md
+++ b/components/multicolumncombobox/data-bind.md
@@ -19,14 +19,14 @@ This article explains how to provide data to the MultiColumnComboBox component,
 
 Bind the MultiColumnComboBox to a model in your application. Unlike other drop down components such as ComboBox or DropDownList, binding to a collection of strings, primitives, or value types is not supported.
 
-Consult the [MultiColumnComboBox basic usage example]({%slug multicolumncombobox-overview%}#creating-multiColumnComboBox).
+Consult the [MultiColumnComboBox basic usage example](slug://multicolumncombobox-overview#creating-multiColumnComboBox).
 
 @[template](/_contentTemplates/common/get-model-from-dropdowns.md#get-model-from-dropdowns)
 
 
 ## Value and Selected Item
 
-By default, if no `Value` is provided, the MultiColumnComboBox will appear empty, or will display the `Placeholder` string. If a `Value` is provided and `AllowCustom` is `false`, the `Value` should match an item in the data source (see the [Value Out of Range]({%slug multicolumncombobox-data-binding%}#value-out-of-range) section.
+By default, if no `Value` is provided, the MultiColumnComboBox will appear empty, or will display the `Placeholder` string. If a `Value` is provided and `AllowCustom` is `false`, the `Value` should match an item in the data source (see the [Value Out of Range](slug://multicolumncombobox-data-binding#value-out-of-range) section.
 
 The MultiColumnComboBox acts as an input, so it will not always have a selected item. There will be no selected item in the following cases:
 
@@ -53,13 +53,13 @@ Missing selection is most common when:
 
 ## Missing Value or Data
 
-The MultiColumnCombobox component attempts to infer the type of its model and value based on the provided `Data` and initial `Value`. This affects its [object reference]({%slug multicolumncombobox-overview%}#component-reference-and-methods).
+The MultiColumnCombobox component attempts to infer the type of its model and value based on the provided `Data` and initial `Value`. This affects its [object reference](slug://multicolumncombobox-overview#component-reference-and-methods).
 
-In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters]({%slug common-features-data-binding-overview%}#component-type).
+In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters](slug://common-features-data-binding-overview#component-type).
 
 ## Value Out of Range
 
-This specific is applicable for the case when [custom value input]({%slug components/combobox/custom-value%}) is disabled (`AllowCustom="false"` which is its default value).
+This specific is applicable for the case when [custom value input](slug://components/combobox/custom-value) is disabled (`AllowCustom="false"` which is its default value).
 
 When the `Value` the application provides does not match any of the values present in the `ValueField` of the `Data` collection, the ComboBox component will not change the `Value` or select a new item. In the common case, it will show up blank to indicate there is nothing selected from its data.
 
@@ -71,5 +71,5 @@ When `AllowCustom="true"`, what the user types in the input will be set to the `
 
 ## See Also
 
-* [MultiColumnComboBox Overview]({%slug multicolumncombobox-overview%})
+* [MultiColumnComboBox Overview](slug://multicolumncombobox-overview)
 * [Live Demo: MultiColumnComboBox](https://demos.telerik.com/blazor-ui/multicolumncombobox/overview)
diff --git a/components/multicolumncombobox/events.md b/components/multicolumncombobox/events.md
index f7727cac80..3a896d1359 100644
--- a/components/multicolumncombobox/events.md
+++ b/components/multicolumncombobox/events.md
@@ -22,7 +22,7 @@ This article describes the events of the Telerik MultiColumnComboBox for Blazor.
 
 ## ValueChanged
 
-The `ValueChanged` event fires upon every change of the user selection. When [custom values]({%slug multicolumncombobox-custom-value%}) are enabled, it fires upon every keystroke, like in a regular `<input>` element.
+The `ValueChanged` event fires upon every change of the user selection. When [custom values](slug://multicolumncombobox-custom-value) are enabled, it fires upon every keystroke, like in a regular `<input>` element.
 
 The type of the argument in the lambda expression must match the `Value` type of the component, and the `ValueField` type (if `ValueField` is set).
 
@@ -194,21 +194,21 @@ The `OnChange` event represents a user action - confirmation of the current valu
 
 ## OnRead
 
->tip Get familiar with the [common `OnRead` event documentation]({%slug common-features-data-binding-onread%}) first.
+>tip Get familiar with the [common `OnRead` event documentation](slug://common-features-data-binding-onread) first.
 
-You can use the `OnRead` event to provide data to the component according to some custom logic, the user input, or the current [virtual scroll]({%slug multicolumncombobox-virtualization%}) position. The event fires when:
+You can use the `OnRead` event to provide data to the component according to some custom logic, the user input, or the current [virtual scroll](slug://multicolumncombobox-virtualization) position. The event fires when:
 
 * The component initializes.
-* The user [filters]({%slug multicolumncombobox-filter%}).
-* The user scrolls with [virtualization]({%slug multicolumncombobox-virtualization%}) enabled.
+* The user [filters](slug://multicolumncombobox-filter).
+* The user scrolls with [virtualization](slug://multicolumncombobox-virtualization) enabled.
 
 You can also call remote data through `async` operations.
 
-Find out how to [get the applied by filtering and grouping criteria]({%slug common-features-descriptors%}).
+Find out how to [get the applied by filtering and grouping criteria](slug://common-features-descriptors).
 
 When using `OnRead`, make sure to set `TItem` and `TValue`.
 
->tip You can also [debounce the service calls and implement minimum filter length]({%slug combo-kb-debounce-onread%}).
+>tip You can also [debounce the service calls and implement minimum filter length](slug://combo-kb-debounce-onread).
 
 >caption Custom Data according to the user input in the ComboBox
 
@@ -519,6 +519,6 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
 
diff --git a/components/multicolumncombobox/filter.md b/components/multicolumncombobox/filter.md
index ddc42338aa..2047a5d91e 100644
--- a/components/multicolumncombobox/filter.md
+++ b/components/multicolumncombobox/filter.md
@@ -14,8 +14,8 @@ The MultiColumnComboBox component allows users to filter items by their text, so
 
 To enable filtering, set the `Filterable` parameter to `true`. The filtering is case insensitive.
 
-You can also use the [`OnRead` event]({%slug multicolumncombobox-events%}#onread) to:
-* Get the [applied filtering criteria]({%slug common-features-descriptors%}#through-the-onread-event).
+You can also use the [`OnRead` event](slug://multicolumncombobox-events#onread) to:
+* Get the [applied filtering criteria](slug://common-features-descriptors#through-the-onread-event).
 * Implement custom (server) filtering and set data dynamically.
 
 Filtering looks in the `TextField`, and the filter is reset when the dropdown closes.
@@ -26,7 +26,7 @@ The default filter operator is `starts with`. You can choose a different operato
 
 ## Performance
 
-By default, the filtering is debounced with 150ms. Configure that with the [`DebounceDelay`]({%slug multicolumncombobox-overview%}#multicolumncombobox-parameters) parameter of the component.
+By default, the filtering is debounced with 150ms. Configure that with the [`DebounceDelay`](slug://multicolumncombobox-overview#multicolumncombobox-parameters) parameter of the component.
 
 ## Filtering Example
 
@@ -111,4 +111,4 @@ By default, the filtering is debounced with 150ms. Configure that with the [`Deb
 
 * [Live Demo: MultiColumnComboBox Filtering](https://demos.telerik.com/blazor-ui/multicolumncombobox/filtering)
 
-* [Custom Filtering by Multiple Fields]({%slug dropdowns-kb-search-in-multiple-fields%})
+* [Custom Filtering by Multiple Fields](slug://dropdowns-kb-search-in-multiple-fields)
diff --git a/components/multicolumncombobox/grouping.md b/components/multicolumncombobox/grouping.md
index 33ea7c7aeb..2041b22845 100644
--- a/components/multicolumncombobox/grouping.md
+++ b/components/multicolumncombobox/grouping.md
@@ -78,7 +78,7 @@ The group headers stick to the top of the dropdown during scrolling. In other wo
 
 * One level of grouping is supported.
 * The `Placeholder` (e.g. "Select item...") is always rendered above the sticky group header in the dropdown.
-* A grouped MultiColumnComboBox will provide a `Groups` property with a single [`GroupDescriptor`](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) argument of its [OnRead event]({%slug multicolumncombobox-events%}#onread). This will allow the developer to apply grouping with [manual data operations]({%slug common-features-data-binding-onread%}).
+* A grouped MultiColumnComboBox will provide a `Groups` property with a single [`GroupDescriptor`](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) argument of its [OnRead event](slug://multicolumncombobox-events#onread). This will allow the developer to apply grouping with [manual data operations](slug://common-features-data-binding-onread).
 
 ## See Also
 
diff --git a/components/multicolumncombobox/overview.md b/components/multicolumncombobox/overview.md
index 20b4050393..48a6bd3112 100644
--- a/components/multicolumncombobox/overview.md
+++ b/components/multicolumncombobox/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor MultiColumnComboBox Overview
 
-The <a href="https://www.telerik.com/blazor-ui/multicolumncombobox" target="_blank">Blazor MultiColumnComboBox</a> enables users to select an option from a [predefined set of choices]({%slug multicolumncombobox-data-binding%}) in a dropdown grid layout. Users can also [filter]({%slug multicolumncombobox-filter%}) or [group]({%slug multicolumncombobox-grouping%}) the available items, or enter [custom values]({%slug multicolumncombobox-custom-value%}).
+The <a href="https://www.telerik.com/blazor-ui/multicolumncombobox" target="_blank">Blazor MultiColumnComboBox</a> enables users to select an option from a [predefined set of choices](slug://multicolumncombobox-data-binding) in a dropdown grid layout. Users can also [filter](slug://multicolumncombobox-filter) or [group](slug://multicolumncombobox-grouping) the available items, or enter [custom values](slug://multicolumncombobox-custom-value).
 
 
 ## Creating MultiColumnComboBox
@@ -18,7 +18,7 @@ The <a href="https://www.telerik.com/blazor-ui/multicolumncombobox" target="_bla
 1. Use the `<TelerikMultiColumnComboBox>` tag.
 1. Populate the `Data` parameter with the collection that you want to appear in the dropdown.
 1. Set the `TextField` and `ValueField` parameters to point to the corresponding property names of the model.
-1. [Bind the component `Value`]({%slug get-started-value-vs-data-binding %}#value-binding) to a variable of the same type as the one of the `ValueField`.
+1. [Bind the component `Value`](slug://get-started-value-vs-data-binding #value-binding) to a variable of the same type as the one of the `ValueField`.
 1. Add `MultiColumnComboBoxColumn` instances under the `MultiColumnComboBoxColumns` tag. The `Field` parameter of each column must point to a property in the model.
 
 >caption MultiColumnComboBox data binding with two-way value binding
@@ -67,27 +67,27 @@ The <a href="https://www.telerik.com/blazor-ui/multicolumncombobox" target="_bla
 
 ## Data Binding
 
-The Blazor MultiColumnComboBox @[template](/_contentTemplates/dropdowns/features.md#data-binding) [Read more about the Blazor MultiColumnComboBox data binding...]({% slug multicolumncombobox-data-binding %}).
+The Blazor MultiColumnComboBox @[template](/_contentTemplates/dropdowns/features.md#data-binding) [Read more about the Blazor MultiColumnComboBox data binding...](slug://multicolumncombobox-data-binding).
 
 The linked article also explains how the component behaves when the current value is not present in the data.
 
 ## Columns
 
-The MultiColumnComboBox renders its dropdown items in a grid-like column layout. [Learn how to define and configure the Blazor MultiColumnComboBox columns...]({%slug multicolumncombobox-columns-overview%})
+The MultiColumnComboBox renders its dropdown items in a grid-like column layout. [Learn how to define and configure the Blazor MultiColumnComboBox columns...](slug://multicolumncombobox-columns-overview)
 
 ## Filtering
 
-The MultiColumnComboBox @[template](/_contentTemplates/dropdowns/features.md#filtering) [Read more about the Blazor MultiColumnComboBox filtering...]({% slug multicolumncombobox-filter %}).
+The MultiColumnComboBox @[template](/_contentTemplates/dropdowns/features.md#filtering) [Read more about the Blazor MultiColumnComboBox filtering...](slug://multicolumncombobox-filter).
 
 ## Grouping
 
-The MultiColumnComboBox @[template](/_contentTemplates/dropdowns/features.md#grouping) [Read more about the Blazor MultiColumnComboBox grouping...]({% slug multicolumncombobox-grouping %}).
+The MultiColumnComboBox @[template](/_contentTemplates/dropdowns/features.md#grouping) [Read more about the Blazor MultiColumnComboBox grouping...](slug://multicolumncombobox-grouping).
 
 @[template](/_contentTemplates/common/inputs.md#adornments)
 
 ## Templates
 
-@[template](/_contentTemplates/dropdowns/features.md#templates) [Read more about the Blazor MultiColumnComboBox templates...]({% slug multicolumncombobox-templates %}).
+@[template](/_contentTemplates/dropdowns/features.md#templates) [Read more about the Blazor MultiColumnComboBox templates...](slug://multicolumncombobox-templates).
 
 ## Validation
 
@@ -95,7 +95,7 @@ The MultiColumnComboBox @[template](/_contentTemplates/dropdowns/features.md#gro
 
 ## Virtualization
 
-@[template](/_contentTemplates/dropdowns/features.md#virtualization) [Read more about the Blazor MultiColumnComboBox virtualization...]({% slug multicolumncombobox-virtualization %})
+@[template](/_contentTemplates/dropdowns/features.md#virtualization) [Read more about the Blazor MultiColumnComboBox virtualization...](slug://multicolumncombobox-virtualization)
 
 ## Adaptive Rendering
 
@@ -109,22 +109,22 @@ The MultiColumnComboBox @[template](/_contentTemplates/dropdowns/features.md#gro
 
 | Parameter | Type and Default&nbsp;Value | Description
 | ----------- | ----------- | -----------|
-| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode]({%slug adaptive-rendering%}) of the component. |
-| `AllowCustom` | `bool` | Determines if the user can enter [custom values]({%slug multicolumncombobox-custom-value%}). If enabled, the `ValueField` must be a `string`. |
+| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode](slug://adaptive-rendering) of the component. |
+| `AllowCustom` | `bool` | Determines if the user can enter [custom values](slug://multicolumncombobox-custom-value). If enabled, the `ValueField` must be a `string`. |
 | `ShowClearButton` | `bool` | Displays a clear button inside the input. When it is clicked, the `Value` will change to `default(TValue)`, so there must be no item in the `Data` that has such a `Value`. For example, if `TValue` is `int`, there should be no data item with `0` in its `ValueField`, otherwise selection issues may occur. |
 | `Data` | `IEnumerable<TItem>` | The component data. |
 | `DebounceDelay` | `int` <br/> (`150`) | The time in milliseconds between the last typed symbol and the internal `oninput` event firing. Applies when the user types and filters. Use it to balance between client-side performance and number of database queries. |
 | `Enabled` | `bool` | Whether the user can interact with the component. |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
-| `Filterable` | `bool` | Enables [filtering]({% slug multicolumncombobox-filter %}) for the end user. |
-| `FilterOperator` | `StringFilterOperator` enum <br /> (`StartsWith`) | The [filtering method]({% slug multicolumncombobox-filter %}). |
+| `Filterable` | `bool` | Enables [filtering](slug://multicolumncombobox-filter) for the end user. |
+| `FilterOperator` | `StringFilterOperator` enum <br /> (`StartsWith`) | The [filtering method](slug://multicolumncombobox-filter). |
 | `Id` | `string` | The `id` attribute of the `<input class="k-input-inner" />` element. Use it to attach a `<label for="...">` to the input. |
 | `InputMode` | `string` | The [`inputmode` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) of the `<input />` element. |
 | `LoaderShowDelay` | `int ` <br /> 300 | Time in milliseconds between opening the popup and showing the loading skeleton in it when the data is not yet available. |
 | `Placeholder` | `string` | The hint text the user sees when no item is selected. The placeholder will shown when the `Value` is set to the default value of the `ValueField` type. For example, `0` for `int`, and `null` for `int?` or `string`. |
 | `TItem` | `Type` | The type of the model. Required if you can't provide `Data` or `Value`. Determines the type of the reference object. |
 | `TValue` | `Type` | The type of the `ValueField` from the model. Required if you can't provide `Data` or `Value`. Determines the type of the reference object. The type of the values can be:<br /> - `number` (`int`, `double`, etc.)<br /> - `string`<br /> - `Guid`<br /> - `Enum` |
-| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`]({%slug adaptive-rendering%}). |
+| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`](slug://adaptive-rendering). |
 | `TextField` | `string` <br /> (`Text`) | The name of the model property that will be shown to the user. |
 | `ValueField` | `string` <br /> (`Value`) | The name of the model property that will be the underlying component `Value`. |
 | `Value` | `TValue` | The value of the component. Use the `@bind-Value` syntax for two-way binding. |
@@ -136,7 +136,7 @@ The following parameters enable you to customize the appearance of the Blazor Mu
 
 @[template](/_contentTemplates/dropdowns/features.md#styling)
 
-You can find more options for customizing the MultiColumnComboBox styling in the [Appearance article]({%slug multicolumncombobox-appearance%}).
+You can find more options for customizing the MultiColumnComboBox styling in the [Appearance article](slug://multicolumncombobox-appearance).
 
 ### Popup settings
 
@@ -166,7 +166,7 @@ The MultiColumnComboBox provides the following popup settings:
 
 To execute MultiColumnComboBox methods, obtain reference to the component instance via `@ref`.
 
-The MultiColumnComboBox is a generic component. Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters]({%slug common-features-data-binding-overview%}#component-type).
+The MultiColumnComboBox is a generic component. Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters](slug://common-features-data-binding-overview#component-type).
 
 The table below lists the MultiComboBox methods. Also consult the [MultiColumnComboBox API](/blazor-ui/api/Telerik.Blazor.Components.TelerikMultiColumnComboBox-2).
 
@@ -175,7 +175,7 @@ The table below lists the MultiComboBox methods. Also consult the [MultiColumnCo
 | `Close` | Closes the component dropdown. |
 | `FocusAsync` | Focuses the component textbox. |
 | `Open` | Opens the component dropdown. |
-| `Rebind` | [Refreshes the component data]({%slug common-features-data-binding-overview%}#refresh-data). |
+| `Rebind` | [Refreshes the component data](slug://common-features-data-binding-overview#refresh-data). |
 | `Refresh` | Re-renders the component popup. |
 
 >caption Using MultiColumnComboBox methods
@@ -236,9 +236,9 @@ The table below lists the MultiComboBox methods. Also consult the [MultiColumnCo
 
 ## Next Steps
 
-* [Bind the MultiColumnComboBox to data]({%slug multicolumncombobox-data-binding%})
-* [Enable MultiColumnComboBox filtering]({%slug multicolumncombobox-filter%})
-* [Allow custom MultiColumnComboBox value]({%slug multicolumncombobox-custom-value%})
+* [Bind the MultiColumnComboBox to data](slug://multicolumncombobox-data-binding)
+* [Enable MultiColumnComboBox filtering](slug://multicolumncombobox-filter)
+* [Allow custom MultiColumnComboBox value](slug://multicolumncombobox-custom-value)
 
 ## See Also
 
diff --git a/components/multicolumncombobox/templates.md b/components/multicolumncombobox/templates.md
index 1ef5f5b353..799cc780e2 100644
--- a/components/multicolumncombobox/templates.md
+++ b/components/multicolumncombobox/templates.md
@@ -22,7 +22,7 @@ The MultiColumnComboBox component allows you to change what is rendered in its h
 
 ## Row Template
 
-The `RowTemplate` allows you to control the rendering of each whole row in the dropdown. Use a row template if separate [column templates]({%slug multicolumncombobox-columns-templates%}) do not allow enough customization.
+The `RowTemplate` allows you to control the rendering of each whole row in the dropdown. Use a row template if separate [column templates](slug://multicolumncombobox-columns-templates) do not allow enough customization.
 
 You can access the `context` object and cast it to the bound model to employ some custom business logic. The `contenxt` represents the current data item for the row.
 
diff --git a/components/multicolumncombobox/virtualization.md b/components/multicolumncombobox/virtualization.md
index 6240a183e3..454c3ad9f3 100644
--- a/components/multicolumncombobox/virtualization.md
+++ b/components/multicolumncombobox/virtualization.md
@@ -25,7 +25,7 @@ This section will explain the parameters and behaviors that are related to the v
 >caption To enable UI virtualization, you need to set the following parameters of the component:
 
 * `ScrollMode` - `Telerik.Blazor.DropDownScrollMode` - set it to `DropDownScrollMode.Virtual`. It defaults to the "regular" scrolling.
-* `ListHeight` - `string` - [set the height]({%slug common-features/dimensions%}) of the dropdown. It must **not** be a `null/empty` string.
+* `ListHeight` - `string` - [set the height](slug://common-features/dimensions) of the dropdown. It must **not** be a `null/empty` string.
 * `ItemHeight` - `decimal` - set it to the height each individual item will have in the dropdown. Make sure to accommodate the content your items will have and any item template.
 * `PageSize` - `int` - defines how many items will actually be rendered and reused. The value determines how many items are loaded on each scroll. The number of items must be large enough according to the `ItemHeight` and popup `ListHeight`, so that there are more items than the dropdown so there is a scrollbar.
 
diff --git a/components/multiselect/accessibility/wai-aria-support.md b/components/multiselect/accessibility/wai-aria-support.md
index b5f6d22939..a105b06d9f 100644
--- a/components/multiselect/accessibility/wai-aria-support.md
+++ b/components/multiselect/accessibility/wai-aria-support.md
@@ -107,4 +107,4 @@ For details on how the MultiSelect keyboard navigation works, refer to the [Blaz
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/multiselect/events.md b/components/multiselect/events.md
index d7d0132623..086d93ea0b 100644
--- a/components/multiselect/events.md
+++ b/components/multiselect/events.md
@@ -96,15 +96,15 @@ from the model:
 
 ## OnRead
 
-You can use the he [`OnRead` event]({%slug common-features-data-binding-onread%}) to provide data to the component according to some custom logic and according to the current user input and/or scroll position (for [virtualization]({%slug multiselect-virtualization%})). The event fires when:
+You can use the he [`OnRead` event](slug://common-features-data-binding-onread) to provide data to the component according to some custom logic and according to the current user input and/or scroll position (for [virtualization](slug://multiselect-virtualization)). The event fires when:
 
 * The component initializes.
-* The user [filters]({%slug multiselect-filter%}).
-* The user scrolls with [virtualization]({%slug dropdownlist-virtualization%}) enabled.
+* The user [filters](slug://multiselect-filter).
+* The user scrolls with [virtualization](slug://dropdownlist-virtualization) enabled.
 
 You can also call remote data through async operations.
 
-Find out how to [get the applied filtering and grouping criteria]({%slug common-features-descriptors%}).
+Find out how to [get the applied filtering and grouping criteria](slug://common-features-descriptors).
 
 >caption Custom Data according to the user input in the MultiSelect
 
@@ -396,5 +396,5 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
diff --git a/components/multiselect/filter.md b/components/multiselect/filter.md
index 4323bb712c..8b621f2ac6 100644
--- a/components/multiselect/filter.md
+++ b/components/multiselect/filter.md
@@ -14,8 +14,8 @@ The MultiSelect component can filter the available suggestions according to the
 
 To enable filtering, set the `Filterable` parameter to `true`. The filtering is case insensitive.
 
-You can also use the [`OnRead` event]({%slug multiselect-events%}#onread) to:
-* Get the [applied filtering criteria]({%slug common-features-descriptors%}#through-the-onread-event).
+You can also use the [`OnRead` event](slug://multiselect-events#onread) to:
+* Get the [applied filtering criteria](slug://common-features-descriptors#through-the-onread-event).
 * Implement custom (server) filtering and set data dynamically.
 
 Filtering looks in the `TextField`, and the filter is reset when the dropdown closes.
@@ -30,7 +30,7 @@ To control when the filter list appears, set the `MinLength` parameter. This can
 
 ## Performance
 
-By default, the filtering is debounced with 150ms. Configure that with the [`DebounceDelay`]({%slug multiselect-overview%}#parameters) parameter of the component.
+By default, the filtering is debounced with 150ms. Configure that with the [`DebounceDelay`](slug://multiselect-overview#parameters) parameter of the component.
 
 ## Persist Filter
 
@@ -139,5 +139,5 @@ To keep the filter upon selection, set the `PersistFilterOnSelect` parameter to
 
 * [Live Demo: MultiSelect Filtering](https://demos.telerik.com/blazor-ui/multiselect/filtering)
 
-* [Custom Filtering by Multiple Fields]({%slug dropdowns-kb-search-in-multiple-fields%})
+* [Custom Filtering by Multiple Fields](slug://dropdowns-kb-search-in-multiple-fields)
 
diff --git a/components/multiselect/grouping.md b/components/multiselect/grouping.md
index cfd2c3898e..1ae5b1451a 100644
--- a/components/multiselect/grouping.md
+++ b/components/multiselect/grouping.md
@@ -67,7 +67,7 @@ The group headers can stick to the top of the dropdown during scrolling. In othe
 # Notes
 
 * One level of grouping is supported.
-* A grouped MultiSelect will provide a `Groups` property with a single [`GroupDescriptor`](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) argument of its [OnRead event]({%slug multiselect-events%}#onread). This will allow the developer to apply grouping with [manual data operations]({%slug components/grid/manual-operations%}).
+* A grouped MultiSelect will provide a `Groups` property with a single [`GroupDescriptor`](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) argument of its [OnRead event](slug://multiselect-events#onread). This will allow the developer to apply grouping with [manual data operations](slug://components/grid/manual-operations).
 
 ## See Also
 
diff --git a/components/multiselect/overview.md b/components/multiselect/overview.md
index 05b3a1e99d..646bca6cbd 100644
--- a/components/multiselect/overview.md
+++ b/components/multiselect/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor MultiSelect Overview
 
-The <a href="https://www.telerik.com/blazor-ui/multiselect" target="_blank">Blazor MultiSelect component</a> lets the user select several items from the available list. It is similar to a `<select multiple>` in this regard. The MultiSelect offers suggestions as you type and they can be [filtered]({%slug multiselect-filter%}). You can control the list of suggestions through [data binding]({%slug multiselect-databind%}), various appearance settings like [dimensions]({%slug common-features/dimensions%}) and [templates]({%slug multiselect-templates%}).
+The <a href="https://www.telerik.com/blazor-ui/multiselect" target="_blank">Blazor MultiSelect component</a> lets the user select several items from the available list. It is similar to a `<select multiple>` in this regard. The MultiSelect offers suggestions as you type and they can be [filtered](slug://multiselect-filter). You can control the list of suggestions through [data binding](slug://multiselect-databind), various appearance settings like [dimensions](slug://common-features/dimensions) and [templates](slug://multiselect-templates).
 
 ## Creating MultiSelect
 
@@ -18,7 +18,7 @@ The <a href="https://www.telerik.com/blazor-ui/multiselect" target="_blank">Blaz
 
 1. Populate the `Data` property with the collection of items that you want to appear in the dropdown.
 
-1. [Bind the value of the component]({%slug get-started-value-vs-data-binding %}#value-binding) to a collection of the same type as the type defined in the `ValueField` parameter.
+1. [Bind the value of the component](slug://get-started-value-vs-data-binding #value-binding) to a collection of the same type as the type defined in the `ValueField` parameter.
 
 1. (Optional) Enable features like placeholder text, clear button, and AutoClose.
 
@@ -61,21 +61,21 @@ The <a href="https://www.telerik.com/blazor-ui/multiselect" target="_blank">Blaz
 
 ## Data Binding
 
-The Blazor MultiSelect @[template](/_contentTemplates/dropdowns/features.md#data-binding) [Read more about the Blazor MultiSelect data binding...]({% slug multiselect-databind %})
+The Blazor MultiSelect @[template](/_contentTemplates/dropdowns/features.md#data-binding) [Read more about the Blazor MultiSelect data binding...](slug://multiselect-databind)
 
 ## Filtering
 
-The Blazor MultiSelect @[template](/_contentTemplates/dropdowns/features.md#filtering) [Read more about the Blazor MultiSelect filter...]({% slug multiselect-filter %})
+The Blazor MultiSelect @[template](/_contentTemplates/dropdowns/features.md#filtering) [Read more about the Blazor MultiSelect filter...](slug://multiselect-filter)
 
 ## Grouping
 
-The Blazor MultiSelect @[template](/_contentTemplates/dropdowns/features.md#grouping) [Read more about the Blazor MultiSelect grouping...]({% slug components/multiselect/grouping %})
+The Blazor MultiSelect @[template](/_contentTemplates/dropdowns/features.md#grouping) [Read more about the Blazor MultiSelect grouping...](slug://components/multiselect/grouping)
 
 @[template](/_contentTemplates/common/inputs.md#adornments)
 
 ## Templates
 
-@[template](/_contentTemplates/dropdowns/features.md#templates) [Read more about the Blazor MultiSelect templates...]({% slug multiselect-templates %})
+@[template](/_contentTemplates/dropdowns/features.md#templates) [Read more about the Blazor MultiSelect templates...](slug://multiselect-templates)
 
 ## Validation
 
@@ -83,7 +83,7 @@ The Blazor MultiSelect @[template](/_contentTemplates/dropdowns/features.md#grou
 
 ## Virtualization
 
-@[template](/_contentTemplates/dropdowns/features.md#virtualization) [Read more about the Blazor MultiSelect virtualization...]({% slug multiselect-virtualization %})
+@[template](/_contentTemplates/dropdowns/features.md#virtualization) [Read more about the Blazor MultiSelect virtualization...](slug://multiselect-virtualization)
 
 ## Adaptive Rendering
 
@@ -97,33 +97,33 @@ The Blazor MultiSelect provides various parameters that allow you to configure t
 
 | Parameter    | Type  | Description |
 | ----------- | ----------- | ------ |
-| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode]({%slug adaptive-rendering%}) of the component. |
+| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode](slug://adaptive-rendering) of the component. |
 | `AutoClose` | `bool` <br /> (`true`) | Defines whether the dropdown list containing the items for the MultiSelect will automatically close after each user selection. |
 | `ShowClearButton` | `bool` | Whether the user will have the option to clear the selected items with a button on the input. When it is clicked, the `Value` will be updated to an empty list. |
 | `Data` | `IEnumerable<TItem>` | Allows you to provide the data source. Required. |
 | `DebounceDelay` | `int` <br/> 150 | Time in milliseconds between the last typed symbol and the internal `oninput` event firing. Applies when the user types and filters. Use it to balance between client-side performance and number of database queries. |
 | `Enabled` | `bool` | Whether the component is enabled. |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
-| `Filterable` | `bool` | Whether [filtering]({%slug multiselect-filter%}) is enabled for the end user (suggestions will get narrowed down as they type). |
-| `FilterOperator` | `StringFilterOperator` <br /> (`StartsWith`) | The string operation that will be used for [filtering]({%slug multiselect-filter%}). |
+| `Filterable` | `bool` | Whether [filtering](slug://multiselect-filter) is enabled for the end user (suggestions will get narrowed down as they type). |
+| `FilterOperator` | `StringFilterOperator` <br /> (`StartsWith`) | The string operation that will be used for [filtering](slug://multiselect-filter). |
 | `Id` | `string` | Renders as the `id` attribute on the `<select />` element, so you can attach a `<label for="">` to it. |
 | `InputMode` | `string` | The [`inputmode` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) of the `<input />` element. |
 | `LoaderShowDelay` | `int ` <br /> 300 | Time in milliseconds between opening the popup and showing the loading skeleton in it when the data is not yet available. |
-| `MinLength` | `int` | How many characters the user must type before the suggestion list appears. Often works together with [filtering]({%slug multiselect-filter%}). |
-| `PersistFilterOnSelect` | `bool` | Controls whether the filter input will be cleared when the user selects an item. Applies when [MultiSelect filtering]({%slug multiselect-filter%}) is enabled and `AutoClose="false"`. 
+| `MinLength` | `int` | How many characters the user must type before the suggestion list appears. Often works together with [filtering](slug://multiselect-filter). |
+| `PersistFilterOnSelect` | `bool` | Controls whether the filter input will be cleared when the user selects an item. Applies when [MultiSelect filtering](slug://multiselect-filter) is enabled and `AutoClose="false"`. 
 | `Placeholder` | `string` | The text the user sees as a hint when there is no selection. |
 | `ShowArrowButton` | `bool` | Controls whether the MultiSelect will show an arrow button, which hints about its dropdown. When enabled, an empty MultiSelect component looks similar to a ComboBox, otherwise it looks similar to a TextBox. |
 | `TextField` | `string` <br /> (`Text`)| The field in the model from which the text of the items is taken. |
 | `TItem` | `Type` | The type of the model to which the component is bound. Required if you can't provide `Data` or `Value`. Determines the type of the reference object. |
 | `TValue` | `Type` | The type of the value field in the model to which the component is bound. Required if you can't provide `Data` or `Value`. Determines the type of the reference object. The type of the values can be:<br /> - `number` (such as `int`, `double`, and so on)<br /> - `string`<br /> - `Guid`<br /> - `Enum` |
-| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`]({%slug adaptive-rendering%}). |
+| `Title` | `string` | The title text rendered in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `Auto`](slug://adaptive-rendering). |
 | `Value` and `bind-Value` | `List<TValue>` | Get/set the value of the component, can be used for binding. Use the `@bind-Value` syntax for two-way binding, for example, to a variable of your own. The `Value` must be a `List<TValue>`. |
 | `ValueField` | `string`  <br /> (`Value`)| The name of the field from the model that will be used as values in the selection. |
 | `TabIndex` | `int?` | Mps to the `tabindex` attribute of the HTML element. You can use it to customize the order in which the inputs in your form focus with the `Tab` key. |
 
 ### Styling and Appearance
 
-The following parameters enable you to customize the [appearance]({%slug multiselect-appearance%}) of the Blazor MultiSelect:
+The following parameters enable you to customize the [appearance](slug://multiselect-appearance) of the Blazor MultiSelect:
 
 @[template](/_contentTemplates/dropdowns/features.md#styling)
 
@@ -162,7 +162,7 @@ The MultiSelect provides the following popup settings:
 
 ## MultiSelect Reference and Methods
 
-The MultiSelect is a generic component and its type is determined by the type of the model you use as its data source. You can find examples in the [Data Bind - Considerations]({%slug multiselect-databind%}#considerations) article.
+The MultiSelect is a generic component and its type is determined by the type of the model you use as its data source. You can find examples in the [Data Bind - Considerations](slug://multiselect-databind#considerations) article.
 
 Add a reference to the component instance to use the [MultiSelect's methods](/blazor-ui/api/Telerik.Blazor.Components.TelerikMultiSelect-2).
 
@@ -196,13 +196,13 @@ Add a reference to the component instance to use the [MultiSelect's methods](/bl
 
 ## Next Steps
 
-* [Binding the MultiSelect to Data]({%slug multiselect-databind%})
+* [Binding the MultiSelect to Data](slug://multiselect-databind)
 
-* [Pre-Selecting Items for the User]({% slug multiselect-pre-select-items %})
+* [Pre-Selecting Items for the User](slug://multiselect-pre-select-items)
 
 ## See Also
 
-* [Data Binding]({%slug multiselect-databind%})
+* [Data Binding](slug://multiselect-databind)
 * [Live Demo: MultiSelect](https://demos.telerik.com/blazor-ui/multiselect/overview)
 * [Live Demo: MultiSelect Validation](https://demos.telerik.com/blazor-ui/multiselect/validation)
 * [MultiSelect API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikMultiSelect-2)
diff --git a/components/multiselect/pre-select-items.md b/components/multiselect/pre-select-items.md
index f080bf932a..27962593bc 100644
--- a/components/multiselect/pre-select-items.md
+++ b/components/multiselect/pre-select-items.md
@@ -13,7 +13,7 @@ position: 8
 
 This article provides an example that shows how to pre-select MultiSelect items for the user. The approach allows you to pre-select a single item or a set of items if they exist in the data source.
 
-On page load, the MultiSelect will render the selected items in the order in which these items appear in the `Data` collection. To preserve the order of the initially selected items, [sort the data to match the selected items order]({%slug multiselect-kb-selected-items-order%}).
+On page load, the MultiSelect will render the selected items in the order in which these items appear in the `Data` collection. To preserve the order of the initially selected items, [sort the data to match the selected items order](slug://multiselect-kb-selected-items-order).
 
 >caption Pre-select MultiSelect items for the user
 
diff --git a/components/multiselect/refresh-data.md b/components/multiselect/refresh-data.md
index dfaf78dfec..659557750e 100644
--- a/components/multiselect/refresh-data.md
+++ b/components/multiselect/refresh-data.md
@@ -21,7 +21,7 @@ Sections in this article:
 
 ## Rebind Method
 
-You can refresh the data of the MultiSelect by using the `Rebind` method exposed to the reference of the TelerikMultiSelect. If you have manually defined the [OnRead event]({%slug multiselect-events%}#onread) the business logic defined in its event handler will be executed. 
+You can refresh the data of the MultiSelect by using the `Rebind` method exposed to the reference of the TelerikMultiSelect. If you have manually defined the [OnRead event](slug://multiselect-events#onread) the business logic defined in its event handler will be executed. 
 
 ````RAZOR
 @* Clicking on the Rebind button will delete the first option from the dropdown and refresh the data *@
@@ -276,6 +276,6 @@ The `Value` parameter also accepts a collection but it does not support observab
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
diff --git a/components/notification/accessibility/wai-aria-support.md b/components/notification/accessibility/wai-aria-support.md
index 33492983a4..91e19053aa 100644
--- a/components/notification/accessibility/wai-aria-support.md
+++ b/components/notification/accessibility/wai-aria-support.md
@@ -64,9 +64,9 @@ The Notification has been tested with the following screen readers and browsers
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor Notification Demos](https://demos.telerik.com/blazor-ui/notification/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/notification/appearance.md b/components/notification/appearance.md
index cd656e0e4f..a2f76dcd49 100644
--- a/components/notification/appearance.md
+++ b/components/notification/appearance.md
@@ -139,7 +139,7 @@ The color of the notification popup is easily controlled through the `ThemeColor
 * `Light`
 * `Inverse`
 
-These predefined options match the main [Telerik Theme]({%slug themes-overview%}) and you can see that in action in the [Notification Appearance](https://demos.telerik.com/blazor-ui/notification/appearance) Live Demo.
+These predefined options match the main [Telerik Theme](slug://themes-overview) and you can see that in action in the [Notification Appearance](https://demos.telerik.com/blazor-ui/notification/appearance) Live Demo.
 
 There are built-in themes for the most common notifications such as Success, Info, Warning, Error, that also come with predefined icons, so you don't have to set them explicitly.
 
diff --git a/components/notification/open-close-hide.md b/components/notification/open-close-hide.md
index 329acb0024..380773b33a 100644
--- a/components/notification/open-close-hide.md
+++ b/components/notification/open-close-hide.md
@@ -29,11 +29,11 @@ You can use it in two ways:
 * [Use Only the Text and ThemeColor Properties](#use-only-the-text-and-themecolor-properties)
 * [Pass a NotificationModel to the Method](#pass-a-notificationmodel-to-the-method)
 
-You can also [show all notifications for your app from a single instance](#show-from-anywhere) so they all [stack together]({%slug notification-stacked-notifications%}) and also stay between page navigations.
+You can also [show all notifications for your app from a single instance](#show-from-anywhere) so they all [stack together](slug://notification-stacked-notifications) and also stay between page navigations.
 
 ### Use Only the Text and ThemeColor Properties
 
-If you do not need to customize the [closing](#close-and-hide) or the icon of the component you can quickly create them by passing only what text and [theme color]({%slug notification-appearance%}#themecolor) should the Notification have.
+If you do not need to customize the [closing](#close-and-hide) or the icon of the component you can quickly create them by passing only what text and [theme color](slug://notification-appearance#themecolor) should the Notification have.
 
 ````RAZOR
 @* At minimum, you can pass a text message and a color to the Show() method *@
@@ -54,7 +54,7 @@ If you do not need to customize the [closing](#close-and-hide) or the icon of th
 
 ### Pass a NotificationModel to the Method
 
-You can pass the entire [NotificationModel]({%slug notification-overview%}#notificationmodel-class-properties) to provide detailed information for the component - whether it should be closable or specify the icon. 
+You can pass the entire [NotificationModel](slug://notification-overview#notificationmodel-class-properties) to provide detailed information for the component - whether it should be closable or specify the icon. 
 
 ````RAZOR
 @* You can pass the entire NotificationModel with all its features for complete control over the message settings *@
@@ -93,7 +93,7 @@ There are two separate ways to close a notification:
 
 ### Automatically Closing a Notification
 
-By default each notification is an automatically closing one. You can define the time it stays visible by adjusting the `CloseAfter` parameter of the [NotificationModel]({%slug notification-overview%}#notificationmodel-class-properties). It defaults to `5000ms`.
+By default each notification is an automatically closing one. You can define the time it stays visible by adjusting the `CloseAfter` parameter of the [NotificationModel](slug://notification-overview#notificationmodel-class-properties). It defaults to `5000ms`.
 
 You can also let the user dismiss a notification message before that timer elapses through a closing button by setting the `Closable` parameter of the `NotificationModel` to `true` (its default value).
 
@@ -207,5 +207,5 @@ To hide all notifications, you use the `HideAll` method. This function enables y
 
 ## See Also
 
-* [Keep Notifications Visible on Hover]({%slug notification-kb-keep-on-hover%})
-* [Notification Overview]({%slug notification-overview%})
+* [Keep Notifications Visible on Hover](slug://notification-kb-keep-on-hover)
+* [Notification Overview](slug://notification-overview)
diff --git a/components/notification/overview.md b/components/notification/overview.md
index 36cda65677..90b45f9110 100644
--- a/components/notification/overview.md
+++ b/components/notification/overview.md
@@ -57,11 +57,11 @@ The Notification component renders a brief message to the user which holds infor
 
 ## Stacked Notifications
 
-Multiple Notifications can stack if they derive from different references. [Read the Stacked Notifications article for more information...]({%slug notification-stacked-notifications%})
+Multiple Notifications can stack if they derive from different references. [Read the Stacked Notifications article for more information...](slug://notification-stacked-notifications)
 
 ## Templates
 
-You can customize the rendering of the Notification by using Templates. To learn more about this feature, refer to the [Notification Templates article]({%slug notification-templates%}).
+You can customize the rendering of the Notification by using Templates. To learn more about this feature, refer to the [Notification Templates article](slug://notification-templates).
 
 ## Notification Parameters
 
@@ -69,9 +69,9 @@ You can customize the rendering of the Notification by using Templates. To learn
 
 | Parameter | Type and Default value | Description |
 |-----------|------------------------|-------------|
-| `Class`  | `string` | The CSS class that will be rendered on the main wrapping element of the Notification component - `<div class="k-notification-container">`. You could use that class to to control things like the size or the z-index of the component. You can find more infomation and examples in the [Appearance]({%slug notification-appearance%}) article. |
-| `OnChange`  | `EventCallback<bool>` |  This event indicates whether the media query string provided to the `Media` parameter matches the current browser size. It fires when it matches, and when it stops matching. See the [Events]({%slug mediaquery-events%}) article for more information.  |
-| `AnimationType`  | `AnimationType` enum <br /> `Fade` | Allows you to customize the animation of the Notifications. You can find more infomation and examples in the [Appearance]({%slug notification-appearance%}) article.  |
+| `Class`  | `string` | The CSS class that will be rendered on the main wrapping element of the Notification component - `<div class="k-notification-container">`. You could use that class to to control things like the size or the z-index of the component. You can find more infomation and examples in the [Appearance](slug://notification-appearance) article. |
+| `OnChange`  | `EventCallback<bool>` |  This event indicates whether the media query string provided to the `Media` parameter matches the current browser size. It fires when it matches, and when it stops matching. See the [Events](slug://mediaquery-events) article for more information.  |
+| `AnimationType`  | `AnimationType` enum <br /> `Fade` | Allows you to customize the animation of the Notifications. You can find more infomation and examples in the [Appearance](slug://notification-appearance) article.  |
 | `AnimationDuration`  | `int` <br /> `300` | Defines the duration of the animation in milliseconds.|
 | `VerticalPosition`  | `NotificationVerticalPosition` enum <br /> `Bottom` | Defines the vertical position of the Notification.|
 | `HorizontalPosition`  | `NotificationHorizontalPosition` enum <br /> `Right` | Defines the horizontal position of the Notification. |
@@ -82,16 +82,16 @@ The `NotificationModel` class is used to add new notifications to the page. You
 
 | Property | Type and Default value | Description |
 |-----------|------------------------|-------------|
-| `ThemeColor`  | `string` | The color of the notification is controlled through this parameter. You can find more infomation and examples in the [Appearance]({%slug notification-appearance%}) article. |
+| `ThemeColor`  | `string` | The color of the notification is controlled through this parameter. You can find more infomation and examples in the [Appearance](slug://notification-appearance) article. |
 | `Closable`  | `bool` <br /> `true` | If set to `true` a close button will appear which will enable the user to close the Notification. If you want the Notification to not close automatically you should set the `Closable` parameter to `true` and the `CloseAfter` to `0`. |
 | `CloseAfter`  | `int` <br /> `5000` | Allows you to configure after how much time the Notification component will close automatically. Set it to `0` to prevent it from closing automatically. |
 | `ShowIcon`  | `bool` <br /> `true` | Allows you to specify whether an icon should appear in the component. |
-| `Icon`  | `string` | Specifies the icon that will render in the component if the `ShowIcon` parameter is set to `true`. You can find more information on adding an icon to a Telerik Component in [Telerik Font Icons article]({%slug common-features-icons%}#icon-namespaces). |
+| `Icon`  | `string` | Specifies the icon that will render in the component if the `ShowIcon` parameter is set to `true`. You can find more information on adding an icon to a Telerik Component in [Telerik Font Icons article](slug://common-features-icons#icon-namespaces). |
 | `Text`  | `string` | The text that will be rendered in the Notification component. |
 
 ### Styling and Appearance
 
-You can customize the appearance and styling of the Notification component by changing the notifications' colors, animation type, size, and stack order. For more information, see the [Notification Appearance]({%slug notification-appearance%}) article.
+You can customize the appearance and styling of the Notification component by changing the notifications' colors, animation type, size, and stack order. For more information, see the [Notification Appearance](slug://notification-appearance) article.
 
 ## Notifications Reference and Methods
 
@@ -120,14 +120,14 @@ To use the Blazor Notification methods, you have to get a reference to the compo
 }
 ````
 
-You can find more information on opening, closing and hiding the Notification in the [Open, Close and Hide]({%slug notification-open-close-hide%}) article.
+You can find more information on opening, closing and hiding the Notification in the [Open, Close and Hide](slug://notification-open-close-hide) article.
 
 ## Next Steps
 
-* [Learn more about the Notification Templates]({%slug notification-templates%})
+* [Learn more about the Notification Templates](slug://notification-templates)
 
 ## See Also
 
 * [Live Demo: Notification](https://demos.telerik.com/blazor-ui/notification/overview)
 * [Notification API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikNotification)
-* [Reuse One Notification Instance]({%slug notification-kb-single-instance%})
+* [Reuse One Notification Instance](slug://notification-kb-single-instance)
diff --git a/components/notification/stacked-notifications.md b/components/notification/stacked-notifications.md
index d94450e7e5..50dca641fb 100644
--- a/components/notification/stacked-notifications.md
+++ b/components/notification/stacked-notifications.md
@@ -46,5 +46,5 @@ When you invoke multiple notifications from the same component reference they wi
 ## See Also
 
   * [Live Demo: Notification Overview](https://demos.telerik.com/blazor-ui/notification/overview)
-  * [Notification Overview]({%slug notification-overview%})
+  * [Notification Overview](slug://notification-overview)
   * [One Notification Instance for All Components Sample Project](https://github.com/telerik/blazor-ui/tree/master/notification/single-instance-per-app)
diff --git a/components/notification/templates.md b/components/notification/templates.md
index 2bdb9a0d91..cdde3e874f 100644
--- a/components/notification/templates.md
+++ b/components/notification/templates.md
@@ -61,7 +61,7 @@ This section gives examples that show how to:
 
 ### Use Different Templates
 
-When you are using different references in order to provide multiple templates the Notifications will not [stack]({%slug notification-stacked-notifications%}).
+When you are using different references in order to provide multiple templates the Notifications will not [stack](slug://notification-stacked-notifications).
 
 ````RAZOR
 @* Use different templates for different content and notifications *@
diff --git a/components/numerictextbox/accessibility/wai-aria-support.md b/components/numerictextbox/accessibility/wai-aria-support.md
index e631d81916..470e0f5da6 100644
--- a/components/numerictextbox/accessibility/wai-aria-support.md
+++ b/components/numerictextbox/accessibility/wai-aria-support.md
@@ -72,4 +72,4 @@ For details on how the NumericTextBox keyboard navigation works, refer to the [B
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/numerictextbox/events.md b/components/numerictextbox/events.md
index 643961f5e2..b808d9d947 100644
--- a/components/numerictextbox/events.md
+++ b/components/numerictextbox/events.md
@@ -126,5 +126,5 @@ Using this event requires one-way binding for the `Value` parameter and manual u
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
diff --git a/components/numerictextbox/overview.md b/components/numerictextbox/overview.md
index 8596547784..9b34ae7b33 100644
--- a/components/numerictextbox/overview.md
+++ b/components/numerictextbox/overview.md
@@ -36,11 +36,11 @@ The Numeric TextBox component is generic, meaning that it takes the type of its
 
 ## Events
 
-The Blazor Numeric TextBox generates events that you can handle and further customize its behavior. [Read more about the Blazor Numeric TextBox events...]({%slug components/numerictextbox/events%}).
+The Blazor Numeric TextBox generates events that you can handle and further customize its behavior. [Read more about the Blazor Numeric TextBox events...](slug://components/numerictextbox/events).
 
 ## Validation
 
-You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...]({%slug common-features/input-validation%}).
+You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...](slug://common-features/input-validation).
 
 ## Custom Format Strings
 
@@ -97,19 +97,19 @@ The Blazor Numeric TextBox allows you to define your desired custom format throu
 | `ShowClearButton` | `bool` | Defines if the user can clear the component value through an **x** button rendered inside the input. |
 | `Step` | `TValue`* <br /> (`1`) | The decimal value with which the component value changes when using the arrows. Must match the `Value` type. |
 | `TabIndex` | `int?` | The `tabindex` attribute of the `<input />` element. Use it to customize the tabbing order on your page. |
-| `ValidateOn` | `ValidationEvent` enum <br/> (`Input`) | The event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs). |
+| `ValidateOn` | `ValidationEvent` enum <br/> (`Input`) | The event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs](slug://common-features/input-validation#validation-modes-for-simple-inputs). |
 | `Value` | `TValue`* | The component value. |
 
 \* `TValue` can be [any numeric type](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/integral-numeric-types), except `nint` and `nuint`. Note that all `TValue` parameters must be of the same type.
 
 ### Styling and Appearance
 
-The following parameters enable you to customize the [appearance]({%slug numerictextbox-appearance%}) of the Blazor Numeric TextBox:
+The following parameters enable you to customize the [appearance](slug://numerictextbox-appearance) of the Blazor Numeric TextBox:
 
 | Attribute | Type and Default Value | Description |
 | --- | --- | --- |
 | `Class` | `string` | The CSS class that will be rendered on the `<span class="k-numerictextbox">` element. |
-| `Width` | `string` | The width of the component in [any supported CSS unit]({%slug common-features/dimensions%}). |
+| `Width` | `string` | The width of the component in [any supported CSS unit](slug://common-features/dimensions). |
 
 >tip To learn more about the appearance, anatomy, and accessibility of the Numeric TextBox, visit the [Progress Design System Kit documentation](https://www.telerik.com/design-system/docs/components/numerictextbox/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 
@@ -140,7 +140,7 @@ The Numeric TextBox has a `FocusAsync` method that enables programmatic focus. T
 
 ## Notes
 
-* If you want to use a currency format, you must specify the culture for your app thread, so .NET knows what symbol to render. If you don't do that, you may see an unexpected/incorrect symbol or format. The Telerik Numeric Textbox uses the thread culture for currency signs and decimal separators (more on [globalization in the Telerik components]({%slug globalization-overview%})).
+* If you want to use a currency format, you must specify the culture for your app thread, so .NET knows what symbol to render. If you don't do that, you may see an unexpected/incorrect symbol or format. The Telerik Numeric Textbox uses the thread culture for currency signs and decimal separators (more on [globalization in the Telerik components](slug://globalization-overview)).
 
 * You may want to match the decimal places available in the `Format` and in the `Decimals` parameters. This will unify the rounding of the numbers when the input is focused and when it is not. For example, if you start with a value `12.3m` and `Step=0.1m` it will render as `12.3` due to the `Math.Round()` behavior in .NET. Changing the value with the spinner icons up and then down will result in `12.30` because the value had had a second decimal digit at some point and that precision is added to the number already.
 
@@ -162,7 +162,7 @@ The Numeric TextBox has a `FocusAsync` method that enables programmatic focus. T
 
 ## Next Steps
 
-* [Using the Numeric Textbox Events]({%slug components/numerictextbox/events%})
+* [Using the Numeric Textbox Events](slug://components/numerictextbox/events)
 
 
 ## See Also
@@ -170,5 +170,5 @@ The Numeric TextBox has a `FocusAsync` method that enables programmatic focus. T
 * [Live Demo: Numeric Textbox](https://demos.telerik.com/blazor-ui/numerictextbox/overview)
 * [Live Demo: Numeric Textbox Validation](https://demos.telerik.com/blazor-ui/numerictextbox/validation)
 * [Live Demo: Numeric Textbox Formats](https://demos.telerik.com/blazor-ui/numerictextbox/formats)
-* [Input Validation]({%slug common-features/input-validation%})
+* [Input Validation](slug://common-features/input-validation)
 * [NumericTextBox API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikNumericTextBox-1)
diff --git a/components/pager/accessibility/wai-aria-support.md b/components/pager/accessibility/wai-aria-support.md
index db24a7c943..f79718ace5 100644
--- a/components/pager/accessibility/wai-aria-support.md
+++ b/components/pager/accessibility/wai-aria-support.md
@@ -82,4 +82,4 @@ For details on how the Pager keyboard navigation works, refer to the [Blazor Pag
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/pager/events.md b/components/pager/events.md
index 1a59859ee4..1ee825fff4 100644
--- a/components/pager/events.md
+++ b/components/pager/events.md
@@ -17,7 +17,7 @@ This article explains the events available in the Telerik Pager for Blazor:
 
 ## PageChanged
 
-The `PageChanged` event fires when a new page is selected. You can use it to implement [load on demand]({%slug pager-overview%}#load-on-demand).
+The `PageChanged` event fires when a new page is selected. You can use it to implement [load on demand](slug://pager-overview#load-on-demand).
 
 Make sure to update the current page index when using the event.
 
@@ -86,4 +86,4 @@ Make sure to update the current page size when using the event.
 
 ## See Also
 
-* [Pager Overview]({%slug pager-overview%})
+* [Pager Overview](slug://pager-overview)
diff --git a/components/pager/overview.md b/components/pager/overview.md
index 92a0d7a4e8..c924d08294 100644
--- a/components/pager/overview.md
+++ b/components/pager/overview.md
@@ -12,7 +12,7 @@ position: 1
 
 The <a href="https://www.telerik.com/blazor-ui/pager" target="_blank">Blazor Pager component</a> will enable you to add paging for your data in a Blazor application. We use it in components like the Grid and ListView, and you can also use it for your own templates and data as a standalone component.
 
-The Pager provides the UI for the user to change the page. To the developer, it provides the page index so you can render only the relevant data portion and an [event]({%slug pager-events%}) that you can use to implement [load on demand](#load-on-demand).
+The Pager provides the UI for the user to change the page. To the developer, it provides the page index so you can render only the relevant data portion and an [event](slug://pager-events) that you can use to implement [load on demand](#load-on-demand).
 
 ## Creating Blazor Pager
 
@@ -70,7 +70,7 @@ The Pager provides the UI for the user to change the page. To the developer, it
 
 ## Events
 
-The Blazor Pager exposes PageChanged and PageSizeChanged events that you can handle and further customize its behavior. [Read more about the Blazor Pager events]({%slug pager-events%}).
+The Blazor Pager exposes PageChanged and PageSizeChanged events that you can handle and further customize its behavior. [Read more about the Blazor Pager events](slug://pager-events).
 
 ## Pager Parameters
 
@@ -98,7 +98,7 @@ The following parameters enable you to customize the appearance of the Blazor Pa
 | --- | --- | --- |
 | `Size` | `Telerik.Blazor.ThemeConstants.Pager.Size` | Adjust the size of the Pager |
 
-You can find more information for customizing the Pager appearance in the [Appearance article]({%slug pager-appearance%}).
+You can find more information for customizing the Pager appearance in the [Appearance article](slug://pager-appearance).
 
 ## Examples
 
@@ -211,10 +211,10 @@ The `Page` parameter supports two-way binding so it can respond to changes from
 
 ## Next Steps
 
-* [Explore the Pager Events]({%slug pager-events%})
+* [Explore the Pager Events](slug://pager-events)
 
 ## See Also
 
 * [Live Pager Demos](https://demos.telerik.com/blazor-ui/pager/overview)
 * [Pager API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikPager)
-* [How to increase the pager dropdownlist width]({%slug pager-kb-dropdown-width%})
+* [How to increase the pager dropdownlist width](slug://pager-kb-dropdown-width)
diff --git a/components/panelbar/accessibility/wai-aria-support.md b/components/panelbar/accessibility/wai-aria-support.md
index aba3fff52a..ee79d13d49 100644
--- a/components/panelbar/accessibility/wai-aria-support.md
+++ b/components/panelbar/accessibility/wai-aria-support.md
@@ -68,4 +68,4 @@ For details on how the PanelBar keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/panelbar/data-binding/flat-data.md b/components/panelbar/data-binding/flat-data.md
index 6832ea4a6f..627be0076f 100644
--- a/components/panelbar/data-binding/flat-data.md
+++ b/components/panelbar/data-binding/flat-data.md
@@ -102,7 +102,7 @@ You must also provide the correct value for the `HasChildren` field - for items
 
 ## See Also
   
-  * [PanelBar Data Binding Overview]({%slug panelbar-data-binding-overview%})
-  * [Binding to Hierarchical Data]({%slug panelbar-data-binding-hierarchical%})
+  * [PanelBar Data Binding Overview](slug://panelbar-data-binding-overview)
+  * [Binding to Hierarchical Data](slug://panelbar-data-binding-hierarchical)
   * [Live Demo: PanelBar Flat Data](https://demos.telerik.com/blazor-ui/panelbar/flat-data)
 
diff --git a/components/panelbar/data-binding/hierarchical-data.md b/components/panelbar/data-binding/hierarchical-data.md
index 65ac0126dd..7e742fa423 100644
--- a/components/panelbar/data-binding/hierarchical-data.md
+++ b/components/panelbar/data-binding/hierarchical-data.md
@@ -104,7 +104,7 @@ This approach of providing nodes lets you gather separate collections of data an
 
 ## See Also
 
-  * [PanelBar Data Binding Basics]({%slug panelbar-data-binding-overview%})
+  * [PanelBar Data Binding Basics](slug://panelbar-data-binding-overview)
   * [Live Demo: PanelBar Hierarchical Data](https://demos.telerik.com/blazor-ui/panelbar/hierarchical-data)
-  * [Binding to Flat Data]({%slug panelbar-data-binding-flat%})
+  * [Binding to Flat Data](slug://panelbar-data-binding-flat)
 
diff --git a/components/panelbar/data-binding/overview.md b/components/panelbar/data-binding/overview.md
index 9eb5739340..2b7462212e 100644
--- a/components/panelbar/data-binding/overview.md
+++ b/components/panelbar/data-binding/overview.md
@@ -21,8 +21,8 @@ First, review:
 
 There are two modes of providing data to a PanelBar, and they both use the items' features. Once you are familiar with the current article, choose the data binding mode you wish to use:
 
-* [Flat data]({%slug panelbar-data-binding-flat%}) - a single collection of items with defined parent-child relationships.
-* [Hierarchical data]({%slug panelbar-data-binding-hierarchical%}) - separate collections of items and their child items.
+* [Flat data](slug://panelbar-data-binding-flat) - a single collection of items with defined parent-child relationships.
+* [Hierarchical data](slug://panelbar-data-binding-hierarchical) - separate collections of items and their child items.
 
 ## PanelBar Item Features
 
@@ -38,9 +38,9 @@ The PanelBar items provide the following features that you control through the c
 
 * `Text` - `string` - the text that will be shown on the item.
 
-* `DisabledField` - `string` - whether the item is disabled. If an item is disabled it will not be clickable and cannot be expanded by the user. The [`OnItemClick`]({%slug panelbar-events%}#onitemclick) will not be fired if the item is disabled.
+* `DisabledField` - `string` - whether the item is disabled. If an item is disabled it will not be clickable and cannot be expanded by the user. The [`OnItemClick`](slug://panelbar-events#onitemclick) will not be fired if the item is disabled.
 
-* `Icon` - The [Telerik Font or SVG icon]({%slug common-features-icons%}) that will be rendered in the item. Read more in the [Icons article]({%slug panelbar-icons%}).
+* `Icon` - The [Telerik Font or SVG icon](slug://common-features-icons) that will be rendered in the item. Read more in the [Icons article](slug://panelbar-icons).
 
 * `Url` - the view the item will navigate to by generating a link.
 
@@ -184,9 +184,9 @@ The following **Example** shows how to define simple binding to match item field
 
 ### Multiple Level Bindings
 
-You can define different binding settings for the different levels of nodes in the PanelBar. With this, the children of a node can consume a different field than their parent, and this may make your application more flexible. If you use [hierarchical data binding]({%slug panelbar-data-binding-hierarchical%}), the children can even use a different field or model from their parent.
+You can define different binding settings for the different levels of nodes in the PanelBar. With this, the children of a node can consume a different field than their parent, and this may make your application more flexible. If you use [hierarchical data binding](slug://panelbar-data-binding-hierarchical), the children can even use a different field or model from their parent.
 
-This also allows you to define different [header and content templates]({%slug panelbar-templates%}) for different levels.
+This also allows you to define different [header and content templates](slug://panelbar-templates) for different levels.
 
 To define multiple bindings, add multiple `PanelBarBinding` tags and define their `Level`.
 
@@ -297,11 +297,11 @@ If a certain level does not have an explicit data binding tag, it will use the d
 }
 ````
 
->note To improve performance when using [flat data binding]({%slug panelbar-data-binding-flat%}), all the bindings for all the levels should use the same `ParentIdField`.
+>note To improve performance when using [flat data binding](slug://panelbar-data-binding-flat), all the bindings for all the levels should use the same `ParentIdField`.
 
 ## See Also
 
-  * [Binding to Flat Data]({%slug panelbar-data-binding-flat%})
-  * [Binding to Hierarchical Data]({%slug panelbar-data-binding-hierarchical%})
+  * [Binding to Flat Data](slug://panelbar-data-binding-flat)
+  * [Binding to Hierarchical Data](slug://panelbar-data-binding-hierarchical)
   * [Live Demo: PanelBar Flat Data](https://demos.telerik.com/blazor-ui/panelbar/flat-data)
   * [Live Demo: PanelBar Hierarchical Data](https://demos.telerik.com/blazor-ui/panelbar/hierarchical-data)
diff --git a/components/panelbar/events.md b/components/panelbar/events.md
index 187f29f8b1..153756fab9 100644
--- a/components/panelbar/events.md
+++ b/components/panelbar/events.md
@@ -405,4 +405,4 @@ Both event arguments expose an `Item` and `IsCancelled` properties. To cancel ea
 
 ## See Also
 
-  * [PanelBar Overview]({%slug panelbar-overview%})
+  * [PanelBar Overview](slug://panelbar-overview)
diff --git a/components/panelbar/expanded-items.md b/components/panelbar/expanded-items.md
index 62931629d9..eefe7dc947 100644
--- a/components/panelbar/expanded-items.md
+++ b/components/panelbar/expanded-items.md
@@ -110,7 +110,7 @@ You can use the ExpandMode to allow the user to expand one or more items at a ti
 
 The PanelBar lets the user expand an item. You can also pre-expand a desired item.
 
-To use the item expansion, use the `ExpandedItems` parameter. It allows two-way binding (@bind-ExpandedItems) and one-way binding + [ExpandedItemsChanged]({%slug panelbar-events%}#expandeditemschanged) event.
+To use the item expansion, use the `ExpandedItems` parameter. It allows two-way binding (@bind-ExpandedItems) and one-way binding + [ExpandedItemsChanged](slug://panelbar-events#expandeditemschanged) event.
 
 The ExpandedItems collection is of type `IEnumerable<object>`.
 
@@ -306,6 +306,6 @@ If the [ExpandMode](#expandmode) is set to `Single` the ExpandedItems collection
 
 ## See Also
 
-* [PanelBar Overview]({%slug panelbar-overview%})
-* [PanelBar Data Binding]({%slug panelbar-data-binding-overview%})
-* [PanelBar Events]({%slug panelbar-events%})
+* [PanelBar Overview](slug://panelbar-overview)
+* [PanelBar Data Binding](slug://panelbar-data-binding-overview)
+* [PanelBar Events](slug://panelbar-events)
diff --git a/components/panelbar/icons.md b/components/panelbar/icons.md
index b841af0a84..a11b826b45 100644
--- a/components/panelbar/icons.md
+++ b/components/panelbar/icons.md
@@ -10,7 +10,7 @@ position: 15
 
 # PanelBar Icons
 
-You can add [Telerik Font or SVG icons]({%slug common-features-icons%}) to the PanelBar items. The component also supports custom icons.
+You can add [Telerik Font or SVG icons](slug://common-features-icons) to the PanelBar items. The component also supports custom icons.
 
 To use PanelBar item icons, define a property in the component model class and assign the property name to the `IconField` parameter of the PanelBar.
 
@@ -124,5 +124,5 @@ If the icon property name in the PanelBar model is `Icon`, there is no need to s
 
 ## See Also
 
-* [PanelBar Overview]({%slug panelbar-overview%})
+* [PanelBar Overview](slug://panelbar-overview)
 * [Live Demos: PanelBar](https://demos.telerik.com/blazor-ui/panelbar/overview)
diff --git a/components/panelbar/navigation.md b/components/panelbar/navigation.md
index 7f599b0261..d24460fd87 100644
--- a/components/panelbar/navigation.md
+++ b/components/panelbar/navigation.md
@@ -10,7 +10,7 @@ position: 5
 
 # PanelBar for Navigation
 
-The PanelBar can be used to navigate between different pages in the application. It can generate the needed links for you through its `UrlField` when [data binding]({%slug panelbar-data-binding-overview%}).
+The PanelBar can be used to navigate between different pages in the application. It can generate the needed links for you through its `UrlField` when [data binding](slug://panelbar-data-binding-overview).
 
 To use the PanelBar for navigating between pages:
 
@@ -104,5 +104,5 @@ To use the PanelBar for navigating between pages:
 
 ## See Also
 
-* [PanelBar Overview]({%slug panelbar-overview%})
-* [PanelBar Data Binding]({%slug panelbar-data-binding-overview%})
+* [PanelBar Overview](slug://panelbar-overview)
+* [PanelBar Data Binding](slug://panelbar-data-binding-overview)
diff --git a/components/panelbar/overview.md b/components/panelbar/overview.md
index f88d482f76..0945fe3af9 100644
--- a/components/panelbar/overview.md
+++ b/components/panelbar/overview.md
@@ -10,13 +10,13 @@ position: 0
 
 # Blazor PanelBar Overview
 
-The <a href="https://www.telerik.com/blazor-ui/panelbar" target="_blank">Blazor PanelBar component</a> displays [data]({%slug panelbar-data-binding-overview%}) ([flat]({%slug panelbar-data-binding-flat%}) or [hierarchical]({%slug panelbar-data-binding-hierarchical%})) in an accordion type structure. In addition to built-in [navigation capabilities]({%slug panelbar-navigation%}), you can navigate through the items and their children, define [templates]({%slug panelbar-templates%}), render text and [icons/images]({%slug panelbar-icons%}), and respond to [events]({%slug panelbar-events%}).
+The <a href="https://www.telerik.com/blazor-ui/panelbar" target="_blank">Blazor PanelBar component</a> displays [data](slug://panelbar-data-binding-overview) ([flat](slug://panelbar-data-binding-flat) or [hierarchical](slug://panelbar-data-binding-hierarchical)) in an accordion type structure. In addition to built-in [navigation capabilities](slug://panelbar-navigation), you can navigate through the items and their children, define [templates](slug://panelbar-templates), render text and [icons/images](slug://panelbar-icons), and respond to [events](slug://panelbar-events).
 
  
 ## Creating Blazor PanelBar
 
 1. Add the `TelerikPanelBar` tag
-1. Populate the `Data` property with the collection of items that you want to appear in the PanelBar. The component will automatically recognize property names like `Id`, `ParentId`, `Text` and a few others. Otherwise, [use bindings to configure custom property names]({%slug panelbar-data-binding-overview%}#data-bindings).
+1. Populate the `Data` property with the collection of items that you want to appear in the PanelBar. The component will automatically recognize property names like `Id`, `ParentId`, `Text` and a few others. Otherwise, [use bindings to configure custom property names](slug://panelbar-data-binding-overview#data-bindings).
 
 >caption Basic PanelBar with hierarchical data binding
 
@@ -112,7 +112,7 @@ The <a href="https://www.telerik.com/blazor-ui/panelbar" target="_blank">Blazor
 
 ## Data Binding
 
-To show any items, the Blazor PanelBar requires a data source that you can provide through the `Data` property. The PanelBar allows you to display the items both as flat data and hierarchically. [Read more about the Blazor PanelBar data binding...]({%slug panelbar-data-binding-overview%})
+To show any items, the Blazor PanelBar requires a data source that you can provide through the `Data` property. The PanelBar allows you to display the items both as flat data and hierarchically. [Read more about the Blazor PanelBar data binding...](slug://panelbar-data-binding-overview)
 
 ## Elements of a PanelBar Item
 
@@ -124,19 +124,19 @@ The `Header` contains the Text of the corresponding data item (model). The `Cont
 
 ## Templates
 
-The PanelBar allows customizing of its item elements. Use [Header Template]({%slug panelbar-templates-header%}) and [Content Template]({%slug panelbar-templates-content%}) to override the default rendering. A `ContentTemplate` displays like a child item. It is rendered only for the items, which have no children.
+The PanelBar allows customizing of its item elements. Use [Header Template](slug://panelbar-templates-header) and [Content Template](slug://panelbar-templates-content) to override the default rendering. A `ContentTemplate` displays like a child item. It is rendered only for the items, which have no children.
 
 ## Navigation
 
-The PanelBar can be used to navigate between different pages in the application. [Read more about the Blazor PanelBar navigation...]({%slug panelbar-navigation%})
+The PanelBar can be used to navigate between different pages in the application. [Read more about the Blazor PanelBar navigation...](slug://panelbar-navigation)
 
 ## Icons
 
-To illustrate the purpose of each item, the Blazor PanelBar allows you to add images, icon classes, or font icons. [Read more about the Blazor PanelBar icons...]({%slug panelbar-icons%})
+To illustrate the purpose of each item, the Blazor PanelBar allows you to add images, icon classes, or font icons. [Read more about the Blazor PanelBar icons...](slug://panelbar-icons)
 
 ## Events
 
-The Blazor PanelBar generates events that you can handle to respond to the user action. [Read more about the Blazor PanelBar events...]({%slug panelbar-events%})
+The Blazor PanelBar generates events that you can handle to respond to the user action. [Read more about the Blazor PanelBar events...](slug://panelbar-events)
 
 ## PanelBar Parameters
 
@@ -147,20 +147,20 @@ The following table lists PanelBar parameters, which are not related to other fe
 | Parameter | Type and Default Value | Description |
 |---|---|---|
 | `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the component.|
-| `ExpandedItems` | `IEnumerable<Object>` | A collection of the expanded PanelBar items. Supports two-way binding. Read more in the [ExpandedItems]({%slug panelbar-expand-items%}) article. |
-| `ExpandMode` | `PanelBarExpandMode` enum <br/> (`PanelBarExpandMode.Multiple`) | Whether the PanelBar will allow single or multiple items to be expanded at a time. Read more in the [ExpandMode]({%slug panelbar-expand-items%}#expandmode) section. |
+| `ExpandedItems` | `IEnumerable<Object>` | A collection of the expanded PanelBar items. Supports two-way binding. Read more in the [ExpandedItems](slug://panelbar-expand-items) article. |
+| `ExpandMode` | `PanelBarExpandMode` enum <br/> (`PanelBarExpandMode.Multiple`) | Whether the PanelBar will allow single or multiple items to be expanded at a time. Read more in the [ExpandMode](slug://panelbar-expand-items#expandmode) section. |
 
 ## PanelBar Reference and Methods
 
 To execute PanelBar methods, obtain reference to the component instance via `@ref`.
 
-The PanelBar is a generic component. Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters]({%slug common-features-data-binding-overview%}#component-type).
+The PanelBar is a generic component. Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters](slug://common-features-data-binding-overview#component-type).
 
 The table below lists the PanelBar methods. Also consult the [PanelBar API](/blazor-ui/api/Telerik.Blazor.Components.TelerikPanelBar).
 
 | Method | Description |
 | --- | --- |
-| `Rebind` | [Refreshes the component data]({%slug panelbar-refresh-data%}#rebind-method). |
+| `Rebind` | [Refreshes the component data](slug://panelbar-refresh-data#rebind-method). |
 
 <div class="skip-repl"></div>
 ````RAZOR
@@ -174,12 +174,12 @@ The table below lists the PanelBar methods. Also consult the [PanelBar API](/bla
 
 ## Next Steps
 
-* [Binding PanelBar PanelBar to Data]({%slug panelbar-data-binding-overview%})
-* [Using the PanelBar to Navigate between Pages]({%slug panelbar-navigation%})
+* [Binding PanelBar PanelBar to Data](slug://panelbar-data-binding-overview)
+* [Using the PanelBar to Navigate between Pages](slug://panelbar-navigation)
 
 
 ## See Also
 
-* [Data Binding a PanelBar]({%slug panelbar-data-binding-overview%})
+* [Data Binding a PanelBar](slug://panelbar-data-binding-overview)
 * [Live Demo: PanelBar](https://demos.telerik.com/blazor-ui/panelbar/overview)
 * [PanelBar API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikPanelBar)
diff --git a/components/panelbar/refresh-data.md b/components/panelbar/refresh-data.md
index 2e53c10c15..b4aab7bdb7 100644
--- a/components/panelbar/refresh-data.md
+++ b/components/panelbar/refresh-data.md
@@ -367,6 +367,6 @@ In this article:
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
\ No newline at end of file
diff --git a/components/panelbar/templates/content.md b/components/panelbar/templates/content.md
index a1a18c6d98..f5e7f842b9 100644
--- a/components/panelbar/templates/content.md
+++ b/components/panelbar/templates/content.md
@@ -15,7 +15,7 @@ You can control and customize the rendering of the content items in the PanelBar
 * The `ContentTemplate` is defined under the `PanelBarBinding` tag.
 * It provides a `context` object that you can cast to the type, which the PanelBar is bound to.
 * The template can include other Razor components or executable code.
-* Similar to [`PanelBarBinding`s]({%slug panelbar-data-binding-overview%}), there can be **one** `ContentTemplate` for all items at the same level. If the content of these items should be different, use conditional statements inside the template.
+* Similar to [`PanelBarBinding`s](slug://panelbar-data-binding-overview), there can be **one** `ContentTemplate` for all items at the same level. If the content of these items should be different, use conditional statements inside the template.
 * A `ContentTemplate` displays like a child item. It is rendered only for the items, which have no children.
 
 >caption Use ContentTemplate to customize the content items
@@ -110,5 +110,5 @@ Without a Level, the ContentTemplate will be applied to all items that have no c
 
 ## See Also
 
-  * [Data Binding a PanelBar]({%slug panelbar-data-binding-overview%})
+  * [Data Binding a PanelBar](slug://panelbar-data-binding-overview)
   * [Live Demo: PanelBar](https://demos.telerik.com/blazor-ui/panelbar/overview)
diff --git a/components/panelbar/templates/header.md b/components/panelbar/templates/header.md
index 9af453e665..b3d2cc8d2d 100644
--- a/components/panelbar/templates/header.md
+++ b/components/panelbar/templates/header.md
@@ -125,5 +125,5 @@ If no levels are defined the `HeaderTemplate` will apply to the entire data.
 
 ## See Also
 
-  * [Data Binding a PanelBar]({%slug panelbar-data-binding-overview%})
+  * [Data Binding a PanelBar](slug://panelbar-data-binding-overview)
   * [Live Demo: PanelBar](https://demos.telerik.com/blazor-ui/panelbar/overview)
diff --git a/components/panelbar/templates/overview.md b/components/panelbar/templates/overview.md
index 4ad8b672ec..f21b44c8d2 100644
--- a/components/panelbar/templates/overview.md
+++ b/components/panelbar/templates/overview.md
@@ -14,12 +14,12 @@ The PanelBar component allows you to define custom templates for both the parent
 
 The PanelBar can use templates for:
 
-* You can control the rendering of the [Header items]({%slug panelbar-overview%}#elements-of-a-panelbar-item) by using the [HeaderTemplate]({%slug panelbar-templates-header%})
+* You can control the rendering of the [Header items](slug://panelbar-overview#elements-of-a-panelbar-item) by using the [HeaderTemplate](slug://panelbar-templates-header)
 
-* You can control the rendering of the [Content items]({%slug panelbar-overview%}#elements-of-a-panelbar-item) by using the [ContentTemplate]({%slug panelbar-templates-content%})
+* You can control the rendering of the [Content items](slug://panelbar-overview#elements-of-a-panelbar-item) by using the [ContentTemplate](slug://panelbar-templates-content)
 
 
 ## See Also
 
-  * [Data Binding a PanelBar]({%slug panelbar-data-binding-overview%})
+  * [Data Binding a PanelBar](slug://panelbar-data-binding-overview)
   * [Live Demo: PanelBar](https://demos.telerik.com/blazor-ui/panelbar/overview)
diff --git a/components/pdfviewer/accessibility/wai-aria-support.md b/components/pdfviewer/accessibility/wai-aria-support.md
index 3875ce9063..929fd7e8fd 100644
--- a/components/pdfviewer/accessibility/wai-aria-support.md
+++ b/components/pdfviewer/accessibility/wai-aria-support.md
@@ -64,9 +64,9 @@ The PDF Viewer has been tested with the following screen readers and browsers co
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor PDFViewer Demos](https://demos.telerik.com/blazor-ui/pdfviewer/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/pdfviewer/annotations.md b/components/pdfviewer/annotations.md
index c3fbac09cc..95af3bfcfd 100644
--- a/components/pdfviewer/annotations.md
+++ b/components/pdfviewer/annotations.md
@@ -14,7 +14,7 @@ The PdfViewer supports a set of annotation types to enhance PDF documents. For e
 
 The PdfViewer creates a dedicated layer for the annotations and includes them when downloading or printing the file. If the user opens a file with annotations, they can edit only the annotations that were added using the PdfViewer `Annotations` tool. The PdfViewer does not support editing annotations added in a different PDF editor.
 
-To add and manage the annotations, the user can click on the dedicated button in the [PdfViewer Toolbar]({%slug pdfviewer-toolbar%}). It opens an annotations bar with the available annotation types.
+To add and manage the annotations, the user can click on the dedicated button in the [PdfViewer Toolbar](slug://pdfviewer-toolbar). It opens an annotations bar with the available annotation types.
 
 ## Supported Annotations
 
@@ -31,7 +31,7 @@ The PdfViewer provides the following annotation types:
 
 **To manage the annotations the user should:**
 
-1. Click on the `Annotations` tool in the [Toolbar]({%slug pdfviewer-toolbar%}) to open the Annotations bar with the available annotation types.
+1. Click on the `Annotations` tool in the [Toolbar](slug://pdfviewer-toolbar) to open the Annotations bar with the available annotation types.
 1. Click the desired annotation type to toggle it. You need to first "turn on" the annotation tool to add or edit annotations of the corresponding type. If none of the annotation tools are enabled, the PdfViewer will not allow interacting with the document to create or edit annotations.
 
 **From this point the user can:**
@@ -45,9 +45,9 @@ The PdfViewer provides the following annotation types:
 
 ## Disabling Annotations
 
-The Annotations tool is included in the [Toolbar]({%slug pdfviewer-toolbar%}) by default. To prevent users from creating annotations, you can [configure the Toolbar and not include the `PdfViewerToolBarAnnotationsTool`]({%slug pdfviewer-toolbar%}#toolbar-configuration).
+The Annotations tool is included in the [Toolbar](slug://pdfviewer-toolbar) by default. To prevent users from creating annotations, you can [configure the Toolbar and not include the `PdfViewerToolBarAnnotationsTool`](slug://pdfviewer-toolbar#toolbar-configuration).
 
 ## See Also
 
 * [PdfViewer Live Demo](https://demos.telerik.com/blazor-ui/pdfviewer/overview)
-* [PdfViewer Toolbar]({%slug pdfviewer-toolbar%})
\ No newline at end of file
+* [PdfViewer Toolbar](slug://pdfviewer-toolbar)
\ No newline at end of file
diff --git a/components/pdfviewer/events.md b/components/pdfviewer/events.md
index c41e12ff72..37ede7512f 100644
--- a/components/pdfviewer/events.md
+++ b/components/pdfviewer/events.md
@@ -20,7 +20,7 @@ This article describes the [Blazor PDF Viewer](https://demos.telerik.com/blazor-
 
 ## OnDownload
 
-The `OnDownload` event fires when the user clicks on the Download button in the [PDF Viewer toolbar]({%slug pdfviewer-toolbar%}).
+The `OnDownload` event fires when the user clicks on the Download button in the [PDF Viewer toolbar](slug://pdfviewer-toolbar).
 
 The event handler receives an argument of type [`PdfViewerDownloadEventArgs`](/blazor-ui/api/Telerik.Blazor.Components.PdfViewerDownloadEventArgs). The event is cancellable and allows the application to set a name of the downloaded file. Do not add the `.pdf` file extension - the component will do that. The default name of the downloaded file is `Document.pdf`. See the [example below](#example).
 
@@ -34,9 +34,9 @@ The event handler receives an argument of type [`PdfViewerErrorEventArgs`](/blaz
 
 ## OnOpen
 
-The `OnOpen` event fires when the user selects a file to open from the [PDF Viewer toolbar]({%slug pdfviewer-toolbar%}).
+The `OnOpen` event fires when the user selects a file to open from the [PDF Viewer toolbar](slug://pdfviewer-toolbar).
 
-The event handler receives an argument of type [`PdfViewerOpenEventArgs`](/blazor-ui/api/Telerik.Blazor.Components.PdfViewerOpenEventArgs). The event is cancellable and allows the application to obtain the PDF file name, size and contents as a `Stream`. To read the `Stream`, you may need to [increase the maximum SignalR message size]({%slug pdfviewer-overview%}#large-file-support).
+The event handler receives an argument of type [`PdfViewerOpenEventArgs`](/blazor-ui/api/Telerik.Blazor.Components.PdfViewerOpenEventArgs). The event is cancellable and allows the application to obtain the PDF file name, size and contents as a `Stream`. To read the `Stream`, you may need to [increase the maximum SignalR message size](slug://pdfviewer-overview#large-file-support).
 
 Using `OnOpen` is *not* required. Users can open local files from their devices without this handler. See the [example below](#example).
 
@@ -126,7 +126,7 @@ The event handler receives the new zoom level as an argument of type `decimal`.
 
 ## Next Steps
 
-* [Customize the PDF Viewer toolbar]({%slug pdfviewer-toolbar%})
+* [Customize the PDF Viewer toolbar](slug://pdfviewer-toolbar)
 
 
 ## See Also
diff --git a/components/pdfviewer/overview.md b/components/pdfviewer/overview.md
index 0b35482b53..4e594614a1 100644
--- a/components/pdfviewer/overview.md
+++ b/components/pdfviewer/overview.md
@@ -20,7 +20,7 @@ To use a Telerik [Blazor PDF Viewer](https://demos.telerik.com/blazor-ui/pdfview
 1. Add the `TelerikPdfViewer` tag.
 2. Set the `Data` parameter to a byte array (`byte[]`) that holds the PDF file contents.
 3. If you are developing a Blazor **Server** app, [increase the maximum SignalR message size](#large-file-support).
-4. (optional) Subscribe to the [PDF Viewer's events]({%slug pdfviewer-events%}). For example, use the `OnDownload` event to set the name of the downloaded file.
+4. (optional) Subscribe to the [PDF Viewer's events](slug://pdfviewer-events). For example, use the `OnDownload` event to set the name of the downloaded file.
 5. (optional) Set [`Width` or `Height`](#pdfviewer-parameters) for the component.
 
 >caption Basic Blazor PDF Viewer
@@ -53,7 +53,7 @@ To use a Telerik [Blazor PDF Viewer](https://demos.telerik.com/blazor-ui/pdfview
 
 ## Toolbar
 
-The [PdfViewer toolbar can render built-in and custom tools]({%slug pdfviewer-toolbar%}). The default tools enable built-in features such as:
+The [PdfViewer toolbar can render built-in and custom tools](slug://pdfviewer-toolbar). The default tools enable built-in features such as:
 
 * Page, zoom and pan documents
 * Search and select text
@@ -61,16 +61,16 @@ The [PdfViewer toolbar can render built-in and custom tools]({%slug pdfviewer-to
 
 ## Annotations
 
-The PdfViewer provides a built-in option for creating and editing annotations. Explore the [available annotation types and how to work with them]({%slug pdfviewer-annotations%}).
+The PdfViewer provides a built-in option for creating and editing annotations. Explore the [available annotation types and how to work with them](slug://pdfviewer-annotations).
 
 ## Large File Support
 
 In Blazor **Server** apps, the PDF Viewer uses the **SignalR WebSocket** to:
 
 * Open PDF files from the server and send them to the browser.
-* Read the PDF file `Stream` from the user device in the [`OnOpen` event handler]({%slug pdfviewer-events%}#onopen). The PDF Viewer uses internally a [FileSelect component]({%slug fileselect-overview%}) to get the user file.
+* Read the PDF file `Stream` from the user device in the [`OnOpen` event handler](slug://pdfviewer-events#onopen). The PDF Viewer uses internally a [FileSelect component](slug://fileselect-overview) to get the user file.
 
-The SignalR WebSocket has a default maximum message size of **32 KB**. To work with larger files in the above two scenarios, [increase the max WebSocket message size for the Blazor application]({%slug common-kb-increase-signalr-max-message-size%}).
+The SignalR WebSocket has a default maximum message size of **32 KB**. To work with larger files in the above two scenarios, [increase the max WebSocket message size for the Blazor application](slug://common-kb-increase-signalr-max-message-size).
 
 
 ## PdfViewer Parameters
@@ -81,14 +81,14 @@ The table below lists the PDF Viewer parameters. Also check the [PDF Viewer API
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | An additional CSS class for the `<div class="k-pdf-viewer">` element. Use it to [customize the component styles and override the theme]({%slug themes-override%}). |
+| `Class` | `string` | An additional CSS class for the `<div class="k-pdf-viewer">` element. Use it to [customize the component styles and override the theme](slug://themes-override). |
 | `Data` | `byte[]` | The source of the currently displayed PDF file. |
 | `EnableLoaderContainer` | `bool` <br /> (`true`) | Determines if the PDF Viewer will show a loading animation during opening, downloading or zooming a PDF file. |
-| `Height` | `string` | The PdfViewer height as a [CSS length value]({%slug common-features/dimensions%}). If not set, the component will expand vertically, based on the loaded file. `Height` is required for the component paging and scrolling to work. |
+| `Height` | `string` | The PdfViewer height as a [CSS length value](slug://common-features/dimensions). If not set, the component will expand vertically, based on the loaded file. `Height` is required for the component paging and scrolling to work. |
 | `MaxZoom` | `decimal` <br /> (`4m`) | The largest possible zoom level. The default value allows zooming in 4 times (400%). |
 | `MinZoom` | `decimal` <br /> (`0.5m`) | The smallest possible zoom level. The default value allows zooming out to 50%. |
-| `Width` | `string` | The PdfViewer width as a [CSS length value]({%slug common-features/dimensions%}). If not set, the component will expand horizontally to fill its parent. |
-| `Zoom` | `decimal` <br /> (`1.25m`) | The current zoom level. Use the parameter with two-way binding or with a [`ZoomChanged` event handler]({%slug pdfviewer-events%}#zoomchanged). |
+| `Width` | `string` | The PdfViewer width as a [CSS length value](slug://common-features/dimensions). If not set, the component will expand horizontally to fill its parent. |
+| `Zoom` | `decimal` <br /> (`1.25m`) | The current zoom level. Use the parameter with two-way binding or with a [`ZoomChanged` event handler](slug://pdfviewer-events#zoomchanged). |
 | `ZoomRate` | `decimal` <br /> (`0.25m`) | The zoom level change that is used by the zoom in and zoom out buttons. |
 
 
@@ -98,8 +98,8 @@ The PdfViewer exposes methods for programmatic operation. To use them, define a
 
 | Method | Description |
 | --- | --- |
-| `Print` | Prints the loaded PDF document as an alternative to the [built-in Print button in the PDF Viewer toolbar]({%slug pdfviewer-toolbar%}#built-in-tools). |
-| `Rebind` | Refreshes the PDF Viewer and ensures it is displaying the latest file `Data`. [`Rebind` is necessary when the Blazor framework cannot re-render components automatically]({%slug common-features-data-binding-overview%}#refresh-data). |
+| `Print` | Prints the loaded PDF document as an alternative to the [built-in Print button in the PDF Viewer toolbar](slug://pdfviewer-toolbar#built-in-tools). |
+| `Rebind` | Refreshes the PDF Viewer and ensures it is displaying the latest file `Data`. [`Rebind` is necessary when the Blazor framework cannot re-render components automatically](slug://common-features-data-binding-overview#refresh-data). |
 
 >caption PDF Viewer reference and method usage
 
@@ -157,8 +157,8 @@ The PdfViewer exposes methods for programmatic operation. To use them, define a
 
 ## Next Steps
 
-* [Customize the PDF Viewer toolbar]({%slug pdfviewer-toolbar%})
-* [Handle PDF Viewer events]({%slug pdfviewer-events%})
+* [Customize the PDF Viewer toolbar](slug://pdfviewer-toolbar)
+* [Handle PDF Viewer events](slug://pdfviewer-events)
 
 
 ## See Also
diff --git a/components/pdfviewer/toolbar.md b/components/pdfviewer/toolbar.md
index 1ce1b94bc1..b4e06a80b6 100644
--- a/components/pdfviewer/toolbar.md
+++ b/components/pdfviewer/toolbar.md
@@ -23,14 +23,14 @@ By default, the [Blazor PDF Viewer](https://demos.telerik.com/blazor-ui/pdfviewe
 
 | Tool Name | Tool Tag | Description |
 | --- | --- | --- |
-| Open | `PdfViewerToolBarOpenTool` | An open command that shows in a submenu upon a hamburger menu click. Fires the [`OnOpen` event]({%slug pdfviewer-events%}#onopen). |
-| Download | `PdfViewerToolBarDownloadTool` | A download command that shows in a submenu upon a hamburger menu click. Fires the [`OnDownload` event]({%slug pdfviewer-events%}#ondownload). |
-| Print | `PdfViewerToolBarPrintTool` | A print command that shows in a submenu upon a hamburger menu click. The component also provides a [`Print` method]({%slug pdfviewer-overview%}#pdfviewer-reference-and-methods). Printing uses an additional browser window with only the PDF document inside. This window may require user confirmation or appropriate browser settings to display. |
-| Pager | `PdfViewerToolBarPagerTool` | A pager to navigate the PDF document via automatic scrolling. Paging requires the [`Height` parameter]({%slug pdfviewer-overview%}#pdfviewer-parameters) to be set, otherwise the component expands and doesn't have its own scrollbar. |
+| Open | `PdfViewerToolBarOpenTool` | An open command that shows in a submenu upon a hamburger menu click. Fires the [`OnOpen` event](slug://pdfviewer-events#onopen). |
+| Download | `PdfViewerToolBarDownloadTool` | A download command that shows in a submenu upon a hamburger menu click. Fires the [`OnDownload` event](slug://pdfviewer-events#ondownload). |
+| Print | `PdfViewerToolBarPrintTool` | A print command that shows in a submenu upon a hamburger menu click. The component also provides a [`Print` method](slug://pdfviewer-overview#pdfviewer-reference-and-methods). Printing uses an additional browser window with only the PDF document inside. This window may require user confirmation or appropriate browser settings to display. |
+| Pager | `PdfViewerToolBarPagerTool` | A pager to navigate the PDF document via automatic scrolling. Paging requires the [`Height` parameter](slug://pdfviewer-overview#pdfviewer-parameters) to be set, otherwise the component expands and doesn't have its own scrollbar. |
 | Zoom | `PdfViewerToolBarZoomTool` | Zoom in and zoom out buttons with an additional dropdown with common options (Fit to page, Fit to width, 100%, etc.) |
 | Selection | `PdfViewerToolBarSelectionTool` | Two toggle buttons that enable either text selection or panning. |
 | Search | `PdfViewerToolBarSearchTool` | A search button. It opens an additional search bar that contains a textbox and arrow buttons to navigate the search results. |
-| Annotations | `PdfViewerToolBarAnnotationsTool` | A button that toggles the Annotations bar. Explore the [available annotation types and how to work with them]({%slug pdfviewer-annotations%}). |
+| Annotations | `PdfViewerToolBarAnnotationsTool` | A button that toggles the Annotations bar. Explore the [available annotation types and how to work with them](slug://pdfviewer-annotations). |
 
 ### Layout Tools
 
@@ -94,7 +94,7 @@ Add a `<PdfViewerToolBar>` tag inside `<TelerikPdfViewer>` to configure a custom
 
 ## Next Steps
 
-* [Handle PDF Viewer events]({%slug pdfviewer-events%})
+* [Handle PDF Viewer events](slug://pdfviewer-events)
 
 
 ## See Also
diff --git a/components/pivotgrid/accessibility/wai-aria-support.md b/components/pivotgrid/accessibility/wai-aria-support.md
index ba317a5a78..c988fdde3a 100644
--- a/components/pivotgrid/accessibility/wai-aria-support.md
+++ b/components/pivotgrid/accessibility/wai-aria-support.md
@@ -146,9 +146,9 @@ The PivotGrid has been tested with the following screen readers and browsers com
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor PivotGrid Demos](https://demos.telerik.com/blazor-ui/pivotgrid/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/pivotgrid/configurator.md b/components/pivotgrid/configurator.md
index e01fa3c6be..b31cc3aa88 100644
--- a/components/pivotgrid/configurator.md
+++ b/components/pivotgrid/configurator.md
@@ -60,12 +60,12 @@ The following user actions do not require users to click on *Apply*:
 
 ## Example
 
-Refer to the [example of a Pivot Grid using an XMLA Data Provider Type]({%slug pivotgrid-data-binding%}#xmla).
+Refer to the [example of a Pivot Grid using an XMLA Data Provider Type](slug://pivotgrid-data-binding#xmla).
 
 
 ## Next Steps
 
-* [Implement PivotGrid templates]({%slug pivotgrid-templates%})
+* [Implement PivotGrid templates](slug://pivotgrid-templates)
 
 
 ## See Also
diff --git a/components/pivotgrid/data-binding.md b/components/pivotgrid/data-binding.md
index e628d28637..6835923abc 100644
--- a/components/pivotgrid/data-binding.md
+++ b/components/pivotgrid/data-binding.md
@@ -23,9 +23,9 @@ The PivotGrid supports different data sources via its `DataProviderType` paramet
 
 ## Local
 
-When bound to local data, the Pivot Grid requires its `Data` parameter to provide all the data at once as `IEnumerable<TItem>`. The component will perform all aggregate calculations in-memory and there is no [load on demand]({%slug pivotgrid-overview%}#pivotgrid-parameters).
+When bound to local data, the Pivot Grid requires its `Data` parameter to provide all the data at once as `IEnumerable<TItem>`. The component will perform all aggregate calculations in-memory and there is no [load on demand](slug://pivotgrid-overview#pivotgrid-parameters).
 
-If the local data changes programmatically, you need to reset the collection instance or [call the PivotGrid `Rebind()` method]({%slug pivotgrid-overview%}#pivotgrid-reference-and-methods). See the common documentation about [refreshing component data]({%slug common-features-data-binding-overview%}#refresh-data) for details.
+If the local data changes programmatically, you need to reset the collection instance or [call the PivotGrid `Rebind()` method](slug://pivotgrid-overview#pivotgrid-reference-and-methods). See the common documentation about [refreshing component data](slug://common-features-data-binding-overview#refresh-data) for details.
 
 > Large amounts of local data may impact the performance, especially in WebAssembly applications.
 
diff --git a/components/pivotgrid/overview.md b/components/pivotgrid/overview.md
index b1264a1464..47250d5b54 100644
--- a/components/pivotgrid/overview.md
+++ b/components/pivotgrid/overview.md
@@ -44,7 +44,7 @@ The PivotGrid is an integrated product that includes several Razor components:
 ## Creating Blazor PivotGrid
 
 1. Add a `<TelerikPivotGrid>` tag to a Razor file.
-1. Set the `DataProviderType` parameter to a member of the `PivotGridDataProviderType` enum, according to your [data provider]({%slug pivotgrid-data-binding%}#data-provider-type). The example below uses `Local` flat data for simplicity. In this case, the PivotGrid also needs a `Data` parameter, which points to an `IEnumerable<TItem>`.
+1. Set the `DataProviderType` parameter to a member of the `PivotGridDataProviderType` enum, according to your [data provider](slug://pivotgrid-data-binding#data-provider-type). The example below uses `Local` flat data for simplicity. In this case, the PivotGrid also needs a `Data` parameter, which points to an `IEnumerable<TItem>`.
 1. (optional) To show initial data, add at least one [row, column, and measure with a `Name` parameter](#row-column-and-measure-parameters) that points to a field name in the data:
     * One `<PivotGridColumn>` instance inside the `<PivotGridColumns>` tag.
     * One `<PivotGridRow>` instance inside the `<PivotGridRows>` tag.
@@ -54,7 +54,7 @@ The PivotGrid is an integrated product that includes several Razor components:
     * Add a `<TelerikPivotGridConfiguratorButton>`.
     * Wrap both tags and `<TelerikPivotGrid>` with a `<TelerikPivotGridContainer>`.
 
-> The Telerik PivotGrid for Blazor [depends on two additional NuGet packages]({%slug getting-started/what-you-need%}#nuget-packages). They are installed automatically when using the [Telerik NuGet feed]({%slug installation/nuget%}) and must not be used separately with other custom or third-party tools.
+> The Telerik PivotGrid for Blazor [depends on two additional NuGet packages](slug://getting-started/what-you-need#nuget-packages). They are installed automatically when using the [Telerik NuGet feed](slug://installation/nuget) and must not be used separately with other custom or third-party tools.
 
 >caption PivotGrid with configurator and local data
 
@@ -127,17 +127,17 @@ The PivotGrid is an integrated product that includes several Razor components:
 
 ## Data Binding
 
-The PivotGrid component supports different [data binding options and data providers]({%slug pivotgrid-data-binding%}), for example local flat data and XML for Analytics (XMLA) with an OLAP cube. It can load data on demand or perform all aggregate calculations in memory.
+The PivotGrid component supports different [data binding options and data providers](slug://pivotgrid-data-binding), for example local flat data and XML for Analytics (XMLA) with an OLAP cube. It can load data on demand or perform all aggregate calculations in memory.
 
 
 ## Configurator
 
-In the simpler case, the PivotGrid supports fixed configuration of its rows, columns, and measures. However, most scenarios and users may require greater flexibility where one can [use the PivotGrid Configurator to change, filter and sort the displayed fields and aggregations]({%slug pivotgrid-configurator%}).
+In the simpler case, the PivotGrid supports fixed configuration of its rows, columns, and measures. However, most scenarios and users may require greater flexibility where one can [use the PivotGrid Configurator to change, filter and sort the displayed fields and aggregations](slug://pivotgrid-configurator).
 
 
 ## Templates
 
-[The PivotGrid supports templates for its header and data cells]({%slug pivotgrid-templates%}). The templates enable you to customize the cell content and appearance.
+[The PivotGrid supports templates for its header and data cells](slug://pivotgrid-templates). The templates enable you to customize the cell content and appearance.
 
 
 ## PivotGrid Parameters
@@ -156,16 +156,16 @@ The following table lists the `TelerikPivotGrid` parameters. Also check the [Piv
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | A custom CSS class for the `<div class="k-pivotgrid">` element. Use it to [override theme styles]({%slug themes-override%}). |
-| `ColumnHeadersWidth` | `string` | The width of each column in [any supported CSS unit]({%slug common-features/dimensions%}). |
-| `Data` | `IEnumerable<TItem>` | The Pivot Grid component data. Use only with [`Local` `DataProviderType`]({%slug pivotgrid-data-binding%}#local). |
-| `DataProviderType` | `PivotGridDataProviderType` enum <br /> (`Local`) | The [type of data source that the Pivot Grid will use]({%slug pivotgrid-data-binding%}). |
-| `EnableLoaderContainer` | `bool` (`true`) | Defines if a built-in [LoaderContainer]({%slug loadercontainer-overview%}) will show during long-running operations (over 600ms). |
-| `Height` | `string` | A `height` style in [any supported CSS unit]({%slug common-features/dimensions%}). |
+| `Class` | `string` | A custom CSS class for the `<div class="k-pivotgrid">` element. Use it to [override theme styles](slug://themes-override). |
+| `ColumnHeadersWidth` | `string` | The width of each column in [any supported CSS unit](slug://common-features/dimensions). |
+| `Data` | `IEnumerable<TItem>` | The Pivot Grid component data. Use only with [`Local` `DataProviderType`](slug://pivotgrid-data-binding#local). |
+| `DataProviderType` | `PivotGridDataProviderType` enum <br /> (`Local`) | The [type of data source that the Pivot Grid will use](slug://pivotgrid-data-binding). |
+| `EnableLoaderContainer` | `bool` (`true`) | Defines if a built-in [LoaderContainer](slug://loadercontainer-overview) will show during long-running operations (over 600ms). |
+| `Height` | `string` | A `height` style in [any supported CSS unit](slug://common-features/dimensions). |
 | `LoadOnDemand` | `bool` <br /> (`true`) | Defines if the PivotGrid will request only the data to display in the current view, or all data. When loading on demand is disabled or when using the `Local` `DataProviderType`, the component performs all calculations in-memory. In such cases, large amounts of data may impact the performance, especially in WebAssembly apps. |
-| `RowHeadersWidth` | `string` | The width of all row headers in [any supported CSS unit]({%slug common-features/dimensions%}). |
+| `RowHeadersWidth` | `string` | The width of all row headers in [any supported CSS unit](slug://common-features/dimensions). |
 | `TItem` | `object` | The PivotGrid `@typeparam`. Required if the data item type cannot be inferred at compile-time. |
-| `Width` | `string` | A `width` style in [any supported CSS unit]({%slug common-features/dimensions%}). |
+| `Width` | `string` | A `width` style in [any supported CSS unit](slug://common-features/dimensions). |
 
 ### Row, Column and Measure Parameters
 
@@ -175,7 +175,7 @@ The following table lists parameters of the `PivotGridRow`, `PivotGridColumn` an
 | --- | --- | --- |
 | `Aggregate` | `PivotGridAggregateType` enum <br /> (`Sum`) | The nature of the calculated aggregate values. Applies to `PivotGridMeasure` only. |
 | `Format` | `string` | The [display format](https://learn.microsoft.com/en-us/dotnet/standard/base-types/standard-numeric-format-strings) of the calculated aggregate values, for example `"{0:C2}"`. Applies to `PivotGridMeasure` only. |
-| `HeaderClass` | `string` | Adds a custom CSS class to the respective row header, column header or measure. Use it to apply custom styles or [override the default PivotGrid styles]({%slug themes-override%}). |
+| `HeaderClass` | `string` | Adds a custom CSS class to the respective row header, column header or measure. Use it to apply custom styles or [override the default PivotGrid styles](slug://themes-override). |
 | `Name` | `string` | The field name of the respective row, column or measure. |
 | `Title` | `string` | The label to be displayed in the Configurator for the respective row, column or measure. |
 
@@ -186,8 +186,8 @@ The following table lists parameters of the `TelerikPivotGridConfigurator` compo
 
 | Parameter | Type | Description |
 | --- | --- | --- |
-| `Class` | `string` | A custom CSS class for the `<div class="k-pivotgrid-configurator">` element. Use it to [override theme styles]({%slug themes-override%}). |
-| `EnableLoaderContainer` | `bool` (`true`) | Defines if a built-in [LoaderContainer]({%slug loadercontainer-overview%}) will show during long-running operations (over 600ms). |
+| `Class` | `string` | A custom CSS class for the `<div class="k-pivotgrid-configurator">` element. Use it to [override theme styles](slug://themes-override). |
+| `EnableLoaderContainer` | `bool` (`true`) | Defines if a built-in [LoaderContainer](slug://loadercontainer-overview) will show during long-running operations (over 600ms). |
 
 
 ### Button Parameters
@@ -196,7 +196,7 @@ The following table lists parameters of the `TelerikPivotGridConfiguratorButton`
 
 | Parameter | Type | Description |
 | --- | --- | --- |
-| `Class` | `string` | A custom CSS class for the `<div class="k-pivotgrid-configurator-button">` element. Use it to [override theme styles]({%slug themes-override%}). |
+| `Class` | `string` | A custom CSS class for the `<div class="k-pivotgrid-configurator-button">` element. Use it to [override theme styles](slug://themes-override). |
 
 
 ### Container Parameters
@@ -205,7 +205,7 @@ The following table lists parameters of the `TelerikPivotGridContainer` componen
 
 | Parameter | Type | Description |
 | --- | --- | --- |
-| `Class` | `string` | A custom CSS class for the Container `<div>` element. Use it for [custom styling]({%slug themes-override%}). |
+| `Class` | `string` | A custom CSS class for the Container `<div>` element. Use it for [custom styling](slug://themes-override). |
 
 
 ## PivotGrid Reference and Methods
@@ -214,7 +214,7 @@ The Pivot Grid exposes methods for programmatic operation. To use them, define a
 
 | Method | Description |
 | --- | --- |
-| `Rebind` | Processes the component `Data` and refreshes the UI. See the [**Refresh Data** section in the common Data Binding article]({%slug common-features-data-binding-overview%}#refresh-data) for details. |
+| `Rebind` | Processes the component `Data` and refreshes the UI. See the [**Refresh Data** section in the common Data Binding article](slug://common-features-data-binding-overview#refresh-data) for details. |
 
 >caption Obtain reference to the PivotGrid instance and execute methods
 
@@ -243,9 +243,9 @@ The Pivot Grid exposes methods for programmatic operation. To use them, define a
 
 ## Next Steps
 
-* [Explore the PivotGrid data binding and data providers]({%slug pivotgrid-data-binding%})
-* [Learn about the PivotGrid configurator]({%slug pivotgrid-configurator%})
-* [Implement PivotGrid templates]({%slug pivotgrid-templates%})
+* [Explore the PivotGrid data binding and data providers](slug://pivotgrid-data-binding)
+* [Learn about the PivotGrid configurator](slug://pivotgrid-configurator)
+* [Implement PivotGrid templates](slug://pivotgrid-templates)
 
 
 ## See Also
diff --git a/components/pivotgrid/templates.md b/components/pivotgrid/templates.md
index 00f2313f56..aedbcac04b 100644
--- a/components/pivotgrid/templates.md
+++ b/components/pivotgrid/templates.md
@@ -40,7 +40,7 @@ Define a row header template with a `<RowHeaderTemplate>` component. The `contex
 
 ## Example
 
-All template components expose an optional `Context` parameter. Set it in scenarios with nested templates of different components, otherwise you will get an error [*Child content element uses the same parameter name ('context')*]({%slug nest-renderfragment%}). The example below sets a custom `Context` name for the `DataCellTemplate`.
+All template components expose an optional `Context` parameter. Set it in scenarios with nested templates of different components, otherwise you will get an error [*Child content element uses the same parameter name ('context')*](slug://nest-renderfragment). The example below sets a custom `Context` name for the `DataCellTemplate`.
 
 >caption Using PivotGrid header and data cell templates
 
diff --git a/components/popover/accessibility/wai-aria-support.md b/components/popover/accessibility/wai-aria-support.md
index 0b6f161f15..ffa5c4e6c1 100644
--- a/components/popover/accessibility/wai-aria-support.md
+++ b/components/popover/accessibility/wai-aria-support.md
@@ -68,9 +68,9 @@ The Popover has been tested with the following screen readers and browsers combi
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor Popover Demos](https://demos.telerik.com/blazor-ui/popover/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/popover/overview.md b/components/popover/overview.md
index 5e68b1eb16..e881d98821 100644
--- a/components/popover/overview.md
+++ b/components/popover/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Popover Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/popover" target="_blank">Blazor Popover component</a> behaves much like a tooltip, as it helps you display additional information in a container that shows on top of the other page content. The major differences between the Popover and the [Tooltip]({%slug tooltip-overview%}) components is that the Popover has built-in support for action buttons and provides more configuration options about its animation and placement on the screen. This article explains how to start using the component and describes its features.
+The <a href = "https://www.telerik.com/blazor-ui/popover" target="_blank">Blazor Popover component</a> behaves much like a tooltip, as it helps you display additional information in a container that shows on top of the other page content. The major differences between the Popover and the [Tooltip](slug://tooltip-overview) components is that the Popover has built-in support for action buttons and provides more configuration options about its animation and placement on the screen. This article explains how to start using the component and describes its features.
 
 ## Creating Blazor Popover
 
@@ -50,11 +50,11 @@ The <a href = "https://www.telerik.com/blazor-ui/popover" target="_blank">Blazor
 
 ## Popover Positioning and Collision
 
-Use the available positioning and collision settings to customize how the Popover positions itself and reacts to insufficient space in the viewport. [Read more about the Blazor Popover Positioning and Collision...]({%slug popover-position-collision%})
+Use the available positioning and collision settings to customize how the Popover positions itself and reacts to insufficient space in the viewport. [Read more about the Blazor Popover Positioning and Collision...](slug://popover-position-collision)
 
 ## Popover Animations 
 
-Use the available parameters to customize the animation type and its duration. [Read more about the Blazor Popover Animations...]({%slug popover-animation%})
+Use the available parameters to customize the animation type and its duration. [Read more about the Blazor Popover Animations...](slug://popover-animation)
 
 ## Popover Parameters
 
@@ -66,11 +66,11 @@ The Blazor Popover provides parameters to configure the component. Also check th
 | ----------- | ----------- | ----------- |
 | `ActionsLayout` | `PopoverActionsLayoutAlign ` enum <br /> (`Stretch`) | The positioning of the elements in the `<PopoverActions>` child tag. The possible values are `Stretch`, `Start`, `Center`, and `End`. |
 | `AnchorSelector` | `string` | The CSS selector targeting the element that the Popover uses as an anchor. |
-| `AnimationDuration` | `int` | The duration of the animation in milliseconds. [Read more about Popover animations...]({%slug popover-animation%}) |
-| `AnimationType` | `AnimationType` enum <br /> (`SlideDown`) | The type of animation when the component displays and hides. [Read more about Popover animations...]({%slug popover-animation%}) |
-| `Collision` | `PopoverCollision` enum <br /> (`Fit`) | The behavior of the Popover when it doesn't fit in the viewport. [Read more about Popover collision...]({%slug popover-position-collision%}) |
-| `Offset` | `double ` | The [space between the Popover and its anchor]({%slug popover-position-collision%}#offset) in pixels. The component ignores its callout when applying this setting. |
-| `Position` | `PopoverPosition  ` enum <br /> (`Top`) | The position relative to the target element at which the Popover will be shown. [Read more about Popover position...]({%slug popover-position-collision%}) |
+| `AnimationDuration` | `int` | The duration of the animation in milliseconds. [Read more about Popover animations...](slug://popover-animation) |
+| `AnimationType` | `AnimationType` enum <br /> (`SlideDown`) | The type of animation when the component displays and hides. [Read more about Popover animations...](slug://popover-animation) |
+| `Collision` | `PopoverCollision` enum <br /> (`Fit`) | The behavior of the Popover when it doesn't fit in the viewport. [Read more about Popover collision...](slug://popover-position-collision) |
+| `Offset` | `double ` | The [space between the Popover and its anchor](slug://popover-position-collision#offset) in pixels. The component ignores its callout when applying this setting. |
+| `Position` | `PopoverPosition  ` enum <br /> (`Top`) | The position relative to the target element at which the Popover will be shown. [Read more about Popover position...](slug://popover-position-collision) |
 | `ShowCallout` | `bool` <br /> (`true`) | Defines if the callout is rendered. |
 | `ShowOn` | `PopOverShowOn?` enum <br /> (`null`) | The browser event that will display the Popover (`MouseEnter` or `Click`) without the need to [use component methods](#popover-reference-and-methods). When you set the `ShowOn` parameter to `Click`, the Popover will hide when the user clicks outside the component. If the parameter value is `MouseEnter`, the Popover will hide when the mouse pointer leaves. |
 
@@ -80,7 +80,7 @@ The following parameters enable you to customize the appearance of the Blazor Po
 
 | Parameter | Type | Description |
 | --- | --- | --- |
-| `Class` | `string` | The custom CSS class to be rendered on the `<div>` element, which wraps the component `ChildContent`. Use for [styling customizations]({%slug themes-override%}). |
+| `Class` | `string` | The custom CSS class to be rendered on the `<div>` element, which wraps the component `ChildContent`. Use for [styling customizations](slug://themes-override). |
 | `Height` | `string` | The height of the Popover. |
 | `Width` | `string` | The width of the Popover. |
 
@@ -119,11 +119,11 @@ To execute Popover methods, obtain a reference to the component instance with `@
 
 ## Next Steps
 
-* [Explore the Popover Positioning and Collision Settings]({%slug popover-position-collision%})
-* [Customize the Popover Animations]({%slug popover-animation%})
+* [Explore the Popover Positioning and Collision Settings](slug://popover-position-collision)
+* [Customize the Popover Animations](slug://popover-animation)
 
 ## See Also
 
 * [Live Popover Demos](https://demos.telerik.com/blazor-ui/popover/overview)
 * [Popover API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikPopover)
-* [Comparison between All Popup Components]({%slug common-kb-popup-component-comparison%})
+* [Comparison between All Popup Components](slug://common-kb-popup-component-comparison)
diff --git a/components/popup/overview.md b/components/popup/overview.md
index 7ffbf0c659..c91aee0fd2 100644
--- a/components/popup/overview.md
+++ b/components/popup/overview.md
@@ -46,11 +46,11 @@ The <a href = "https://www.telerik.com/blazor-ui/popup" target="_blank">Blazor P
 
 ## Popup Positioning and Collision
 
-Use the available positioning and collision settings to customize how the Popup positions and reacts to insufficient space in the viewport. [Read more about the Blazor Popup Positioning and Collision...]({%slug popup-position-collision%})
+Use the available positioning and collision settings to customize how the Popup positions and reacts to insufficient space in the viewport. [Read more about the Blazor Popup Positioning and Collision...](slug://popup-position-collision)
 
 ## Popup Animations 
 
-Use the available parameters to customize the animation type and its duration. [Read more about the Blazor Popup animations...]({%slug popup-animation%}).
+Use the available parameters to customize the animation type and its duration. [Read more about the Blazor Popup animations...](slug://popup-animation).
 
 ## Popup Parameters
 
@@ -60,16 +60,16 @@ The Blazor Popup provides parameters to configure the component. Also check the
 
 | Parameter | Type | Description |
 | ----------- | ----------- | ----------- |
-| `AnchorHorizontalAlign` | `PopupAnchorHorizontalAlign` enum <br /> (`Left`) | Defines how the anchor aligns with the Popup component on the horizontal plane. [Read more about Popup Positioning.]({%slug popup-position-collision%})|
+| `AnchorHorizontalAlign` | `PopupAnchorHorizontalAlign` enum <br /> (`Left`) | Defines how the anchor aligns with the Popup component on the horizontal plane. [Read more about Popup Positioning.](slug://popup-position-collision)|
 | `AnchorSelector` | `string` | The CSS selector for the anchor element of the Popup. |
-| `AnchorVerticalAlign` | `PopupAnchorVerticalAlign` enum <br /> (`Bottom`) | Defines how the anchor aligns with the Popup on the vertical plane. [Read more about Popup Positioning.]({%slug popup-position-collision%}). |
-| `AnimationDuration` | `int` | The duration of the animation in milliseconds. [Read more about Popup animations.]({%slug popup-animation%}) |
-| `AnimationType` | `AnimationType` enum <br /> (`SlideDown`) | The type of animation when the component displays and hides. [Read more about Popup animations.]({%slug popup-animation%}) |
-| `HorizontalAlign` | `PopupHorizontalAlign ` enum <br /> (`Left`) | Determines if the left or the right side of the Popup will touch its anchor. [Read more about Popup Positioning.]({%slug popup-position-collision%}) |
-| `HorizontalCollision` | `PopupCollision  ` enum <br /> (`Fit`) | Sets the behavior of the Popup when it doesn't fit in the viewport based on the horizontal plane. [Read more about Popup collision behavior.]({%slug popup-position-collision%}) |
+| `AnchorVerticalAlign` | `PopupAnchorVerticalAlign` enum <br /> (`Bottom`) | Defines how the anchor aligns with the Popup on the vertical plane. [Read more about Popup Positioning.](slug://popup-position-collision). |
+| `AnimationDuration` | `int` | The duration of the animation in milliseconds. [Read more about Popup animations.](slug://popup-animation) |
+| `AnimationType` | `AnimationType` enum <br /> (`SlideDown`) | The type of animation when the component displays and hides. [Read more about Popup animations.](slug://popup-animation) |
+| `HorizontalAlign` | `PopupHorizontalAlign ` enum <br /> (`Left`) | Determines if the left or the right side of the Popup will touch its anchor. [Read more about Popup Positioning.](slug://popup-position-collision) |
+| `HorizontalCollision` | `PopupCollision  ` enum <br /> (`Fit`) | Sets the behavior of the Popup when it doesn't fit in the viewport based on the horizontal plane. [Read more about Popup collision behavior.](slug://popup-position-collision) |
 | `HorizontalOffset` | `double` | The horizontal space between the Popup and its anchor in pixels. |
-| `VerticalAlign` | `PopupVerticalAlign ` enum <br /> (`Top`) | Determines if the Popup will touch the anchor with its top, bottom, or center. [Read more about Popup Positioning.]({%slug popup-position-collision%}) |
-| `VerticalCollision` | `PopupCollision  ` enum <br /> (`Flip`) | Defines the behavior of the Popup when it doesn't fit in the viewport based on the vertical plane. [Read more about Popup collision behavior.]({%slug popup-position-collision%}) |
+| `VerticalAlign` | `PopupVerticalAlign ` enum <br /> (`Top`) | Determines if the Popup will touch the anchor with its top, bottom, or center. [Read more about Popup Positioning.](slug://popup-position-collision) |
+| `VerticalCollision` | `PopupCollision  ` enum <br /> (`Flip`) | Defines the behavior of the Popup when it doesn't fit in the viewport based on the vertical plane. [Read more about Popup collision behavior.](slug://popup-position-collision) |
 | `VerticalOffset` | `double` | The vertical space between the Popup and its anchor in `pixels`. |
 
 ### Styling and Appearance
@@ -78,7 +78,7 @@ The following parameters enable you to customize the appearance of the Blazor Po
 
 | Parameter | Type | Description |
 | --- | --- | --- |
-| `Class` | `string` | The custom CSS class to be rendered on the `<div>` element, which wraps the component `ChildContent`. Use for [styling customizations]({%slug themes-override%}). |
+| `Class` | `string` | The custom CSS class to be rendered on the `<div>` element, which wraps the component `ChildContent`. Use for [styling customizations](slug://themes-override). |
 | `Height` | `string` | The height of the Popup. |
 | `Width` | `string` | The width of the Popup. If not set, the component width will match the anchor width. |
 
@@ -124,11 +124,11 @@ To execute Popup methods, obtain a reference to the component instance with `@re
 
 ## Next Steps
 
-* [Explore the Popup Positioning and Collision Settings]({%slug popup-position-collision%})
-* [Customize the Popup Animations]({%slug popup-animation%})
+* [Explore the Popup Positioning and Collision Settings](slug://popup-position-collision)
+* [Customize the Popup Animations](slug://popup-animation)
 
 ## See Also
 
 * [Live Popup Demos](https://demos.telerik.com/blazor-ui/popup/overview)
 * [Popup API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikPopup)
-* [Comparison between All Popup Components]({%slug common-kb-popup-component-comparison%})
+* [Comparison between All Popup Components](slug://common-kb-popup-component-comparison)
diff --git a/components/progressbar/accessibility/wai-aria-support.md b/components/progressbar/accessibility/wai-aria-support.md
index 713d0436d1..e43a51d4bd 100644
--- a/components/progressbar/accessibility/wai-aria-support.md
+++ b/components/progressbar/accessibility/wai-aria-support.md
@@ -64,9 +64,9 @@ The ProgressBar has been tested with the following screen readers and browsers c
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor ProgressBar Demos](https://demos.telerik.com/blazor-ui/progressbar/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/progressbar/indeterminate.md b/components/progressbar/indeterminate.md
index 8de785a4e9..d92b61f2b8 100644
--- a/components/progressbar/indeterminate.md
+++ b/components/progressbar/indeterminate.md
@@ -41,6 +41,6 @@ To put the ProgressBar in Indeterminate state set the `Indeterminate`, `boolean`
 ## See Also
 
   * [Live Demo: ProgressBar Overview](https://demos.telerik.com/blazor-ui/loader/overview)
-  * [Overview]({%slug progressbar-overview%})
-  * [Labels]({%slug progressbar-label%})
+  * [Overview](slug://progressbar-overview)
+  * [Labels](slug://progressbar-label)
   
diff --git a/components/progressbar/label.md b/components/progressbar/label.md
index 82a84f37cf..614b2df907 100644
--- a/components/progressbar/label.md
+++ b/components/progressbar/label.md
@@ -63,5 +63,5 @@ The `Template` allows you to control the entire rendering of the label for the P
 ## See Also
 
   * [Live Demo: ProgressBar Label](https://demos.telerik.com/blazor-ui/progressbar/label)
-  * [Overview]({%slug progressbar-overview%})
-  * [Indeterminate state]({%slug progressbar-indeterminate-state%})
+  * [Overview](slug://progressbar-overview)
+  * [Indeterminate state](slug://progressbar-indeterminate-state)
diff --git a/components/progressbar/overview.md b/components/progressbar/overview.md
index 79850c1a32..d9d4d6611b 100644
--- a/components/progressbar/overview.md
+++ b/components/progressbar/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor ProgressBar Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/progressbar" target = "_blank">Blazor ProgressBar component</a> tracks the execution of operations and displays what portion of it is completed. For very long tasks, you can also make it [indeterminate]({%slug progressbar-indeterminate-state%}).
+The <a href = "https://www.telerik.com/blazor-ui/progressbar" target = "_blank">Blazor ProgressBar component</a> tracks the execution of operations and displays what portion of it is completed. For very long tasks, you can also make it [indeterminate](slug://progressbar-indeterminate-state).
 
 ## Creating Blazor ProgressBar
 
@@ -32,11 +32,11 @@ The <a href = "https://www.telerik.com/blazor-ui/progressbar" target = "_blank">
 
 ## Label
 
-The label is a representation of the current progress. [Depending on the theme, it renders inside or next to the ProgressBar](https://demos.telerik.com/blazor-ui/progressbar/overview) and by default shows the component `Value` with an appended percent sign `%`. The [ProgressBar allows customization of the label position and content]({%slug progressbar-label%}). Use the label template to show the desired percent progress if the ProgressBar `Max` parameter is not `100`.
+The label is a representation of the current progress. [Depending on the theme, it renders inside or next to the ProgressBar](https://demos.telerik.com/blazor-ui/progressbar/overview) and by default shows the component `Value` with an appended percent sign `%`. The [ProgressBar allows customization of the label position and content](slug://progressbar-label). Use the label template to show the desired percent progress if the ProgressBar `Max` parameter is not `100`.
 
 ## Indeterminate State
 
-In some scenarios the estimated time of completion is unknown or the progress cannot be strictly measured. The ProgressBar supports continuous animation that can cover these cases. [Read more about the ProgressBar Indeterminate State...]({%slug progressbar-indeterminate-state%})
+In some scenarios the estimated time of completion is unknown or the progress cannot be strictly measured. The ProgressBar supports continuous animation that can cover these cases. [Read more about the ProgressBar Indeterminate State...](slug://progressbar-indeterminate-state)
 
 ## Responsive ProgressBar
 
@@ -65,16 +65,16 @@ The ProgressBar provides the following features to further customize its behavio
 | --- | --- | --- |
 | `Class` | `string` | The CSS class that will be rendered on the main wrapping element. You can use it to cascade styles more easily. |
 | `Max` | `double` <br /> `100` | The maximum value of the ProgressBar. It must be greater than `0`. |
-| `Value` | `double` | The value of the ProgressBar, which indicates the progress of the tracked process as a percentage. If `Max` is not `100` or `Value` is not a percent number, then use a [ProgressBar label template]({%slug progressbar-label%}) to display the component value in the desired format and precision. |
+| `Value` | `double` | The value of the ProgressBar, which indicates the progress of the tracked process as a percentage. If `Max` is not `100` or `Value` is not a percent number, then use a [ProgressBar label template](slug://progressbar-label) to display the component value in the desired format and precision. |
 | `Orientation` | `ProgressBarOrientation` enum <br /> (`Horizontal`) | The orientation of the ProgressBar. It can be `Horizontal` or `Vertical`. |
 
 ## Next Steps
 
-* [Customize the ProgressBar Label]({%slug progressbar-label%})
+* [Customize the ProgressBar Label](slug://progressbar-label)
 
 ## See Also
 
 * [Live Demo: ProgressBar](https://demos.telerik.com/blazor-ui/progressbar/overview)
-* [Label]({%slug progressbar-label%})
-* [Indeterminate state]({%slug progressbar-indeterminate-state%})
+* [Label](slug://progressbar-label)
+* [Indeterminate state](slug://progressbar-indeterminate-state)
 * [ProgressBar API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikProgressBar)
diff --git a/components/radiogroup/accessibility/wai-aria-support.md b/components/radiogroup/accessibility/wai-aria-support.md
index 1623874882..7efc64c185 100644
--- a/components/radiogroup/accessibility/wai-aria-support.md
+++ b/components/radiogroup/accessibility/wai-aria-support.md
@@ -68,4 +68,4 @@ For details on how the RadioGroup keyboard navigation works, refer to the [Blazo
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/radiogroup/data-bind.md b/components/radiogroup/data-bind.md
index 65741cd941..077def7f9e 100644
--- a/components/radiogroup/data-bind.md
+++ b/components/radiogroup/data-bind.md
@@ -177,5 +177,5 @@ The RadioGroup is a generic component and its type depends on the type of its `D
 
 ## See Also
 
-* [RadioGroup Overview]({%slug radiogroup-overview%})
+* [RadioGroup Overview](slug://radiogroup-overview)
 * [Live Demo: RadioGroup](https://demos.telerik.com/blazor-ui/radiogroup/overview)
diff --git a/components/radiogroup/events.md b/components/radiogroup/events.md
index 9a6ab3f6c6..6ffae57f13 100644
--- a/components/radiogroup/events.md
+++ b/components/radiogroup/events.md
@@ -16,7 +16,7 @@ This article explains the events available in the Telerik RadioGroup for Blazor:
 * [ValueChanged](#valuechanged)
 * [OnBlur](#onblur)
 
-The examples in this article use `string` values and simple data sources for brevity. You can use full models, see the [data binding]({%slug radiogroup-databind%}) article for more details.
+The examples in this article use `string` values and simple data sources for brevity. You can use full models, see the [data binding](slug://radiogroup-databind) article for more details.
 
 
 ## OnChange
@@ -51,7 +51,7 @@ The `OnChange` event represents a user action - confirmation of the current valu
 
 The `ValueChanged` event fires upon every change of the user selection.
 
-The example below uses [binding]({%slug radiogroup-databind%}) to string data for brevity. You can use a model class as well.
+The example below uses [binding](slug://radiogroup-databind) to string data for brevity. You can use a model class as well.
 
 >caption Handle ValueChanged
 
@@ -107,4 +107,4 @@ The `OnBlur` event fires when an element inside the component loses focus (radio
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
diff --git a/components/radiogroup/label-position.md b/components/radiogroup/label-position.md
index 4eb2390d67..aeb79db2ec 100644
--- a/components/radiogroup/label-position.md
+++ b/components/radiogroup/label-position.md
@@ -38,6 +38,6 @@ By default, the labels are after the buttons, and you can change that through th
 
 ## See Also
 
-* [RadioGroup Overview]({%slug radiogroup-overview%})
-* [RadioGroup Data Binding]({%slug radiogroup-databind%})
+* [RadioGroup Overview](slug://radiogroup-overview)
+* [RadioGroup Data Binding](slug://radiogroup-databind)
 * [Live Demo: RadioGroup Customization](https://demos.telerik.com/blazor-ui/radiogroup/customization)
diff --git a/components/radiogroup/layout.md b/components/radiogroup/layout.md
index a9960f432d..ed5ae424cb 100644
--- a/components/radiogroup/layout.md
+++ b/components/radiogroup/layout.md
@@ -59,6 +59,6 @@ In the `Horizontal` layout mode, the individual items do not create a layout and
 
 ## See Also
 
-* [RadioGroup Overview]({%slug radiogroup-overview%})
-* [RadioGroup Data Binding]({%slug radiogroup-databind%})
+* [RadioGroup Overview](slug://radiogroup-overview)
+* [RadioGroup Data Binding](slug://radiogroup-databind)
 * [Live Demo: RadioGroup Customization](https://demos.telerik.com/blazor-ui/radiogroup/customization)
diff --git a/components/radiogroup/overview.md b/components/radiogroup/overview.md
index e3b86d4f1d..4ce612de33 100644
--- a/components/radiogroup/overview.md
+++ b/components/radiogroup/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor RadioGroup Overview
 
-The <a href="https://www.telerik.com/blazor-ui/radiogroup" target="_blank">Blazor RadioGroup component</a> allows the user to select an option from a predefined set of choices in a list of radio buttons. The radio group is styled according to the Telerik [Theme]({%slug themes-overview%}). You can also choose the [layout order]({%slug radiogroup-layout%}) and [label position]({%slug radiogroup-label-position%}).
+The <a href="https://www.telerik.com/blazor-ui/radiogroup" target="_blank">Blazor RadioGroup component</a> allows the user to select an option from a predefined set of choices in a list of radio buttons. The radio group is styled according to the Telerik [Theme](slug://themes-overview). You can also choose the [layout order](slug://radiogroup-layout) and [label position](slug://radiogroup-label-position).
 
 ## Creating Blazor RadioGroup
 
@@ -57,27 +57,27 @@ Chosen gender: @( ChosenGender == 0 ? "no selection yet" : ChosenGender.ToString
 
 ## Data Binding
 
-The Blazor RadioGroup supports data binding to strings, [value type](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/value-types) data, and a model collection. [Read more about the Blazor RadioGroup data binding]({%slug radiogroup-databind%}).
+The Blazor RadioGroup supports data binding to strings, [value type](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/value-types) data, and a model collection. [Read more about the Blazor RadioGroup data binding](slug://radiogroup-databind).
 
 ## Layout
 
-The RadioGroup component provides two ways to render the list of options - in a *vertical* or in a *horizontal* fashion. [Read more about the Blazor RadioGroup layouts]({%slug radiogroup-layout%}).
+The RadioGroup component provides two ways to render the list of options - in a *vertical* or in a *horizontal* fashion. [Read more about the Blazor RadioGroup layouts](slug://radiogroup-layout).
 
 ## Label Position
 
-The RadioGroup component provides two ways to render the labels of the radio buttons - *before* or *after* the radio buttons. [Read more about the Blazor RadioGroup label position]({%slug radiogroup-label-position%}).
+The RadioGroup component provides two ways to render the labels of the radio buttons - *before* or *after* the radio buttons. [Read more about the Blazor RadioGroup label position](slug://radiogroup-label-position).
 
 ## Appearance Settings
 
-The Blazor RadioGroup provides a `Size` parameter to customize the radio button dimensions. [Read more about the Blazor RadioGroup appearance settings]({%slug radiogroup-appearance%}).
+The Blazor RadioGroup provides a `Size` parameter to customize the radio button dimensions. [Read more about the Blazor RadioGroup appearance settings](slug://radiogroup-appearance).
 
 ## Templates
 
-The [RadioGroup item template]({%slug radiogroup-templates%}) allows customization of the content of each radio item.
+The [RadioGroup item template](slug://radiogroup-templates) allows customization of the content of each radio item.
 
 ## Events
 
-The Blazor RadioGroup fires blur and value change events to respond to user actions. [Read more about the Blazor RadioGroup events]({%slug radiogroup-events%}).
+The Blazor RadioGroup fires blur and value change events to respond to user actions. [Read more about the Blazor RadioGroup events](slug://radiogroup-events).
 
 ## RadioGroup Parameters
 
@@ -99,7 +99,7 @@ The Blazor RadioGroup provides various parameters to configure the component. Al
 | `ValueField` | `string` <br /> (`Value`) | The name of the field from the model that will populate the underlying `Value`. |
 | `Value` | `object` | The value of the component. Supports one and two-way binding. If the `Value` matches a `ValueField` value in the Data, the corresponding item from the data will be pre-selected. |
 
-See the [Input Validation]({%slug common-features/input-validation%}) article for more details.
+See the [Input Validation](slug://common-features/input-validation) article for more details.
 
 ## RadioGroup Reference and Methods
 
@@ -144,10 +144,10 @@ The RadioGroup provides a `FocusAsync` method that allows the application to foc
 
 ## Next Steps
 
-* [Bind the RadioGroup to Data]({%slug radiogroup-databind%})
-* [Handle the RadioGroup Events]({%slug radiogroup-events%})
-* [Explore the RadioGroup Layouts]({%slug radiogroup-layout%})
-* [Customize the RadioGroup Item Rendering with Templates]({%slug radiogroup-templates%})
+* [Bind the RadioGroup to Data](slug://radiogroup-databind)
+* [Handle the RadioGroup Events](slug://radiogroup-events)
+* [Explore the RadioGroup Layouts](slug://radiogroup-layout)
+* [Customize the RadioGroup Item Rendering with Templates](slug://radiogroup-templates)
 
 ## See Also
 
diff --git a/components/radiogroup/templates.md b/components/radiogroup/templates.md
index 920f327f99..7bbf8bb9d9 100644
--- a/components/radiogroup/templates.md
+++ b/components/radiogroup/templates.md
@@ -66,9 +66,9 @@ The template exposes a `context` variable. Cast it to the RadioGroup model type
 
 ## Next Steps
 
-* [Handle the RadioGroup Events]({%slug radiogroup-events%})
+* [Handle the RadioGroup Events](slug://radiogroup-events)
 
 ## See Also
 
 * [Live Demo: RadioGroup Templates](https://demos.telerik.com/blazor-ui/radiogroup/templates)
-* [RadioGroup Label Position]({%slug radiogroup-label-position%})
+* [RadioGroup Label Position](slug://radiogroup-label-position)
diff --git a/components/rangeslider/accessibility/wai-aria-support.md b/components/rangeslider/accessibility/wai-aria-support.md
index dcd1be2a64..a4bdb32e45 100644
--- a/components/rangeslider/accessibility/wai-aria-support.md
+++ b/components/rangeslider/accessibility/wai-aria-support.md
@@ -67,4 +67,4 @@ For details on how the RangeSlider keyboard navigation works, refer to the [Blaz
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/rangeslider/events.md b/components/rangeslider/events.md
index 3e788c94fb..1127f169e2 100644
--- a/components/rangeslider/events.md
+++ b/components/rangeslider/events.md
@@ -231,4 +231,4 @@ from @StartValue to @EndValue
 
 ## See Also
 
-* [RangeSlider Overview]({%slug rangeslider-overview%})
\ No newline at end of file
+* [RangeSlider Overview](slug://rangeslider-overview)
\ No newline at end of file
diff --git a/components/rangeslider/label-template.md b/components/rangeslider/label-template.md
index f8305347d0..c64fcbfa24 100644
--- a/components/rangeslider/label-template.md
+++ b/components/rangeslider/label-template.md
@@ -173,5 +173,5 @@ While the slider is a numeric input, you can use its values to match against ind
 
 ## See Also
 
-* [RangeSlider Overview]({%slug rangeslider-overview%})
+* [RangeSlider Overview](slug://rangeslider-overview)
 * [Live Demo: RangeSlider Label Template](https://demos.telerik.com/blazor-ui/rangeslider/label-template)
\ No newline at end of file
diff --git a/components/rangeslider/overview.md b/components/rangeslider/overview.md
index 5ac950220c..7597eb5ad7 100644
--- a/components/rangeslider/overview.md
+++ b/components/rangeslider/overview.md
@@ -76,7 +76,7 @@ The RangeSlider is a generic component that takes the type of the `StartValue` w
 
 ## Steps
 
-The RangeSlider works with small and large steps and they are both required. Read more for their configuration and explore examples in the [Steps article]({%slug rangeslider-steps%}).
+The RangeSlider works with small and large steps and they are both required. Read more for their configuration and explore examples in the [Steps article](slug://rangeslider-steps).
 
 ## Ticks Position
 
@@ -88,11 +88,11 @@ You can customize the default horizontal orientation of the RangeSlider through
 
 ## Decimals
 
-This setting helps avoid [round-off errors](https://en.wikipedia.org/wiki/Round-off_error) when calculating steps (see more about this type of errors [here](https://en.wikipedia.org/wiki/Floating-point_arithmetic#Accuracy_problems)). Explore the [Decimals article]({%slug rangeslider-decimals%}) for details on how to configure this option.
+This setting helps avoid [round-off errors](https://en.wikipedia.org/wiki/Round-off_error) when calculating steps (see more about this type of errors [here](https://en.wikipedia.org/wiki/Floating-point_arithmetic#Accuracy_problems)). Explore the [Decimals article](slug://rangeslider-decimals) for details on how to configure this option.
 
 ## Validation
 
-You can validate RangeSlider value using the built-in validation. See the [Input Validation]({%slug common-features/input-validation%}) article for more details.
+You can validate RangeSlider value using the built-in validation. See the [Input Validation](slug://common-features/input-validation) article for more details.
 
 ## Parameters
 
@@ -119,11 +119,11 @@ The following parameters enable you to customize the appearance of the Blazor Sl
 
 ## Next Steps
 
-* [RangeSlider Steps]({%slug rangeslider-steps%})
+* [RangeSlider Steps](slug://rangeslider-steps)
 
 ## See Also
 
 * [Live Demo: RangeSlider](https://demos.telerik.com/blazor-ui/rangeslider/overview)
 * [Live Demo: RangeSlider Settings](https://demos.telerik.com/blazor-ui/rangeslider/customization)
-* [RangeSlider Events]({%slug rangeslider-events%})
+* [RangeSlider Events](slug://rangeslider-events)
 
diff --git a/components/rating/accessibility/wai-aria-support.md b/components/rating/accessibility/wai-aria-support.md
index ac02b30597..b98445677b 100644
--- a/components/rating/accessibility/wai-aria-support.md
+++ b/components/rating/accessibility/wai-aria-support.md
@@ -67,4 +67,4 @@ For details on how the Rating keyboard navigation works, refer to the [Blazor Ra
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/rating/overview.md b/components/rating/overview.md
index cc056baf79..26f6570a97 100644
--- a/components/rating/overview.md
+++ b/components/rating/overview.md
@@ -33,23 +33,23 @@ The <a href = "https://www.telerik.com/blazor-ui/rating" target="_blank">Blazor
 
 ## Selection
 
-You can choose between `Continuous` and `Single` selection. The behavior depends on the `SelectionMode` parameter value. [Read more about the selection options of the Rating...]({%slug rating-selection%})
+You can choose between `Continuous` and `Single` selection. The behavior depends on the `SelectionMode` parameter value. [Read more about the selection options of the Rating...](slug://rating-selection)
 
 ## Precision
 
-You can choose between `Full` and `Half` precision. The behavior depends on the `PrecisionMode` parameter value. [Read more about the selection precision options of the Rating...]({%slug rating-precision%})
+You can choose between `Full` and `Half` precision. The behavior depends on the `PrecisionMode` parameter value. [Read more about the selection precision options of the Rating...](slug://rating-precision)
 
 ## Label
 
-You can set a label with the `Label` parameter value. [Read more about the label of the Rating...]({%slug rating-label%})
+You can set a label with the `Label` parameter value. [Read more about the label of the Rating...](slug://rating-label)
 
 ## Templates
 
-You can use templates to customize the rendering and appearance of the component. [Read more about the templates of the Rating...]({%slug rating-templates%})
+You can use templates to customize the rendering and appearance of the component. [Read more about the templates of the Rating...](slug://rating-templates)
 
 ## Events
 
-The Rating events allow you to implement custom functionality and handle user interactions with the component. [Read more about the events of the Rating...]({%slug rating-events%})
+The Rating events allow you to implement custom functionality and handle user interactions with the component. [Read more about the events of the Rating...](slug://rating-events)
 
 ## Rating Parameters
 
@@ -61,20 +61,20 @@ The Blazor Rating provides various parameters that allow you to configure the co
 | ----------- | ----------- | ----------- |
 | `AriaLabel` | `string` | The `aria-label` attribute of the `<span class="telerik-blazor k-rating">` element that represents the Rating component. |
 | `AriaLabelledBy` | `string` | The `aria-labelledby` attribute of the `<span class="telerik-blazor k-rating">` element that represents the Rating component. |
-| `Class` | `string` | The `class` attribute of the `<span class="telerik-blazor k-rating">` element. Use it to apply custom styles or [override the theme]({%slug themes-override%}). |
+| `Class` | `string` | The `class` attribute of the `<span class="telerik-blazor k-rating">` element. Use it to apply custom styles or [override the theme](slug://themes-override). |
 | `Enabled` | `bool` <br /> (`true`) | Defines if the Rating allows selection. |
 | `HoverThrottleInterval` | `int` | Determines the delay between hovering and applying the hover value to the component. |
 | `Label` | `string` | If set, renders an additional HTML element next to the rating with arbitrary content. |
 | `Max` | `int` <br /> (`5`) | Defines the number of items (icons). |
-| `PrecisionMode` | `RatingPrecisionMode` <br /> (`Full`) | Controls the [precision mode]({%slug rating-precision%}) of the component selection. |
+| `PrecisionMode` | `RatingPrecisionMode` <br /> (`Full`) | Controls the [precision mode](slug://rating-precision) of the component selection. |
 | `ReadOnly` | `bool` <br /> (`false`) | Defines whether the component should be rendered in a read-only state. |
-| `SelectionMode` | `RatingSelectionMode` <br /> (`Continuous`) | Controls the [selection mode]({%slug rating-selection%}) of the component. |
+| `SelectionMode` | `RatingSelectionMode` <br /> (`Continuous`) | Controls the [selection mode](slug://rating-selection) of the component. |
 
 ## Next Steps
 
-* [Explore the Rating Selection Options]({%slug rating-selection%})
-* [Explore the Rating Precision Options]({%slug rating-precision%})
-* [Customize the Rating Appearance]({%slug rating-templates%})
+* [Explore the Rating Selection Options](slug://rating-selection)
+* [Explore the Rating Precision Options](slug://rating-precision)
+* [Customize the Rating Appearance](slug://rating-templates)
 
 ## See Also
 
diff --git a/components/rootcomponent/overview.md b/components/rootcomponent/overview.md
index b261d3b14c..9baf5a3cda 100644
--- a/components/rootcomponent/overview.md
+++ b/components/rootcomponent/overview.md
@@ -17,13 +17,13 @@ The `TelerikRootComponent` is a special component in Telerik UI for Blazor. Its
 
 The `TelerikRootComponent` is responsible for the following tasks:
 
-* It provides settings to all its child Telerik components, for example, for the [icon type]({%slug common-features-icons%}#set-global-icon-type) or [right-to-left (RTL) support]({%slug rtl-support%}).
+* It provides settings to all its child Telerik components, for example, for the [icon type](slug://common-features-icons#set-global-icon-type) or [right-to-left (RTL) support](slug://rtl-support).
 * It renders all Telerik popups, which has the following benefits:
     * It's more reliable that the popups will display on top of the other page content.
     * There is no risk for the popups to be trapped by scrollable containers, or clipped by containers with an `overflow:hidden` style.
-* It exposes the `DialogFactory` for using [predefined dialogs]({%slug dialog-predefined%}).
+* It exposes the `DialogFactory` for using [predefined dialogs](slug://dialog-predefined).
 
-The `TelerikRootComponent` achieves all these tasks with the help of [cascading values](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/cascading-values-and-parameters). That's why it is crucial for the root component to wrap all other Telerik components in the app, otherwise an [exception may occur]({%slug common-kb-component-requires-telerikrootcomponent%}). To ensure correct popup position, it is also highly recommended for the `TelerikRootComponent` to be the top-level component in the app and wrap all other content, including the application layout.
+The `TelerikRootComponent` achieves all these tasks with the help of [cascading values](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/cascading-values-and-parameters). That's why it is crucial for the root component to wrap all other Telerik components in the app, otherwise an [exception may occur](slug://common-kb-component-requires-telerikrootcomponent). To ensure correct popup position, it is also highly recommended for the `TelerikRootComponent` to be the top-level component in the app and wrap all other content, including the application layout.
 
 
 ## Using TelerikRootComponent
@@ -64,7 +64,7 @@ However, you can also add `<TelerikRootComponent>` directly to an existing appli
 * The `TelerikRootComponent` must reside in an interactive layout or component.
 * Application layouts are interactive only if the whole app is interactive. To achieve this, set **Interactivity location** of the app to **Global** during app creation.
 
-If you are using Telerik components in a Blazor app with **Per page/component** interactivity location, then learn [how to correctly add the `TelerikRootComponent`]({%slug rootcomponent-percomponent%}) in this case.
+If you are using Telerik components in a Blazor app with **Per page/component** interactivity location, then learn [how to correctly add the `TelerikRootComponent`](slug://rootcomponent-percomponent) in this case.
 
 
 ## TelerikRootComponent Parameters
@@ -73,9 +73,9 @@ If you are using Telerik components in a Blazor app with **Per page/component**
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `EnableRtl` | `bool` | Enables [right-to-left (RTL) support]({%slug rtl-support%}). |
-| `IconType` | `IconType` enum <br /> (`Svg`) | The icon type, which other Telerik components will use to render internal icons. Regardless of this parameter value, you can freely use the [`<TelerikFontIcon>`]({%slug common-features-icons%}#fonticon-component) and [`<TelerikSvgIcon>`]({%slug common-features-icons%}#svgicon-component) components, and [set the `Icon` parameter of other Telerik components]({%slug button-icons%}) to any type that you wish. |
-| `Localizer` | `Telerik.Blazor.Services.ITelerikStringLocalizer` | The Telerik localization service. The recommended approach is to [define the localizer as a service in `Program.cs`]({%slug globalization-localization%}). Use the `Localizer` parameter only in special cases when this is not possible. |
+| `EnableRtl` | `bool` | Enables [right-to-left (RTL) support](slug://rtl-support). |
+| `IconType` | `IconType` enum <br /> (`Svg`) | The icon type, which other Telerik components will use to render internal icons. Regardless of this parameter value, you can freely use the [`<TelerikFontIcon>`](slug://common-features-icons#fonticon-component) and [`<TelerikSvgIcon>`](slug://common-features-icons#svgicon-component) components, and [set the `Icon` parameter of other Telerik components](slug://button-icons) to any type that you wish. |
+| `Localizer` | `Telerik.Blazor.Services.ITelerikStringLocalizer` | The Telerik localization service. The recommended approach is to [define the localizer as a service in `Program.cs`](slug://globalization-localization). Use the `Localizer` parameter only in special cases when this is not possible. |
 
 ### TelerikRootComponent Settings
 
@@ -83,6 +83,6 @@ The `TelerikRootComponent` exposes and additional `<RootComponentSettings>` tag
 
 ## See Also
 
-* [Popup Troubleshooting]({%slug troubleshooting-general-issues%})
-* [Setting up Telerik Blazor apps]({%slug getting-started/what-you-need%})
-* [Exception: Telerik component requires a TelerikRootComponent]({%slug common-kb-component-requires-telerikrootcomponent%})
+* [Popup Troubleshooting](slug://troubleshooting-general-issues)
+* [Setting up Telerik Blazor apps](slug://getting-started/what-you-need)
+* [Exception: Telerik component requires a TelerikRootComponent](slug://common-kb-component-requires-telerikrootcomponent)
diff --git a/components/rootcomponent/per-component-interactivity-location.md b/components/rootcomponent/per-component-interactivity-location.md
index 20503f672f..79ed299d3c 100644
--- a/components/rootcomponent/per-component-interactivity-location.md
+++ b/components/rootcomponent/per-component-interactivity-location.md
@@ -17,7 +17,7 @@ position: 10
 
 The `TelerikRootComponent` must [reside in an interactive layout or component in order to pass cascading values](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/cascading-values-and-parameters?view=aspnetcore-8.0#cascading-valuesparameters-and-render-mode-boundaries) to all other Telerik Blazor components. The `TelerikRootComponent` placement in the app depends on the selected **Interactivity location** during app creation.
 
-In apps with **Global** interactivity location, it's best to [add the `TelerikRootComponent` to a layout]({%slug rootcomponent-overview%}#using-telerikrootcomponent).
+In apps with **Global** interactivity location, it's best to [add the `TelerikRootComponent` to a layout](slug://rootcomponent-overview#using-telerikrootcomponent).
 
 In apps with **Per page/component** interactivity, the layout files are static. There are three options to use the `TelerikRootComponent` in this case:
 
@@ -30,7 +30,7 @@ The sections below provide additional information for each of the three options.
 
 ## Add TelerikRootComponent to Interactive Pages
 
-In this scenario, add a `TelerikRootComponent` to all interactive `.razor` pages, which host Telerik Blazor components. The `TelerikRootComponent` will not wrap all the page content, so a possible side effect may be [wrong popup position]({%slug troubleshooting-general-issues%}#wrong-popup-position). Component interactivity is inherited, so nested components will not need to be explicitly interactive.
+In this scenario, add a `TelerikRootComponent` to all interactive `.razor` pages, which host Telerik Blazor components. The `TelerikRootComponent` will not wrap all the page content, so a possible side effect may be [wrong popup position](slug://troubleshooting-general-issues#wrong-popup-position). Component interactivity is inherited, so nested components will not need to be explicitly interactive.
 
 Here are the detailed steps:
 
@@ -88,12 +88,12 @@ Here are the detailed steps:
 }
 ````
 
-> When the `TelerikRootComponent` is added to a `.razor` file, you cannot reference the `DialogFactory` and use [predefined dialogs]({%slug dialog-predefined%}) in the same `.razor` file. The `DialogFactory` will be available to child components of the `TelerikRootComponent`. However, a [workaround exists](https://github.com/telerik/blazor-ui/tree/master/rootcomponent/BlazorWebAppServer).
+> When the `TelerikRootComponent` is added to a `.razor` file, you cannot reference the `DialogFactory` and use [predefined dialogs](slug://dialog-predefined) in the same `.razor` file. The `DialogFactory` will be available to child components of the `TelerikRootComponent`. However, a [workaround exists](https://github.com/telerik/blazor-ui/tree/master/rootcomponent/BlazorWebAppServer).
 
 
 ## Change the App Render Mode at Runtime
 
-In this scenario, [add a `TelerikRootComponent` to a layout]({%slug rootcomponent-overview%}#using-telerikrootcomponent) as if the application has **Global** interactivity location. Then, enable global interactivity at runtime when the user navigates to a page (component) with Telerik components inside. To do this, [set the `@rendermode` conditionally in `App.razor`](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0#set-the-render-mode-by-component-instance). Blazor Web Apps with identity use the [same approach to disable interactivity in the `Account` section](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0#area-folder-of-static-ssr-components).
+In this scenario, [add a `TelerikRootComponent` to a layout](slug://rootcomponent-overview#using-telerikrootcomponent) as if the application has **Global** interactivity location. Then, enable global interactivity at runtime when the user navigates to a page (component) with Telerik components inside. To do this, [set the `@rendermode` conditionally in `App.razor`](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0#set-the-render-mode-by-component-instance). Blazor Web Apps with identity use the [same approach to disable interactivity in the `Account` section](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0#area-folder-of-static-ssr-components).
 
 >caption Change render mode at runtime in App.razor
 
@@ -137,12 +137,12 @@ In this scenario, use a regular layout (`MainLayout.razor`) for static pages and
 1. [Reference `EmptyLayout.razor` in a Razor component with Telerik Blazor components inside](https://github.com/telerik/blazor-ui/blob/master/rootcomponent/BlazorWebAppServer/Components/Pages/PageWithEmptyLayout.razor).
 1. Wrap all Telerik components in a `<LayoutContainer>` component.
 
-This code duplication requires more effort to maintain, but avoids [possible issues with popup position]({%slug troubleshooting-general-issues%}#wrong-popup-position). The approach is applicable to Blazor Web Apps with **Server** render mode. Apps with **WebAssembly** or **Auto** render mode, and **Per page/component** interactivity, have their layout files and interactive `.razor` components in separate projects, which limits the ability to switch layouts.
+This code duplication requires more effort to maintain, but avoids [possible issues with popup position](slug://troubleshooting-general-issues#wrong-popup-position). The approach is applicable to Blazor Web Apps with **Server** render mode. Apps with **WebAssembly** or **Auto** render mode, and **Per page/component** interactivity, have their layout files and interactive `.razor` components in separate projects, which limits the ability to switch layouts.
 
 
 ## See Also
 
 * [Blazor Web App sample project on GitHub](https://github.com/telerik/blazor-ui/tree/master/rootcomponent/BlazorWebAppServer)
-* [Setting up Telerik Blazor apps]({%slug getting-started/what-you-need%})
+* [Setting up Telerik Blazor apps](slug://getting-started/what-you-need)
 * [ASP.NET Core Blazor render modes](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes)
 * [Video: Intro to Blazor in .NET 8 - SSR, Stream Rendering, Auto](https://www.youtube.com/watch?v=walv3nLTJ5g)
diff --git a/components/sankey/accessibility/wai-aria-support.md b/components/sankey/accessibility/wai-aria-support.md
index 0a659d9349..25b774dc0d 100644
--- a/components/sankey/accessibility/wai-aria-support.md
+++ b/components/sankey/accessibility/wai-aria-support.md
@@ -70,9 +70,9 @@ The Sankey has been tested with the following screen readers and browsers combin
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor Sankey Demos](https://demos.telerik.com/blazor-ui/sankey/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/sankey/data-bind.md b/components/sankey/data-bind.md
index 110dc725f0..e677d5f2f7 100644
--- a/components/sankey/data-bind.md
+++ b/components/sankey/data-bind.md
@@ -37,7 +37,7 @@ The `SankeyDataLink` object contains all the information for the link. It expose
 | `TargetId` | `object` | The target node ID of the link. The target node is the node to which the link points. Required. |
 | `Value` | `double?` | The value of the link. The value represents the weight of the link and determines the width of the link. Required. |
 
->tip The visual properties (`Color`, `Opacity` etc.) are not required. You can use these properties to [provide custom settings for the separate links through the data](#customize-elements-through-data). If you want to apply the same settings for all the links in the Sankey use the [component options]({%slug sankey-links%}).
+>tip The visual properties (`Color`, `Opacity` etc.) are not required. You can use these properties to [provide custom settings for the separate links through the data](#customize-elements-through-data). If you want to apply the same settings for all the links in the Sankey use the [component options](slug://sankey-links).
 
 ### Node
 
@@ -54,7 +54,7 @@ The `SankeyDataNode` object contains all the information for the node and its la
 | `Width` | `double?` <br/> (`24`)| The width of the node. |
 | `Align` | [`SankeyNodesAlign?` enum](/blazor-ui/api/telerik.blazor.sankeynodesalign) <br/> (`Stretch`) | The alignment of the node.|
 
->tip The visual properties (`Color`, `Opacity` etc.) are not required. You can use these properties to [provide custom settings for the separate nodes through the data](#customize-elements-through-data).  If you want to apply the same settings for all the nodes and labels in the Sankey use the component options for [nodes]({%slug sankey-nodes%}) and [labels]({%slug sankey-labels%}).
+>tip The visual properties (`Color`, `Opacity` etc.) are not required. You can use these properties to [provide custom settings for the separate nodes through the data](#customize-elements-through-data).  If you want to apply the same settings for all the nodes and labels in the Sankey use the component options for [nodes](slug://sankey-nodes) and [labels](slug://sankey-labels).
 
 ## Customize Elements Through Data
 
@@ -142,13 +142,13 @@ The example below showcases binding the Sankey data and adding some specific opt
 
 ## Next Steps
 
-* [Add a Title to the Sankey Diagram]({%slug sankey-title%})
-* [Configure the Sankey Legend]({%slug sankey-legend%})
-* [Explore the Sankey Events]({%slug sankey-events%})
+* [Add a Title to the Sankey Diagram](slug://sankey-title)
+* [Configure the Sankey Legend](slug://sankey-legend)
+* [Explore the Sankey Events](slug://sankey-events)
 
 ## See Also
 
 * [Live Demo: Sankey Diagram](https://demos.telerik.com/blazor-ui/sankey/overview)
-* [Sankey Links]({%slug sankey-links%})
-* [Sankey Nodes]({%slug sankey-nodes%})
-* [Sankey Labels]({%slug sankey-labels%})
\ No newline at end of file
+* [Sankey Links](slug://sankey-links)
+* [Sankey Nodes](slug://sankey-nodes)
+* [Sankey Labels](slug://sankey-labels)
\ No newline at end of file
diff --git a/components/sankey/elements/labels.md b/components/sankey/elements/labels.md
index 62b95056c4..8e43fc48be 100644
--- a/components/sankey/elements/labels.md
+++ b/components/sankey/elements/labels.md
@@ -11,9 +11,9 @@ position: 5
 
 # Sankey Labels
 
-The Sankey diagram Labels represent the [node]({%slug sankey-nodes%}) names. The labels can show over the nodes or next to them. This article explains how to customize the labels in the UI for Blazor Sankey diagram. Each setting applies to all labels in the Sankey diagram.
+The Sankey diagram Labels represent the [node](slug://sankey-nodes) names. The labels can show over the nodes or next to them. This article explains how to customize the labels in the UI for Blazor Sankey diagram. Each setting applies to all labels in the Sankey diagram.
 
->tip Each setting applies to all labels in the Sankey diagram. If you want to provide different settings for the separate labels, [customize them through the data source]({%slug sankey-data-binding%}#customize-elements-through-data).
+>tip Each setting applies to all labels in the Sankey diagram. If you want to provide different settings for the separate labels, [customize them through the data source](slug://sankey-data-binding#customize-elements-through-data).
 
 ## Basic Customization
 
@@ -134,8 +134,8 @@ The `<SankeyLabelsStroke>` child tag provides the following properties:
 ## See Also
 
 * [Live Demo: Sankey Diagram Configuration](https://demos.telerik.com/blazor-ui/sankey/configuration)
-* [Sankey Links]({%slug sankey-links%})
-* [Sankey Nodes]({%slug sankey-nodes%})
-* [Sankey Legend]({%slug sankey-legend%})
-* [Sankey Title]({%slug sankey-title%})
-* [Sankey Tooltip]({%slug sankey-tooltip%})
\ No newline at end of file
+* [Sankey Links](slug://sankey-links)
+* [Sankey Nodes](slug://sankey-nodes)
+* [Sankey Legend](slug://sankey-legend)
+* [Sankey Title](slug://sankey-title)
+* [Sankey Tooltip](slug://sankey-tooltip)
\ No newline at end of file
diff --git a/components/sankey/elements/legend.md b/components/sankey/elements/legend.md
index 73edb2cebb..60ddeecd8c 100644
--- a/components/sankey/elements/legend.md
+++ b/components/sankey/elements/legend.md
@@ -108,8 +108,8 @@ The `<SankeyLegend>` tag exposes nested tags for further customization of the se
 ## See Also
 
 * [Live Demo: Sankey Diagram Configuration](https://demos.telerik.com/blazor-ui/sankey/configuration)
-* [Sankey Links]({%slug sankey-links%})
-* [Sankey Nodes]({%slug sankey-nodes%})
-* [Sankey Labels]({%slug sankey-labels%})
-* [Sankey Tooltip]({%slug sankey-tooltip%})
-* [Sankey Title]({%slug sankey-title%})
\ No newline at end of file
+* [Sankey Links](slug://sankey-links)
+* [Sankey Nodes](slug://sankey-nodes)
+* [Sankey Labels](slug://sankey-labels)
+* [Sankey Tooltip](slug://sankey-tooltip)
+* [Sankey Title](slug://sankey-title)
\ No newline at end of file
diff --git a/components/sankey/elements/links.md b/components/sankey/elements/links.md
index 6da6bf3546..67d3a22263 100644
--- a/components/sankey/elements/links.md
+++ b/components/sankey/elements/links.md
@@ -11,9 +11,9 @@ position: 3
 
 # Sankey Links
 
-The Sankey Diagram Links are the lines that connect the [nodes]({%slug sankey-nodes%}) to each other. The greater the value of the link, the greater the width of the link will be. This article explains how to customize the links in the UI for Blazor Sankey Diagram.
+The Sankey Diagram Links are the lines that connect the [nodes](slug://sankey-nodes) to each other. The greater the value of the link, the greater the width of the link will be. This article explains how to customize the links in the UI for Blazor Sankey Diagram.
 
->tip Each setting applies to all links in the Sankey Diagram. If you want to provide different settings for the separate links, [customize them through the data source]({%slug sankey-data-binding%}#customize-elements-through-data).
+>tip Each setting applies to all links in the Sankey Diagram. If you want to provide different settings for the separate links, [customize them through the data source](slug://sankey-data-binding#customize-elements-through-data).
 
 ## Basic Customization
 
@@ -86,8 +86,8 @@ The `<SankeyLinks>` tag exposes a child `<SankeyLinksHighlight>` tag that allows
 ## See Also
 
 * [Live Demo: Sankey Diagram Configuration](https://demos.telerik.com/blazor-ui/sankey/configuration)
-* [Sankey Nodes]({%slug sankey-nodes%})
-* [Sankey Labels]({%slug sankey-labels%})
-* [Sankey Legend]({%slug sankey-legend%})
-* [Sankey Title]({%slug sankey-title%})
-* [Sankey Tooltip]({%slug sankey-tooltip%})
\ No newline at end of file
+* [Sankey Nodes](slug://sankey-nodes)
+* [Sankey Labels](slug://sankey-labels)
+* [Sankey Legend](slug://sankey-legend)
+* [Sankey Title](slug://sankey-title)
+* [Sankey Tooltip](slug://sankey-tooltip)
\ No newline at end of file
diff --git a/components/sankey/elements/nodes.md b/components/sankey/elements/nodes.md
index 8a1d7e01bf..6479a01196 100644
--- a/components/sankey/elements/nodes.md
+++ b/components/sankey/elements/nodes.md
@@ -11,9 +11,9 @@ position: 0
 
 # Sankey Nodes
 
-The Sankey diagram Nodes are rectangular elements that are being connected. They can be source and target for the [links]({%slug sankey-links%}). This article explains how to customize the nodes in the UI for Blazor Sankey diagram. 
+The Sankey diagram Nodes are rectangular elements that are being connected. They can be source and target for the [links](slug://sankey-links). This article explains how to customize the nodes in the UI for Blazor Sankey diagram. 
 
->tip Each setting applies to all nodes in the Sankey diagram. If you want to provide different settings for the separate nodes, [customize them through the data source]({%slug sankey-data-binding%}#customize-elements-through-data).
+>tip Each setting applies to all nodes in the Sankey diagram. If you want to provide different settings for the separate nodes, [customize them through the data source](slug://sankey-data-binding#customize-elements-through-data).
 
 ## Basic Customization
 
@@ -86,8 +86,8 @@ The `<SankeyNodes>` tag exposes a child `<SankeyNodesOffset>` tag that allows yo
 ## See Also
 
 * [Live Demo: Sankey Diagram Configuration](https://demos.telerik.com/blazor-ui/sankey/configuration)
-* [Sankey Links]({%slug sankey-links%})
-* [Sankey Labels]({%slug sankey-labels%})
-* [Sankey Legend]({%slug sankey-legend%})
-* [Sankey Title]({%slug sankey-title%})
-* [Sankey Tooltip]({%slug sankey-tooltip%})
\ No newline at end of file
+* [Sankey Links](slug://sankey-links)
+* [Sankey Labels](slug://sankey-labels)
+* [Sankey Legend](slug://sankey-legend)
+* [Sankey Title](slug://sankey-title)
+* [Sankey Tooltip](slug://sankey-tooltip)
\ No newline at end of file
diff --git a/components/sankey/elements/title.md b/components/sankey/elements/title.md
index c104027c02..de59d44ad1 100644
--- a/components/sankey/elements/title.md
+++ b/components/sankey/elements/title.md
@@ -96,8 +96,8 @@ The `<SankeyTitle>` tag exposes nested tags for further customization. The struc
 ## See Also
 
 * [Live Demo: Sankey Diagram Configuration](https://demos.telerik.com/blazor-ui/sankey/configuration)
-* [Sankey Links]({%slug sankey-links%})
-* [Sankey Nodes]({%slug sankey-nodes%})
-* [Sankey Labels]({%slug sankey-labels%})
-* [Sankey Legend]({%slug sankey-legend%})
-* [Sankey Tooltip]({%slug sankey-tooltip%})
\ No newline at end of file
+* [Sankey Links](slug://sankey-links)
+* [Sankey Nodes](slug://sankey-nodes)
+* [Sankey Labels](slug://sankey-labels)
+* [Sankey Legend](slug://sankey-legend)
+* [Sankey Tooltip](slug://sankey-tooltip)
\ No newline at end of file
diff --git a/components/sankey/elements/tooltip.md b/components/sankey/elements/tooltip.md
index d273dd55d5..8a61c9c79d 100644
--- a/components/sankey/elements/tooltip.md
+++ b/components/sankey/elements/tooltip.md
@@ -116,8 +116,8 @@ The `NodeTemplate` controls the content of the Tooltip that will appear when the
 ## See Also
 
 * [Live Demo: Sankey Diagram Configuration](https://demos.telerik.com/blazor-ui/sankey/configuration)
-* [Sankey Links]({%slug sankey-links%})
-* [Sankey Nodes]({%slug sankey-nodes%})
-* [Sankey Labels]({%slug sankey-labels%})
-* [Sankey Legend]({%slug sankey-legend%})
-* [Sankey Title]({%slug sankey-title%})
+* [Sankey Links](slug://sankey-links)
+* [Sankey Nodes](slug://sankey-nodes)
+* [Sankey Labels](slug://sankey-labels)
+* [Sankey Legend](slug://sankey-legend)
+* [Sankey Title](slug://sankey-title)
diff --git a/components/sankey/overview.md b/components/sankey/overview.md
index 12dd79d698..730fa6dce4 100644
--- a/components/sankey/overview.md
+++ b/components/sankey/overview.md
@@ -16,8 +16,8 @@ The <a href = "https://www.telerik.com/blazor-ui/sankey-chart" target="_blank">B
 ## Creating Blazor Sankey Diagram
 
 1. Add the `<TelerikSankey>` tag to your razor page.
-1. [Bind the Sankey Data]({%slug sankey-data-binding%}) - the Sankey diagram expects its data to have a specific structure and use specific object types.
-1. (Optional) Set the [`ColorType` of the `SankeyLinks`]({%slug sankey-links%}).
+1. [Bind the Sankey Data](slug://sankey-data-binding) - the Sankey diagram expects its data to have a specific structure and use specific object types.
+1. (Optional) Set the [`ColorType` of the `SankeyLinks`](slug://sankey-links).
 1. (Optional) Set `Width` and `Height` of the Sankey chart.
 
 >caption Sankey diagram with width, height and link colors based on the source nodes
@@ -69,25 +69,25 @@ The <a href = "https://www.telerik.com/blazor-ui/sankey-chart" target="_blank">B
 
 The Sankey component uses three main building blocks for the visual data representation:
 
-* [Nodes]({%slug sankey-nodes%}) - rectangular elements that can be connected to each other.
-* [Labels]({%slug sankey-labels%}) - the names of the nodes.
-* [Links]({%slug sankey-links%}) - the lines that connect the nodes to each other.
+* [Nodes](slug://sankey-nodes) - rectangular elements that can be connected to each other.
+* [Labels](slug://sankey-labels) - the names of the nodes.
+* [Links](slug://sankey-links) - the lines that connect the nodes to each other.
 
 ## Data Binding
 
-The Sankey `Data` accepts an object of type `SankeyData` that contains all the information for the nodes, links and labels. [Read more about the data binding specifics in the Sankey diagram...]({%slug sankey-data-binding%})
+The Sankey `Data` accepts an object of type `SankeyData` that contains all the information for the nodes, links and labels. [Read more about the data binding specifics in the Sankey diagram...](slug://sankey-data-binding)
 
 ## Title
 
-You can add a short description of the Sankey's purpose by using the `<SankeyTitle>` tag and the `Text` parameter. In addition, [you can customize the appearance of the title through the dedicated parameters]({%slug sankey-title%}).
+You can add a short description of the Sankey's purpose by using the `<SankeyTitle>` tag and the `Text` parameter. In addition, [you can customize the appearance of the title through the dedicated parameters](slug://sankey-title).
 
 ## Tooltip
 
-The Sankey chart shows a tooltip when the user hovers a node or a link that contains details for the hovered element. Use the [Tooltip Templates if you want to customize their content and appearance]({%slug sankey-tooltip%}).
+The Sankey chart shows a tooltip when the user hovers a node or a link that contains details for the hovered element. Use the [Tooltip Templates if you want to customize their content and appearance](slug://sankey-tooltip).
 
 ## Legend
 
-By design, the Sankey renders a legend that illustrates the node details. You can [customize the legend or remove it]({%slug sankey-legend%}) depending on the application needs.
+By design, the Sankey renders a legend that illustrates the node details. You can [customize the legend or remove it](slug://sankey-legend) depending on the application needs.
 
 ## Sankey Parameters
 
@@ -102,8 +102,8 @@ The Blazor Sankey diagram provides various parameters to configure the component
 
 ## Next Steps
 
-* [Bind Data to the Sankey Diagram]({%slug sankey-data-binding%})
-* [Explore the Sankey Elements]({%slug sankey-events%})
+* [Bind Data to the Sankey Diagram](slug://sankey-data-binding)
+* [Explore the Sankey Elements](slug://sankey-events)
 
 ## See Also
 
diff --git a/components/scheduler/accessibility/wai-aria-support.md b/components/scheduler/accessibility/wai-aria-support.md
index 39ee4cfea8..0843d9f6c7 100644
--- a/components/scheduler/accessibility/wai-aria-support.md
+++ b/components/scheduler/accessibility/wai-aria-support.md
@@ -130,4 +130,4 @@ For details on how the Scheduler keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/scheduler/data-bind.md b/components/scheduler/data-bind.md
index d73b05bf32..036fb37e6b 100644
--- a/components/scheduler/data-bind.md
+++ b/components/scheduler/data-bind.md
@@ -29,7 +29,7 @@ Some of the Scheduler features and behaviors depend directly on values in the ap
 * Define a model with *default (expected) property names*. In this case, the Scheduler will recognize and use the properties automatically. See [an example with default field names](#example-with-default-field-names).
 * Define *custom property names*. In this case, define the property names as parameters of the `<TelerikScheduler>` tag. The parameter names derive from the default property names, for example `IdField`, `TitleField`, `StartField`, etc. See [an example with custom field names](#example-with-custom-field-names).
 
->tip The Scheduler model can carry additional information in other existing properties, that will be used by your application logic, or in [Scheduler item templates]({%slug scheduler-templates-appointment%}).
+>tip The Scheduler model can carry additional information in other existing properties, that will be used by your application logic, or in [Scheduler item templates](slug://scheduler-templates-appointment).
 
 The following table lists the default property names and explains how the Scheduler uses these properties. The appointment model needs to provide all properties from the list below, no matter if they have the same names or not.
 
@@ -246,8 +246,8 @@ The Scheduler edit form works with an instance that that the scheduler creates f
 
 ## Next Steps
 
-* [Configure Scheduler views]({%slug scheduler-views-overview%})
-* [Enable Scheduler editing]({%slug scheduler-appointments-edit%})
+* [Configure Scheduler views](slug://scheduler-views-overview)
+* [Enable Scheduler editing](slug://scheduler-appointments-edit)
 
 
 ## See Also
diff --git a/components/scheduler/editing/delete-confirmation-dialog.md b/components/scheduler/editing/delete-confirmation-dialog.md
index d546edb28c..8df8eb1355 100644
--- a/components/scheduler/editing/delete-confirmation-dialog.md
+++ b/components/scheduler/editing/delete-confirmation-dialog.md
@@ -16,7 +16,7 @@ This article provides information on how to enable the built-in delete confirmat
 
 ## Basics
 
-The built-in delete confirmation dialog triggers before event deletion. You can enable it by setting the `ConfirmDelete` parameter of the Scheduler to `true`. The default texts of the dialog are exposed in the [localization]({%slug globalization-localization%}) messages of the component, and you can customize them.
+The built-in delete confirmation dialog triggers before event deletion. You can enable it by setting the `ConfirmDelete` parameter of the Scheduler to `true`. The default texts of the dialog are exposed in the [localization](slug://globalization-localization) messages of the component, and you can customize them.
 
 >important This dialog displays only for **single** events, **not** for recurring. The built-in delete confirmation dialog for recurring events is **not** changed.
 
@@ -160,8 +160,8 @@ The built-in delete confirmation dialog triggers before event deletion. You can
 
 ## See Also
 
-  * [Data Binding]({%slug scheduler-appointments-databinding%})
+  * [Data Binding](slug://scheduler-appointments-databinding)
   * [Live Demo: Appointment Editing](https://demos.telerik.com/blazor-ui/scheduler/appointment-editing)
   * [Custom Edit Form](https://github.com/telerik/blazor-ui/tree/master/scheduler/custom-edit-form)
-  * [Customize the Delete Confirmation Dialog]({%slug grid-kb-customize-delete-confirmation-dialog%})
+  * [Customize the Delete Confirmation Dialog](slug://grid-kb-customize-delete-confirmation-dialog)
 
diff --git a/components/scheduler/editing/edit-appointments.md b/components/scheduler/editing/edit-appointments.md
index 0526772552..2a3e27f4a0 100644
--- a/components/scheduler/editing/edit-appointments.md
+++ b/components/scheduler/editing/edit-appointments.md
@@ -83,7 +83,7 @@ The UI for the scheduler provides the following options for interacting with the
 
 ## Delete Confirmation Dialog
 
-When the user clicks the close button (`x`) of the appointment a confirmation dialog will appear. To read more information see the [Delete Confirmation Dialog article]({%slug scheduler-delete-confirmation-dialog%}).
+When the user clicks the close button (`x`) of the appointment a confirmation dialog will appear. To read more information see the [Delete Confirmation Dialog article](slug://scheduler-delete-confirmation-dialog).
 
 
 ## Example
@@ -313,6 +313,6 @@ The example below shows the signature of the event handlers so you can copy the
 
 ## See Also
 
-  * [Data Binding]({%slug scheduler-appointments-databinding%})
+  * [Data Binding](slug://scheduler-appointments-databinding)
   * [Live Demo: Appointment Editing](https://demos.telerik.com/blazor-ui/scheduler/appointment-editing)
   * [Custom Edit Form](https://github.com/telerik/blazor-ui/tree/master/scheduler/custom-edit-form)
diff --git a/components/scheduler/editing/edit-popup-customization.md b/components/scheduler/editing/edit-popup-customization.md
index 367509bc70..f01031aa8e 100644
--- a/components/scheduler/editing/edit-popup-customization.md
+++ b/components/scheduler/editing/edit-popup-customization.md
@@ -98,6 +98,6 @@ The `SchedulerPopupEditFormSettings` nested tag exposes the following parameters
 
 ## See Also
 
-  * [Data Binding]({%slug scheduler-appointments-databinding%})
+  * [Data Binding](slug://scheduler-appointments-databinding)
   * [Live Demo: Appointment Editing](https://demos.telerik.com/blazor-ui/scheduler/appointment-editing)
   * [Custom Edit Form](https://github.com/telerik/blazor-ui/tree/master/scheduler/custom-edit-form)
diff --git a/components/scheduler/events.md b/components/scheduler/events.md
index 5b261f8d10..4a3c48c743 100644
--- a/components/scheduler/events.md
+++ b/components/scheduler/events.md
@@ -24,7 +24,7 @@ This article explains the events available in the Telerik Scheduler for Blazor:
 
 ## CUD Events
 
-To implement appointment editing, the scheduler exposes the `OnCreate`, `OnDelete` and `OnUpdate` events. They let you propagate the changes the user makes in the UI to the view model and to the data storage. You can read mode in the [Appointment Editing]({%slug scheduler-appointments-edit%}) article.
+To implement appointment editing, the scheduler exposes the `OnCreate`, `OnDelete` and `OnUpdate` events. They let you propagate the changes the user makes in the UI to the view model and to the data storage. You can read mode in the [Appointment Editing](slug://scheduler-appointments-edit) article.
 
 ## OnModelInit
 
@@ -838,7 +838,7 @@ It provides a `SchedulerItemContextMenuEventArgs` object to the event handler an
 
 The `OnItemRender` event fires when an appointment is going to be rendered in the scheduler. It fires one for every appointment, including all-day appointments that span several days/slots, and the class is rendered on all elements.
 
-Through its event arguments you can get the `Item` to cast it to your model type and to set the `Class` that will render on the appointment wrapping element. This lets you customize the appearance of the entire appointment, not just the contents of its [template]({%slug scheduler-templates-appointment%}).
+Through its event arguments you can get the `Item` to cast it to your model type and to set the `Class` that will render on the appointment wrapping element. This lets you customize the appearance of the entire appointment, not just the contents of its [template](slug://scheduler-templates-appointment).
 
 >caption Customize the appearance of the scheduler appointments by adding custom CSS classes to them conditionally
 
@@ -946,7 +946,7 @@ The handler receives an argument of type `SchedulerCellRenderEventArgs` which ex
 | --- | --- | --- |
 | `Class` | `string` | The CSS class that will be applied to the cell. |
 | `IsAllDay` | `bool` | Whether the slot is inside the `AllDay` row/column.
-| `Resources` | `List<KeyValuePair<string, object>` | The resources that are associated with the column/row. Applicable when the Scheduler uses both - [resources]({%slug scheduler-resources%}) and [grouping]({%slug scheduler-resource-grouping%}). Needed to differentiate between the same dates within different groups. |
+| `Resources` | `List<KeyValuePair<string, object>` | The resources that are associated with the column/row. Applicable when the Scheduler uses both - [resources](slug://scheduler-resources) and [grouping](slug://scheduler-resource-grouping). Needed to differentiate between the same dates within different groups. |
 | `Start` | `DateTime` | The slot start time. |
 | `End` | `DateTime` | The slot end time. |
 
@@ -1039,7 +1039,7 @@ The handler receives an argument of type `SchedulerCellRenderEventArgs` which ex
 
 ## DateChanged
 
-The `DateChanged` event fires when the user [navigates]({%slug scheduler-navigation%}) to another date in the scheduler. For a view whose start is determined by outside factors and not only by the `Date` parameter (the week view), the event argument may not always be the start time of the range, but a date contained within the range. You could also use this event to load only appointments from the view's range which can be a performance optimization technique if you have a very large number of appointments.
+The `DateChanged` event fires when the user [navigates](slug://scheduler-navigation) to another date in the scheduler. For a view whose start is determined by outside factors and not only by the `Date` parameter (the week view), the event argument may not always be the start time of the range, but a date contained within the range. You could also use this event to load only appointments from the view's range which can be a performance optimization technique if you have a very large number of appointments.
 
 >caption Handle the `DateChanged` event
 
@@ -1125,7 +1125,7 @@ The `DateChanged` event fires when the user [navigates]({%slug scheduler-navigat
 
 ## ViewChanged
 
-The `ViewChanged` event fires when the user chooses a new [View]({%slug scheduler-views-overview%}). You can read more about the navigation options the user has in the [Navigation]({%slug scheduler-navigation%}) article.
+The `ViewChanged` event fires when the user chooses a new [View](slug://scheduler-views-overview). You can read more about the navigation options the user has in the [Navigation](slug://scheduler-navigation) article.
 
 >caption Handle the `ViewChanged` event.
 
@@ -1207,8 +1207,8 @@ The `ViewChanged` event fires when the user chooses a new [View]({%slug schedule
 
 ## See Also
 
-* [Scheduler Overview]({%slug scheduler-overview%})
-* [Views Overview]({%slug scheduler-views-overview%})
-* [Scheduler Navigation]({%slug scheduler-navigation%})
-* [Data Binding]({%slug scheduler-appointments-databinding%})
-* [Appointments Editing]({%slug scheduler-appointments-edit%})
+* [Scheduler Overview](slug://scheduler-overview)
+* [Views Overview](slug://scheduler-views-overview)
+* [Scheduler Navigation](slug://scheduler-navigation)
+* [Data Binding](slug://scheduler-appointments-databinding)
+* [Appointments Editing](slug://scheduler-appointments-edit)
diff --git a/components/scheduler/manual-operations.md b/components/scheduler/manual-operations.md
index aa7e0b49cd..79b9600450 100644
--- a/components/scheduler/manual-operations.md
+++ b/components/scheduler/manual-operations.md
@@ -10,7 +10,7 @@ position: 15
 
 # Manual Data Source Operations
 
-By default, the scheduler will receive the entire collection of appointments, and it will perform the necessary operations (like determining which ones to go into the current view) internally to it. You can perform these operations yourself by handling the `OnRead` event of the scheduler as shown in the example below. The data source will be read after each [navigation]({%slug scheduler-navigation%}) as well, to ensure fresh data.
+By default, the scheduler will receive the entire collection of appointments, and it will perform the necessary operations (like determining which ones to go into the current view) internally to it. You can perform these operations yourself by handling the `OnRead` event of the scheduler as shown in the example below. The data source will be read after each [navigation](slug://scheduler-navigation) as well, to ensure fresh data.
 
 The parameter of type `DataSourceRequest` exposes information about the desired paging, filtering and sorting so you can, for example, call your remote endpoint with appropriate parameters so its performance is optimized and it fetches only the relevant data.
 
@@ -196,7 +196,7 @@ Using Telerik DataSource extension methods to manipulate all the data into paged
 
 ## See Also
 
-  * [CRUD Operations Overview]({%slug components/grid/editing/overview%})
+  * [CRUD Operations Overview](slug://components/grid/editing/overview)
   * [Live Demo: Manual Data Source Operations](https://demos.telerik.com/blazor-ui/grid/manual-operations)
   * [Use OData Service](https://github.com/telerik/blazor-ui/tree/master/grid/odata)
   
diff --git a/components/scheduler/navigation.md b/components/scheduler/navigation.md
index 8059d511cf..8377af996e 100644
--- a/components/scheduler/navigation.md
+++ b/components/scheduler/navigation.md
@@ -113,7 +113,7 @@ Change current View:
 
 ## See Also
 
-* [Scheduler Overview]({%slug scheduler-overview%})
-* [Scheduler Views]({%slug scheduler-views-overview%})
+* [Scheduler Overview](slug://scheduler-overview)
+* [Scheduler Views](slug://scheduler-views-overview)
 
 
diff --git a/components/scheduler/overview.md b/components/scheduler/overview.md
index b6eb1768fe..9b82595668 100644
--- a/components/scheduler/overview.md
+++ b/components/scheduler/overview.md
@@ -16,7 +16,7 @@ The <a href="https://www.telerik.com/blazor-ui/scheduler" target="_blank">Blazor
 ## Creating Blazor Scheduler
 
 1. Use the `<TelerikScheduler>` tag.
-1. Set its `Data` parameter to `IEnumerable<TItem>` to define the collection of appointments (events). The Scheduler can [detect and use some property names in the model]({%slug scheduler-appointments-databinding%}#appointment-features), such as `Title`, `Description`, `Start`, `End` and others. Alternatively, you can use different property names and configure them explicitly. See [Data Binding]({%slug scheduler-appointments-databinding%}) for more details.
+1. Set its `Data` parameter to `IEnumerable<TItem>` to define the collection of appointments (events). The Scheduler can [detect and use some property names in the model](slug://scheduler-appointments-databinding#appointment-features), such as `Title`, `Description`, `Start`, `End` and others. Alternatively, you can use different property names and configure them explicitly. See [Data Binding](slug://scheduler-appointments-databinding) for more details.
 1. Define the available views that users can toggle. Each view will be a child tag inside `<SchedulerViews>`.
 1. (optional) Set `StartTime` and `EndTime` for the views, unless users should see the full 24 hours. Only the time portion of these `DateTime` objects will matter.
 1. (optional) Set the Scheduler's `Date` and `View` parameters. By default, users will see today's date and the first view. Both parameters support two-way binding.
@@ -81,12 +81,12 @@ The <a href="https://www.telerik.com/blazor-ui/scheduler" target="_blank">Blazor
 
 ## Data Binding
 
-As a data-driven component, the Scheduler needs a collection of appointments to work with. Learn how to [data bind the Scheduler and configure model property names]({%slug scheduler-appointments-databinding%}).
+As a data-driven component, the Scheduler needs a collection of appointments to work with. Learn how to [data bind the Scheduler and configure model property names](slug://scheduler-appointments-databinding).
 
 
 ## Views
 
-The [Scheduler offers different views]({%slug scheduler-views-overview%}) that are suitable for different user needs:
+The [Scheduler offers different views](slug://scheduler-views-overview) that are suitable for different user needs:
 
 * Day view
 * Multiday view
@@ -97,27 +97,27 @@ The [Scheduler offers different views]({%slug scheduler-views-overview%}) that a
 
 ## Editing
 
-Users can [create, edit and delete Scheduler appointments]({%slug scheduler-appointments-edit%}). The component provides you with the new information so you can store it to the underlying data source.
+Users can [create, edit and delete Scheduler appointments](slug://scheduler-appointments-edit). The component provides you with the new information so you can store it to the underlying data source.
 
 
 ## Navigation
 
-The [Scheduler features extensive navigation]({%slug scheduler-navigation%}), which can be both programmatic and managed by the end user. The component can change the currently visible time range, the current view, and toggle business hours only display.
+The [Scheduler features extensive navigation](slug://scheduler-navigation), which can be both programmatic and managed by the end user. The component can change the currently visible time range, the current view, and toggle business hours only display.
 
 
 ## Templates
 
-You can [customize the appointment appearance and content via Scheduler templates]({%slug scheduler-templates-appointment%}). Another option is to use the [Scheduler `OnItemRender` event]({%slug scheduler-events%}#itemrender).
+You can [customize the appointment appearance and content via Scheduler templates](slug://scheduler-templates-appointment). Another option is to use the [Scheduler `OnItemRender` event](slug://scheduler-events#itemrender).
 
 
 ## Resources and Grouping
 
-[Scheduler resources]({%slug scheduler-resources%}) provide a way to associate and [group appointments]({%slug scheduler-resource-grouping%}) by certain criteria, such as a meeting room, a participating person, or used equipment.
+[Scheduler resources](slug://scheduler-resources) provide a way to associate and [group appointments](slug://scheduler-resource-grouping) by certain criteria, such as a meeting room, a participating person, or used equipment.
 
 
 ## Events
 
-The [Scheduler component fires events]({%slug scheduler-events%}) related to CRUD operations, item (appointment) clicks and user navigation. Use them to gain more information about user actions and enhance the component behavior.
+The [Scheduler component fires events](slug://scheduler-events) related to CRUD operations, item (appointment) clicks and user navigation. Use them to gain more information about user actions and enhance the component behavior.
 
 
 ## Scheduler Parameters
@@ -128,10 +128,10 @@ The following table lists Scheduler parameters, which are not discussed elsewher
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | A custom CSS class for the `<div class="k-scheduler">` element. Use it to [override theme styles]({%slug themes-override%}). |
+| `Class` | `string` | A custom CSS class for the `<div class="k-scheduler">` element. Use it to [override theme styles](slug://themes-override). |
 | `EnableLoaderContainer` | `bool` <br /> (`true`) | Determines if the Scheduler will display a loading animation for operations that take longer than 600 ms. |
-| `Height` | `string` | A `height` style in [any supported unit]({%slug common-features/dimensions%}). |
-| `Width` | `string` | A `width` style in [any supported unit]({%slug common-features/dimensions%}). |
+| `Height` | `string` | A `height` style in [any supported unit](slug://common-features/dimensions). |
+| `Width` | `string` | A `width` style in [any supported unit](slug://common-features/dimensions). |
 
 ## Scheduler Reference and Methods
 
@@ -167,9 +167,9 @@ To execute Scheduler methods, obtain reference to the component instance with `@
 
 ## Next Steps
 
-* [Bind the Scheduler to data]({%slug scheduler-appointments-databinding%})
-* [Configure Scheduler views]({%slug scheduler-views-overview%})
-* [Enable Scheduler editing]({%slug scheduler-appointments-edit%})
+* [Bind the Scheduler to data](slug://scheduler-appointments-databinding)
+* [Configure Scheduler views](slug://scheduler-views-overview)
+* [Enable Scheduler editing](slug://scheduler-appointments-edit)
 
 
 ## See Also
diff --git a/components/scheduler/refresh-data.md b/components/scheduler/refresh-data.md
index 573f3c91f7..f460f3c0f6 100644
--- a/components/scheduler/refresh-data.md
+++ b/components/scheduler/refresh-data.md
@@ -255,6 +255,6 @@ You can refresh the Scheduler data by using the Rebind method exposed to the ref
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
diff --git a/components/scheduler/resource-grouping.md b/components/scheduler/resource-grouping.md
index 2926268963..0bc03c1e12 100644
--- a/components/scheduler/resource-grouping.md
+++ b/components/scheduler/resource-grouping.md
@@ -543,4 +543,4 @@ public class Appointment
 ## See Also
 
 * [Live Demo: Scheduler Grouping](https://demos.telerik.com/blazor-ui/scheduler/grouping)
-* [Scheduler Overview]({%slug scheduler-overview%})
+* [Scheduler Overview](slug://scheduler-overview)
diff --git a/components/scheduler/resources.md b/components/scheduler/resources.md
index cd6d4f362f..6b08850e2f 100644
--- a/components/scheduler/resources.md
+++ b/components/scheduler/resources.md
@@ -36,15 +36,15 @@ To use resources:
 
 1. Under the `SchedulerResources` tag, define a `SchedulerResource` for each type of resource you will be using.
     * Set its `Field` parameter to a string that will point to the name of the field in the appointment that associated appointments with the resource type.
-    * The `Title` parameter defines the text shown for its dropdown in the [edit form]({%slug scheduler-appointments-edit%}).
+    * The `Title` parameter defines the text shown for its dropdown in the [edit form](slug://scheduler-appointments-edit).
 1. Provide a collection of resource entries for each type of resource you will use to the `Data` parameter of the resource.
     * The `ColorField`, `ValueField` and `TextField` let you specify field names in the resource model that contain the data. These fields must all be of type `string`. The default values are `Value`, `Text`, `Color` respectively. If you use them, you don't need to explicitly specify them in the markup.
-1. Define appointments [as usual]({%slug scheduler-appointments-databinding%}). Add a `string` field to them for each resources type they will require. The name of this field must match the value of the `Field` parameter of the resource declaration.
+1. Define appointments [as usual](slug://scheduler-appointments-databinding). Add a `string` field to them for each resources type they will require. The name of this field must match the value of the `Field` parameter of the resource declaration.
     * If you are using multiple resource types, you will need a field for each resource.
 1. Populate the appointment field that matches the resource name with the corresponding `Value` of the resource that you want associated with it.
     * If you don't want any resource in the appointment, define a resource with empty strings in its `Value` and `Color` fields, and a suitable `Text`.
 
->tip To style the appointments, you can also use their [template]({%slug scheduler-templates-appointment%}) and the [ItemRender event]({%slug scheduler-events%}#itemrender).
+>tip To style the appointments, you can also use their [template](slug://scheduler-templates-appointment) and the [ItemRender event](slug://scheduler-events#itemrender).
 
 ## Examples
 
@@ -405,6 +405,6 @@ Actual CRUD operations are not implemented for brevity, just the UX is enabled s
 ## See Also
 
 * [Live Demo: Scheduler Resources](https://demos.telerik.com/blazor-ui/scheduler/resources)
-* [Scheduler Overview]({%slug scheduler-overview%})
-* [Scheduler Data Binding]({%slug scheduler-appointments-databinding%})
-* [Scheduler Appointment Editing]({%slug scheduler-appointments-edit%})
+* [Scheduler Overview](slug://scheduler-overview)
+* [Scheduler Data Binding](slug://scheduler-appointments-databinding)
+* [Scheduler Appointment Editing](slug://scheduler-appointments-edit)
diff --git a/components/scheduler/templates/appointment.md b/components/scheduler/templates/appointment.md
index 75b3af8b67..926664780d 100644
--- a/components/scheduler/templates/appointment.md
+++ b/components/scheduler/templates/appointment.md
@@ -20,11 +20,11 @@ There are two templates:
 
 The appointment template lets you control the rendering of the appointment content, but it keeps the other built-in appointment features - such as drag and resize handles, delete icon, arrows indicating if the appointment spans more than a day.
 
-You can set a template for the entire scheduler, or you can also set templates per [view]({%slug scheduler-views-overview%}). If a template is set on the particular view, it will take precedence over the shared template for the whole scheduler.
+You can set a template for the entire scheduler, or you can also set templates per [view](slug://scheduler-views-overview). If a template is set on the particular view, it will take precedence over the shared template for the whole scheduler.
 
 The `context` of the template is the item that it will display. You can cast it to the model type you use.
 
-You can also style the entire appointments by adding a class to their wrapping element by using the [ItemRender event]({%slug scheduler-events%}#itemrender).
+You can also style the entire appointments by adding a class to their wrapping element by using the [ItemRender event](slug://scheduler-events#itemrender).
 
 >caption Example of using appointment templates and all-day appointment templates in the scheduler. The Month view uses a different template than the other views
 
diff --git a/components/scheduler/templates/dateheader.md b/components/scheduler/templates/dateheader.md
index 67091137f3..42538986f6 100644
--- a/components/scheduler/templates/dateheader.md
+++ b/components/scheduler/templates/dateheader.md
@@ -12,7 +12,7 @@ position: 10
 
 You can use the `DateHeaderTemplate` to customize the rendering of the Scheduler date header cells. This allows you to change the date format, add custom icons or other HTML elements.
 
-The `DateHeaderTemplate` can be defined for the [day and week Scheduler views]({%slug scheduler-views-overview%}). It receives as `context` a `DateTime` object.
+The `DateHeaderTemplate` can be defined for the [day and week Scheduler views](slug://scheduler-views-overview). It receives as `context` a `DateTime` object.
 
 >caption Example of using the DateHeaderTemplate
 
diff --git a/components/scheduler/templates/resource-grouping-header.md b/components/scheduler/templates/resource-grouping-header.md
index c8ca00d0c3..4c4b1a9d79 100644
--- a/components/scheduler/templates/resource-grouping-header.md
+++ b/components/scheduler/templates/resource-grouping-header.md
@@ -15,7 +15,7 @@ You can use the `SchedulerResourceGroupHeaderTemplate` to customize the renderin
 The `SchedulerResourceGroupHeaderTemplate`:
 * Is invoked for each resource when the Scheduler is configured to have resources and grouping.
 * Applies in both horizontal and vertical grouping.
-* Can be defined individually for each [Scheduler view]({%slug scheduler-views-overview%}).
+* Can be defined individually for each [Scheduler view](slug://scheduler-views-overview).
 
 The `context` of the template is a `SchedulerResourceGroupHeaderTemplateContext` object that contains:
 
diff --git a/components/scheduler/templates/slot.md b/components/scheduler/templates/slot.md
index 87250e7ac4..e0877a102e 100644
--- a/components/scheduler/templates/slot.md
+++ b/components/scheduler/templates/slot.md
@@ -17,7 +17,7 @@ You can use the `SlotTemplate` and the `AllDaySlotTemplate` to customize the ren
 
 ## AllDaySlotTemplate
 
-Use the `AllDaySlotTemplate` to provide a custom rendering for the cells in the Telerik Scheduler for Blazor that span across a full day. This template can be defined for the [Day, Multiday, and Week Scheduler views]({%slug scheduler-views-overview%}). 
+Use the `AllDaySlotTemplate` to provide a custom rendering for the cells in the Telerik Scheduler for Blazor that span across a full day. This template can be defined for the [Day, Multiday, and Week Scheduler views](slug://scheduler-views-overview). 
 
 The `context` of the template is a `SchedulerAllDaySlotTemplateContext` object that contains:
 
@@ -25,11 +25,11 @@ The `context` of the template is a `SchedulerAllDaySlotTemplateContext` object t
 | --- | --- | --- |
 | `Start` | `DateTime` | The slot's start time. |
 | `End` | `DateTime` | The slot's end time.|
-| `Resources` | `List<KeyValuePair<string, object>` | A collection of resources for which the slot is defined. The collection is populated when the [Resources]({%slug scheduler-resources%}) and [Resource Grouping]({%slug scheduler-resource-grouping%}) features are used. |
+| `Resources` | `List<KeyValuePair<string, object>` | A collection of resources for which the slot is defined. The collection is populated when the [Resources](slug://scheduler-resources) and [Resource Grouping](slug://scheduler-resource-grouping) features are used. |
 
 ## SlotTemplate
 
-Use the `SlotTemplate` to provide a custom rendering for the cells in the Telerik Scheduler for Blazor. This template can be defined for the [Day, Multiday, Month, Timeline, and Week Scheduler views]({%slug scheduler-views-overview%}). 
+Use the `SlotTemplate` to provide a custom rendering for the cells in the Telerik Scheduler for Blazor. This template can be defined for the [Day, Multiday, Month, Timeline, and Week Scheduler views](slug://scheduler-views-overview). 
 
 The `context` of the template is a `SchedulerSlotTemplateContext` object that contains:
 
@@ -37,7 +37,7 @@ The `context` of the template is a `SchedulerSlotTemplateContext` object that co
 | --- | --- | --- |
 | `Start` | `DateTime` | The slot's start time. |
 | `End` | `DateTime` | The slot's end time.|
-| `Resources` | `List<KeyValuePair<string, object>` | A collection of resources for which the slot is defined. The collection is populated when the [Resources]({%slug scheduler-resources%}) and [Resource Grouping]({%slug scheduler-resource-grouping%}) features are used. |
+| `Resources` | `List<KeyValuePair<string, object>` | A collection of resources for which the slot is defined. The collection is populated when the [Resources](slug://scheduler-resources) and [Resource Grouping](slug://scheduler-resource-grouping) features are used. |
 
 >note When you use the SlotTemplate in the Timeline Scheduler view, and the content of the template is not a plain string, you must add the `!k-pos-absolute` built-in class to the custom element.
 
diff --git a/components/scheduler/toolbar.md b/components/scheduler/toolbar.md
index 2b52df97b7..33498a7f11 100644
--- a/components/scheduler/toolbar.md
+++ b/components/scheduler/toolbar.md
@@ -14,13 +14,13 @@ The [Blazor Scheduler toolbar](https://demos.telerik.com/blazor-ui/scheduler/too
 
 ## Built-in Tools
 
-By default, the [Blazor Scheduler]({%slug scheduler-overview%}) displays all its built-in tools in the following order:
+By default, the [Blazor Scheduler](slug://scheduler-overview) displays all its built-in tools in the following order:
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
 | Tool Tag | Description |
 | --- | --- |
-| `SchedulerToolBarNavigationTool` | A group of navigation buttons. They can navigate to the present day, to the previous period, and to the next period depending on the [Scheduler view]({%slug scheduler-views-overview%}). |
+| `SchedulerToolBarNavigationTool` | A group of navigation buttons. They can navigate to the present day, to the previous period, and to the next period depending on the [Scheduler view](slug://scheduler-views-overview). |
 | `SchedulerToolBarCalendarTool` | A button that shows the start and the end of the current period. Upon click, you can select a new period via a calendar popup. |
 | `SchedulerToolBarViewsTool` | A button group or a dropdown (depending on the screen size) with all available views. |
 
diff --git a/components/scheduler/views/agenda.md b/components/scheduler/views/agenda.md
index 265544672a..ed15b7f040 100644
--- a/components/scheduler/views/agenda.md
+++ b/components/scheduler/views/agenda.md
@@ -131,8 +131,8 @@ The following parameters allow you to configure the Agenda view:
 
 ## See Also
 
-* [Views]({%slug scheduler-views-overview%})
-* [Navigation]({%slug scheduler-navigation%})
+* [Views](slug://scheduler-views-overview)
+* [Navigation](slug://scheduler-navigation)
 * [Live Demo: Scheduler Agenda View](https://demos.telerik.com/blazor-ui/scheduler/agenda-view)
-* [Resource Grouping]({%slug scheduler-resource-grouping%})
+* [Resource Grouping](slug://scheduler-resource-grouping)
 
diff --git a/components/scheduler/views/day.md b/components/scheduler/views/day.md
index 489e4c7942..630074f763 100644
--- a/components/scheduler/views/day.md
+++ b/components/scheduler/views/day.md
@@ -97,7 +97,7 @@ In this article:
 
 ## See Also
 
-* [Views]({%slug scheduler-views-overview%})
-* [Navigation]({%slug scheduler-navigation%})
+* [Views](slug://scheduler-views-overview)
+* [Navigation](slug://scheduler-navigation)
 * [Live Demo: Scheduler Day View](https://demos.telerik.com/blazor-ui/scheduler/day-view)
-* [Resource Grouping]({%slug scheduler-resource-grouping%})
+* [Resource Grouping](slug://scheduler-resource-grouping)
diff --git a/components/scheduler/views/month.md b/components/scheduler/views/month.md
index 534f36a8bd..7a3dd6e43f 100644
--- a/components/scheduler/views/month.md
+++ b/components/scheduler/views/month.md
@@ -31,7 +31,7 @@ The following parameters allow you to configure the month view:
 | `ItemsPerSlot` | `int` <br /> (`2`) | Indicates the number of appointments that are displayed per day. |
 
 
-If there are more appointments for a day than per the `ItemsPerSlot` parameter, an ellipsis button provides access to the DayView for the specific day. You must [define a day view]({%slug scheduler-views-day%}) so the user can see it. The Scheduler sorts and displays the number of appointments per the `ItemsPerSlot` parameter, by start time (ascending) and then by end time (descending).
+If there are more appointments for a day than per the `ItemsPerSlot` parameter, an ellipsis button provides access to the DayView for the specific day. You must [define a day view](slug://scheduler-views-day) so the user can see it. The Scheduler sorts and displays the number of appointments per the `ItemsPerSlot` parameter, by start time (ascending) and then by end time (descending).
 
 If the `ItemsPerSlot` parameter is a zero or a negative value, an `ArgumentOutOfRangeException` is thrown.
 
@@ -141,7 +141,7 @@ If the `ItemsPerSlot` parameter is a zero or a negative value, an `ArgumentOutOf
 
 ## See Also
 
-* [Views]({%slug scheduler-views-overview%})
-* [Navigation]({%slug scheduler-navigation%})
+* [Views](slug://scheduler-views-overview)
+* [Navigation](slug://scheduler-navigation)
 * [Live Demo: Scheduler Month View](https://demos.telerik.com/blazor-ui/scheduler/month-view)
-* [Resource Grouping]({%slug scheduler-resource-grouping%})
+* [Resource Grouping](slug://scheduler-resource-grouping)
diff --git a/components/scheduler/views/multiday.md b/components/scheduler/views/multiday.md
index d78fa0c334..699d1f13a4 100644
--- a/components/scheduler/views/multiday.md
+++ b/components/scheduler/views/multiday.md
@@ -98,8 +98,8 @@ In this article:
 
 ## See Also
 
-* [Views]({%slug scheduler-views-overview%})
-* [Navigation]({%slug scheduler-navigation%})
+* [Views](slug://scheduler-views-overview)
+* [Navigation](slug://scheduler-navigation)
 * [Live Demo: Scheduler MultiDay View](https://demos.telerik.com/blazor-ui/scheduler/multiday-view)
-* [Resource Grouping]({%slug scheduler-resource-grouping%})
+* [Resource Grouping](slug://scheduler-resource-grouping)
 
diff --git a/components/scheduler/views/overview.md b/components/scheduler/views/overview.md
index 18eedad13c..a71f221043 100644
--- a/components/scheduler/views/overview.md
+++ b/components/scheduler/views/overview.md
@@ -16,16 +16,16 @@ You can choose which views the user can switch between. To do that, declare the
 
 You can also control which is the default one through the `View` parameter. You should usually use it in the `@bind-View` syntax to prevent it from resetting to its initial view when re-rendering happens.
 
-You can read more about this in the [Navigation]({%slug scheduler-navigation%}) article.
+You can read more about this in the [Navigation](slug://scheduler-navigation) article.
 
 The available views are:
 
-* [Scheduler**Day**View]({%slug scheduler-views-day%})
-* [Scheduler**Week**View]({%slug scheduler-views-week%})
-* [Scheduler**MultiDay**View]({%slug scheduler-views-multiday%})
-* [Scheduler**Month**View]({%slug scheduler-views-month%})
-* [Scheduler**Timeline**View]({%slug scheduler-views-timeline%})
-* [Scheduler**Agenda**View]({%slug scheduler-views-agenda%})
+* [Scheduler**Day**View](slug://scheduler-views-day)
+* [Scheduler**Week**View](slug://scheduler-views-week)
+* [Scheduler**MultiDay**View](slug://scheduler-views-multiday)
+* [Scheduler**Month**View](slug://scheduler-views-month)
+* [Scheduler**Timeline**View](slug://scheduler-views-timeline)
+* [Scheduler**Agenda**View](slug://scheduler-views-agenda)
 
 >caption Allow the user to navigate between Day and Week views only by defining only them. Example how to choose starting View (Week) and Date (29 Nov 2019).
 
@@ -99,5 +99,5 @@ The available views are:
 ## See Also
 
   * [Live Demo: Scheduler](https://demos.telerik.com/blazor-ui/scheduler/overview)
-  * [Day View]({%slug scheduler-views-day%})
+  * [Day View](slug://scheduler-views-day)
 
diff --git a/components/scheduler/views/timeline.md b/components/scheduler/views/timeline.md
index 9e23d68fe0..db40cd98a6 100644
--- a/components/scheduler/views/timeline.md
+++ b/components/scheduler/views/timeline.md
@@ -112,8 +112,8 @@ Generally, the views are designed around the timeframe that they show and the da
 
 ## See Also
 
-* [Views]({%slug scheduler-views-overview%})
-* [Navigation]({%slug scheduler-navigation%})
+* [Views](slug://scheduler-views-overview)
+* [Navigation](slug://scheduler-navigation)
 * [Live Demo: Scheduler Timeline View](https://demos.telerik.com/blazor-ui/scheduler/timeline-view)
-* [Resource Grouping]({%slug scheduler-resource-grouping%})
+* [Resource Grouping](slug://scheduler-resource-grouping)
 
diff --git a/components/scheduler/views/week.md b/components/scheduler/views/week.md
index 9fd06246a2..855b272dea 100644
--- a/components/scheduler/views/week.md
+++ b/components/scheduler/views/week.md
@@ -97,8 +97,8 @@ In this article:
 
 ## See Also
 
-* [Views]({%slug scheduler-views-overview%})
-* [Navigation]({%slug scheduler-navigation%})
+* [Views](slug://scheduler-views-overview)
+* [Navigation](slug://scheduler-navigation)
 * [Live Demo: Scheduler Week View](https://demos.telerik.com/blazor-ui/scheduler/week-view)
-* [Resource Grouping]({%slug scheduler-resource-grouping%})
+* [Resource Grouping](slug://scheduler-resource-grouping)
 
diff --git a/components/signature/accessibility/wai-aria-support.md b/components/signature/accessibility/wai-aria-support.md
index 32ac390864..a2a633a28d 100644
--- a/components/signature/accessibility/wai-aria-support.md
+++ b/components/signature/accessibility/wai-aria-support.md
@@ -65,9 +65,9 @@ The Signature has been tested with the following screen readers and browsers com
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor Signature Demos](https://demos.telerik.com/blazor-ui/signature/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/signature/appearance.md b/components/signature/appearance.md
index 1a3b9bc482..fb204a1607 100644
--- a/components/signature/appearance.md
+++ b/components/signature/appearance.md
@@ -162,5 +162,5 @@ Use the `Size` parameter to apply the `min-height` CSS style to the `<div class=
 
 ## See Also
 
-* [Signature Overview]({%slug signature-overview%})
+* [Signature Overview](slug://signature-overview)
 * [Live Demo: Signature Overview](https://demos.telerik.com/blazor-ui/signature/overview)
diff --git a/components/signature/events.md b/components/signature/events.md
index b6a244a25d..31fe78e17e 100644
--- a/components/signature/events.md
+++ b/components/signature/events.md
@@ -72,4 +72,4 @@ The `ValueChanged` event fires when signature is fully drawn.
 
 ## See Also
 
-* [Signature Overview]({%slug signature-overview%})
+* [Signature Overview](slug://signature-overview)
diff --git a/components/signature/overview.md b/components/signature/overview.md
index f0ca9ba6bd..d56f0e04fe 100644
--- a/components/signature/overview.md
+++ b/components/signature/overview.md
@@ -12,7 +12,7 @@ position: 0
 
 This article provides information about the <a href = "https://www.telerik.com/blazor-ui/signature" target="_blank">Blazor Signature component</a> and its core features.
 
-The Blazor Signature component provides an area where users can draw their signatures with a mouse, pen, or with their fingertips. You can use the component in any application where the users must sign a document. The Blazor Signature integrates easily with the [TelerikForm]({%slug form-overview%}). The component stores the value of the signature as a <a href="https://learn.microsoft.com/en-us/dotnet/api/system.buffers.text.base64?view=net-6.0">base64 string</a>
+The Blazor Signature component provides an area where users can draw their signatures with a mouse, pen, or with their fingertips. You can use the component in any application where the users must sign a document. The Blazor Signature integrates easily with the [TelerikForm](slug://form-overview). The component stores the value of the signature as a <a href="https://learn.microsoft.com/en-us/dotnet/api/system.buffers.text.base64?view=net-6.0">base64 string</a>
 
 ## Creating Blazor Signature
 
@@ -107,15 +107,15 @@ To test with physical PNG files, uncomment the code below and run the example in
 
 ## Appearance
 
-The Signature component provides settings to control its appearance, for example colors and borders. [Read more about the Blazor Signature appearance settings...]({%slug signature-appearance%})
+The Signature component provides settings to control its appearance, for example colors and borders. [Read more about the Blazor Signature appearance settings...](slug://signature-appearance)
 
 ## Events
 
-Use the Blazor Signature **blur** and value **change** events to respond to user actions. [Read more about the Blazor Signature events...]({%slug signature-events%})
+Use the Blazor Signature **blur** and value **change** events to respond to user actions. [Read more about the Blazor Signature events...](slug://signature-events)
 
 ## SignalR Message Size
 
-In **Blazor server-side applications**, the Signature component uses the **SignalR WebSocket**, which has a default maximum message size of **32 KB**. This is rarely enough for the Signature `Value`, which is a Base64 image, so [increase the max WebSocket message size for the Blazor application]({%slug common-kb-increase-signalr-max-message-size%}).
+In **Blazor server-side applications**, the Signature component uses the **SignalR WebSocket**, which has a default maximum message size of **32 KB**. This is rarely enough for the Signature `Value`, which is a Base64 image, so [increase the max WebSocket message size for the Blazor application](slug://common-kb-increase-signalr-max-message-size).
 
 The Signature parameters, which affect the `Value` size are `ExportScale`, `Height`, and `Width`.
 
@@ -130,11 +130,11 @@ The following table lists the Signature parameters. Also check the [Signature AP
 | `AriaDescribedBy` | `string` | Maps to the `area-describedby` attribute. Use this parameter to establish a relationship between widgets or groups and the text that describes them. |
 | `AriaLabel` | `string` | Maps to the `aria-label` attribute. Use  this parameter if the text that labels the component is not visible. |
 | `AriaLabelledBy` | `string` | Maps to the `area-labelledby` attribute. Use this parameter to reference another element to define its accessible name. |
-| `Class` | `string` | Renders a custom CSS class to the `<div class="k-signature">` element. Use it to [override theme styles]({%slug themes-override%}). |
+| `Class` | `string` | Renders a custom CSS class to the `<div class="k-signature">` element. Use it to [override theme styles](slug://themes-override). |
 | `DebounceDelay` | `int` <br /> `(150)` | The time in milliseconds between the last drawn line and the value change event. Increase the debounce delay to optimize the number of client-server requests while the user is drawing, especially when the `Width` and `Height` are larger. |
 | `Enabled` | `bool` <br /> `(true)` | Defines if the component is enabled. |
 | `ExportScale` | `double` <br /> `(2)` | The `Width` and `Height` of the component will be multiplied by the export scale when converting the signature to an image. If you don't need to save a high-precision signature of the user, or if the `Width` and `Height` are large, reduce the export scale to optimize the [`Value` size](#signalr-message-size). |
-| `Height` | `string` | Defines the height of the component. Set it in `px`. If you need to use relative units, see how to [resize the Signature with the browser]({%slug signature-kb-relative-width-height%}). |
+| `Height` | `string` | Defines the height of the component. Set it in `px`. If you need to use relative units, see how to [resize the Signature with the browser](slug://signature-kb-relative-width-height). |
 | `HideLine` | `bool` | Whether the dotted line is rendered. |
 | `Maximizable` | `bool` | Whether the Signature can be maximized via a button at the top-right corner. When maximized, the component will show a modal popup dialog. Also see `PopupScale`. |
 | `PopupScale` | `double` <br /> `(3)` | The `Width` and `Height` of the component will be multiplied by the `PopupScale` value when maximizing the Blazor Signature. Also see `Maximizable`. |
@@ -142,8 +142,8 @@ The following table lists the Signature parameters. Also check the [Signature AP
 | `Smooth` | `bool` | Use this parameter to smoothen the signature line. |
 | `StrokeWidth` | `double?` | The drawn lines' thickness in pixels. |
 | `TabIndex` | `int?` | Maps to the `tabindex` attribute of the HTML element. You can use it to customize the order in which the inputs in your form focus with the Tab key. |
-| `ValidateOn` | `ValidationEvent` enum <br /> (`Input`) | Configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs). |
-| `Width` | `string` | Defines the width of the component. Set the it in `px`. If you need to use relative units, see how to [resize the Signature at runtime]({%slug signature-kb-relative-width-height%}). |
+| `ValidateOn` | `ValidationEvent` enum <br /> (`Input`) | Configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs](slug://common-features/input-validation#validation-modes-for-simple-inputs). |
+| `Width` | `string` | Defines the width of the component. Set the it in `px`. If you need to use relative units, see how to [resize the Signature at runtime](slug://signature-kb-relative-width-height). |
 
 ## Signature Reference and Methods
 
@@ -182,9 +182,9 @@ The Signature exposes methods for programmatic operation. To use them, define a
 
 ## Next Steps
 
-* [Explore the Signature Appearance Settings]({%slug signature-appearance%})
-* [Handle the Signature Events]({%slug signature-events%})
-* [Validate the Signature]({%slug common-features/input-validation%})
+* [Explore the Signature Appearance Settings](slug://signature-appearance)
+* [Handle the Signature Events](slug://signature-events)
+* [Validate the Signature](slug://common-features/input-validation)
 
 ## See Also
 
diff --git a/components/skeleton/accessibility/wai-aria-support.md b/components/skeleton/accessibility/wai-aria-support.md
index 41c2d7a83d..1903466be6 100644
--- a/components/skeleton/accessibility/wai-aria-support.md
+++ b/components/skeleton/accessibility/wai-aria-support.md
@@ -57,9 +57,9 @@ The Skeleton has been tested with the following screen readers and browsers comb
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor Skeleton Demos](https://demos.telerik.com/blazor-ui/skeleton/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/skeleton/overview.md b/components/skeleton/overview.md
index fa1da98fe5..792b918c58 100644
--- a/components/skeleton/overview.md
+++ b/components/skeleton/overview.md
@@ -56,7 +56,7 @@ else
 
 ## Appearance
 
-The Telerik UI for Blazor Skeleton provides various options to control its [visual appearance]({%slug skeleton-appearance%}):
+The Telerik UI for Blazor Skeleton provides various options to control its [visual appearance](slug://skeleton-appearance):
 
 * `ShapeType`
 * `AnimationType`
@@ -68,8 +68,8 @@ The table below, lists the available parameters for the Skeleton component.
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
 | `Class` | `string` | Renders a custom CSS class to the `<span class="k-skeleton">` element. |
-| `ShapeType` | `SkeletonShapeType` enum<br />(`Text`) | Sets the [shape]({%slug skeleton-appearance%}#shapetype). |
-| `AnimationType` | `SkeletonAnimationType` enum<br />(`Pulse`) | Sets the [animation of the Skeleton]({%slug skeleton-appearance%}#animationtype). |
+| `ShapeType` | `SkeletonShapeType` enum<br />(`Text`) | Sets the [shape](slug://skeleton-appearance#shapetype). |
+| `AnimationType` | `SkeletonAnimationType` enum<br />(`Pulse`) | Sets the [animation of the Skeleton](slug://skeleton-appearance#animationtype). |
 | `Width` | `string` | Sets the width of the Skeleton component. Required for every shape. |
 | `Height` | `string` | Sets the height of the Skeleton component. Require for the `Circle` and `Rectangle` shapes. The `Text` shape calculates its own height, but you can override it with the `Height` parameter. |
 | `Visible` | `bool`<br />(`true`) | Controls if the Skeleton is rendered on the page. |
@@ -77,7 +77,7 @@ The table below, lists the available parameters for the Skeleton component.
 
 ## Next Steps
 
-* [Check the Skeleton appearance settings]({%slug skeleton-appearance%})
+* [Check the Skeleton appearance settings](slug://skeleton-appearance)
 
 
 ## See Also
diff --git a/components/slider/accessibility/wai-aria-support.md b/components/slider/accessibility/wai-aria-support.md
index 68fe74014f..a9c7a39781 100644
--- a/components/slider/accessibility/wai-aria-support.md
+++ b/components/slider/accessibility/wai-aria-support.md
@@ -83,4 +83,4 @@ For details on how the Slider keyboard navigation works, refer to the [Blazor Sl
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/slider/events.md b/components/slider/events.md
index 7e8c6bfe48..8c0dbf1b55 100644
--- a/components/slider/events.md
+++ b/components/slider/events.md
@@ -98,4 +98,4 @@ If you use two-way binding, the [`ValueChanged`](#valuechanged) event will fire
 
 ## See Also
 
-* [Slider Overview]({%slug slider-overview%})
\ No newline at end of file
+* [Slider Overview](slug://slider-overview)
\ No newline at end of file
diff --git a/components/slider/label-template.md b/components/slider/label-template.md
index 54c1030e18..629b225cee 100644
--- a/components/slider/label-template.md
+++ b/components/slider/label-template.md
@@ -147,5 +147,5 @@ actual slider value: @TheIndex
 
 ## See Also
 
-* [Slider Overview]({%slug slider-overview%})
+* [Slider Overview](slug://slider-overview)
 * [Live Demo: Slider Label Template](https://demos.telerik.com/blazor-ui/slider/label-template)
\ No newline at end of file
diff --git a/components/slider/overview.md b/components/slider/overview.md
index 56b5af43b5..57e154fd50 100644
--- a/components/slider/overview.md
+++ b/components/slider/overview.md
@@ -60,7 +60,7 @@ The Slider is a generic component that takes the type of the `Value` which can b
 
 ## Steps
 
-The Slider works with small and large steps and they are both required. Read more for their configuration and explore examples in the [Steps article]({%slug slider-steps%}).
+The Slider works with small and large steps and they are both required. Read more for their configuration and explore examples in the [Steps article](slug://slider-steps).
 
 ## Ticks Position
 
@@ -72,11 +72,11 @@ You can customize the default horizontal orientation of the Slider through its `
 
 ## Decimals
 
-This setting helps avoid [round-off errors](https://en.wikipedia.org/wiki/Round-off_error) when calculating steps (see more about this type of errors [here](https://en.wikipedia.org/wiki/Floating-point_arithmetic#Accuracy_problems)). Explore the [Decimals article]({%slug rangeslider-decimals%}) for details on how to configure this option.
+This setting helps avoid [round-off errors](https://en.wikipedia.org/wiki/Round-off_error) when calculating steps (see more about this type of errors [here](https://en.wikipedia.org/wiki/Floating-point_arithmetic#Accuracy_problems)). Explore the [Decimals article](slug://rangeslider-decimals) for details on how to configure this option.
 
 ## Validation
 
-You can validate Slider value using the built-in validation. See the [Input Validation]({%slug common-features/input-validation%}) article for more details.
+You can validate Slider value using the built-in validation. See the [Input Validation](slug://common-features/input-validation) article for more details.
 
 ## Parameters
 
@@ -89,10 +89,10 @@ The Slider provides various parameters that allow you to configure the component
 | `Decimals` | `int` | The number precision for the steps.
 | `Enabled` | `bool` | Sets if the component accepts user interaction.
 | `LabelTemplate` | `RenderFragment<TValue>` | A container for custom labels for the major ticks.
-| `LargeStep` | `TValue` | The numeric interval between the large ticks. Read more in [Slider Steps]({%slug slider-steps%}).
+| `LargeStep` | `TValue` | The numeric interval between the large ticks. Read more in [Slider Steps](slug://slider-steps).
 | `Max` | `TValue` | The maximum value of the Slider. Required.
 | `Min` | `TValue` | The minimum value on the Slider. Required and must be less than `Max`.
-| `SmallStep` | `TValue` | The numeric interval between all selectable Slider values. The parameter also defines where small ticks appear on the track. The Slider `Value` may be between two small ticks, but such a value can only be set programmatically. Read more in [Slider Steps]({%slug slider-steps%}).
+| `SmallStep` | `TValue` | The numeric interval between all selectable Slider values. The parameter also defines where small ticks appear on the track. The Slider `Value` may be between two small ticks, but such a value can only be set programmatically. Read more in [Slider Steps](slug://slider-steps).
 | `Orientation` | `SliderOrientation` <br/> (`Horizontal`) | Defines whether the Slider is horizontal or vertical.
 | `TickPosition` | `SliderTickPosition` <br/> (`Both`) | Sets which side of the Slider shows ticks.
 | `ShowButtons` | `bool` <br /> (`true`) | Sets if the Slider renders buttons to increase and decrease the `Value`.
@@ -107,11 +107,11 @@ The following parameters enable you to customize the appearance of the Blazor Sl
 
 ## Next Steps
 
-* [Slider Steps]({%slug slider-steps%})
+* [Slider Steps](slug://slider-steps)
 
 ## See Also
 
 * [Live Demo: Slider](https://demos.telerik.com/blazor-ui/slider/overview)
 * [Live Demo: Slider Settings](https://demos.telerik.com/blazor-ui/slider/customization)
-* [Slider Events]({%slug slider-events%})
+* [Slider Events](slug://slider-events)
 
diff --git a/components/splitbutton/accessibility/wai-aria-support.md b/components/splitbutton/accessibility/wai-aria-support.md
index 8eaefb24f5..9d69383179 100644
--- a/components/splitbutton/accessibility/wai-aria-support.md
+++ b/components/splitbutton/accessibility/wai-aria-support.md
@@ -59,4 +59,4 @@ For details on how the SplitButton keyboard navigation works, refer to the [Blaz
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/splitbutton/appearance.md b/components/splitbutton/appearance.md
index 5f7ec45588..e232e7b3c2 100644
--- a/components/splitbutton/appearance.md
+++ b/components/splitbutton/appearance.md
@@ -12,7 +12,7 @@ position: 10
 
 This article describes the declarative settings of the SplitButton component, which affect its styling and appearance.
 
-The SplitButton provides the same appearance parameters, as the regular [Button component]({%slug button-appearance%}):
+The SplitButton provides the same appearance parameters, as the regular [Button component](slug://button-appearance):
 
 * [FillMode](#fillmode)
 * [Rounded](#rounded)
@@ -230,8 +230,8 @@ The `ThemeColor` parameter sets the SplitButton's background and text color from
 
 ## Next Steps
 
-* [Handle SplitButton Events]({%slug splitbutton-events%})
-* [Add SplitButton Icons]({%slug splitbutton-icons%})
+* [Handle SplitButton Events](slug://splitbutton-events)
+* [Add SplitButton Icons](slug://splitbutton-icons)
 
 
 ## See Also
diff --git a/components/splitbutton/events.md b/components/splitbutton/events.md
index 6cb90adc55..c610e789c3 100644
--- a/components/splitbutton/events.md
+++ b/components/splitbutton/events.md
@@ -57,8 +57,8 @@ at <strong> @ClickTimeString </strong>.
 
 ## Next Steps
 
-* [Add SplitButton Icons]({%slug splitbutton-icons%})
-* [Configure the SplitButton appearance]({%slug splitbutton-appearance%})
+* [Add SplitButton Icons](slug://splitbutton-icons)
+* [Configure the SplitButton appearance](slug://splitbutton-appearance)
 
 
 ## See Also
diff --git a/components/splitbutton/icons.md b/components/splitbutton/icons.md
index 78020d3257..089bd20aa4 100644
--- a/components/splitbutton/icons.md
+++ b/components/splitbutton/icons.md
@@ -14,8 +14,8 @@ The `<TelerikSplitButton>` and `<SplitButtonItem>` provide an `Icon` parameter t
 
 The `Icon` parameter type is `object` and it accepts:
 
-* A property of the static [`SvgIcon` class]({%slug common-features-icons%}#icons-list)
-* A member of the [`FontIcon` enum]({%slug common-features-icons%}#icons-list)
+* A property of the static [`SvgIcon` class](slug://common-features-icons#icons-list)
+* A member of the [`FontIcon` enum](slug://common-features-icons#icons-list)
 * A `string` that is a CSS class for a custom icon
 
 @[template](/_contentTemplates/common/icons.md#font-icons-css-note)
diff --git a/components/splitbutton/overview.md b/components/splitbutton/overview.md
index 21b463c2cc..6fbfc504eb 100644
--- a/components/splitbutton/overview.md
+++ b/components/splitbutton/overview.md
@@ -60,30 +60,30 @@ Last action: <strong> @LastAction </strong>
 
 ## Icons
 
-The primary SplitButton action and each secondary item in the dropdown can [display a font icon or an image]({%slug splitbutton-icons%}) for better looks and user experience.
+The primary SplitButton action and each secondary item in the dropdown can [display a font icon or an image](slug://splitbutton-icons) for better looks and user experience.
 
 
 ## Appearance
 
-The SplitButton provides a [variety of settings to control its visual appearance]({%slug splitbutton-appearance%}), for example the colors, borders, and size. This spares the need to use custom CSS code.
+The SplitButton provides a [variety of settings to control its visual appearance](slug://splitbutton-appearance), for example the colors, borders, and size. This spares the need to use custom CSS code.
 
 >tip To learn more about the appearance, anatomy, and accessibility of the SplitButton, visit the [Progress Design System Kit documentation](https://www.telerik.com/design-system/docs/components/splitbutton/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 
 ## Events
 
-Each SplitButton action [fires a separate `OnClick` event]({%slug splitbutton-events%}), so that the application can react to user behavior.
+Each SplitButton action [fires a separate `OnClick` event](slug://splitbutton-events), so that the application can react to user behavior.
 
 
 ## SplitButton Parameters
 
-The following table lists the SplitButton parameters, except those related to [built-in styling]({%slug splitbutton-appearance%}) and [icons]({%slug splitbutton-icons%}). Also check the [SplitButton API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikSplitButton) for a full list of properties, methods and events.
+The following table lists the SplitButton parameters, except those related to [built-in styling](slug://splitbutton-appearance) and [icons](slug://splitbutton-icons). Also check the [SplitButton API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikSplitButton) for a full list of properties, methods and events.
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
 | `AriaLabel` | `string` | Sets the `aria-label` attribute of the primary action element, which is `<button class="k-button">`. |
-| `Class` | `string` | Renders a custom CSS class to the main component element, which is `<div class="k-split-button">`. Use it to [override the theme styles]({%slug themes-override%}) to obtain a specific appearance, if none of the [SplitButton appearance settings]({%slug splitbutton-appearance%}) can achieve this. |
+| `Class` | `string` | Renders a custom CSS class to the main component element, which is `<div class="k-split-button">`. Use it to [override the theme styles](slug://themes-override) to obtain a specific appearance, if none of the [SplitButton appearance settings](slug://splitbutton-appearance) can achieve this. |
 | `Enabled` | `bool`<br />(`true`) | Enables or disables the component. |
 | `Id` | `string` | Sets the `id` attribute of the primary action element (`<button>`). |
 | `TabIndex`| `int` | Sets the `tabindex` attribute of the primary action element. |
@@ -120,7 +120,7 @@ The SplitButton exposes configuration settings for its dropdown (popup). The par
 
 ### Item Settings
 
-The following table lists the `SplitButtonItem` parameters, except those related to [icons]({%slug splitbutton-icons%}).
+The following table lists the `SplitButtonItem` parameters, except those related to [icons](slug://splitbutton-icons).
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
@@ -130,7 +130,7 @@ The following table lists the `SplitButtonItem` parameters, except those related
 
 ## SplitButton Reference and Methods
 
-The SplitButton exposes a `FocusAsync` method to focus it programmatically. To use it, define a reference to the component instance with the `@ref` attribute. Be aware of the Blazor life cycle if you want to [focus the component on page load]({%slug inputs-kb-focus%}#focus-on-page-load).
+The SplitButton exposes a `FocusAsync` method to focus it programmatically. To use it, define a reference to the component instance with the `@ref` attribute. Be aware of the Blazor life cycle if you want to [focus the component on page load](slug://inputs-kb-focus#focus-on-page-load).
 
 >caption Get a reference to the SplitButton and execute methods
 
@@ -171,13 +171,13 @@ Last action clicked: <strong> @LastActionClicked </strong>
 
 ## Next Steps
 
-* [Handle SplitButton Events]({%slug splitbutton-events%})
-* [Add SplitButton Icons]({%slug splitbutton-icons%})
-* [Configure the SplitButton appearance]({%slug splitbutton-appearance%})
+* [Handle SplitButton Events](slug://splitbutton-events)
+* [Add SplitButton Icons](slug://splitbutton-icons)
+* [Configure the SplitButton appearance](slug://splitbutton-appearance)
 
 
 ## See Also
 
 * [SplitButton API](/blazor-ui/api/Telerik.Blazor.Components.TelerikSplitButton)
 * [Live Demo: SplitButton](https://demos.telerik.com/blazor-ui/splitbutton/overview)
-* [KB: Change Primary SplitButton Action on Click]({%slug splitbutton-kb-change-primary-action-onclick%})
+* [KB: Change Primary SplitButton Action on Click](slug://splitbutton-kb-change-primary-action-onclick)
diff --git a/components/splitter/accessibility/overview.md b/components/splitter/accessibility/overview.md
index 61b9101176..803b82e76d 100644
--- a/components/splitter/accessibility/overview.md
+++ b/components/splitter/accessibility/overview.md
@@ -15,9 +15,9 @@ The UI for Blazor Splitter component is <a href="https://www.w3.org/TR/WCAG22" t
 
 WCAG 2.2 introduces the <a href="https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements" target="_blank">"Dragging Movements"</a> criterion as an important part of the Operable principle. Its primary goal is to guarantee that any feature reliant on drag actions offers an alternative method that can be executed with a single click, enhancing user accessibility.
 
-The illustrative example below shows the tile resize action, achievable through the [Context Menu]({%slug contextmenu-overview%}). Telerik UI for Blazor to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
+The illustrative example below shows the tile resize action, achievable through the [Context Menu](slug://contextmenu-overview). Telerik UI for Blazor to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
 
-The following example demonstrates the [accessibility compliance of the Splitter component]({%slug splitter-wai-aria-support%}). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch]({%slug accessibility-overview%}#color-contrast).
+The following example demonstrates the [accessibility compliance of the Splitter component](slug://splitter-wai-aria-support). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch](slug://accessibility-overview#color-contrast).
 
 >caption Splitter accessibility compliance example
 
diff --git a/components/splitter/accessibility/wai-aria-support.md b/components/splitter/accessibility/wai-aria-support.md
index 83350457f3..26d5b9f4ac 100644
--- a/components/splitter/accessibility/wai-aria-support.md
+++ b/components/splitter/accessibility/wai-aria-support.md
@@ -81,4 +81,4 @@ For details on how the Splitter keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/splitter/events.md b/components/splitter/events.md
index c5e71798b8..3d776a0bff 100644
--- a/components/splitter/events.md
+++ b/components/splitter/events.md
@@ -236,4 +236,4 @@ The `CollapsedChanged` event is triggered when the `Collapsed` parameter of the
 
 ## See Also
 
-* [Splitter Overview]({%slug splitter-overview%})
+* [Splitter Overview](slug://splitter-overview)
diff --git a/components/splitter/orientation.md b/components/splitter/orientation.md
index 82fb8c58de..a9f892c826 100644
--- a/components/splitter/orientation.md
+++ b/components/splitter/orientation.md
@@ -99,8 +99,8 @@ Sometimes you need to create a more complex layout that includes both horizontal
 
 ## Next Steps
 
-* [Manage the Splitter state]({%slug splitter-state%})
-* [Handle Splitter events]({%slug splitter-events%})
+* [Manage the Splitter state](slug://splitter-state)
+* [Handle Splitter events](slug://splitter-events)
 
 ## See Also
 
diff --git a/components/splitter/overview.md b/components/splitter/overview.md
index ee49db035b..878dc3c894 100644
--- a/components/splitter/overview.md
+++ b/components/splitter/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Splitter Overview
 
-The <a href="https://www.telerik.com/blazor-ui/splitter" target="_blank">Blazor Splitter component</a> lets you divide a portion of the page into several pieces that the user can resize and collapse. This provides real estate management for the app and the end user so they can focus on the content that is important in their current task. You can also [save and load its state]({%slug splitter-state%}), and respond to [events]({%slug splitter-events%}).
+The <a href="https://www.telerik.com/blazor-ui/splitter" target="_blank">Blazor Splitter component</a> lets you divide a portion of the page into several pieces that the user can resize and collapse. This provides real estate management for the app and the end user so they can focus on the content that is important in their current task. You can also [save and load its state](slug://splitter-state), and respond to [events](slug://splitter-events).
 
 ## Creating Blazor Splitter
 
@@ -18,7 +18,7 @@ The <a href="https://www.telerik.com/blazor-ui/splitter" target="_blank">Blazor
 1. Set the `Width` and `Height` parameters in any valid CSS unit. See [Splitter Parameters](#splitter-parameters) for more information about the component behavior when dimensions are not set.
 1. Inside the `<SplitterPanes>` child tag, add the desired `<SplitterPane>` tags to create sections of content.
 1. Inside each `<SplitterPane>`, add the desired content as HTML markup or other components.
-1. Configure the panes. For example, [set their `Size`, `Min`, `Max`, `Collapsible`, and `Resizable` parameters]({%slug splitter-panes%}#pane-parameters). By default, Splitter panes are resizable, but not collapsible.
+1. Configure the panes. For example, [set their `Size`, `Min`, `Max`, `Collapsible`, and `Resizable` parameters](slug://splitter-panes#pane-parameters). By default, Splitter panes are resizable, but not collapsible.
 
 >caption Basic Splitter
 
@@ -48,23 +48,23 @@ The <a href="https://www.telerik.com/blazor-ui/splitter" target="_blank">Blazor
 
 ## Panes
 
-Тhe Panes are the building blocks of the Splitter. Each pane controls its own behaviors such as the ability to change its size and collapse. [Read more about the Splitter Panes...]({%slug splitter-panes%})
+Тhe Panes are the building blocks of the Splitter. Each pane controls its own behaviors such as the ability to change its size and collapse. [Read more about the Splitter Panes...](slug://splitter-panes)
 
 ## Orientation
 
-The Splitter panes can stack horizontally or vertically. [Read more about how to configure the Splitter orientation...]({%slug splitter-orientation%})
+The Splitter panes can stack horizontally or vertically. [Read more about how to configure the Splitter orientation...](slug://splitter-orientation)
 
 ## State
 
-The Splitter allows you to save its state and programmatically control it. [Read more about the Splitter state...]({%slug splitter-state%})
+The Splitter allows you to save its state and programmatically control it. [Read more about the Splitter state...](slug://splitter-state)
 
 ## Events
 
-The Splitter fires events that you can handle to further customize the component behavior and respond to the user actions. [Read more about the Blazor Splitter events...]({%slug splitter-events%})
+The Splitter fires events that you can handle to further customize the component behavior and respond to the user actions. [Read more about the Blazor Splitter events...](slug://splitter-events)
 
 ## Splitter Parameters
 
-The Blazor Splitter provides various parameters for its configuration. The following table lists Splitter parameters on component level. Explore the [Splitter Panes]({%slug splitter-panes%}) article for details on the individual Panes configuration.
+The Blazor Splitter provides various parameters for its configuration. The following table lists Splitter parameters on component level. Explore the [Splitter Panes](slug://splitter-panes) article for details on the individual Panes configuration.
 
 Check the [Splitter API Reference ](/blazor-ui/api/Telerik.Blazor.Components.TelerikSplitter) for a full list of properties, methods and events.
 
@@ -74,9 +74,9 @@ Check the [Splitter API Reference ](/blazor-ui/api/Telerik.Blazor.Components.Tel
 | --- | --- | --- |
 | `AriaLabel` | `string` | The `aria-label` attribute of the splitbars elements (`<div class="k-splitbar">`). |
 | `Class` | `string` | The CSS class that renders on the Splitter element (`<div class="k-splitter">`). |
-| `Height` | `string` | The height style of the Splitter. See the [Dimensions]({%slug common-features/dimensions%}) article for details on what units you can use and how percentage dimensions work. If not set, the Splitter will shrink and expand, according to the [pane sizes]({%slug splitter-panes%}#pane-size) and content. |
+| `Height` | `string` | The height style of the Splitter. See the [Dimensions](slug://common-features/dimensions) article for details on what units you can use and how percentage dimensions work. If not set, the Splitter will shrink and expand, according to the [pane sizes](slug://splitter-panes#pane-size) and content. |
 | `Orientation` | `SplitterOrientation` enum <br/> (`SplitterOrientation.Horizontal`) | Whether the content will be split up (how the panes will stack) horizontally or vertically. |
-| `Width`| `string` | The width style of the Splitter in any [valid CSS unit]({%slug common-features/dimensions%}). If not set, the Splitter will expand horizontally to 100%. |
+| `Width`| `string` | The width style of the Splitter in any [valid CSS unit](slug://common-features/dimensions). If not set, the Splitter will expand horizontally to 100%. |
 
 ## Splitter Reference and Methods
 
@@ -84,8 +84,8 @@ Add a reference to the component instance to use the [Splitter methods](/blazor-
 
 | Method | Description |
 | --- | --- |
-| `GetState` | Gets the current [state]({%slug splitter-state%}) of the Splitter.
-| `SetState` | Sets the current [state]({%slug splitter-state%}) of the Splitter.
+| `GetState` | Gets the current [state](slug://splitter-state) of the Splitter.
+| `SetState` | Sets the current [state](slug://splitter-state) of the Splitter.
 
 ````RAZOR
 <TelerikButton OnClick="@GetSplitterState">Get Splitter State</TelerikButton>
@@ -114,10 +114,10 @@ Add a reference to the component instance to use the [Splitter methods](/blazor-
 
 ## Next Steps
 
-* [Explore the Splitter pane settings]({%slug splitter-panes%})
-* [Set the Splitter orientation]({%slug splitter-orientation%})
-* [Manage the Splitter state]({%slug splitter-state%})
-* [Handle Splitter events]({%slug splitter-events%})
+* [Explore the Splitter pane settings](slug://splitter-panes)
+* [Set the Splitter orientation](slug://splitter-orientation)
+* [Manage the Splitter state](slug://splitter-state)
+* [Handle Splitter events](slug://splitter-events)
 
 ## See Also
 
diff --git a/components/splitter/panes.md b/components/splitter/panes.md
index 3405e8e627..e05e2e163b 100644
--- a/components/splitter/panes.md
+++ b/components/splitter/panes.md
@@ -21,13 +21,13 @@ Each Splitter pane is configured individually and offers the following parameter
 
 | Attribute | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | The custom CSS class that renders on the pane element (`<div class="k-pane">`). Use it to [apply custom styling]({%slug themes-override%}) or [enable scrolling](#pane-scrolling). |
+| `Class` | `string` | The custom CSS class that renders on the pane element (`<div class="k-pane">`). Use it to [apply custom styling](slug://themes-override) or [enable scrolling](#pane-scrolling). |
 | `Collapsed` | `bool` | Defines if the pane content renders or not. Supports two-way binding. Collapsed panes still show their splitbar and available actions, for example, expand icon or resize handle. Compare with the `Visible` parameter. |
 | `Collapsible` | `bool` | Whether the user can collapse (hide) the pane to provide more room for other panes. When enabled, the adjacent splitbar (the drag handle between the panes) will offer a collapse button for the pane. |
 | `Max` | `string` | The maximum size the pane can have in pixels or percentages. When it is reached, the user cannot expand its size further. |
 | `Min` | `string` |  The minimum size the pane can have in pixels or percentages. When it is reached, the user cannot reduce its size further. |
 | `Resizable` | `bool` <br /> (`true`) | Whether users can resize the pane with a resize handle (splitbar) or the keyboard. Pane resizing always affects two panes. To enable resizing for a specific pane, at least one adjacent pane must be resizable too. |
-| `Size` | `string` | The pane `width` CSS style in [horizontal Splitters]({%slug splitter-orientation%}), or the pane `height` in [vertical Splitters]({%slug splitter-orientation%}). Supports two-way binding. The `Size` must be between the `Min` and `Max` values. See [Pane Size](#pane-size) below for more details on pane dimensions and behavior. |
+| `Size` | `string` | The pane `width` CSS style in [horizontal Splitters](slug://splitter-orientation), or the pane `height` in [vertical Splitters](slug://splitter-orientation). Supports two-way binding. The `Size` must be between the `Min` and `Max` values. See [Pane Size](#pane-size) below for more details on pane dimensions and behavior. |
 | `Visible` | `bool` | Defines if the pane element and splitbar render or not. When toggled at runtime, the pane's index remains unchanged, unlike when adding a pane with a conditional statement, which appends it at the end. Compare with the `Collapsed` parameter. |
 
 >caption Configure Splitter Panes
@@ -82,7 +82,7 @@ The sections below provide more details and a [hands-on example](#example).
 
 ### Pane Size
 
-The Splitter pane `Size` controls the pane width or height, depending on the [Splitter `Orientation`]({%slug splitter-orientation%}).
+The Splitter pane `Size` controls the pane width or height, depending on the [Splitter `Orientation`](slug://splitter-orientation).
 
 There must be at least one `SplitterPane` without a `Size`. This pane will adjust automatically to occupy the remaining space, based on the other pane sizes.
 
@@ -97,18 +97,18 @@ Collapsibility and resizability have the following impact on the Splitter pane d
 
 ### Splitter Width and Height
 
-In a [vertical Splitter]({%slug splitter-orientation%}), the pane widths match the Splitter `Width`.
+In a [vertical Splitter](slug://splitter-orientation), the pane widths match the Splitter `Width`.
 
 Here is how the Splitter `Height` affects the pane heights:
 
-* If a [horizontal Splitter]({%slug splitter-orientation%}) has no `Height`, then its panes do not expand vertically to fill up the Splitter element. The [example](#example) below shows how to work around this with a `height:auto` style on the `.k-pane` class.
+* If a [horizontal Splitter](slug://splitter-orientation) has no `Height`, then its panes do not expand vertically to fill up the Splitter element. The [example](#example) below shows how to work around this with a `height:auto` style on the `.k-pane` class.
 * If a vertical Splitter has no `Height`, then all its panes ignore their `Size`. The panes expand or shrink, depending on their content. There is no pane scrolling.
 * If a vertical Splitter has a `Height`, then:
     * All panes obey their set `Size`.
     * Static panes with no `Size` expand to match the Splitter `Height`, leading to content overflow.
     * Flex panes with no `Size` shrink to zero height, but only if there is a static pane with no `Size`.
 
-See [Splitter Parameters]({%slug splitter-overview%}#splitter-parameters) for more information about the component `Width` and `Height`.
+See [Splitter Parameters](slug://splitter-overview#splitter-parameters) for more information about the component `Width` and `Height`.
 
 ### Example
 
@@ -297,9 +297,9 @@ Splitter Orientation:
 
 ## Next Steps
 
-* [Set the Splitter orientation]({%slug splitter-orientation%})
-* [Manage the Splitter state]({%slug splitter-state%})
-* [Handle Splitter events]({%slug splitter-events%})
+* [Set the Splitter orientation](slug://splitter-orientation)
+* [Manage the Splitter state](slug://splitter-state)
+* [Handle Splitter events](slug://splitter-events)
 
 ## See Also
 
diff --git a/components/splitter/state.md b/components/splitter/state.md
index bb369d2e0f..feaa0f3eee 100644
--- a/components/splitter/state.md
+++ b/components/splitter/state.md
@@ -134,13 +134,13 @@ public class LocalStorage
 }
 ````
 
->tip You can use the [Splitter events]({%slug splitter-events%}) to save the component state and restore it on page reload. Learn more at [Save and Load the Splitter State]({%slug splitter-kb-save-and-load-state%}).
+>tip You can use the [Splitter events](slug://splitter-events) to save the component state and restore it on page reload. Learn more at [Save and Load the Splitter State](slug://splitter-kb-save-and-load-state).
 
 ## Next Steps
 
-* [Handle Splitter events]({%slug splitter-events%})
+* [Handle Splitter events](slug://splitter-events)
 
 ## See Also
 
-* [Splitter Panes]({%slug splitter-panes%})
+* [Splitter Panes](slug://splitter-panes)
 * [Live Demo: Splitter](https://demos.telerik.com/blazor-ui/splitter/overview)
diff --git a/components/spreadsheet/accessibility/wai-aria-support.md b/components/spreadsheet/accessibility/wai-aria-support.md
index 7b3771ca88..83d4503ad2 100644
--- a/components/spreadsheet/accessibility/wai-aria-support.md
+++ b/components/spreadsheet/accessibility/wai-aria-support.md
@@ -165,4 +165,4 @@ For details on how the Spreadsheet keyboard navigation works, refer to the [Blaz
 ## See Also
 
 * [Blazor Spreadsheet Demos](https://demos.telerik.com/blazor-ui/spreadsheet/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/spreadsheet/events.md b/components/spreadsheet/events.md
index 3185a9fe59..f510020ac8 100644
--- a/components/spreadsheet/events.md
+++ b/components/spreadsheet/events.md
@@ -32,7 +32,7 @@ See the [example below](#example).
 
 ## OnOpen
 
-The `OnOpen` event fires when the user clicks on the **Open** button in the Spreadsheet toolbar and opens a file for editing from their file system. The Spreadsheet uses a [FileSelect component]({%slug fileselect-overview%}) for opening files. The Spreadsheet `OnOpen` event is similar to the [FileSelect `OnSelect` event]({%slug fileselect-events%}#onselect).
+The `OnOpen` event fires when the user clicks on the **Open** button in the Spreadsheet toolbar and opens a file for editing from their file system. The Spreadsheet uses a [FileSelect component](slug://fileselect-overview) for opening files. The Spreadsheet `OnOpen` event is similar to the [FileSelect `OnSelect` event](slug://fileselect-events#onselect).
 
 The `SpreadsheetOpenEventArgs` argument of the `OnOpen` event has the following properties:
 
@@ -40,7 +40,7 @@ The `SpreadsheetOpenEventArgs` argument of the `OnOpen` event has the following
 
 | Property Name | Type | Description |
 | --- | --- | --- |
-| `Files` | `List<FileSelectFileInfo>` | The `List` contains one member and it is the file that the user opened. Check the [`FileSelectFileInfo` section in the FileSelect Events documentation]({%slug fileselect-events%}#fileselectfileinfo) for more information about the `FileSelectFileInfo` properties `Name`, `Size,` `Extension`, and `Stream`. |
+| `Files` | `List<FileSelectFileInfo>` | The `List` contains one member and it is the file that the user opened. Check the [`FileSelectFileInfo` section in the FileSelect Events documentation](slug://fileselect-events#fileselectfileinfo) for more information about the `FileSelectFileInfo` properties `Name`, `Size,` `Extension`, and `Stream`. |
 | `IsCancelled` | `bool` | Sets if the open action should be prevented. |
 
 
diff --git a/components/spreadsheet/overview.md b/components/spreadsheet/overview.md
index 121afcc609..cd0cb20fdb 100644
--- a/components/spreadsheet/overview.md
+++ b/components/spreadsheet/overview.md
@@ -55,17 +55,17 @@ The Spreadsheet provides built-in tools that perform various actions such as:
 * Insert images and links
 * Merge cells or toggle the visibility of the cell borders.
 
-You can also add custom tools. Learn how to [configure and customize the Blazor Spreadsheet tools]({%slug spreadsheet-tools%}).
+You can also add custom tools. Learn how to [configure and customize the Blazor Spreadsheet tools](slug://spreadsheet-tools).
 
 
 ## Functions and Formulas
 
-The Blazor Spreadsheet component supports formulas and a large variety of Excel functions. See the complete list of available [Spreadsheet functions]({%slug spreadsheet-functions-formulas%}).
+The Blazor Spreadsheet component supports formulas and a large variety of Excel functions. See the complete list of available [Spreadsheet functions](slug://spreadsheet-functions-formulas).
 
 
 ## Events
 
-The [Spreadsheet events]({%slug spreadsheet-events%}) allow you to implement custom functionality and handle user interactions with the component.
+The [Spreadsheet events](slug://spreadsheet-events) allow you to implement custom functionality and handle user interactions with the component.
 
 
 ## Spreadsheet Parameters
@@ -76,18 +76,18 @@ The table below lists the Spreadsheet parameters. For a full list of the ListBox
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | The custom CSS classes to render for the `<div class="k-spreadsheet">` element. Use the parameter to [override the theme styles]({%slug themes-override%}) of some or all Spreadsheet instances. |
+| `Class` | `string` | The custom CSS classes to render for the `<div class="k-spreadsheet">` element. Use the parameter to [override the theme styles](slug://themes-override) of some or all Spreadsheet instances. |
 | `ColumnHeaderHeight` | `double` <br /> (`20`) | The pixel height of the column headers that display the letters A, B, C, and so on. |
 | `ColumnsCount` | `int`  <br /> (`50`) | The initial number of columns to render. Users can add and delete columns at runtime. |
 | `ColumnWidth` | `double` <br /> (`64`) | The initial pixel width of the columns. |
 | `Data` | `byte[]` | The Excel file to display in the Spreadsheet component. |
-| `EnableLoaderContainer` | `bool` <br /> (`true`) | Defines if the component will show a built-in [LoaderContainer]({%slug loadercontainer-overview%}) while loading Excel files. |
-| `Height` | `string` | The `height` style of the `<div class="k-spreadsheet">` element. The [built-in themes]({%slug themes-overview%}) apply `"600px"` by default. |
+| `EnableLoaderContainer` | `bool` <br /> (`true`) | Defines if the component will show a built-in [LoaderContainer](slug://loadercontainer-overview) while loading Excel files. |
+| `Height` | `string` | The `height` style of the `<div class="k-spreadsheet">` element. The [built-in themes](slug://themes-overview) apply `"600px"` by default. |
 | `RowHeaderWidth` | `double` <br /> (`32`) | The pixel width of the row headers that display the row numbers. The default width fits up to 3 digits comfortably. |
 | `RowHeight` | `double` <br /> (`20`) | The initial pixel height of the rows. |
 | `RowsCount` | `int` <br /> (`200`) | The initial number of rows to render. Users can add and delete rows at runtime. |
 | `Tools` | `SpreadsheetToolSet` <br /> (`SpreadsheetToolSets.All`) | The available tabs and tools that users can use to manipulate the Excel file content. The Spreadsheet renders all its tools by default, so the resulting Spreadsheet UI will change in the future. |
-| `Width` | `string` | The `width` style of the `<div class="k-spreadsheet">` element. The [built-in CSS themes]({%slug themes-overview%}) apply `"100%"` by default. |
+| `Width` | `string` | The `width` style of the `<div class="k-spreadsheet">` element. The [built-in CSS themes](slug://themes-overview) apply `"100%"` by default. |
 
 
 ## Spreadsheet Reference and Methods
@@ -96,8 +96,8 @@ The Blazor Spreadsheet component exposes methods for programmatic operation. To
 
 | Method | Description |
 | --- | --- |
-| `ExportToExcelAsync` | Returns the current Spreadsheet Excel file content as `byte[]`. The application can save the file or pass it to [Telerik Document Processing]({%slug dpl-in-blazor%}) for further manipulation. You can also [get the Spreadsheet cell values]({%slug spreadsheet-kb-get-cell-values%}) programmatically. |
-| `Rebind` | Refreshes the Spreadsheet and ensures it displays the current `Data`. [`Rebind` is necessary when the Blazor framework cannot re-render components automatically]({%slug common-features-data-binding-overview%}#refresh-data). |
+| `ExportToExcelAsync` | Returns the current Spreadsheet Excel file content as `byte[]`. The application can save the file or pass it to [Telerik Document Processing](slug://dpl-in-blazor) for further manipulation. You can also [get the Spreadsheet cell values](slug://spreadsheet-kb-get-cell-values) programmatically. |
+| `Rebind` | Refreshes the Spreadsheet and ensures it displays the current `Data`. [`Rebind` is necessary when the Blazor framework cannot re-render components automatically](slug://common-features-data-binding-overview#refresh-data). |
 | `Refresh` | Calls `StateHasChanged()` for the Spreadsheet component. |
 
 >caption Using the Spreadsheet reference and methods
@@ -127,13 +127,13 @@ The Blazor Spreadsheet component exposes methods for programmatic operation. To
 
 ## Next Steps
 
-* [Customize the Spreadsheet tools]({%slug spreadsheet-tools%})
-* [Learn about the supported Spreadsheet functions and formulas]({%slug spreadsheet-functions-formulas%})
-* [Handle Spreadsheet events]({%slug spreadsheet-events%})
+* [Customize the Spreadsheet tools](slug://spreadsheet-tools)
+* [Learn about the supported Spreadsheet functions and formulas](slug://spreadsheet-functions-formulas)
+* [Handle Spreadsheet events](slug://spreadsheet-events)
 
 
 ## See Also
 
 * [Live Demo: Spreadsheet](https://demos.telerik.com/blazor-ui/spreadsheet/overview)
 * [Spreadsheet API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikSpreadsheet)
-* [Bind Spreadsheet to IEnumerable]({%slug spreadsheet-kb-bind-to-json-ienumerable-list-collection%})
+* [Bind Spreadsheet to IEnumerable](slug://spreadsheet-kb-bind-to-json-ienumerable-list-collection)
diff --git a/components/spreadsheet/tools.md b/components/spreadsheet/tools.md
index fc2f15c646..8e2f42bb99 100644
--- a/components/spreadsheet/tools.md
+++ b/components/spreadsheet/tools.md
@@ -83,7 +83,7 @@ The Spreadsheet uses Telerik Blazor components to create its built-in tool sets
 
 The example below shows how to:
 
-* Get the **File** and **Home** tool set items. The built-in tool set items are distinguishable by their index or `Title`. The title can change in localized applications, so you may need to use the [`ITelerikStringLocalizer` service]({%slug globalization-localization%}) to search for the localized `Title` string.
+* Get the **File** and **Home** tool set items. The built-in tool set items are distinguishable by their index or `Title`. The title can change in localized applications, so you may need to use the [`ITelerikStringLocalizer` service](slug://globalization-localization) to search for the localized `Title` string.
 * Change the label of the **File** tool set item.
 * Obtain reference to a few built-in tools inside the **Home** tool set item. You can find tools by their type or order index. Using order index is not future-proof, as the built-in tool sets can change.
 * Set the `Data` property of the **Font Family** and **Font Size** tools to change the available drop down options.
@@ -247,7 +247,7 @@ Here is how to define a custom tool set from scratch. You can also [set the avai
 The `SpreadsheetCustomTool` type has a `Template` property that is a `RenderFragment`. Generally, custom tools can do one of the following:
 
 * Perform actions that relate to the Spreadsheet component, loaded Excel document, or app business logic.
-* Modify the Excel document programmatically with the help of [RadSpreadProcessing]({%slug dpl-in-blazor%}).
+* Modify the Excel document programmatically with the help of [RadSpreadProcessing](slug://dpl-in-blazor).
 
 >caption Creating custom Spreadsheet tools
 
diff --git a/components/stacklayout/layout.md b/components/stacklayout/layout.md
index 9244b066ff..6036b851d0 100644
--- a/components/stacklayout/layout.md
+++ b/components/stacklayout/layout.md
@@ -255,4 +255,4 @@ The `VerticalAlign` parameter controls the alignment of the items in the `Teleri
 
 ## See Also
 
-  * [Overview]({%slug stacklayout-overview%})
\ No newline at end of file
+  * [Overview](slug://stacklayout-overview)
\ No newline at end of file
diff --git a/components/stacklayout/overview.md b/components/stacklayout/overview.md
index b33810ec8b..99ac0032d0 100644
--- a/components/stacklayout/overview.md
+++ b/components/stacklayout/overview.md
@@ -54,7 +54,7 @@ The <a href="https://www.telerik.com/blazor-ui/stacklayout" target="_blank">Stac
 
 ## Layout
 
-The layout is the building block of the StackLayout component. Control its appearance via different parameters. [Read more about the Blazor StackLayout layout]({%slug stacklayout-layout%}).
+The layout is the building block of the StackLayout component. Control its appearance via different parameters. [Read more about the Blazor StackLayout layout](slug://stacklayout-layout).
 
 ## StackLayout Parameters
 
@@ -64,13 +64,13 @@ The Blazor StackLayout provides various parameters that allow you to configure t
 
 | Parameter | Type and Default Value | Description |
 | ----------- | ----------- | ----------- |
-| `Class` | `string` | The CSS class to be rendered on the main wrapping element of the StackLayout component, which is `<div class="k-stack-layout">`. Use for [styling customizations]({%slug themes-override%}). |
-| `Height` | `string` | The StackLayout height as a CSS unit. See the [Dimensions]({%slug common-features/dimensions%}) article for more details on what units you can use and how percentage dimensions work. |
-| `Width` | `string` | The StackLayout width as a CSS unit. See the [Dimensions]({%slug common-features/dimensions%}) article for more details on what units you can use and how percentage dimensions work. |
-| `Orientation` | `StackLayoutOrientation` enum <br/> (`StackLayoutOrientation.Horizontal`) | Whether the content will be aligned horizontally or vertically. See the [Layout Orientation]({%slug stacklayout-layout%}#orientation) article for more information. |
-| `Spacing` | `string` | The space between the elements in the StackLayout. See the [Layout Spacing]({%slug stacklayout-layout%}#spacing) article for more information. |
-| `HorizontalAlign` | `StackLayoutHorizontalAlign` enum <br/> (`StackLayoutHorizontalAlign.Stretch`) | The StackLayout items alignment based on the X axis. See the [Layout HorizontalAlign]({%slug stacklayout-layout%}#horizontalalign) article for more information. |
-| `VerticalAlign` | `StackLayoutVerticalAlign` enum <br/> (`StackLayoutVerticalAlign.Stretch`) | The StackLayout items alignment based on the Y axis. See the [Layout VerticalAlign]({%slug stacklayout-layout%}#verticalalign) article for more information. |
+| `Class` | `string` | The CSS class to be rendered on the main wrapping element of the StackLayout component, which is `<div class="k-stack-layout">`. Use for [styling customizations](slug://themes-override). |
+| `Height` | `string` | The StackLayout height as a CSS unit. See the [Dimensions](slug://common-features/dimensions) article for more details on what units you can use and how percentage dimensions work. |
+| `Width` | `string` | The StackLayout width as a CSS unit. See the [Dimensions](slug://common-features/dimensions) article for more details on what units you can use and how percentage dimensions work. |
+| `Orientation` | `StackLayoutOrientation` enum <br/> (`StackLayoutOrientation.Horizontal`) | Whether the content will be aligned horizontally or vertically. See the [Layout Orientation](slug://stacklayout-layout#orientation) article for more information. |
+| `Spacing` | `string` | The space between the elements in the StackLayout. See the [Layout Spacing](slug://stacklayout-layout#spacing) article for more information. |
+| `HorizontalAlign` | `StackLayoutHorizontalAlign` enum <br/> (`StackLayoutHorizontalAlign.Stretch`) | The StackLayout items alignment based on the X axis. See the [Layout HorizontalAlign](slug://stacklayout-layout#horizontalalign) article for more information. |
+| `VerticalAlign` | `StackLayoutVerticalAlign` enum <br/> (`StackLayoutVerticalAlign.Stretch`) | The StackLayout items alignment based on the Y axis. See the [Layout VerticalAlign](slug://stacklayout-layout#verticalalign) article for more information. |
 
 ## Nested StackLayouts
 
@@ -132,7 +132,7 @@ Sometimes you may need to create a more complex layout that includes both horizo
 
 ## Next Steps
 
-* [Configure StackLayout orientation, spacing and alignment]({%slug stacklayout-layout%})
+* [Configure StackLayout orientation, spacing and alignment](slug://stacklayout-layout)
 
 ## See Also
 
diff --git a/components/stepper/accessibility/wai-aria-support.md b/components/stepper/accessibility/wai-aria-support.md
index f2ccbe82f5..f820b8b815 100644
--- a/components/stepper/accessibility/wai-aria-support.md
+++ b/components/stepper/accessibility/wai-aria-support.md
@@ -72,4 +72,4 @@ For details on how the Stepper keyboard navigation works, refer to the [Blazor S
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/stepper/overview.md b/components/stepper/overview.md
index 4d6be98d29..410bef126f 100644
--- a/components/stepper/overview.md
+++ b/components/stepper/overview.md
@@ -13,7 +13,7 @@ position: 0
 
 The <a href ="https://www.telerik.com/blazor-ui/stepper"><strong>Stepper for Blazor</strong></a> is a component that renders a path formed by a sequence of logical steps towards a bigger action. The Stepper indicates the user’s progress within this action by showing the steps left for them to complete it. It makes the user experience less overwhelming as it breaks the long process into smaller parts.
 
-The Stepper provides several features out of the box, including the ability to define the appearance of each [step]({%slug stepper-steps-overview%}), [validation]({%slug stepper-steps-validation%}) for the steps, strict [linear flow]({%slug stepper-linear-flow%}) and [step template]({%slug step-template%}) to make the it fit any design requirements.
+The Stepper provides several features out of the box, including the ability to define the appearance of each [step](slug://stepper-steps-overview), [validation](slug://stepper-steps-validation) for the steps, strict [linear flow](slug://stepper-linear-flow) and [step template](slug://step-template) to make the it fit any design requirements.
 
 
 ## Creating Blazor Stepper
@@ -22,7 +22,7 @@ The Stepper provides several features out of the box, including the ability to d
 
 2. Set the `Value` parameter (`int`) to define the current step index. It supports one-way and two-way binding.
 
-3. Add [`StepperStep` instances]({%slug  stepper-steps-overview%}) inside the `StepperSteps` tag.
+3. Add [`StepperStep` instances](slug://stepper-steps-overview) inside the `StepperSteps` tag.
 
 4. (optional) Set the `Icon` and `Label` `StepperStep` properties.
 
@@ -50,26 +50,26 @@ The Stepper provides several features out of the box, including the ability to d
 
 ## Steps
 
-The Steps are the building blocks of the Stepper component. Include the desired steps by adding a `StepperStep` tag for every step. Then, configure each `StepperStep` appearance via its parameters. [Read more about the Blazor Steps configuration]({%slug stepper-steps-overview%}).
+The Steps are the building blocks of the Stepper component. Include the desired steps by adding a `StepperStep` tag for every step. Then, configure each `StepperStep` appearance via its parameters. [Read more about the Blazor Steps configuration](slug://stepper-steps-overview).
 
 ## Orientation
-The Stepper component provides horizontal and vertical orientations. [Read more about the Blazor Stepper orientation]({%slug stepper-orientation%}).
+The Stepper component provides horizontal and vertical orientations. [Read more about the Blazor Stepper orientation](slug://stepper-orientation).
 
 ## Display Modes
 
-The Stepper steps can display labels and icons. [Read more about the Blazor Stepper display modes]({%slug stepper-display-modes%}).
+The Stepper steps can display labels and icons. [Read more about the Blazor Stepper display modes](slug://stepper-display-modes).
 
 ## Linear Flow
 
-By default, the user can select any step in the Stepper component and go to it directly. This behavior can be changed with the `Linear` parameter, so that the user goes through the steps sequentially. [Read more about the Blazor Stepper linear flow]({%slug stepper-linear-flow%}).
+By default, the user can select any step in the Stepper component and go to it directly. This behavior can be changed with the `Linear` parameter, so that the user goes through the steps sequentially. [Read more about the Blazor Stepper linear flow](slug://stepper-linear-flow).
 
 ## Templates
 
-You can use the functionality of the built-in templates and customize what is rendered as steps. [Read more about the Blazor Stepper templates]({%slug step-template%}).
+You can use the functionality of the built-in templates and customize what is rendered as steps. [Read more about the Blazor Stepper templates](slug://step-template).
 
 ## Events
 
-The Blazor Stepper generates events that you can handle and further customize its behavior. [Read more about the Blazor Stepper events]({%slug stepper-events%}).
+The Blazor Stepper generates events that you can handle and further customize its behavior. [Read more about the Blazor Stepper events](slug://stepper-events).
 
 ## Stepper Parameters
 
@@ -80,15 +80,15 @@ The Blazor Stepper provides various parameters that allow you to configure the c
 | Parameter | Type and Default Value | Description |
 | ----------- | ----------- | ----------- |
 | `Value` | `int` | Defines the current step index. |
-| `Orientation` | `StepperOrientation` enum <br /> (`Horizontal`) | Defines the orientation of the Stepper. You can read more on how to configure it in the [Orientation]({%slug stepper-orientation%}) article. |
-| `Linear` | `bool` | Enables/disables [linear flow]({%slug stepper-linear-flow%}). |
-| `StepType` | `StepperStepType` enum <br /> (`Steps`) | Defines the display mode of the Stepper. You can read more on how to configure it in the [Display modes]({%slug stepper-display-modes%}) article. |
+| `Orientation` | `StepperOrientation` enum <br /> (`Horizontal`) | Defines the orientation of the Stepper. You can read more on how to configure it in the [Orientation](slug://stepper-orientation) article. |
+| `Linear` | `bool` | Enables/disables [linear flow](slug://stepper-linear-flow). |
+| `StepType` | `StepperStepType` enum <br /> (`Steps`) | Defines the display mode of the Stepper. You can read more on how to configure it in the [Display modes](slug://stepper-display-modes) article. |
 
 ## Next Steps
 
-* [Configure Steps]({%slug stepper-steps-overview%})
-* [Use Stepper Templates]({%slug step-template%})
-* [Explore Stepper Events]({%slug stepper-events%})
+* [Configure Steps](slug://stepper-steps-overview)
+* [Use Stepper Templates](slug://step-template)
+* [Explore Stepper Events](slug://stepper-events)
 
 ## See Also
 
diff --git a/components/stepper/steps/indicators.md b/components/stepper/steps/indicators.md
index bd28263e19..504af6d6c6 100644
--- a/components/stepper/steps/indicators.md
+++ b/components/stepper/steps/indicators.md
@@ -46,7 +46,7 @@ Stepper component allows you to use Font and SVG icons for its step indicators.
 
 * `Icon` - defines the name of the desired Telerik font icon.
 
-More details as well as a list of the available Telerik font icons you can find in the [Built-in Icons article]({%slug common-features-icons%}).
+More details as well as a list of the available Telerik font icons you can find in the [Built-in Icons article](slug://common-features-icons).
 
 ![Icon Indicators](images/icon-indicators-example.png)
 
diff --git a/components/stepper/steps/overview.md b/components/stepper/steps/overview.md
index 774ea5fd1c..5038713aa9 100644
--- a/components/stepper/steps/overview.md
+++ b/components/stepper/steps/overview.md
@@ -10,9 +10,9 @@ position: 0
 
 # Blazor Steps Overview
 
-The Steps are the building blocks of the Stepper component. You can include the desired steps by adding a `StepperStep` tag for every step. The steps appearance can be configured through the features the `StepperStep` exposes - each step includes a visual [indicator]({%slug stepper-indicators%}), you can define a [label]({%slug stepper-labels%}) for the corresponding indicator and manage the step [state]({%slug stepper-state%}) and [validity]({%slug stepper-steps-validation%}).
+The Steps are the building blocks of the Stepper component. You can include the desired steps by adding a `StepperStep` tag for every step. The steps appearance can be configured through the features the `StepperStep` exposes - each step includes a visual [indicator](slug://stepper-indicators), you can define a [label](slug://stepper-labels) for the corresponding indicator and manage the step [state](slug://stepper-state) and [validity](slug://stepper-steps-validation).
 
-The whole rendering of the steps can also be customized with a [Step Template]({%slug step-template%}).
+The whole rendering of the steps can also be customized with a [Step Template](slug://step-template).
 
 >caption In this article:
 
@@ -25,18 +25,18 @@ The `StepperStep` exposes the following parameters which allow you to configure
 
 ### Indicators 
 
-The [visual indicators]({%slug stepper-indicators%}) of the steps can include the content below.
+The [visual indicators](slug://stepper-indicators) of the steps can include the content below.
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
 | Parameter | Type | Description |
 | ----------- | ----------- | ----------- |
 | `Text` | `string` | Specifies the step indicator text. |
-| `Icon` | `object` | The icon which will be rendered inside the step indicator. The parameter can accept [properties of the static `SvgIcon` class, members of the `FontIcon` enum]({%slug common-features-icons%}), or strings for custom icons. |
+| `Icon` | `object` | The icon which will be rendered inside the step indicator. The parameter can accept [properties of the static `SvgIcon` class, members of the `FontIcon` enum](slug://common-features-icons), or strings for custom icons. |
 
 ### State
 
-The steps can have one of the [states]({%slug stepper-state%}) below.
+The steps can have one of the [states](slug://stepper-state) below.
 
 | Parameter | Type | Description |
 | ----------- | ----------- | ----------- |
@@ -47,8 +47,8 @@ The steps can have one of the [states]({%slug stepper-state%}) below.
 
 | Parameter | Type | Description |
 | ----------- | ----------- | ----------- |
-| `Label` | `string` | Specifies the [label text]({%slug stepper-labels%}) that will be rendered under the corresponding step indicator. |
-| `Valid` | `bool?` | Specifies if the step is [valid]({%slug stepper-steps-validation%}) or not. |
+| `Label` | `string` | Specifies the [label text](slug://stepper-labels) that will be rendered under the corresponding step indicator. |
+| `Valid` | `bool?` | Specifies if the step is [valid](slug://stepper-steps-validation) or not. |
 | `Class` | `string` | CSS class for the current step. |
 
 ## Steps Declaration
diff --git a/components/stepper/steps/state.md b/components/stepper/steps/state.md
index 1bcf1ed50b..bf73072218 100644
--- a/components/stepper/steps/state.md
+++ b/components/stepper/steps/state.md
@@ -17,8 +17,8 @@ The Stepper for Blazor allows you to control the state of its steps. You can use
 
 ## Optional
 
-To mark a step as optional, you can set its `Optional` parameter to `true` (its default value is `false`). This configuration strives to visually notify the user that a certain step is not required by rendering "(Optional)" text underneath the corresponding step. It doesn't come with a built-in functionality to skip the step if a [linear flow]({%slug stepper-linear-flow%}) is enabled.
-The stepper component will also allow you to [localize]({%slug globalization-localization%}) the "Optional" text.
+To mark a step as optional, you can set its `Optional` parameter to `true` (its default value is `false`). This configuration strives to visually notify the user that a certain step is not required by rendering "(Optional)" text underneath the corresponding step. It doesn't come with a built-in functionality to skip the step if a [linear flow](slug://stepper-linear-flow) is enabled.
+The stepper component will also allow you to [localize](slug://globalization-localization) the "Optional" text.
 
 >caption Set an optional step. The result from the snippet.
 
@@ -45,7 +45,7 @@ The stepper component will also allow you to [localize]({%slug globalization-loc
 
 You can disable a step by setting the `Disabled` parameter of the the desired `StepperStep` to `true` (its default value is `false`). You can also toggle its value to conditionally enable/disable steps based on your application logic.
 
-This feature serves to mark the desired step as disabled, so users cannot click and select it. If [linear flow]({%slug stepper-linear-flow%}) is enabled, users will not be able to skip the disabled step and click on the next enabled.
+This feature serves to mark the desired step as disabled, so users cannot click and select it. If [linear flow](slug://stepper-linear-flow) is enabled, users will not be able to skip the disabled step and click on the next enabled.
 
 >caption Set a disabled step. The result from the snippet.
 
diff --git a/components/stepper/steps/validation.md b/components/stepper/steps/validation.md
index 3d6a323bb4..317a7c96d1 100644
--- a/components/stepper/steps/validation.md
+++ b/components/stepper/steps/validation.md
@@ -16,7 +16,7 @@ Step validation serves as a visual indication whether a step is valid or not. It
 
 You can toggle the `Valid` parameter value based on your application logic to accordingly render success or error icon. You can then use the `Valid` parameter value to perform logic for any further desired operations (for example preventing the user from navigating to the next step if the current one is invalid).
 
-Depending on the [display mode]({%slug stepper-display-modes%}) the Stepper is using, validation icons will be displayed either in the step indicator or as part of the step label.
+Depending on the [display mode](slug://stepper-display-modes) the Stepper is using, validation icons will be displayed either in the step indicator or as part of the step label.
 
 
 In this article:
@@ -26,7 +26,7 @@ In this article:
 
 ## Validation in Stepper with Display mode: Steps
 
-If the Stepper uses the default display mode ([`Steps`]({%slug stepper-display-modes%}#steps)), the validation icons will be displayed in the step indicator regardless of whether or not a label is defined for every step.
+If the Stepper uses the default display mode ([`Steps`](slug://stepper-display-modes#steps)), the validation icons will be displayed in the step indicator regardless of whether or not a label is defined for every step.
 
 When validation icons are rendered inside the indicators, they will override the content of the step indicator (text, icon etc). They have priority over the step indicator content in order to notify whether the corresponding step is valid or not.
 
@@ -77,7 +77,7 @@ When validation icons are rendered inside the indicators, they will override the
 
 ## Validation in Stepper with Display mode: Labels
 
-If the Stepper uses the [`Labels`]({%slug stepper-display-modes%}#labels)display mode, the validation icons will be displayed as part of the step label.
+If the Stepper uses the [`Labels`](slug://stepper-display-modes#labels)display mode, the validation icons will be displayed as part of the step label.
 
 >caption Setup Steps validation in a Stepper with Display mode: Labels. The result from the snippet.
 
diff --git a/components/stockchart/events.md b/components/stockchart/events.md
index 29d52b68f9..8bbb9bde22 100644
--- a/components/stockchart/events.md
+++ b/components/stockchart/events.md
@@ -32,8 +32,8 @@ Below you can find:
 The event handler receives a `ChartSeriesClickEventArgs` object which provides the following data:
 
 * `DataItem` - provides the data model of the current series item. You need to cast it to the type from your data source, which needs to be serializable.
-    * For [`OHLC`]({%slug stockchart-ohlc%}) and [`Candlestick`]({%slug stockchart-candlestick%}) chart types the `DataItem` will contain the information mapped to the `OpenField`, `CloseField`, `HighField` and `LowField` properties.
-    * For [`Line`]({%slug stockchart-line%}), [`Area`]({%slug stockchart-area%}) and [`Column`]({%slug stockchart-column%}) the `DataItem` will contain the information mapped to the `Field` properties.
+    * For [`OHLC`](slug://stockchart-ohlc) and [`Candlestick`](slug://stockchart-candlestick) chart types the `DataItem` will contain the information mapped to the `OpenField`, `CloseField`, `HighField` and `LowField` properties.
+    * For [`Line`](slug://stockchart-line), [`Area`](slug://stockchart-area) and [`Column`](slug://stockchart-column) the `DataItem` will contain the information mapped to the `Field` properties.
     * The `DataItem` will contain an aggregated value for the date, so in order to get it you can use the `Category` and parse it to `DateTime`.
 
 * `Category` - provides information on the category the data point is located in. Since the Stock Chart has a date X axis the `Category` should be cast to `DateTime`.
diff --git a/components/stockchart/labels-template-and-format.md b/components/stockchart/labels-template-and-format.md
index aa89e09689..1cd652de4d 100644
--- a/components/stockchart/labels-template-and-format.md
+++ b/components/stockchart/labels-template-and-format.md
@@ -128,7 +128,7 @@ Standard number format strings and rotate the labels of the Category Axis
 
 You can use the `Template` parameter to apply more complex formatting to the labels in the StockChart for Blazor. The syntax of the template is based on the [Kendo Templates](https://docs.telerik.com/kendo-ui/framework/templates/overview). The labels are not HTML elements so the `Template` cannot contain arbitrary HTML elements. If you want to add a new line, use the `\n` symbol instead of a block HTML element. 
 
-To format the values, you need to call a JavaScript function that will return the desired new string based on the template value you pass to it. You can find examples of this in the [How to format the percent in a label for a pie or donut chart]({%slug chart-format-percent%}) knowledge base article and the [Label Format - Complex Logic](https://github.com/telerik/blazor-ui/tree/master/chart/label-template) sample project.
+To format the values, you need to call a JavaScript function that will return the desired new string based on the template value you pass to it. You can find examples of this in the [How to format the percent in a label for a pie or donut chart](slug://chart-format-percent) knowledge base article and the [Label Format - Complex Logic](https://github.com/telerik/blazor-ui/tree/master/chart/label-template) sample project.
 
 ### Template Fields
 
diff --git a/components/stockchart/navigator.md b/components/stockchart/navigator.md
index 79da8f4d0c..35790a6576 100644
--- a/components/stockchart/navigator.md
+++ b/components/stockchart/navigator.md
@@ -20,7 +20,7 @@ In this article you will find:
 
 To enable data navigation you have to:
 
-1. set up a [`<TelerikStockChart>`]({%slug stockchart-overview%})
+1. set up a [`<TelerikStockChart>`](slug://stockchart-overview)
 1. add a `<StockChartNavigator>` inside the main `<TelerikStockChart>`
 1. add a `<StockChartNavigatorSeries>` to the `<StockChartNavigatorSeriesItems>` collection.
 1. set its `Type` property to one of the following:
diff --git a/components/stockchart/overview.md b/components/stockchart/overview.md
index 623135edbf..51c4d7bd23 100644
--- a/components/stockchart/overview.md
+++ b/components/stockchart/overview.md
@@ -12,14 +12,14 @@ position: 0
 
 The <a href = "https://www.telerik.com/blazor-ui/stock-chart" target="_blank">Blazor Stock Chart component</a> allows you to visualize the deviation of a financial unit over a period of time to the user in a meaningful way so they can draw conclusions. You can use a variety of chart types and control all aspects of the chart's appearance - from colors and fonts, to paddings, margins, tooltips and templates.
 
-The Telerik Stock Chart provides a [Navigator]({%slug stockchart-navigator%}) to widen or shorten the defined period of time and zoom on particular part of the chart; and a [crosshair]({%slug stockchart-crosshairs%}) to see precise values in data-dense charts.
+The Telerik Stock Chart provides a [Navigator](slug://stockchart-navigator) to widen or shorten the defined period of time and zoom on particular part of the chart; and a [crosshair](slug://stockchart-crosshairs) to see precise values in data-dense charts.
 
 ## Creating Stock Chart
 
 1. Add the `TelerikStockChart` tag to your razor page.
-2. Set the `DateField` parameter of the `TelerikStockChart` to the corresponding property of the model for the [`OHLC`]({%slug stockchart-ohlc%}) and the [`Candlestick`]({%slug stockchart-candlestick%}) StockChart types.
-3. Provide [data]({%slug stockchart-data-binding%}) to the series.
-4. (optional) Enable the [navigator]({%slug stockchart-navigator%}) by including its `StockChartNavigator` tag and adding a series that mirrors the main chart data to it.
+2. Set the `DateField` parameter of the `TelerikStockChart` to the corresponding property of the model for the [`OHLC`](slug://stockchart-ohlc) and the [`Candlestick`](slug://stockchart-candlestick) StockChart types.
+3. Provide [data](slug://stockchart-data-binding) to the series.
+4. (optional) Enable the [navigator](slug://stockchart-navigator) by including its `StockChartNavigator` tag and adding a series that mirrors the main chart data to it.
 
 >caption Basic configuration of a Stock Chart with common settings
 
@@ -252,9 +252,9 @@ To execute StockChart methods, obtain reference to the component instance via `@
 
 ## Next Steps
 
-* [Bind Data to the StockChart]({%slug stockchart-data-binding%})
-* [Explore the Navigator]({%slug stockchart-navigator%})
-* [Learn more about the Crosshair]({%slug stockchart-crosshairs%})
+* [Bind Data to the StockChart](slug://stockchart-data-binding)
+* [Explore the Navigator](slug://stockchart-navigator)
+* [Learn more about the Crosshair](slug://stockchart-crosshairs)
 
 ## See Also
 
diff --git a/components/stockchart/tooltip/overview.md b/components/stockchart/tooltip/overview.md
index 231306ed90..cf5a51ce61 100644
--- a/components/stockchart/tooltip/overview.md
+++ b/components/stockchart/tooltip/overview.md
@@ -10,7 +10,7 @@ position: 1
 
 # Tooltip for Telerik Blazor Stock Chart
 
-The Telerik Stock Chart provides a tooltip for its data points. You can have settings specific to each `<StockChartSeries>`, common tooltip settings for all series, or a [shared]({%slug stockchart-tooltip-shared%}) tooltip for all categories.
+The Telerik Stock Chart provides a tooltip for its data points. You can have settings specific to each `<StockChartSeries>`, common tooltip settings for all series, or a [shared](slug://stockchart-tooltip-shared) tooltip for all categories.
 
 In this article:
 
@@ -542,5 +542,5 @@ The available series data point information in the `context` is:
 
 ## See Also
 
-  * [Stock Chart Overview]({%slug stockchart-overview%})
-  * [Stock Chart Shared Tooltip]({%slug stockchart-tooltip-shared%})
+  * [Stock Chart Overview](slug://stockchart-overview)
+  * [Stock Chart Shared Tooltip](slug://stockchart-tooltip-shared)
diff --git a/components/stockchart/tooltip/shared.md b/components/stockchart/tooltip/shared.md
index 1d856315f0..7f6b14aefc 100644
--- a/components/stockchart/tooltip/shared.md
+++ b/components/stockchart/tooltip/shared.md
@@ -302,5 +302,5 @@ Each `Point` contains the following data:
 
 ## See also
 
-* [Stock Chart Overview]({%slug stockchart-overview%})
-* [Stock Chart Tooltip Overview]({%slug stockchart-tooltip-overview%})
+* [Stock Chart Overview](slug://stockchart-overview)
+* [Stock Chart Tooltip Overview](slug://stockchart-tooltip-overview)
diff --git a/components/switch/accessibility/wai-aria-support.md b/components/switch/accessibility/wai-aria-support.md
index f4e8c6343f..2cecf0f18b 100644
--- a/components/switch/accessibility/wai-aria-support.md
+++ b/components/switch/accessibility/wai-aria-support.md
@@ -69,4 +69,4 @@ For details on how the Switch keyboard navigation works, refer to the [Blazor Sw
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/switch/appearance.md b/components/switch/appearance.md
index be122be3a0..fdc9ea2caa 100644
--- a/components/switch/appearance.md
+++ b/components/switch/appearance.md
@@ -134,4 +134,4 @@ The `TrackRounded` attribute applies the `border-radius` CSS rule to the track o
 
 ## See Also
 
-* [Change the Switch Background Color]({%slug switch-kb-change-background-color%})
+* [Change the Switch Background Color](slug://switch-kb-change-background-color)
diff --git a/components/switch/labels.md b/components/switch/labels.md
index bb43e9a949..e8f89ea316 100644
--- a/components/switch/labels.md
+++ b/components/switch/labels.md
@@ -56,4 +56,4 @@ To remove the Switch labels, use a blank space for the `OnLabel` and `OffLabel`
 
 ## See Also
 * [Live Demo: Switch Labels](https://demos.telerik.com/blazor-ui/switch/labels)
-* [Switch Events]({%slug switch-events%})
\ No newline at end of file
+* [Switch Events](slug://switch-events)
\ No newline at end of file
diff --git a/components/switch/overview.md b/components/switch/overview.md
index 81e1c7cf5a..432734fe21 100644
--- a/components/switch/overview.md
+++ b/components/switch/overview.md
@@ -39,15 +39,15 @@ The <a href = "https://www.telerik.com/blazor-ui/switch" target="_blank">Blazor
 
 ## Labels
 
-The Switch has dedicated `On` and `Off` labels serving as text representation of the component value. [Read more about the Switch labels....]({%slug switch-labels%})
+The Switch has dedicated `On` and `Off` labels serving as text representation of the component value. [Read more about the Switch labels....](slug://switch-labels)
 
 ## Events
 
-The Blazor Switch generates events that you can handle and further customize its behavior. [Read more about the Switch events....]({%slug switch-events%})
+The Blazor Switch generates events that you can handle and further customize its behavior. [Read more about the Switch events....](slug://switch-events)
 
 ## Validation
 
-You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation....]({%slug common-features/input-validation%}) 
+You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation....](slug://common-features/input-validation) 
 
 ## Switch Parameters
 
@@ -70,8 +70,8 @@ The following parameters enable you to customize the appearance of the Blazor Sw
 
 | Attribute | Type and Default Value | Description |
 |----------|----------|----------|
-| `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the Switch. Use it to [customize the Switch background color and other styles]({%slug switch-kb-change-background-color%})
-| `Width` | `string` | The width of the component. You can set the Width parameter to any of the [supported units]({%slug common-features/dimensions%}).
+| `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the Switch. Use it to [customize the Switch background color and other styles](slug://switch-kb-change-background-color)
+| `Width` | `string` | The width of the component. You can set the Width parameter to any of the [supported units](slug://common-features/dimensions).
 
 >tip To learn more about the appearance, anatomy, and accessibility of the Switch, visit the [Progress Design System Kit documentation](https://www.telerik.com/design-system/docs/components/switch/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 
@@ -103,10 +103,10 @@ The Switch is a generic component and its type comes from the model field it is
 
 ## Next Steps
 
-* [Customize the Switch labels]({%slug switch-labels%})
-* [Handle the Switch events]({%slug switch-events%})
+* [Customize the Switch labels](slug://switch-labels)
+* [Handle the Switch events](slug://switch-events)
 
 ## See Also
 * [Live Demo: Switch](https://demos.telerik.com/blazor-ui/switch/overview)
-* [Switch Events]({%slug switch-events%})
+* [Switch Events](slug://switch-events)
 * [Switch API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikSwitch-1)
diff --git a/components/tabstrip/accessibility/wai-aria-support.md b/components/tabstrip/accessibility/wai-aria-support.md
index 2d6d20d115..cc026580eb 100644
--- a/components/tabstrip/accessibility/wai-aria-support.md
+++ b/components/tabstrip/accessibility/wai-aria-support.md
@@ -72,4 +72,4 @@ For details on how the TabStrip keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/tabstrip/active-tab-index.md b/components/tabstrip/active-tab-index.md
index a92e866d9b..e5f51c7970 100644
--- a/components/tabstrip/active-tab-index.md
+++ b/components/tabstrip/active-tab-index.md
@@ -10,7 +10,7 @@ position: 5
 
 # TabStrip Active Tab Index
 
-The TabStrip allows you to get or set the index of the currently selected (active) tab through the `ActiveTabIndex` parameter. It supports two-way binding (the `@bind-ActiveTabIndex` syntax) and one-way binding used along with the [`ActiveTabIndexChanged` event]({%slug tabstrip-events%}#activetabindexchanged).
+The TabStrip allows you to get or set the index of the currently selected (active) tab through the `ActiveTabIndex` parameter. It supports two-way binding (the `@bind-ActiveTabIndex` syntax) and one-way binding used along with the [`ActiveTabIndexChanged` event](slug://tabstrip-events#activetabindexchanged).
 
 To deactivate all tabs, set the `ActiveTabIndex` parameter to `-1`.
 
diff --git a/components/tabstrip/events.md b/components/tabstrip/events.md
index 38b200b505..32a66f78d6 100644
--- a/components/tabstrip/events.md
+++ b/components/tabstrip/events.md
@@ -80,4 +80,4 @@ If you remove programmatically the currently active tab, when it disposes, the e
 
 ## See Also
 
-  * [TabStrip Overview]({%slug components/tabstrip/overview%})
+  * [TabStrip Overview](slug://components/tabstrip/overview)
diff --git a/components/tabstrip/header-template.md b/components/tabstrip/header-template.md
index cdacaa98fd..d888cae2f0 100644
--- a/components/tabstrip/header-template.md
+++ b/components/tabstrip/header-template.md
@@ -61,10 +61,10 @@ You can define the `HeaderTemplate` with the following configuration in the `Tab
 
 ## Next Steps
 
-* [Use TabStrip Events]({%slug tabstrip-events%})
+* [Use TabStrip Events](slug://tabstrip-events)
 
 
 ## See Also
 
 * [Live Demo: TabStrip Header Template](https://demos.telerik.com/blazor-ui/tabstrip/header-template)
-* [How to remove TabStrip tabs]({%slug tabstrip-kb-remove-tab%})
+* [How to remove TabStrip tabs](slug://tabstrip-kb-remove-tab)
diff --git a/components/tabstrip/overview.md b/components/tabstrip/overview.md
index 7d78b5ecb0..652735a8ea 100644
--- a/components/tabstrip/overview.md
+++ b/components/tabstrip/overview.md
@@ -17,7 +17,7 @@ The <a href = "https://www.telerik.com/blazor-ui/tabstrip" target = "_blank">Bla
 1. Use the `<TelerikTabStrip>` tag.
 1. Add a nested `<TabStripTab>` tag for each tab you want to include in the component.
 1. Set tab titles through the `Title` parameter of the `<TabStripTab>` tags.
-1. Optionally, configure other tab settings such as `Disabled` - read more in the [Tabs Configuration]({%slug tabstrip-tabs-configuration%}) article.
+1. Optionally, configure other tab settings such as `Disabled` - read more in the [Tabs Configuration](slug://tabstrip-tabs-configuration) article.
 1. Place the desired content in the tabs - it can be any content, including other components.
 
 >caption TabStrip with specified tab position and a disabled tab
@@ -38,31 +38,31 @@ The <a href = "https://www.telerik.com/blazor-ui/tabstrip" target = "_blank">Bla
 
 ## Active Tab Index
 
-By default, the initially selected tab is the first one. You can programmatically control the selected tab through the `ActiveTabIndex` parameter. [Read more about the `ActiveTabIndex`...]({%slug tabstrip-activetabindex%})
+By default, the initially selected tab is the first one. You can programmatically control the selected tab through the `ActiveTabIndex` parameter. [Read more about the `ActiveTabIndex`...](slug://tabstrip-activetabindex)
 
 ## Tabs Configuration
 
-The Tabs are the building blocks of the TabStrip. The component allows individual configuration of the declared `<TabStripTab>` tags - you can set their title and visibility or put them in disabled state. [Read more about the available Tabs configuration options...]({%slug tabstrip-tabs-configuration%})
+The Tabs are the building blocks of the TabStrip. The component allows individual configuration of the declared `<TabStripTab>` tags - you can set their title and visibility or put them in disabled state. [Read more about the available Tabs configuration options...](slug://tabstrip-tabs-configuration)
 
 ## Position of the Tabs
 
-The Blazor TabStrip component allows you to control the position of the tabs. [Read more about the Tabs Position...]({%slug tabstrip-tabs-position%})
+The Blazor TabStrip component allows you to control the position of the tabs. [Read more about the Tabs Position...](slug://tabstrip-tabs-position)
 
 ## Alignment of the Tabs
 
-The Blazor TabStrip component allows you to control the alignment of the tabs. [Read more about the Tabs Alignment...]({%slug tabstrip-tabs-alignment%})
+The Blazor TabStrip component allows you to control the alignment of the tabs. [Read more about the Tabs Alignment...](slug://tabstrip-tabs-alignment)
 
 ## Persist Content
 
-The Blazor TabStrip component can persist the content of the tabs. When the user navigates between the tabs, their content will be hidden with CSS only to avoid re-initialization. [Read more about the Persist Content...]({%slug tabstrip-persist-content%})
+The Blazor TabStrip component can persist the content of the tabs. When the user navigates between the tabs, their content will be hidden with CSS only to avoid re-initialization. [Read more about the Persist Content...](slug://tabstrip-persist-content)
 
 ## Scrollable Tabs
 
-The Blazor TabStrip allows you to scroll only its tabs. This is useful for scenarios where a lot of tabs are defined. [Read more about the Scrollable Tabs...]({%slug tabstrip-scroll-tabs%})
+The Blazor TabStrip allows you to scroll only its tabs. This is useful for scenarios where a lot of tabs are defined. [Read more about the Scrollable Tabs...](slug://tabstrip-scroll-tabs)
 
 ## Events
 
-The TabStrip fires an [`ActiveTabIndexChanged` event]({%slug tabstrip-events%}) when the user clicks on a tab to select it.
+The TabStrip fires an [`ActiveTabIndexChanged` event](slug://tabstrip-events) when the user clicks on a tab to select it.
 
 ## TabStrip Parameters
 
@@ -73,8 +73,8 @@ The TabStrip provides the following features to allow further customization of i
 | Parameter        | Type  | Header 2                                 |
 |------------------|-------|------------------------------------------|
 | `ActiveTabIndex` | `int` | The index of the currently shown tab. Supports two-way binding.
-|`PersistTabContent` | `bool` | Whether to remove the content of inactive tabs from the DOM (if `false`), or just hide it with CSS (if `true`). See [Persist Content]({%slug tabstrip-persist-content%})
-| `Scrollable` | `bool` | Whether the tabs will be scrollable. See [Scrollable Tabs]({%slug tabstrip-scroll-tabs%})
+|`PersistTabContent` | `bool` | Whether to remove the content of inactive tabs from the DOM (if `false`), or just hide it with CSS (if `true`). See [Persist Content](slug://tabstrip-persist-content)
+| `Scrollable` | `bool` | Whether the tabs will be scrollable. See [Scrollable Tabs](slug://tabstrip-scroll-tabs)
 | `TabPosition` | `TabPosition` enum <br/> (`TabPosition.Top`)| Controls the position of the tabs.
 | `TabAlignment` | `TabStripTabAlignment` enum <br/> (`TabStripTabAlignment.Start`)| Controls the alignment of the tabs.
 
@@ -86,8 +86,8 @@ The following parameters enable you to customize the appearance of the Blazor Ta
 | Parameter | Type     | Description                              |
 |-----------|----------|------------------------------------------|
 | `Class`   | `string` | The CSS class that will be rendered on the main wrapping element of the component. |
-| `Width`   | `string` | The width of the component. You can set the Width parameter to any of the [supported units]({%slug common-features/dimensions%}). |
-| `Height`  | `string` | The height of the Component. You can set the `Height` parameter to any of the [supported units]({%slug common-features/dimensions%}). |
+| `Width`   | `string` | The width of the component. You can set the Width parameter to any of the [supported units](slug://common-features/dimensions). |
+| `Height`  | `string` | The height of the Component. You can set the `Height` parameter to any of the [supported units](slug://common-features/dimensions). |
 
 ## TabStrip Reference and Methods
 
@@ -136,13 +136,13 @@ The `TabStrip` methods are accessible through its reference.
 
 ## Next Steps
 
-* [Configure the Tabs]({%slug tabstrip-tabs-configuration%})
-* Explore the supported Tab [positions]({%slug tabstrip-tabs-position%}) and [alignments]({%slug tabstrip-tabs-alignment%})
-* [Handle the TabStrip events]({%slug tabstrip-events%})
+* [Configure the Tabs](slug://tabstrip-tabs-configuration)
+* Explore the supported Tab [positions](slug://tabstrip-tabs-position) and [alignments](slug://tabstrip-tabs-alignment)
+* [Handle the TabStrip events](slug://tabstrip-events)
 
 ## See Also
 
 * [Live Demo: TabStrip](https://demos.telerik.com/blazor-ui/tabstrip/overview)
 * [Live Demo: Tabs Position and Alignment](https://demos.telerik.com/blazor-ui/tabstrip/tab-positions)
-* [Events]({%slug tabstrip-events%})
+* [Events](slug://tabstrip-events)
 * [TabStrip API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikTabStrip)
diff --git a/components/tabstrip/persist-content.md b/components/tabstrip/persist-content.md
index 1bf366e562..4a369ff70c 100644
--- a/components/tabstrip/persist-content.md
+++ b/components/tabstrip/persist-content.md
@@ -47,4 +47,4 @@ To keep Tab content in the DOM after the Tab is deactivated, set the `PersistCon
 ## See Also
 
 * [Live Demo: TabStrip - Persist Tab Content](https://demos.telerik.com/blazor-ui/tabstrip/persist-content)
-* [Render All TabStrip Tabs Initially]({%slug tabstrip-kb-load-all-tabs%})
+* [Render All TabStrip Tabs Initially](slug://tabstrip-kb-load-all-tabs)
diff --git a/components/tabstrip/scrollable-tabs.md b/components/tabstrip/scrollable-tabs.md
index 3b04c4166e..df14fd23a7 100644
--- a/components/tabstrip/scrollable-tabs.md
+++ b/components/tabstrip/scrollable-tabs.md
@@ -12,7 +12,7 @@ position: 15
 
 If the TabStrip dimensions exceed the width or height of the page, a browser-level scrollbar will appear.
 
-To scroll the tabs only, set the `Scrollable` bool parameter of the TabStrip to `true` (defaults to `false`). You should also set the `Width` (for tabs with [Position]({%slug tabstrip-tabs-position%}) set to top and bottom) and `Height` (for tabs with [Position]({%slug tabstrip-tabs-position%}) set to left and right) to achieve the desired behavior.
+To scroll the tabs only, set the `Scrollable` bool parameter of the TabStrip to `true` (defaults to `false`). You should also set the `Width` (for tabs with [Position](slug://tabstrip-tabs-position) set to top and bottom) and `Height` (for tabs with [Position](slug://tabstrip-tabs-position) set to left and right) to achieve the desired behavior.
 
 >caption Scroll the tabs only
 
diff --git a/components/textarea/accessibility/wai-aria-support.md b/components/textarea/accessibility/wai-aria-support.md
index 8b14d767dc..9f63ae9e6b 100644
--- a/components/textarea/accessibility/wai-aria-support.md
+++ b/components/textarea/accessibility/wai-aria-support.md
@@ -64,9 +64,9 @@ The TextArea has been tested with the following screen readers and browsers comb
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor TextArea Demos](https://demos.telerik.com/blazor-ui/textarea/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/textarea/events.md b/components/textarea/events.md
index e7d11fe999..22534cd517 100644
--- a/components/textarea/events.md
+++ b/components/textarea/events.md
@@ -98,6 +98,6 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [TextArea Overview]({%slug textarea-overview%})
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [TextArea Overview](slug://textarea-overview)
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
diff --git a/components/textarea/overview.md b/components/textarea/overview.md
index 74203a448f..2d169e56bd 100644
--- a/components/textarea/overview.md
+++ b/components/textarea/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor TextArea Overview
 
-The Telerik <a href ="https://www.telerik.com/blazor-ui/textarea" target="_blank">Blazor TextArea component</a> is a highly customizable multi-line text input area. It provides features like auto resizing based on the user input and [events]({%slug textarea-events%}) to respond to user actions.
+The Telerik <a href ="https://www.telerik.com/blazor-ui/textarea" target="_blank">Blazor TextArea component</a> is a highly customizable multi-line text input area. It provides features like auto resizing based on the user input and [events](slug://textarea-events) to respond to user actions.
 
 ## Creating Blazor TextArea
 
@@ -35,7 +35,7 @@ The Telerik <a href ="https://www.telerik.com/blazor-ui/textarea" target="_blank
 
 ## Appearance
 
-The TextArea component provides settings to control its appearance. [Read more about the Blazor TextArea appearance settings]({%slug TextArea-appearance%}).
+The TextArea component provides settings to control its appearance. [Read more about the Blazor TextArea appearance settings](slug://TextArea-appearance).
 
 >tip To learn more about the appearance, anatomy, and accessibility of the TextArea, visit the [Progress Design System Kit documentation](https://www.telerik.com/design-system/docs/components/textarea/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 
@@ -43,7 +43,7 @@ The TextArea component provides settings to control its appearance. [Read more a
 
 ## Events
 
-The Blazor TextArea fires **blur** and value **change** events to respond to user actions. [Read more about the Blazor TextArea events]({%slug textarea-events%}).
+The Blazor TextArea fires **blur** and value **change** events to respond to user actions. [Read more about the Blazor TextArea events](slug://textarea-events).
 
 ## TextArea Parameters
 
@@ -55,7 +55,7 @@ The Blazor TextArea provides various parameters to configure the component:
 | ----------- | ----------- | ----------- |
 | `AutoCapitalize` | `string` | A `string` that maps to the [`autocapitalize`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autocapitalize) attribute of the HTML element. It's applicable only for touch devices and virtual keyboards. |
 | `AutoComplete` | `bool` | Maps to the autocomplete attribute of the HTML `<textarea>`. |
-| `ResizeMode` | `TextAreaResizeMode?` | Specifies the TextArea's resize behavior. The default behavior is the one set by the browser. You can also [use CSS to limit the resizing up to a max height]({%slug textarea-kb-autosize-max-height%}). |
+| `ResizeMode` | `TextAreaResizeMode?` | Specifies the TextArea's resize behavior. The default behavior is the one set by the browser. You can also [use CSS to limit the resizing up to a max height](slug://textarea-kb-autosize-max-height). |
 | `Class` | `string` | The custom CSS class to be rendered on the `<span class="k-textarea">` element. |
 | `Cols` | `int?` | Maps to the `cols` attribute of the HTML `<textarea>` element. Do not use together with `Width`.
 | `DebounceDelay` | `int` | Specifies the time in milliseconds between the last typed symbol and the updating of the value. The default value is 150ms. |
@@ -68,12 +68,12 @@ The Blazor TextArea provides various parameters to configure the component:
 | `Rows` | `int?` | Maps to the `rows` attribute of the HTML `<textarea>` element.
 | `SpellCheck` | `string` | A `string` that maps to the [`spellcheck`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/spellcheck) attribute of the HTML element. Use it to disable browser spellchecking if it's intrusive to the user or due to [privacy and security concerns](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/spellcheck#security_and_privacy_concerns). |
 | `TabIndex` | `Nullable<int>` | Maps to the `tabindex` attribute of the HTML element. You can use it to customize the order in which the inputs in your form focus with the `Tab` key. |
-| `Title` | `string` | Maps to the `title` attribute of the HTML element. You can use it to add a [Blazor Tooltip]({%slug tooltip-overview%}). |
-| `ValidateOn` | `ValidationEvent` enum <br /> (`Input`) | Configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs). |
+| `Title` | `string` | Maps to the `title` attribute of the HTML element. You can use it to add a [Blazor Tooltip](slug://tooltip-overview). |
+| `ValidateOn` | `ValidationEvent` enum <br /> (`Input`) | Configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs](slug://common-features/input-validation#validation-modes-for-simple-inputs). |
 | `Value` | `string` | The value of the component. Supports two-way binding. |
-| `Width` | `string` | The component width. See [Dimensions]({%slug common-features/dimensions%}). The `Width` parameter has no default value, but the theme applies a `width: 100%` style. Do not use together with `Cols`.|
+| `Width` | `string` | The component width. See [Dimensions](slug://common-features/dimensions). The `Width` parameter has no default value, but the theme applies a `width: 100%` style. Do not use together with `Cols`.|
 
-See the [Input Validation]({%slug common-features/input-validation%}) article.
+See the [Input Validation](slug://common-features/input-validation) article.
 
 ## TextArea Reference and Methods
 
@@ -103,8 +103,8 @@ The TextArea provides a `FocusAsync` method that allows the application to focus
 
 ## Next Steps
 
-* [Handle the TextArea Events]({%slug textarea-events%})
-* [Explore the TextArea Appearance Settings]({%slug TextArea-appearance%})
+* [Handle the TextArea Events](slug://textarea-events)
+* [Explore the TextArea Appearance Settings](slug://TextArea-appearance)
 
 ## See Also
 
diff --git a/components/textbox/accessibility/wai-aria-support.md b/components/textbox/accessibility/wai-aria-support.md
index bfa1203b31..3f1e413d3e 100644
--- a/components/textbox/accessibility/wai-aria-support.md
+++ b/components/textbox/accessibility/wai-aria-support.md
@@ -66,9 +66,9 @@ The TextBox has been tested with the following screen readers and browsers combi
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor TextBox Demos](https://demos.telerik.com/blazor-ui/textbox/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/textbox/events.md b/components/textbox/events.md
index b61e55bf6d..64ad96e330 100644
--- a/components/textbox/events.md
+++ b/components/textbox/events.md
@@ -143,5 +143,5 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
diff --git a/components/textbox/overview.md b/components/textbox/overview.md
index eec1033155..0f7d2dc967 100644
--- a/components/textbox/overview.md
+++ b/components/textbox/overview.md
@@ -12,7 +12,7 @@ position: 0
 
 The <a href="https://www.telerik.com/blazor-ui/textbox" target="_blank">Blazor TextBox component</a> allows the user to enter a generic plain text message. 
 
-You can control [various attributes](#textbox-parameters) of the `input` element and turn the TextBox into a password box, for example. You can also configure this component to respond to [events]({%slug components/textbox/events%}).
+You can control [various attributes](#textbox-parameters) of the `input` element and turn the TextBox into a password box, for example. You can also configure this component to respond to [events](slug://components/textbox/events).
 
 ## Creating Blazor TextBox
 
@@ -33,7 +33,7 @@ You can control [various attributes](#textbox-parameters) of the `input` element
 
 ## Appearance
 
-The TextBox component provides settings to control its appearance. [Read more about the Blazor TextBox appearance settings]({%slug textbox-appearance%}).
+The TextBox component provides settings to control its appearance. [Read more about the Blazor TextBox appearance settings](slug://textbox-appearance).
 
 >tip To learn more about the appearance, anatomy, and accessibility of the TextBox, visit the [Progress Design System Kit documentation](https://www.telerik.com/design-system/docs/components/textbox/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
 
@@ -41,7 +41,7 @@ The TextBox component provides settings to control its appearance. [Read more ab
 
 ## Events
 
-The Blazor TextBox generates blur and value change events for further customizing its behavior. [Read more about the Blazor TextBox events]({%slug components/textbox/events%}).
+The Blazor TextBox generates blur and value change events for further customizing its behavior. [Read more about the Blazor TextBox events](slug://components/textbox/events).
 
 ## TextBox Parameters
 
@@ -61,17 +61,17 @@ The Blazor TextBox provides various parameters to configure the component:
 | `MaxLength` | `int?` | Maps to the `maxlength` attribute of the HTML `<input />` element. |
 | `InputMode` | `string` | A `string` that maps to the [`inputmode`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) attribute of the HTML element. You can use it to instruct the rendering device to show a suitable virtual keyboard (for example, one optimized for entering an URL or an email). Make sure to use values that make sense for a text input. For example, if you need a numerical input, use the TelerikNumericTextBox component, or the TelerikDatePicker for dates. |
 | `Name` | `string` | The `name` attribute of the HTML element. It is usually required so the `AutoComplete` will be honored by the browser. |
-| `Password` | `bool` | When set to `true`, the HTML element renders `type="password"` so that the user input is hidden. You can find examples of validation and reveal buttons in the [Password Textbox demo](https://demos.telerik.com/blazor-ui/textbox/password) and the [Add Eye Icon to Reveal a TextBox Password]({%slug textbox-kb-eye-reveal-password%}) article. |
+| `Password` | `bool` | When set to `true`, the HTML element renders `type="password"` so that the user input is hidden. You can find examples of validation and reveal buttons in the [Password Textbox demo](https://demos.telerik.com/blazor-ui/textbox/password) and the [Add Eye Icon to Reveal a TextBox Password](slug://textbox-kb-eye-reveal-password) article. |
 | `Placeholder` | `string` | A `string` that maps to the `placeholder` attribute of the HTML element. If a `Label` is defined, it will be shown instead of the placeholder when the input is not focused. |
 | `ShowClearButton` | `bool` | Defines if the user can clear the component value through an **x** button rendered inside the input. |
 | `SpellCheck` | `string` | A `string` that maps to the [`spellcheck`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/spellcheck) attribute of the HTML element. Use it to disable browser spellchecking if it's intrusive to the user or due to [privacy and security concerns](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/spellcheck#security_and_privacy_concerns). |
 | `TabIndex` | ``Nullable<int>`` | Maps to the `tabindex` attribute of the HTML element. You can use it to customize the order in which the inputs in your form focus with the `Tab` key. |
-| `Title` | `string` | Maps to the `title` attribute of the HTML element. You can use it to add a [Blazor Tooltip]({%slug tooltip-overview%}). |
-| `ValidateOn` | `ValidationEvent` enum <br /> (`Input`) | Configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs). |
+| `Title` | `string` | Maps to the `title` attribute of the HTML element. You can use it to add a [Blazor Tooltip](slug://tooltip-overview). |
+| `ValidateOn` | `ValidationEvent` enum <br /> (`Input`) | Configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs](slug://common-features/input-validation#validation-modes-for-simple-inputs). |
 | `Value` | `string` | The value of the input. Supports two-way binding. |
-| `Width` | `string` | The component width. See [Dimensions]({%slug common-features/dimensions%}). The `Width` parameter has no default value, but the theme applies a `width: 100%` style. |
+| `Width` | `string` | The component width. See [Dimensions](slug://common-features/dimensions). The `Width` parameter has no default value, but the theme applies a `width: 100%` style. |
 
-See also the [Input Validation]({%slug common-features/input-validation%}) article.
+See also the [Input Validation](slug://common-features/input-validation) article.
 
 ## TextBox Reference and Methods
 
@@ -113,7 +113,7 @@ The TextBox provides a `FocusAsync` method that allows the application to focus
 
 >caption Password type TextBox
 
-See [Add Eye Icon to Reveal a TextBox Password]({%slug textbox-kb-eye-reveal-password%}).
+See [Add Eye Icon to Reveal a TextBox Password](slug://textbox-kb-eye-reveal-password).
 
 >caption Programmatically change the TextBox value
 
@@ -139,8 +139,8 @@ TextBox value: @StringValue
 
 ## Next Steps
 
-* [Explore the TextBox Appearance Settings]({%slug textbox-appearance%})
-* [Handle the TextBox Events]({%slug components/textbox/events%})
+* [Explore the TextBox Appearance Settings](slug://textbox-appearance)
+* [Handle the TextBox Events](slug://components/textbox/events)
 
 ## See Also
 
diff --git a/components/tilelayout/accessibility/overview.md b/components/tilelayout/accessibility/overview.md
index aad406e14c..c5210626f7 100644
--- a/components/tilelayout/accessibility/overview.md
+++ b/components/tilelayout/accessibility/overview.md
@@ -15,9 +15,9 @@ The UI for Blazor TileLayout component is <a href="https://www.w3.org/TR/WCAG22"
 
 WCAG 2.2 introduces the <a href="https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements" target="_blank">"Dragging Movements"</a> criterion as an important part of the Operable principle. Its primary goal is to guarantee that any feature reliant on drag actions offers an alternative method that can be executed with a single click, enhancing user accessibility.
 
-The illustrative example below shows the tile resize action, achievable through the [DropDown Button]({%slug dropdownbutton-overview%}). Telerik UI for Blazor aims to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
+The illustrative example below shows the tile resize action, achievable through the [DropDown Button](slug://dropdownbutton-overview). Telerik UI for Blazor aims to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
 
-The following example demonstrates the [accessibility compliance of the TileLayout component]({%slug tilelayout-wai-aria-support%}). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch]({%slug accessibility-overview%}#color-contrast).
+The following example demonstrates the [accessibility compliance of the TileLayout component](slug://tilelayout-wai-aria-support). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch](slug://accessibility-overview#color-contrast).
 
 >caption TileLayout accessibility compliance example
 
diff --git a/components/tilelayout/accessibility/wai-aria-support.md b/components/tilelayout/accessibility/wai-aria-support.md
index 7c536a66df..8faa99ca95 100644
--- a/components/tilelayout/accessibility/wai-aria-support.md
+++ b/components/tilelayout/accessibility/wai-aria-support.md
@@ -61,9 +61,9 @@ The TileLayout has been tested with the following screen readers and browsers co
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor TileLayout Demos](https://demos.telerik.com/blazor-ui/tilelayout/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/tilelayout/events.md b/components/tilelayout/events.md
index a2b8d07d50..f3699994da 100644
--- a/components/tilelayout/events.md
+++ b/components/tilelayout/events.md
@@ -17,7 +17,7 @@ This article explains the events available in the Telerik TileLayout for Blazor:
 
 ## OnResize
 
-The `OnResize` event is fired when any tile is resized. It lets you respond to that change if needed - for example, call the `.Refresh()` method of a chart or otherwise repaint a child component in the content. You can also use it to, for example, update the saved [state]({%slug tilelayout-state%}) for your users.
+The `OnResize` event is fired when any tile is resized. It lets you respond to that change if needed - for example, call the `.Refresh()` method of a chart or otherwise repaint a child component in the content. You can also use it to, for example, update the saved [state](slug://tilelayout-state) for your users.
 
 The `OnResize` event provides an argument of type `TileLayoutResizeEventArgs`. It exposes two properties:
 
@@ -88,7 +88,7 @@ The `OnResize` event provides an argument of type `TileLayoutResizeEventArgs`. I
 
 ## OnReorder
 
-The `OnReorder` event fires when tiles have been reordered. You can use it to, for example, update the saved [state]({%slug tilelayout-state%}) for your users.
+The `OnReorder` event fires when tiles have been reordered. You can use it to, for example, update the saved [state](slug://tilelayout-state) for your users.
 
 The `OnReorder` event provides an argument of type `TileLayoutReorderEventArgs`. It exposes two properties:
 
@@ -128,9 +128,9 @@ The `OnReorder` event provides an argument of type `TileLayoutReorderEventArgs`.
 
 ## Next Steps
 
-* [Manage the Tile Layout state]({%slug tilelayout-state%}).
+* [Manage the Tile Layout state](slug://tilelayout-state).
 
 
 ## See Also
 
-* [TileLayout Overview]({%slug tilelayout-overview%})
+* [TileLayout Overview](slug://tilelayout-overview)
diff --git a/components/tilelayout/layout.md b/components/tilelayout/layout.md
index 192bd347c3..bc8d1b7a45 100644
--- a/components/tilelayout/layout.md
+++ b/components/tilelayout/layout.md
@@ -52,12 +52,12 @@ Each tile provides settings that define how many columns and rows its takes up -
 
 ## Next Steps
 
-* [Find how to set tile content]({%slug tilelayout-tile-content%}).
-* Enable tile [resizing]({%slug tilelayout-resize%}) and [reordering]({%slug tilelayout-reorder%}).
-* [Handle Tile Layout events]({%slug tilelayout-events%}).
-* [Manage the Tile Layout state]({%slug tilelayout-state%}).
+* [Find how to set tile content](slug://tilelayout-tile-content).
+* Enable tile [resizing](slug://tilelayout-resize) and [reordering](slug://tilelayout-reorder).
+* [Handle Tile Layout events](slug://tilelayout-events).
+* [Manage the Tile Layout state](slug://tilelayout-state).
 
 
 ## See Also
 
-* [TileLayout Overview]({%slug tilelayout-overview%})
+* [TileLayout Overview](slug://tilelayout-overview)
diff --git a/components/tilelayout/overview.md b/components/tilelayout/overview.md
index 610b9690ce..8da0e2ffc7 100644
--- a/components/tilelayout/overview.md
+++ b/components/tilelayout/overview.md
@@ -10,15 +10,15 @@ position: 0
 
 # Blazor TileLayout Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/tilelayout" target="_blank">Blazor TileLayout component</a> is based on the two-dimensional <a href="https://css-tricks.com/snippets/css/complete-guide-grid/" target="_blank">CSS grid</a> and displays its content in tiles. Users can [drag to rearrange]({%slug tilelayout-reorder%}) and [drag to resize]({%slug tilelayout-resize%}) tiles. The tiles can span across multiple rows and columns. This allows you to build customizable dashboards for your users, save and restore the [layout state]({%slug tilelayout-state%}).
+The <a href = "https://www.telerik.com/blazor-ui/tilelayout" target="_blank">Blazor TileLayout component</a> is based on the two-dimensional <a href="https://css-tricks.com/snippets/css/complete-guide-grid/" target="_blank">CSS grid</a> and displays its content in tiles. Users can [drag to rearrange](slug://tilelayout-reorder) and [drag to resize](slug://tilelayout-resize) tiles. The tiles can span across multiple rows and columns. This allows you to build customizable dashboards for your users, save and restore the [layout state](slug://tilelayout-state).
 
 ## Creating Blazor TileLayout
 
 1. Use the `TelerikTileLayout` tag.
 1. Set the desired number of `Columns` for the layout.
-1. (optional) Configure the `Width`, `Height`, `ColumnWidth` or `RowHeight` to [define the desired dimensions of the layout]({%slug tilelayout-layout%}) and the base size of the individual tiles.
-1. (optional) set the [`Resizable`]({%slug tilelayout-resize%}) and [`Reorderable`]({%slug tilelayout-reorder%}) parameters to `true` to allow the user to alter the layout.
-1. Add `<TileLayoutItem>` instances inside a `<TileLayoutItems>` tag. Set the `HeaderText` parameter of each tile, and add a nested `<Content>` tag for the [tile content]({%slug tilelayout-tile-content%}).
+1. (optional) Configure the `Width`, `Height`, `ColumnWidth` or `RowHeight` to [define the desired dimensions of the layout](slug://tilelayout-layout) and the base size of the individual tiles.
+1. (optional) set the [`Resizable`](slug://tilelayout-resize) and [`Reorderable`](slug://tilelayout-reorder) parameters to `true` to allow the user to alter the layout.
+1. Add `<TileLayoutItem>` instances inside a `<TileLayoutItems>` tag. Set the `HeaderText` parameter of each tile, and add a nested `<Content>` tag for the [tile content](slug://tilelayout-tile-content).
 1. (optional) Set the `RowSpan` and `ColSpan` parameters of the tiles to values larger than `1` to increase their size in the grid.
 
 >caption Basic Tile Layout
@@ -47,32 +47,32 @@ The <a href = "https://www.telerik.com/blazor-ui/tilelayout" target="_blank">Bla
 
 ## Layout and Appearance
 
-The TileLayout is based on the *CSS Grid* concept. Basically, [the component layout depends on columns and rows with predefined or automatic dimensions]({%slug tilelayout-layout%}). You can set the spacing between rows and columns. Finally, tiles can also span over multiple rows and columns.
+The TileLayout is based on the *CSS Grid* concept. Basically, [the component layout depends on columns and rows with predefined or automatic dimensions](slug://tilelayout-layout). You can set the spacing between rows and columns. Finally, tiles can also span over multiple rows and columns.
 
 
 ## Tile Content
 
-Each tile (`<TileLayoutItem>`) in the TileLayout provides a few configuration options to [control its header and content]({%slug tilelayout-tile-content%}).
+Each tile (`<TileLayoutItem>`) in the TileLayout provides a few configuration options to [control its header and content](slug://tilelayout-tile-content).
 
 
 ## Resizing
 
-Users can [resize individual tiles]({%slug tilelayout-resize%}) for better user experience and content visibility.
+Users can [resize individual tiles](slug://tilelayout-resize) for better user experience and content visibility.
 
 
 ## Reordering
 
-Users can also [rearrange tiles]({%slug tilelayout-reorder%}), according to their preferences.
+Users can also [rearrange tiles](slug://tilelayout-reorder), according to their preferences.
 
 
 ## State
 
-The [Tile Layout allows getting and setting its state]({%slug tilelayout-state%}). The TileLayout state contains information about the tiles' order, column span and row span.
+The [Tile Layout allows getting and setting its state](slug://tilelayout-state). The TileLayout state contains information about the tiles' order, column span and row span.
 
 
 ## Events
 
-The Tile Layout fires [events when the user resizes or rearranges tiles]({%slug tilelayout-events%}). This allows custom logic execution, refreshing of nested components and saving the [TileLayout state]({%slug tilelayout-state%}) for later restore.
+The Tile Layout fires [events when the user resizes or rearranges tiles](slug://tilelayout-events). This allows custom logic execution, refreshing of nested components and saving the [TileLayout state](slug://tilelayout-state) for later restore.
 
 
 ## TileLayout Parameters
@@ -83,7 +83,7 @@ The following table lists the Tile Layout parameters. Also check the [TileLayout
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | The custom CSS class of the `<div class="k-tilelayout">` element. Use it to [override theme styles]({%slug themes-override%}). |
+| `Class` | `string` | The custom CSS class of the `<div class="k-tilelayout">` element. Use it to [override theme styles](slug://themes-override). |
 | `ColumnSpacing` | `string` <br /> (`"16px"`) | The empty space between columns. |
 | `Columns` | `int` | The number of columns in the Tile Layout. |
 | `ColumnWidth` | `string` | The width of one tile. If not set, the tile widths will distribute evenly. |
@@ -98,17 +98,17 @@ The following table lists the Tile Layout parameters. Also check the [TileLayout
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | The custom CSS class of the `<div class="k-tilelayout-item">` element. Use it to [override theme styles]({%slug themes-override%}). |
+| `Class` | `string` | The custom CSS class of the `<div class="k-tilelayout-item">` element. Use it to [override theme styles](slug://themes-override). |
 | `ColSpan` | `int` <br /> (`1`) | How many columns a tile will span over. |
 | `HeaderText` | `string` | The tile header as plain text. For rich text, use a nested `<HeaderTemplate>` tag. |
-| `Id` | `string` | Tile IDs are not rendered in the HTML markup. The component provides them in the [`OnReorder` and `OnResize` event arguments]({%slug tilelayout-events%}). |
+| `Id` | `string` | Tile IDs are not rendered in the HTML markup. The component provides them in the [`OnReorder` and `OnResize` event arguments](slug://tilelayout-events). |
 | `RowSpan` | `int` <br /> (`1`) | How many rows a tile will span over. |
 | `Visible` | `bool` <br /> (`true`) | Defines the tile visibility. |
 
 
 ## TileLayout Reference
 
-Use the component reference to execute methods and [get or set the TileLayout state]({%slug tilelayout-state%}).
+Use the component reference to execute methods and [get or set the TileLayout state](slug://tilelayout-state).
 
 | Method | Description |
 | --- | --- |
@@ -135,11 +135,11 @@ Use the component reference to execute methods and [get or set the TileLayout st
 
 ## Next Steps
 
-* [Explore Tile Layout appearance settings]({%slug tilelayout-layout%}).
-* [Find how to set tile content]({%slug tilelayout-tile-content%}).
-* Enable tile [resizing]({%slug tilelayout-resize%}) and [reordering]({%slug tilelayout-reorder%}).
-* [Handle Tile Layout events]({%slug tilelayout-events%}).
-* [Manage the Tile Layout state]({%slug tilelayout-state%}).
+* [Explore Tile Layout appearance settings](slug://tilelayout-layout).
+* [Find how to set tile content](slug://tilelayout-tile-content).
+* Enable tile [resizing](slug://tilelayout-resize) and [reordering](slug://tilelayout-reorder).
+* [Handle Tile Layout events](slug://tilelayout-events).
+* [Manage the Tile Layout state](slug://tilelayout-state).
 
 
 ## See Also
diff --git a/components/tilelayout/reorder.md b/components/tilelayout/reorder.md
index cc21e42132..5c1a6622e9 100644
--- a/components/tilelayout/reorder.md
+++ b/components/tilelayout/reorder.md
@@ -14,11 +14,11 @@ You can rearrange the tiles in the tile layout by a simple drag-and-drop of thei
 
 To enable reordering, set the `Reorderable` parameter of the main `TelerikTileLayout` tag to `true`.
 
-To be able to drag and reorder a tile, it must have some [content]({%slug tilelayout-tile-content%}) in its header.
+To be able to drag and reorder a tile, it must have some [content](slug://tilelayout-tile-content) in its header.
 
 @[template](/_contentTemplates/tilelayout/basics.md#resizing-reordering-logic)
 
-Reordering a tile fires the [OnReorder event]({%slug tilelayout-events%}#onreorder).
+Reordering a tile fires the [OnReorder event](slug://tilelayout-events#onreorder).
 
 > When the tile layout allows reordering, it captures mouse events in the tile headers. Thus, if you put components in the `HeaderTemplate` of the tiles, they may not function as expected. For example, you may not be able to focus inputs with the mouse. The header is designed for presentation purposes and to allow dragging. We recommend putting editors or complex content in the `Content` of the tiles.
 
@@ -52,11 +52,11 @@ Reordering a tile fires the [OnReorder event]({%slug tilelayout-events%}#onreord
 
 ## Next Steps
 
-* [Handle Tile Layout events]({%slug tilelayout-events%}).
-* [Manage the Tile Layout state]({%slug tilelayout-state%}).
+* [Handle Tile Layout events](slug://tilelayout-events).
+* [Manage the Tile Layout state](slug://tilelayout-state).
 
 
 ## See Also
 
-* [Overview]({%slug tilelayout-overview%})
+* [Overview](slug://tilelayout-overview)
 * [Live Demo: TileLayout Reordering](https://demos.telerik.com/blazor-ui/tilelayout/reordering)
diff --git a/components/tilelayout/resize.md b/components/tilelayout/resize.md
index 77cb7a86d3..e1dd35d661 100644
--- a/components/tilelayout/resize.md
+++ b/components/tilelayout/resize.md
@@ -20,7 +20,7 @@ To enable resizing:
 
 @[template](/_contentTemplates/tilelayout/basics.md#resizing-reordering-logic)
 
-Resizing a tile fires the [OnResize event]({%slug tilelayout-events%}#onresize).
+Resizing a tile fires the [OnResize event](slug://tilelayout-events#onresize).
 
 >caption Resizing tiles in the TileLayout
 
@@ -52,12 +52,12 @@ Resizing a tile fires the [OnResize event]({%slug tilelayout-events%}#onresize).
 
 ## Next Steps
 
-* Enable [tile reordering]({%slug tilelayout-reorder%}).
-* [Handle Tile Layout events]({%slug tilelayout-events%}).
-* [Manage the Tile Layout state]({%slug tilelayout-state%}).
+* Enable [tile reordering](slug://tilelayout-reorder).
+* [Handle Tile Layout events](slug://tilelayout-events).
+* [Manage the Tile Layout state](slug://tilelayout-state).
 
 
 ## See Also
 
-* [Overview]({%slug tilelayout-overview%})
+* [Overview](slug://tilelayout-overview)
 * [Live Demo: TileLayout Resizing](https://demos.telerik.com/blazor-ui/tilelayout/resizing)
diff --git a/components/tilelayout/state.md b/components/tilelayout/state.md
index d84c8cbbd3..3fe2b3ff4d 100644
--- a/components/tilelayout/state.md
+++ b/components/tilelayout/state.md
@@ -28,7 +28,7 @@ The `TileLayoutItemState` object has the following fields:
 
 The TileLayout component reads the state collection and applies the information from it to each tile that is declared in the markup sequentially. Thus, changing the tiles collection between a save and a load of the state might alter the results.
 
-You can consider saving the current state of the component in events that it exposes (such as [OnReorder and OnResize]({%slug tilelayout-events%})) or on an event specific to your app (such as a button click or the `Dispose` method from `IDisposable` from its parent component). You can consider loading the state in events like `OnAfterRender` of its parent component, or events specific to your app such as button click.
+You can consider saving the current state of the component in events that it exposes (such as [OnReorder and OnResize](slug://tilelayout-events)) or on an event specific to your app (such as a button click or the `Dispose` method from `IDisposable` from its parent component). You can consider loading the state in events like `OnAfterRender` of its parent component, or events specific to your app such as button click.
 
 >caption Save, Load, Persist and Manage the State of a TileLayout. Uses a sample LocalStorage in the browser.
 
@@ -171,13 +171,13 @@ public class LocalStorage
 
 ## Add And Remove Tiles
 
-To change the tile collection itself and add or remove tiles, render the `<TileLayoutItem>` instances with a loop. See article [How to Add and Remove TileLayout Tiles]({%slug tilelayout-kb-add-remove-tiles%}).
+To change the tile collection itself and add or remove tiles, render the `<TileLayoutItem>` instances with a loop. See article [How to Add and Remove TileLayout Tiles](slug://tilelayout-kb-add-remove-tiles).
 
 ## Next Steps
 
-* [Explore TileLayout event]({%slug tilelayout-events%})
+* [Explore TileLayout event](slug://tilelayout-events)
 
 ## See Also
 
 * [Live Demo: TileLayout State](https://demos.telerik.com/blazor-ui/tilelayout/persist-state)
-* [KB: Add or Remove Tiles]({%slug tilelayout-kb-add-remove-tiles%})
+* [KB: Add or Remove Tiles](slug://tilelayout-kb-add-remove-tiles)
diff --git a/components/tilelayout/tile-content.md b/components/tilelayout/tile-content.md
index 6b4285a3f2..dce7fdd24d 100644
--- a/components/tilelayout/tile-content.md
+++ b/components/tilelayout/tile-content.md
@@ -90,6 +90,6 @@ If you want to change that (for example, because you have certain content that r
 
 ## Next Steps
 
-* Enable tile [resizing]({%slug tilelayout-resize%}) and [reordering]({%slug tilelayout-reorder%}).
-* [Handle Tile Layout events]({%slug tilelayout-events%}).
-* [Manage the Tile Layout state]({%slug tilelayout-state%}).
+* Enable tile [resizing](slug://tilelayout-resize) and [reordering](slug://tilelayout-reorder).
+* [Handle Tile Layout events](slug://tilelayout-events).
+* [Manage the Tile Layout state](slug://tilelayout-state).
diff --git a/components/timepicker/accessibility/wai-aria-support.md b/components/timepicker/accessibility/wai-aria-support.md
index 347c60e9ef..f4b9ed5aae 100644
--- a/components/timepicker/accessibility/wai-aria-support.md
+++ b/components/timepicker/accessibility/wai-aria-support.md
@@ -88,4 +88,4 @@ For details on how the TimePicker keyboard navigation works, refer to the [Blazo
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/timepicker/events.md b/components/timepicker/events.md
index e32953479b..f55c73a575 100644
--- a/components/timepicker/events.md
+++ b/components/timepicker/events.md
@@ -218,5 +218,5 @@ The `OnBlur` event fires when the component loses focus.
 
 ## See Also
 
-* [ValueChanged and Validation]({%slug value-changed-validation-model%})
-* [Fire OnChange Only Once]({%slug ddl-kb-onchange-fires-twice%})
+* [ValueChanged and Validation](slug://value-changed-validation-model)
+* [Fire OnChange Only Once](slug://ddl-kb-onchange-fires-twice)
diff --git a/components/timepicker/increment-steps.md b/components/timepicker/increment-steps.md
index cc8964f1ba..3f79b58984 100644
--- a/components/timepicker/increment-steps.md
+++ b/components/timepicker/increment-steps.md
@@ -47,5 +47,5 @@ All values default to `1` to provide every possible option. If you set a value l
 ## See Also
 
 * [Live Demo: Time Picker Incremental Steps](https://demos.telerik.com/blazor-ui/timepicker/incremental-steps)
-* [TimePicker Overview]({%slug components/timepicker/overview%})
+* [TimePicker Overview](slug://components/timepicker/overview)
 
diff --git a/components/timepicker/overview.md b/components/timepicker/overview.md
index f279992e0f..e2fef9b2f5 100644
--- a/components/timepicker/overview.md
+++ b/components/timepicker/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Time Picker Overview
 
-The <a href="https://www.telerik.com/blazor-ui/timepicker" target="_blank">Blazor Time Picker component</a> allows the user to choose a time from a visual list in a dropdown, or to type it into a [date input]({%slug components/dateinput/overview%}) that can accept only DateTime values. You can control the format shown in the input and respond to [events]({%slug components/timepicker/events %}).
+The <a href="https://www.telerik.com/blazor-ui/timepicker" target="_blank">Blazor Time Picker component</a> allows the user to choose a time from a visual list in a dropdown, or to type it into a [date input](slug://components/dateinput/overview) that can accept only DateTime values. You can control the format shown in the input and respond to [events](slug://components/timepicker/events ).
 
 The Time Picker component supports `DateTime`, `DateTime?`, `DateTimeOffset` and `DateTimeOffset?` types.
 
@@ -45,15 +45,15 @@ TimePicker.
 
 ## Increment Steps
 
-The Time Picker enables the end users to change the selected value by clicking the rendered arrows. You can set the increment and decrement steps through the nested `TimePickerSteps` tag and its parameters. [Read more about the Blazor Time Picker increment steps...]({%slug timepicker-steps%})
+The Time Picker enables the end users to change the selected value by clicking the rendered arrows. You can set the increment and decrement steps through the nested `TimePickerSteps` tag and its parameters. [Read more about the Blazor Time Picker increment steps...](slug://timepicker-steps)
 
 ## Events
 
-The Blazor Time Picker generates events that you can handle and further customize its behavior. [Read more about the Blazor Time Picker events...]({%slug components/timepicker/events%}).
+The Blazor Time Picker generates events that you can handle and further customize its behavior. [Read more about the Blazor Time Picker events...](slug://components/timepicker/events).
 
 ## Validation
 
-You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...]({%slug common-features/input-validation%}).
+You can ensure that the component value is acceptable by using the built-in validation. [Read more about input validation...](slug://common-features/input-validation).
 
 ## Action Buttons
 
@@ -79,19 +79,19 @@ The Blazor Time Picker component provides various parameters that allow you to c
 
 | Attribute | Type and Default Value | Description |
 |---|---|---|
-| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode]({%slug adaptive-rendering%}) of the component. |
+| `AdaptiveMode` | `AdaptiveMode` <br /> (`None`) | The [adaptive mode](slug://adaptive-rendering) of the component. |
 | `AutoComplete` | `string` <br /> (`"off"`) | The `autocomplete` HTML attribute of the `input`. |
 | `DebounceDelay` | `int` <br/> (`150`) | Time in milliseconds between the last typed symbol and the value update. Use it to balance between client-side performance and number of database queries. |
 | `Enabled` | `bool` | Specifies whether typing in the input and opening the dropdown are allowed. |
 | `ReadOnly` | `bool` | If set to `true`, the component will be readonly and will not allow user input. The component is not readonly by default and allows user input. |
-| `Format` | `string` <br /> (`ShortTimePattern`) | The format of the TimePicker's DateInput. The default value depends on `CultureInfo.CurrentCulture`. Read more at [Supported date formats by the DateInput]({%slug components/dateinput/supported-formats%}). Note that format specifiers for non-time portions will be editable only in the input and will not have a representation in the Time Picker dropdown. |
+| `Format` | `string` <br /> (`ShortTimePattern`) | The format of the TimePicker's DateInput. The default value depends on `CultureInfo.CurrentCulture`. Read more at [Supported date formats by the DateInput](slug://components/dateinput/supported-formats). Note that format specifiers for non-time portions will be editable only in the input and will not have a representation in the Time Picker dropdown. |
 | `Id` | `string` | Renders as the `id` attribute on the `<input />` element, so you can attach a `<label for="">` to the input. |
 | `Max` | `DateTime` <br /> (`DateTime(2099, 12, 31, 23, 59, 59)`) | The latest time that the user can select. |
 | `Min` | `DateTime` <br /> (`DateTime(1900, 1, 1, 0, 0, 0)`) | The earliest time that the user can select. |
 | `Placeholder` | `string` | Maps to the `placeholder` attribute of the HTML element. The placeholder will appear if the component is bound to **nullable** DateTime object - `DateTime?`, but will not be rendered if the component is bound to the default value of a non-nullable DateTime object. The Placeholder value will be displayed when the input is not focused. Once the user focuses it to start typing, the Format Placeholder (default or [customized one](#format-placeholder)) will override the Placeholder to indicate the format the date should be entered in. |
 | `ShowClearButton` | `bool` | Defines if the user can clear the component value through an **x** button rendered inside the input. |
 | `TabIndex` | `int?` | Maps to the `tabindex` attribute of the HTML element. You can use it to customize the order in which the inputs in your form focus with the `Tab` key. |
-| `ValidateOn` | `ValidationEvent` enum <br/> (`Input`) | Configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs). |
+| `ValidateOn` | `ValidationEvent` enum <br/> (`Input`) | Configures the event that will trigger validation (if validation is enabled). Read more at [Validation Modes for Simple Inputs](slug://common-features/input-validation#validation-modes-for-simple-inputs). |
 | `Value` | `DateTime` or `DateTime?` | The current value of the component. Supports two-way binding. |
 
 @[template](/_contentTemplates/date-inputs/general.md#typing-parameters)
@@ -106,7 +106,7 @@ The following parameters enable you to customize the appearance of the Blazor Ti
 | `PopupClass` | `string` | additional CSS class to customize the appearance of the Time Picker's dropdown.
 | `Width` | `string` | Defines the width of the TimePicker.
 
-You can find more options for customizing the Time Picker styling in the [Appearance article]({%slug timepicker-appearance%}).
+You can find more options for customizing the Time Picker styling in the [Appearance article](slug://timepicker-appearance).
 
 @[template](/_contentTemplates/date-inputs/general.md#format-placeholder)
 
@@ -143,13 +143,13 @@ Add a reference to the component instance to use the [Time Picker's methods](/bl
 
 ## Next Steps
 
-* [Using the Time Picker Events]({%slug components/timepicker/events%})
+* [Using the Time Picker Events](slug://components/timepicker/events)
 
-* [Configuring the Time Picker Increment Steps]({%slug timepicker-steps%})
+* [Configuring the Time Picker Increment Steps](slug://timepicker-steps)
 
 ## See Also
 
 * [Live Demo: Time Picker](https://demos.telerik.com/blazor-ui/timepicker/overview)
-* [Input Validation]({%slug common-features/input-validation%})
-* [Supported Input Date Formats]({%slug components/dateinput/supported-formats%})
+* [Input Validation](slug://common-features/input-validation)
+* [Supported Input Date Formats](slug://components/dateinput/supported-formats)
 * [TimePicker API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikTimePicker-1)
diff --git a/components/togglebutton/accessibility/wai-aria-support.md b/components/togglebutton/accessibility/wai-aria-support.md
index 89500eb116..c6336f3263 100644
--- a/components/togglebutton/accessibility/wai-aria-support.md
+++ b/components/togglebutton/accessibility/wai-aria-support.md
@@ -62,4 +62,4 @@ For details on how the ToggleButton keyboard navigation works, refer to the [Bla
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/togglebutton/events.md b/components/togglebutton/events.md
index 0d9bebb175..57d35849e3 100644
--- a/components/togglebutton/events.md
+++ b/components/togglebutton/events.md
@@ -78,4 +78,4 @@ The `SelectedChanged` event fires after `OnClick`.
 
 ## See Also
 
-* [ToggleButton Overview]({%slug togglebutton-overview%})
+* [ToggleButton Overview](slug://togglebutton-overview)
diff --git a/components/togglebutton/icons.md b/components/togglebutton/icons.md
index 5ef1a0cb17..3200737a8c 100644
--- a/components/togglebutton/icons.md
+++ b/components/togglebutton/icons.md
@@ -18,7 +18,7 @@ You can put a Font or Svg Icon in the toggle button to illustrate its purpose fo
 
 | Parameter | Type and Default Value | Description |
 |---|---|---|
-| `Icon`| `object` | Use it to display a [Telerik Font and SVG Icons]({%slug common-features-icons%}). |
+| `Icon`| `object` | Use it to display a [Telerik Font and SVG Icons](slug://common-features-icons). |
 
 The following example shows how to use SVG and Font icons. If you don't add text to the button, the button will center the icon on all sides.
 
@@ -56,4 +56,4 @@ Images and icons should generally be small enough to fit in a line of text - the
 
 ## See Also
 
-* [ToggleButton Overview]({%slug togglebutton-overview%})
+* [ToggleButton Overview](slug://togglebutton-overview)
diff --git a/components/togglebutton/overview.md b/components/togglebutton/overview.md
index c53d297bad..bfa93946a9 100644
--- a/components/togglebutton/overview.md
+++ b/components/togglebutton/overview.md
@@ -12,14 +12,14 @@ position: 0
 
 This article provides information about the <a href="https://www.telerik.com/blazor-ui/togglebutton" target="_blank">Blazor ToggleButton component</a> and its core features.
 
-The ToggleButton component can have a selected state, which is the main difference from the [regular Telerik UI for Blazor Button]({%slug components/button/overview%}). The two-state styling depends on the [chosen theme]({%slug themes-overview%}). The ToggleButton also provides [events]({%slug togglebutton-events%}), [declarative appearance customization]({%slug togglebutton-appearance%}) and can nest [icons]({%slug togglebutton-icons%}).
+The ToggleButton component can have a selected state, which is the main difference from the [regular Telerik UI for Blazor Button](slug://components/button/overview). The two-state styling depends on the [chosen theme](slug://themes-overview). The ToggleButton also provides [events](slug://togglebutton-events), [declarative appearance customization](slug://togglebutton-appearance) and can nest [icons](slug://togglebutton-icons).
 
 ## Creating Blazor ToggleButton
 
 1. Use the `<TelerikToggleButton>` tag.
-1. Set the `Selected` parameter to a `bool` property. Use two-way binding, or one-way binding with a [`SelectedChanged` handler]({%slug togglebutton-events%}#selectedchanged).
-1. Handle the [`OnClick` event]({%slug togglebutton-events%}#onclick).
-1. (optional) Add an [icon]({%slug togglebutton-icons%}) or configure the [appearance]({%slug togglebutton-appearance%}).
+1. Set the `Selected` parameter to a `bool` property. Use two-way binding, or one-way binding with a [`SelectedChanged` handler](slug://togglebutton-events#selectedchanged).
+1. Handle the [`OnClick` event](slug://togglebutton-events#onclick).
+1. (optional) Add an [icon](slug://togglebutton-icons) or configure the [appearance](slug://togglebutton-appearance).
 
 >caption Basic Telerik ToggleButton
 
@@ -46,15 +46,15 @@ The ToggleButton component can have a selected state, which is the main differen
 
 ## Events
 
-The Toggle Button exposes events for clicks and selected state changes. Find more in the [Toggle Button Events article]({%slug togglebutton-events%}).
+The Toggle Button exposes events for clicks and selected state changes. Find more in the [Toggle Button Events article](slug://togglebutton-events).
 
 ## Icons
 
-The Toggle Button provides a built-in way to render [Telerik font icons, custom font icons, images or sprites]({%slug togglebutton-icons%}).
+The Toggle Button provides a built-in way to render [Telerik font icons, custom font icons, images or sprites](slug://togglebutton-icons).
 
 ## Appearance
 
-The Toggle Button provides several parameters that control its [styling and appearance, including background color, rounded corners and fill]({%slug togglebutton-appearance%}). 
+The Toggle Button provides several parameters that control its [styling and appearance, including background color, rounded corners and fill](slug://togglebutton-appearance). 
 
 ## ToggleButton Parameters
 
@@ -65,7 +65,7 @@ The following table lists Toggle Button parameters, which are not discussed else
 | Parameter | Type and Default&nbsp;Value | Description |
 |---|---|---|
 | `AriaLabel` | `string` | Renders an `aria-label` HTML attribute to the button element. |
-| `Class` | `string` | Renders additional CSS class to the `<button class="k-button">` element. Use it to apply custom styles or [override the theme]({%slug themes-override%}). See [Custom Styling](#custom-styling) below. |
+| `Class` | `string` | Renders additional CSS class to the `<button class="k-button">` element. Use it to apply custom styles or [override the theme](slug://themes-override). See [Custom Styling](#custom-styling) below. |
 | `Enabled` | `bool` <br /> (`true`) | Determines if the button is enabled and accepts clicks. |
 | `Id` | `string` | Renders an `id` HTML attribute to the button element. |
 | `TabIndex` | `int` | Renders a `tabindex` attribute. |
@@ -99,8 +99,8 @@ It is possible to apply custom styles to the button through its `Class` paramete
 
 ## Next Steps
 
-* [Handle Toggle Button Events]({%slug togglebutton-events%})
-* [Enhance the Toggle Button with Icons]({%slug togglebutton-icons%})
+* [Handle Toggle Button Events](slug://togglebutton-events)
+* [Enhance the Toggle Button with Icons](slug://togglebutton-icons)
 
 ## See Also
 
diff --git a/components/toolbar/accessibility/wai-aria-support.md b/components/toolbar/accessibility/wai-aria-support.md
index d8b37689cd..6ff4a90bba 100644
--- a/components/toolbar/accessibility/wai-aria-support.md
+++ b/components/toolbar/accessibility/wai-aria-support.md
@@ -63,4 +63,4 @@ For details on how the Toolbar keyboard navigation works, refer to the [Blazor T
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/toolbar/built-in-tools.md b/components/toolbar/built-in-tools.md
index 533e7c3e01..c21070a140 100644
--- a/components/toolbar/built-in-tools.md
+++ b/components/toolbar/built-in-tools.md
@@ -10,7 +10,7 @@ position: 1
 
 # Built-in Tools
 
-The Telerik ToolBar for Blazor allows you to use built-in buttons and button groups or to add a [custom tool]({%slug toolbar-templated-item%}). The available built-in tools are:
+The Telerik ToolBar for Blazor allows you to use built-in buttons and button groups or to add a [custom tool](slug://toolbar-templated-item). The available built-in tools are:
 
 * [ToolBarButton](#toolbarbutton)
 * [ToolBarToggleButton](#toolbartogglebutton)
@@ -32,7 +32,7 @@ The nested `ToolBarButton` tag exposes parameters that allow you to customize th
 | ----------- | ----------- | ----------- |
 | `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the ToolbarButton. You could use that class to cascade styles. |
 | `Enabled` | `bool` <br /> `true` | Specifies if the button is clickable. |
-| `Icon` | `object` | Adds a font icon to the button. You can find more information on adding a font icon to a Telerik Component in [Telerik Font and Svg Icons article]({%slug common-features-icons%}#icon-namespaces). |
+| `Icon` | `object` | Adds a font icon to the button. You can find more information on adding a font icon to a Telerik Component in [Telerik Font and Svg Icons article](slug://common-features-icons#icon-namespaces). |
 | `Overflow` | `ToolBarItemOverflow` enum <br /> (`Auto`) | Specifies whether the item will be hidden when the ToolBar is resized. |
 | `OverflowText` | `string` | Defines the button text that will be shown only in the overflow popup. If not specified, it will get the default text of the item. |
 | `Title` | `string` | Maps to the `title` HTML attribute for the `<button>`. |
@@ -83,8 +83,8 @@ The nested `ToolBarToggleButton` tag exposes parameters that allow you to custom
 | ----------- | ----------- | ----------- |
 | `Class` | `string` | The CSS class that will be rendered on the main wrapping element of the ToolbarButton. You could use that class to cascade styles. |
 | `Enabled` | `bool` <br /> `true` | Specifies if the button is clickable. |
-| `Icon` | `object` | Adds a font icon to the button. You can find more information on adding a font icon to a Telerik Component in [Telerik Font and Svg Icons article]({%slug common-features-icons%}#icon-namespaces). |
-| `Selected` | `bool` | Specifies whether the button is in selected state. You can use it with one and two-way data binding with the `SelectedChanged` event. For more information on how to handle the `SelectedChanged` event see the [Events]({%slug toolbar-events%}) article. |
+| `Icon` | `object` | Adds a font icon to the button. You can find more information on adding a font icon to a Telerik Component in [Telerik Font and Svg Icons article](slug://common-features-icons#icon-namespaces). |
+| `Selected` | `bool` | Specifies whether the button is in selected state. You can use it with one and two-way data binding with the `SelectedChanged` event. For more information on how to handle the `SelectedChanged` event see the [Events](slug://toolbar-events) article. |
 | `SpriteClass` | `string` | Add a sprite class image to the button. Set this attribute to `k-icon MySpriteClass` where `MySpriteClass` defines the CSS rules for the sprite. |
 | `Overflow` | `ToolBarItemOverflow` enum <br /> (`Auto`) | Specifies whether the item will be hidden when the ToolBar is resized. |
 | `OverflowText` | `string` | Defines the button text that will be shown only in the overflow popup. If not specified, it will get the default text of the item. |
@@ -167,4 +167,4 @@ The nested `ToolBarButtonGroup` tag exposes parameters that allow you to customi
 ## See Also
 
   * [Live Demo: ToolBar Overview](https://demos.telerik.com/blazor-ui/toolbar/overview)
-  * [ToolBar Overview]({%slug toolbar-overview%})
+  * [ToolBar Overview](slug://toolbar-overview)
diff --git a/components/toolbar/events.md b/components/toolbar/events.md
index 2c25e535bd..688e31cf99 100644
--- a/components/toolbar/events.md
+++ b/components/toolbar/events.md
@@ -10,12 +10,12 @@ position: 25
 
 # Events
 
-The ToolBar exposes events for its [built-in buttons]({%slug toolbar-built-in-tools%}) which allow you to react when the user perform actions on them. Such actions would be a click event or changing the selected state for the toggle button. The available events are:
+The ToolBar exposes events for its [built-in buttons](slug://toolbar-built-in-tools) which allow you to react when the user perform actions on them. Such actions would be a click event or changing the selected state for the toggle button. The available events are:
 
 * [OnClick](#onclick)
 * [SelectedChanged](#selectedchanged)
 
-For [custom (templated) items]({%slug toolbar-templated-item%}), handle the corresponding events exposed by the components/elements you place inside them.
+For [custom (templated) items](slug://toolbar-templated-item), handle the corresponding events exposed by the components/elements you place inside them.
 
 ## OnClick
 
@@ -41,7 +41,7 @@ The `OnClick` event fires when the user clicks on a button in the ToolBar (also
 
 ## SelectedChanged
 
-The `SelectedChanged` event will fire when the user changes the state of the [`ToolBarToggleButton`]({%slug toolbar-built-in-tools%}#toolbartogglebutton). It is used for one-way data binding of the `Selected` parameter and will prevent you from using two-way data binding (`@bind-Selected`)
+The `SelectedChanged` event will fire when the user changes the state of the [`ToolBarToggleButton`](slug://toolbar-built-in-tools#toolbartogglebutton). It is used for one-way data binding of the `Selected` parameter and will prevent you from using two-way data binding (`@bind-Selected`)
 
 >caption The SelectedChanged event for the ToolBarToggleButton
 
@@ -69,4 +69,4 @@ The `SelectedChanged` event will fire when the user changes the state of the [`T
 ## See Also
 
   * [Live Demo: ToolBar Overview](https://demos.telerik.com/blazor-ui/toolbar/overview)
-  * [ToolBar Overview]({%slug toolbar-overview%})
+  * [ToolBar Overview](slug://toolbar-overview)
diff --git a/components/toolbar/overview.md b/components/toolbar/overview.md
index a7b2d7f265..50ad43a96c 100644
--- a/components/toolbar/overview.md
+++ b/components/toolbar/overview.md
@@ -15,7 +15,7 @@ The <a href = "https://www.telerik.com/blazor-ui/toolbar" target="_blank">Blazor
 ## Creating Blazor ToolBar
 
 1. Add the `<TelerikToolBar>` tag to a Razor file.
-2. Use child tags to add [tools]({%slug toolbar-built-in-tools%}) such as `<ToolBarButton>` or `<ToolBarToggleButton>`. Set button text as child content. Optionally, set [`Icon`]({%slug common-features-icons%}#icons-list).
+2. Use child tags to add [tools](slug://toolbar-built-in-tools) such as `<ToolBarButton>` or `<ToolBarToggleButton>`. Set button text as child content. Optionally, set [`Icon`](slug://common-features-icons#icons-list).
 3. Define `OnClick` handlers for the buttons.
 4. Set the `Selected` parameter of the toggle buttons. It supports two-way binding.
 5. (optional) Place related buttons in a `<ToolBarButtonGroup>` to display them together.
@@ -60,19 +60,19 @@ The <a href = "https://www.telerik.com/blazor-ui/toolbar" target="_blank">Blazor
 
 ## Built-in Tools
 
-The ToolBar component can include built-in tools such as buttons, toggle buttons and button groups. [Read more about the Blazor ToolBar built-in tools]({%slug toolbar-built-in-tools%}).
+The ToolBar component can include built-in tools such as buttons, toggle buttons and button groups. [Read more about the Blazor ToolBar built-in tools](slug://toolbar-built-in-tools).
 
 ## Separators
 
-The Toolbar features separators and spacers that can visually divide the component items. [Read more about the Blazor ToolBar separators and spacers.]({%slug toolbar-separators%}).
+The Toolbar features separators and spacers that can visually divide the component items. [Read more about the Blazor ToolBar separators and spacers.](slug://toolbar-separators).
 
 ## Custom Items
 
-The ToolBar component supports template items. Use them to create complex toolbars with dropdowns, inputs and other custom content. [Read more about Blazor ToolBar item customization]({%slug toolbar-templated-item%}).
+The ToolBar component supports template items. Use them to create complex toolbars with dropdowns, inputs and other custom content. [Read more about Blazor ToolBar item customization](slug://toolbar-templated-item).
 
 ## Events
 
-The Blazor ToolBar fires click and selection events. Handle those events to respond to user actions. [Read more about the Blazor ToolBar events]({%slug toolbar-events%}).
+The Blazor ToolBar fires click and selection events. Handle those events to respond to user actions. [Read more about the Blazor ToolBar events](slug://toolbar-events).
 
 ## ToolBar Parameters
 
@@ -82,8 +82,8 @@ The Blazor ToolBar provides parameters to configure the component:
 
 | Parameter | Type | Description |
 | ----------- | ----------- | ----------- |
-| `Adaptive ` | `bool` <br /> (`true`) | Toggles the overflow popup of the ToolBar. The component displays an additional anchor on its side, where it places all items which do not fit and overflow. [Template items]({%slug toolbar-templated-item%}#notes) don't participate in this mechanism and they are always rendered in the ToolBar itself. |
-| `Class` | `string` | The CSS class to be rendered on the main wrapping element of the ToolBar component, which is `<div class="k-toolbar">`. Use for [styling customizations]({%slug themes-override%}). |
+| `Adaptive ` | `bool` <br /> (`true`) | Toggles the overflow popup of the ToolBar. The component displays an additional anchor on its side, where it places all items which do not fit and overflow. [Template items](slug://toolbar-templated-item#notes) don't participate in this mechanism and they are always rendered in the ToolBar itself. |
+| `Class` | `string` | The CSS class to be rendered on the main wrapping element of the ToolBar component, which is `<div class="k-toolbar">`. Use for [styling customizations](slug://themes-override). |
 
 ### Styling and Appearance
 
@@ -93,7 +93,7 @@ The following parameters enable you to customize the appearance of the Blazor To
 | --- | --- | --- |
 | `Size` | `Telerik.Blazor.ThemeConstants.ToolBar.Size` | Adjust the size of the ToolBar |
 
-You can find more information for customizing the ToolBar appearance in the [Appearance article]({%slug toolbar-appearance%}).
+You can find more information for customizing the ToolBar appearance in the [Appearance article](slug://toolbar-appearance).
 
 ## Example
 
@@ -147,10 +147,10 @@ The Blazor Toolbar has an option for adaptiveness. This option allows you to hid
 
 ## Next Steps
 
-* [Explore the ToolBar built-in tools]({%slug toolbar-built-in-tools%})
-* [Handle the ToolBar Events]({%slug toolbar-events%})
-* [Use the ToolBar Separators]({%slug toolbar-separators%})
-* [Implement custom ToolBar tools]({%slug toolbar-built-in-tools%})
+* [Explore the ToolBar built-in tools](slug://toolbar-built-in-tools)
+* [Handle the ToolBar Events](slug://toolbar-events)
+* [Use the ToolBar Separators](slug://toolbar-separators)
+* [Implement custom ToolBar tools](slug://toolbar-built-in-tools)
 
 ## See Also
 
diff --git a/components/toolbar/separators.md b/components/toolbar/separators.md
index 71212744ba..ccd08f2e0e 100644
--- a/components/toolbar/separators.md
+++ b/components/toolbar/separators.md
@@ -16,7 +16,7 @@ You can visually separate the items in the Telerik ToolBar for Blazor. Depending
 
 * `ToolBarSpacer` - defines empty space in the toolbar which separates the items. The space between the items is automatically calculated to fit the width of the ToolBar. For example, one spacer in the middle of the items will push the second part of items to the right-hand side of the toolbar.
 
-* `ToolBarButtonGroup` - you can combine built-in buttons into groups and those groups also add some spacing and separation around themselves. You can read more about them in the [Built-in Tools - ToolBarButtonGroup]({%slug toolbar-built-in-tools%}#toolbarbuttongroup) section.
+* `ToolBarButtonGroup` - you can combine built-in buttons into groups and those groups also add some spacing and separation around themselves. You can read more about them in the [Built-in Tools - ToolBarButtonGroup](slug://toolbar-built-in-tools#toolbarbuttongroup) section.
 
 
 >caption Use ToolBarButtonGroup, ToolBarSeparator and ToolBarSpace to separate items in the ToolBar
@@ -46,4 +46,4 @@ You can visually separate the items in the Telerik ToolBar for Blazor. Depending
 ## See Also
 
   * [Live Demo: ToolBar Overview](https://demos.telerik.com/blazor-ui/toolbar/overview)
-  * [ToolBar Overview]({%slug toolbar-overview%})
+  * [ToolBar Overview](slug://toolbar-overview)
diff --git a/components/toolbar/templated-item.md b/components/toolbar/templated-item.md
index 97a6a958ac..6a54bb1093 100644
--- a/components/toolbar/templated-item.md
+++ b/components/toolbar/templated-item.md
@@ -62,7 +62,7 @@ You can use that item to add complex toolbars to your application, which have dr
 ## Notes
 
 * Template items cannot be part of a `ToolBarButtonGroup`.
-* Template items do not participate in the [ToolBar's adaptive behavior]({%slug toolbar-overview%}#toolbar-parameters) and don't expose `Overflow` and `OverFlowText` parameters. This is because template items do not have a predefined click action to be triggered from an item in the overflow popup.
+* Template items do not participate in the [ToolBar's adaptive behavior](slug://toolbar-overview#toolbar-parameters) and don't expose `Overflow` and `OverFlowText` parameters. This is because template items do not have a predefined click action to be triggered from an item in the overflow popup.
 
 ## See Also
 
diff --git a/components/tooltip/accessibility/wai-aria-support.md b/components/tooltip/accessibility/wai-aria-support.md
index a69880b463..c334dedf80 100644
--- a/components/tooltip/accessibility/wai-aria-support.md
+++ b/components/tooltip/accessibility/wai-aria-support.md
@@ -62,9 +62,9 @@ The Tooltip has been tested with the following screen readers and browsers combi
 
 ## Keyboard Navigation
 
-For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
 ## See Also
 
 * [Blazor Tooltip Demos](https://demos.telerik.com/blazor-ui/tooltip/overview)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/tooltip/overview.md b/components/tooltip/overview.md
index aa395412d7..0381fca518 100644
--- a/components/tooltip/overview.md
+++ b/components/tooltip/overview.md
@@ -18,7 +18,7 @@ The Blazor Tooltip will automatically display the value of `title` and `alt` att
 
 1. Use the `TelerikTooltip` tag.
 1. Set the Tooltip's `TargetSelector` parameter to a `string` that is a [CSS selector](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors) or [CSS combinator](https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators). It should point to the HTML element(s) that will trigger a tooltip.
-1. (optional) Set the Tooltip's [`Width`, `Height`](#tooltip-parameters) or [`Position`]({%slug tooltip-position%}) parameters. They will depend mostly on the Tooltip content and the targets' position on the page.
+1. (optional) Set the Tooltip's [`Width`, `Height`](#tooltip-parameters) or [`Position`](slug://tooltip-position) parameters. They will depend mostly on the Tooltip content and the targets' position on the page.
 
 >caption Basic Tooltip attached to multiple targets
 
@@ -42,15 +42,15 @@ The Blazor Tooltip will automatically display the value of `title` and `alt` att
 
 ## Position
 
-The Blazor Tooltip normally appears above its target, but can show on all four sides. If there is not enough space, the component will shift or flip its position automatically. Learn how to [control the Tooltip position]({%slug tooltip-position%}).
+The Blazor Tooltip normally appears above its target, but can show on all four sides. If there is not enough space, the component will shift or flip its position automatically. Learn how to [control the Tooltip position](slug://tooltip-position).
 
 ## Show Behavior
 
-By default, the Tooltip displays on mouse over, but it is possible to [configure it to show on click or tap]({%slug tooltip-show-event%}).
+By default, the Tooltip displays on mouse over, but it is possible to [configure it to show on click or tap](slug://tooltip-show-event).
 
 ## Template
 
-The Blazor Tooltip accepts a nested `<Template>` tag, which is a standard Blazor `RenderFragment`. It lets you generate content for the Tooltip based on meta data from the target. You can also fetch data on demand for the Tooltip content through that. See [examples in the Tooltip Template article]({%slug tooltip-template%}).
+The Blazor Tooltip accepts a nested `<Template>` tag, which is a standard Blazor `RenderFragment`. It lets you generate content for the Tooltip based on meta data from the target. You can also fetch data on demand for the Tooltip content through that. See [examples in the Tooltip Template article](slug://tooltip-template).
 
 ## Tooltip Parameters
 
@@ -60,28 +60,28 @@ The Blazor Tooltip provides the following configuration parameters. Also check t
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | Renders a custom CSS class to the `<div class="k-animation-container">` element, which is an ancestor (but not parent) of the `<div class="k-tooltip>` element. The former element is responsible for the Tooltip's `position` and `z-index` styles. The latter element applies the theme styling (borders, background, etc.). Use a CSS class to [override theme styles]({%slug themes-override%}). Here is a [custom Tooltip styling example]({%slug tooltip-kb-custom-styles%}). |
-| `Height` | `string` | Applies a height style in [any supported unit]({%slug common-features/dimensions%}). @[template](/_contentTemplates/tooltip/notes.md#dimensions-behavior) |
+| `Class` | `string` | Renders a custom CSS class to the `<div class="k-animation-container">` element, which is an ancestor (but not parent) of the `<div class="k-tooltip>` element. The former element is responsible for the Tooltip's `position` and `z-index` styles. The latter element applies the theme styling (borders, background, etc.). Use a CSS class to [override theme styles](slug://themes-override). Here is a [custom Tooltip styling example](slug://tooltip-kb-custom-styles). |
+| `Height` | `string` | Applies a height style in [any supported unit](slug://common-features/dimensions). @[template](/_contentTemplates/tooltip/notes.md#dimensions-behavior) |
 | `HideDelay` | `int` <br/> (0) | The Tooltip hiding delay in milliseconds. |
 | `Id` | `string` | Renders an `id` attribute to the `<div class="k-tooltip>` element. To improve accessibility and screen reader behavior, set the same string as Tooltip `Id` and `aria-described-by` attribute of all Tooltip targets. |
-| `Position` | `TooltipPosition` enum <br /> (`Top`) | Sets the [Tooltip popup direction]({%slug tooltip-position%}), with regard to its target. |
+| `Position` | `TooltipPosition` enum <br /> (`Top`) | Sets the [Tooltip popup direction](slug://tooltip-position), with regard to its target. |
 | `ShowDelay` | `int` <br/> (0) | The Tooltip opening delay in milliseconds. |
-| `ShowOn` | `TooltipShowEvent` enum <br /> (`Hover`) | Sets the [browser event, which will trigger the Tooltip to display]({%slug tooltip-show-event%}). |
+| `ShowOn` | `TooltipShowEvent` enum <br /> (`Hover`) | Sets the [browser event, which will trigger the Tooltip to display](slug://tooltip-show-event). |
 | `TargetSelector` | `string` | The CSS [selector](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors) or [combinator](https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators), which points to one or multiple Tooltip targets. |
-| `Width` | `string` | Applies a width style in [any supported unit]({%slug common-features/dimensions%}). @[template](/_contentTemplates/tooltip/notes.md#dimensions-behavior) |
+| `Width` | `string` | Applies a width style in [any supported unit](slug://common-features/dimensions). @[template](/_contentTemplates/tooltip/notes.md#dimensions-behavior) |
 
 >tip To have the tooltip stretch according to its content, leave **both** the `Width` and `Height` parameters empty. If one of them has a value, the HTML element will have some layout and you may get unexpected results in terms of size and position.
 >
-> If you will be [loading large content on demand]({%slug tooltip-template%}#separate-component-and-load-on-demand), you should set dimensions that will accommodate the expected content and layout.
+> If you will be [loading large content on demand](slug://tooltip-template#separate-component-and-load-on-demand), you should set dimensions that will accommodate the expected content and layout.
 
 ## Next Steps
 
-* [Experiment with Tooltip Position]({%slug tooltip-position%})
-* [Choose a Tooltip Show Event]({%slug tooltip-show-event%})
-* [Explore ToolTip Templates]({%slug tooltip-template%})
+* [Experiment with Tooltip Position](slug://tooltip-position)
+* [Choose a Tooltip Show Event](slug://tooltip-show-event)
+* [Explore ToolTip Templates](slug://tooltip-template)
 
 ## See Also
 
 * [Live Demo: Tooltip](https://demos.telerik.com/blazor-ui/tooltip/overview)
-* [Comparison between All Popup Components]({%slug common-kb-popup-component-comparison%})
-* [Custom ToolTip Styles and Colors]({%slug tooltip-kb-custom-styles%})
+* [Comparison between All Popup Components](slug://common-kb-popup-component-comparison)
+* [Custom ToolTip Styles and Colors](slug://tooltip-kb-custom-styles)
diff --git a/components/tooltip/position.md b/components/tooltip/position.md
index 94c805e104..dc9849ae3c 100644
--- a/components/tooltip/position.md
+++ b/components/tooltip/position.md
@@ -54,10 +54,10 @@ You can control it through the `Position` parameter, which takes a member of the
 
 ## Next Steps
 
-* [Choose a Tooltip Show Event]({%slug tooltip-show-event%})
-* [Explore ToolTip Templates]({%slug tooltip-template%})
+* [Choose a Tooltip Show Event](slug://tooltip-show-event)
+* [Explore ToolTip Templates](slug://tooltip-template)
 
 ## See Also
 
-* [Blazor Tooltip Overview]({%slug tooltip-overview%})
+* [Blazor Tooltip Overview](slug://tooltip-overview)
 * [Live Demo: Tooltip Position](https://demos.telerik.com/blazor-ui/tooltip/position)
diff --git a/components/tooltip/show-event.md b/components/tooltip/show-event.md
index e190d4d512..b9c6296db7 100644
--- a/components/tooltip/show-event.md
+++ b/components/tooltip/show-event.md
@@ -66,9 +66,9 @@ By default, the tooltip shows on hover (mouseover) of its target, just like the
 
 ## Next Steps
 
-* [Explore ToolTip Templates]({%slug tooltip-template%})
+* [Explore ToolTip Templates](slug://tooltip-template)
 
 ## See Also
 
-* [Blazor Tooltip Overview]({%slug tooltip-overview%})
+* [Blazor Tooltip Overview](slug://tooltip-overview)
 * [Live Demo: Tooltip Show Event](https://demos.telerik.com/blazor-ui/tooltip/show-event)
diff --git a/components/tooltip/template.md b/components/tooltip/template.md
index 163bb37598..9d2573420f 100644
--- a/components/tooltip/template.md
+++ b/components/tooltip/template.md
@@ -173,5 +173,5 @@ else
 
 ## See Also
 
-* [Blazor Tooltip Overview]({%slug tooltip-overview%})
+* [Blazor Tooltip Overview](slug://tooltip-overview)
 * [Live Demo: Tooltip Template](https://demos.telerik.com/blazor-ui/tooltip/template)
diff --git a/components/treelist/accessibility/overview.md b/components/treelist/accessibility/overview.md
index 47d530102b..eb37d15838 100644
--- a/components/treelist/accessibility/overview.md
+++ b/components/treelist/accessibility/overview.md
@@ -15,9 +15,9 @@ The UI for Blazor TreeList component is [WCAG 2.2 AA](https://www.w3.org/TR/WCAG
 
 WCAG 2.2 introduces the ["Dragging Movements"](https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements) criterion as an important part of the Operable principle. Its primary goal is to guarantee that any feature reliant on drag actions offers an alternative method that can be executed with a single click, enhancing user accessibility.
 
-In our illustrative example below, we've showcased the column reorder actions, achievable through our Column Menu functionality. We've demonstrated also the row reordering achievable through our [Context Menu]({%slug contextmenu-integration%}#context-menu-for-a-grid-row). Our goal is to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
+In our illustrative example below, we've showcased the column reorder actions, achievable through our Column Menu functionality. We've demonstrated also the row reordering achievable through our [Context Menu](slug://contextmenu-integration#context-menu-for-a-grid-row). Our goal is to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
 
-The following example demonstrates the [accessibility compliance of the TreeList component]({%slug grid-wai-aria-support%}). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch]({%slug accessibility-overview%}#color-contrast).
+The following example demonstrates the [accessibility compliance of the TreeList component](slug://grid-wai-aria-support). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch](slug://accessibility-overview#color-contrast).
 
 >caption TreeList accessibility compliance example
 
diff --git a/components/treelist/accessibility/wai-aria-support.md b/components/treelist/accessibility/wai-aria-support.md
index 6d0f560865..fc49e44e34 100644
--- a/components/treelist/accessibility/wai-aria-support.md
+++ b/components/treelist/accessibility/wai-aria-support.md
@@ -94,5 +94,5 @@ For details on how the TreeList keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Blazor TreeList Accessibility Example]({%slug treelist-accessibility-overview%}#blazor-treelist-accessibility-example)
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Blazor TreeList Accessibility Example](slug://treelist-accessibility-overview#blazor-treelist-accessibility-example)
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/treelist/aggregates.md b/components/treelist/aggregates.md
index 7419bed619..281e5223fe 100644
--- a/components/treelist/aggregates.md
+++ b/components/treelist/aggregates.md
@@ -10,7 +10,7 @@ position: 23
 
 # Grid Aggregates
 
-The Grid component provides built-in aggregates for column values based on [grouping]({%slug components/grid/features/grouping%}).
+The Grid component provides built-in aggregates for column values based on [grouping](slug://components/grid/features/grouping).
 
 There are several available aggregate functions under the `Telerik.Blazor.GridAggregateType` enum:
 
diff --git a/components/treelist/columns/auto-generated.md b/components/treelist/columns/auto-generated.md
index 63b44f11d3..6bbca9293c 100644
--- a/components/treelist/columns/auto-generated.md
+++ b/components/treelist/columns/auto-generated.md
@@ -297,7 +297,7 @@ You can use data annotation attributes to control the column generation, in addi
  * The properties that do not have a `setter` or the `setter` is not accessible (`private`) will not be editable either.
 
 * You can set custom width to all auto-generated columns through the `ColumnWidth` parameter of `TreeListAutoGeneratedColumns`. By default they will be equally distributed to fill the width of the treelist.
-    * To enable horizontal scrolling, the `ColumnWidth` parameter has to be set so that the sum of all columns is greater than the treelist width. You can find more information in the [Column Width]({%slug treelist-columns-width%}) article.
+    * To enable horizontal scrolling, the `ColumnWidth` parameter has to be set so that the sum of all columns is greater than the treelist width. You can find more information in the [Column Width](slug://treelist-columns-width) article.
 
 >tip To use the attributes listed above the `System.ComponentModel.DataAnnotations` using statement has to be present in the file with your model. With [Popup editing](https://demos.telerik.com/blazor-ui/treelist/editing-popup), you can use validation attributes in addition to the customization attributes.
 
@@ -463,7 +463,7 @@ This example shows how to:
 * @[template](/_contentTemplates/common/grid-treelist-autogenerated-columns.md#grid-treelist-autogenerated-columns-limitation)
 
 ## See also
-* [Column Width]({%slug treelist-columns-width%})
+* [Column Width](slug://treelist-columns-width)
 * [Live Demo: Auto Generated Columns](https://demos.telerik.com/blazor-ui/treelist/column-auto-generation)
-* [Selection]({%slug treelist-selection-overview%})
-* [Paging]({%slug treelist-paging%})
+* [Selection](slug://treelist-selection-overview)
+* [Paging](slug://treelist-paging)
diff --git a/components/treelist/columns/bound.md b/components/treelist/columns/bound.md
index 14436caa0f..9625dca515 100644
--- a/components/treelist/columns/bound.md
+++ b/components/treelist/columns/bound.md
@@ -25,7 +25,7 @@ To show data in a treelist, you must define `TreeListColumn` instances in the `T
 
 Since the treelist is designed for hierarchical data, you should also define which column will hold the expand/collapse arrow for the child items. It can be any column, not necessarily the first, and you denote it by setting its `Expandable` parameter to `true`.
 
-You can read more details on how to tie the treelist to your data fields and child elements in the [Data Binding Overview]({%slug treelist-data-binding-overview%}) article. It provides information on the features of the model, and describing the parent-child relationships in two different ways.
+You can read more details on how to tie the treelist to your data fields and child elements in the [Data Binding Overview](slug://treelist-data-binding-overview) article. It provides information on the features of the model, and describing the parent-child relationships in two different ways.
 
 >caption Provide data to the treelist and choose which columns (fields) to see
 
@@ -111,7 +111,7 @@ You can read more details on how to tie the treelist to your data fields and chi
 
 >tip The `Data` collection can be an `ObservableCollection`, an array, a `List` - it must only implement `IEnumerable`.
 
->tip The TreeList can [generate the columns from the model for you]({%slug treelist-columns-automatically-generated%}).
+>tip The TreeList can [generate the columns from the model for you](slug://treelist-columns-automatically-generated).
 
 
 ## TreeList Bound Column Parameters
@@ -126,34 +126,34 @@ You can use the following properties on bound columns:
 ### Appearance
 
 * `Title` - the text that is rendered in the column header. See the Notes below for its behavior.
-* `DisplayFormat` - the C# format string that is used to render the field value in the cell when the Treelist is in display mode. Read more in the [Column Display Format]({%slug gantt-columns-displayformat%}) article.
-* `TextAlign` - specifies the horizontal alignment of the **data** cells. For example, you can use this property to right-align numeric columns. The property accepts `ColumnTextAlign` enum values (`Left`, `Right` or `Center`). If not set, the text alignment will depend on existing styles on the page, default browser behavior and the text direction. Header cell alignment requires a different approach with `HeaderClass` and [custom CSS]({%slug themes-override%}) - see [Center Grid column header text]({%slug grid-kb-center-column-header-content%}).
-* `Width` -  (defaults to `null`) - the width of the column. See the [Dimensions]({%slug common-features/dimensions%}) article for information about the supported formats. See [TreeList Column Width Behavior]({%slug treelist-columns-width%}) for detailed information about the TreeList behavior with different column width configurations.
-* `HeaderClass` - `string` - adds a custom CSS class to the header cell of the column. Use it to apply custom styles or [override the default TreeList styles]({%slug themes-override%}).
-* `MinResizableWidth` - (defaults to `30` and ignores smaller values) - the minimum allowed column width during [user resizing]({%slug treelist-columns-resize%}). Unlike the string `Width` property, this one is decimal and expects pixel values.
-* `MaxResizableWidth` - (defaults to `0`) - the maximum allowed column width during [user resizing]({%slug treelist-columns-resize%}). Unlike the string `Width` property, this one is decimal and expects pixel values.
-* `Locked` - (defaults to `false`) - defines whether the column is [locked (frozen, pinned)]({%slug treelist-columns-frozen%}).
-* `Reorderable` - (defaults to `true`) - whether the user can [drag to reorder]({%slug treelist-columns-reorder%}) this column.
-* `Resizable` - (defaults to `true`) - whether the user can [resize]({%slug treelist-columns-resize%}) this column.
-* `Visible` - (defaults to `null`) - if this parameter is set to `false` it [hides]({%slug treelist-columns-visible%}) the column from the TreeList. Accepts both `bool` and `bool?` types, and `null` is treated like `true`.
-* `Columns` - a nested tag where you can declare [multiple column headers]({%slug treelist-columns-multiple-column-headers%}).
-* `ShowColumnMenu` - (defaults to `true`) - if set to `false`, disables the [column menu]({%slug treelist-column-menu%}) for that particular column.
-* `VisibleInColumnChooser` - (defaults to `true`) - if set to `false`, removes the column from the Column chooser of the [column menu]({%slug treelist-column-menu%}).
+* `DisplayFormat` - the C# format string that is used to render the field value in the cell when the Treelist is in display mode. Read more in the [Column Display Format](slug://gantt-columns-displayformat) article.
+* `TextAlign` - specifies the horizontal alignment of the **data** cells. For example, you can use this property to right-align numeric columns. The property accepts `ColumnTextAlign` enum values (`Left`, `Right` or `Center`). If not set, the text alignment will depend on existing styles on the page, default browser behavior and the text direction. Header cell alignment requires a different approach with `HeaderClass` and [custom CSS](slug://themes-override) - see [Center Grid column header text](slug://grid-kb-center-column-header-content).
+* `Width` -  (defaults to `null`) - the width of the column. See the [Dimensions](slug://common-features/dimensions) article for information about the supported formats. See [TreeList Column Width Behavior](slug://treelist-columns-width) for detailed information about the TreeList behavior with different column width configurations.
+* `HeaderClass` - `string` - adds a custom CSS class to the header cell of the column. Use it to apply custom styles or [override the default TreeList styles](slug://themes-override).
+* `MinResizableWidth` - (defaults to `30` and ignores smaller values) - the minimum allowed column width during [user resizing](slug://treelist-columns-resize). Unlike the string `Width` property, this one is decimal and expects pixel values.
+* `MaxResizableWidth` - (defaults to `0`) - the maximum allowed column width during [user resizing](slug://treelist-columns-resize). Unlike the string `Width` property, this one is decimal and expects pixel values.
+* `Locked` - (defaults to `false`) - defines whether the column is [locked (frozen, pinned)](slug://treelist-columns-frozen).
+* `Reorderable` - (defaults to `true`) - whether the user can [drag to reorder](slug://treelist-columns-reorder) this column.
+* `Resizable` - (defaults to `true`) - whether the user can [resize](slug://treelist-columns-resize) this column.
+* `Visible` - (defaults to `null`) - if this parameter is set to `false` it [hides](slug://treelist-columns-visible) the column from the TreeList. Accepts both `bool` and `bool?` types, and `null` is treated like `true`.
+* `Columns` - a nested tag where you can declare [multiple column headers](slug://treelist-columns-multiple-column-headers).
+* `ShowColumnMenu` - (defaults to `true`) - if set to `false`, disables the [column menu](slug://treelist-column-menu) for that particular column.
+* `VisibleInColumnChooser` - (defaults to `true`) - if set to `false`, removes the column from the Column chooser of the [column menu](slug://treelist-column-menu).
 
 ### Data Operations
 
-* `Editable` - (defaults to `true`) - you can set this property to `true` or `false` to allow or prevent [editing]({%slug treelist-overview%}#editing) of this field. Defaults to `true`. To edit data, you also need a [CommandColumn]({%slug treelist-columns-command%}).
-* `EditorType` - set the [editor component for `string` or `DateTime` columns]({%slug treelist-editing-overview%}#customize-the-editor-fields) when an [`EditorTemplate`]({%slug treelist-templates-editor%}) is not used.
-* `Filterable` - (defaults to `true`) - you can set this to `false` so a [filterable]({%slug treelist-filtering%}) treelist will not let the user filter that particular column.
+* `Editable` - (defaults to `true`) - you can set this property to `true` or `false` to allow or prevent [editing](slug://treelist-overview#editing) of this field. Defaults to `true`. To edit data, you also need a [CommandColumn](slug://treelist-columns-command).
+* `EditorType` - set the [editor component for `string` or `DateTime` columns](slug://treelist-editing-overview#customize-the-editor-fields) when an [`EditorTemplate`](slug://treelist-templates-editor) is not used.
+* `Filterable` - (defaults to `true`) - you can set this to `false` so a [filterable](slug://treelist-filtering) treelist will not let the user filter that particular column.
 * `FilterEditorType` - (defaults to `TreeListFilterEditorType.DatePicker`) - determines if the default filtering component of a `DateTime` column will be a DatePicker or a DateTimePicker.
 * `FilterEditorFormat` - sets the `Format` of the filtering component as a `string`. Works for DateTime and numeric columns. Do not use a placeholder (e.g. set `"D"`, not `"{0:D}"`).
-* `Sortable` - (defaults to `true`) - set it to `false` so the user cannot [sort]({%slug treelist-sorting%}) this column.
+* `Sortable` - (defaults to `true`) - set it to `false` so the user cannot [sort](slug://treelist-sorting) this column.
 
 ### Templates
 
-* `Template` - this property can also be used as an inner tag and it defines the [custom cell content]({%slug treelist-templates-column%}) that renders instead of the default field value the treelist puts in it.
-* `HeaderTemplate` - this property can also be used as an inner tag and defines the custom contents of the [header cell]({%slug treelist-templates-column-header%}) that you can render instead of the Title.
-* `EditorTemplate` - this property can also be used as an inner tag and defines a [custom input and logic that is used for editing the field]({%slug treelist-templates-editor%}).
+* `Template` - this property can also be used as an inner tag and it defines the [custom cell content](slug://treelist-templates-column) that renders instead of the default field value the treelist puts in it.
+* `HeaderTemplate` - this property can also be used as an inner tag and defines the custom contents of the [header cell](slug://treelist-templates-column-header) that you can render instead of the Title.
+* `EditorTemplate` - this property can also be used as an inner tag and defines a [custom input and logic that is used for editing the field](slug://treelist-templates-editor).
 
 >tip You can find more examples in the rest of the treelist documentation and in our [live demos](https://demos.telerik.com/blazor-ui/treelist/overview).
 
@@ -163,7 +163,7 @@ You can use the following properties on bound columns:
 * For advanced operations such as filtering and sorting, you *must* set a `Field` to the column, and the field it points to must be a string or a value type (such as a number, string, DateTime, boolean).
     * If a `Field` is not set the column will not allow filtering, sorting and editing for the column.
     * If the `Field` points to a custom object or something like an `IDictionary`, errors will be thrown upon those actions because there are no known data operations for reference types in .NET, except for strings.
-    * To bind to nested (complex) models (also called navigation properties), use only the name of the field that holds the child class and its own field. For an example, see the [Bind to navigation properties in complex objects]({%slug grid-use-navigation-properties%}) article.
+    * To bind to nested (complex) models (also called navigation properties), use only the name of the field that holds the child class and its own field. For an example, see the [Bind to navigation properties in complex objects](slug://grid-use-navigation-properties) article.
 
 * The treelist skips fields marked with the [`IgnoreDataMemberAttribute`](https://docs.microsoft.com/en-us/dotnet/api/system.runtime.serialization.ignoredatamemberattribute) when performing CUD operations. Its presence indicates that this property does not need to be part of the serialized data anyway, and skipping such fields allows [Lazy Loading Proxies in EF](https://docs.microsoft.com/en-us/dotnet/api/microsoft.entityframeworkcore.proxiesextensions.uselazyloadingproxies?view=efcore-3.1) to work.
 
@@ -176,10 +176,10 @@ You can use the following properties on bound columns:
 
 * The treelist uses `Activator.CreateInstance<TItem>();` to generate a new item when an Insert action is invoked, so the Model should have a Parameterless constructor defined. 
 
-<!-- A workaround might be [invoking Insert through the treelist state]({            %slug treelist-state%}#initiate-editing-or-inserting-of-an-item) and creating the object with your own code. -->
+<!-- A workaround might be [invoking Insert through the treelist state](slug://treelist-state#initiate-editing-or-inserting-of-an-item) and creating the object with your own code. -->
 
 
->tip You can improve performance by loading child nodes only when the user expands them. Read more in the [Load on Demand]({%slug treelist-data-binding-load-on-demand%}) article.
+>tip You can improve performance by loading child nodes only when the user expands them. Read more in the [Load on Demand](slug://treelist-data-binding-load-on-demand) article.
 
 ## See Also
 
diff --git a/components/treelist/columns/checkbox.md b/components/treelist/columns/checkbox.md
index 35e7b6ed8c..f609fcf465 100644
--- a/components/treelist/columns/checkbox.md
+++ b/components/treelist/columns/checkbox.md
@@ -12,19 +12,19 @@ position: 2
 
 This article describes the configuration parameters of the Blazor `TreeListCheckboxColumn`.
 
-The `TreeListCheckboxColumn` provides an additional way for users to [select TreeList rows]({%slug treelist-selection-overview%}). By default, users can select and deselect rows by clicking anywhere on them.
+The `TreeListCheckboxColumn` provides an additional way for users to [select TreeList rows](slug://treelist-selection-overview). By default, users can select and deselect rows by clicking anywhere on them.
 
 ## Parameters
 
-The TreeList checkbox column has the following exclusive parameters. For other available parameters, see the [appearance settings of bound columns]({%slug treelist-columns-bound%}#appearance).
+The TreeList checkbox column has the following exclusive parameters. For other available parameters, see the [appearance settings of bound columns](slug://treelist-columns-bound#appearance).
 
 @[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
 | `CheckBoxOnlySelection` | `bool` | Determines if row selection occurs only on checkbox clicks. By default, user can select rows by clicking anywhere, except on command buttons. |
-| `SelectAll` | `bool` <br /> (`true`) | Determines if the column header renders a checkbox to select all rows. Set this to `false` if the [TreeList `SelectionMode` is `Single`]({%slug treelist-selection-overview%}#use-single-or-multiple-selection). The `SelectAll` parameter has no effect when the checkbox column has a [`HeaderTemplate`](#header-template). |
-| `SelectAllMode` | `TreeListSelectAllMode` enum <br /> (`Current`) | Determines if the header cell checkbox selects all rows on the current page, or all rows in the TreeList. `Current` selects the visible rows on the current page. It does not select the children of collapsed items - they are not part of the [current page]({%slug treelist-paging%}) data. `All` selects all the data items, including ones that may be currently filtered out. |
+| `SelectAll` | `bool` <br /> (`true`) | Determines if the column header renders a checkbox to select all rows. Set this to `false` if the [TreeList `SelectionMode` is `Single`](slug://treelist-selection-overview#use-single-or-multiple-selection). The `SelectAll` parameter has no effect when the checkbox column has a [`HeaderTemplate`](#header-template). |
+| `SelectAllMode` | `TreeListSelectAllMode` enum <br /> (`Current`) | Determines if the header cell checkbox selects all rows on the current page, or all rows in the TreeList. `Current` selects the visible rows on the current page. It does not select the children of collapsed items - they are not part of the [current page](slug://treelist-paging) data. `All` selects all the data items, including ones that may be currently filtered out. |
 | `SelectChildren` | `bool` | Determines if a parent row checkbox affects the selected state of respective child rows. |
 
 >note  If the TreeList is bound to `IQueriable`, a header checkbox with an `All` option will execute the query over all the data. This may be a performance hit.
@@ -33,7 +33,7 @@ The TreeList checkbox column has the following exclusive parameters. For other a
 
 The `HeaderTemplate` of the TreeList checkbox column enables developers to customize the header cell's rendering and checkbox behavior.
 
-On a side note, it is possible to [center the checkboxes in the `TreeListCheckboxColumn`]({%slug grid-kb-center-checkbox-column%}) without using a template.
+On a side note, it is possible to [center the checkboxes in the `TreeListCheckboxColumn`](slug://grid-kb-center-checkbox-column) without using a template.
 
 >caption TreeList Checkbox Column Header Template
 
@@ -176,4 +176,4 @@ On a side note, it is possible to [center the checkboxes in the `TreeListCheckbo
 ## See Also
 
 * [Live Demo: TreeList Selection](https://demos.telerik.com/blazor-ui/treelist/row-selection)
-* [TreeList Selection Overview]({%slug treelist-selection-overview%})
+* [TreeList Selection Overview](slug://treelist-selection-overview)
diff --git a/components/treelist/columns/command.md b/components/treelist/columns/command.md
index 8da5ce6d80..d3f31a5630 100644
--- a/components/treelist/columns/command.md
+++ b/components/treelist/columns/command.md
@@ -10,7 +10,7 @@ position: 1
 
 # TreeList Command Column
 
-The command column of a treelist allows you to initiate [inline]({%slug treelist-editing-inline%}) or [popup]({%slug treelist-editing-popup%}) editing, or to execute your own commands.
+The command column of a treelist allows you to initiate [inline](slug://treelist-editing-inline) or [popup](slug://treelist-editing-popup) editing, or to execute your own commands.
 
 To define it, add a `TreeListCommandColumn` in the `TreeListColumns` collection of a treelist. The command column takes a collection of `TreeListCommandButton` instances that invoke the commands. It also provides the data item `context` and a `Title` property to set its header text.
 
@@ -35,10 +35,10 @@ This section describes the available features and their use.
 The `TreeListCommandButton` tag offers the following features:
 
 * `Command` - the command that will be invoked. Can be one of the built-in commands (see below), or a custom command name.
-* `OnClick` - the event handler that the button will fire. If used on a built-in command, this handler will fire before the [corresponding CRUD event]({%slug treelist-editing-overview%}). Cancelling it will prevent the built-in CRUD event from firing.
+* `OnClick` - the event handler that the button will fire. If used on a built-in command, this handler will fire before the [corresponding CRUD event](slug://treelist-editing-overview). Cancelling it will prevent the built-in CRUD event from firing.
 * `ShowInEdit` - a boolean property indicating whether the button is only visible while the user is editing/inserting data.
 * `ChildContent` - the text the button will render. You can also place it between the command button's opening and closing tags.
-* Appearance properties like `Icon`, `Class`, `Enabled` that are come from the underlying [Telerik UI for Blazor Button Component features]({%slug components/button/overview%}).
+* Appearance properties like `Icon`, `Class`, `Enabled` that are come from the underlying [Telerik UI for Blazor Button Component features](slug://components/button/overview).
 
 ### Built-in Commands
 
@@ -46,11 +46,11 @@ There are four built-in commands:
 
 * `Add` - initiates the creation of a new item. Can apply to rows as well, to create a child element for the current row.
 * `Edit` - initiates the inline or popup editing (depending on the TreeListEditMode configuration of the treelist).
-* `Delete` - initiates the deletion of an existing item. You can also enable a [delete confirmation dialog]({%slug treelist-delete-confirmation%}).
+* `Delete` - initiates the deletion of an existing item. You can also enable a [delete confirmation dialog](slug://treelist-delete-confirmation).
 * `Save` - performs the actual update operation after the data has been changed. Triggers the `OnUpdate` or `OnCreate` event so you can perform the data source operation. Which event is triggered depends on whether the item was created or edited.
 * `Cancel` - aborts the current operation (edit or insert).
 
-> The `Add` and `Edit` commands require [enabled editing]({%slug treelist-overview%}#editing).
+> The `Add` and `Edit` commands require [enabled editing](slug://treelist-overview#editing).
 
 ### Context
 
diff --git a/components/treelist/columns/events.md b/components/treelist/columns/events.md
index 52572c0a43..66d31a4ad5 100644
--- a/components/treelist/columns/events.md
+++ b/components/treelist/columns/events.md
@@ -135,5 +135,5 @@ This event fires upon the rendering of the TreeLists columns. It receives an arg
 
 ## See Also
 
-  * [TreeList Overview]({%slug treelist-overview%})
-  * [TreeList Events]({%slug treelist-events%})
+  * [TreeList Overview](slug://treelist-overview)
+  * [TreeList Events](slug://treelist-events)
diff --git a/components/treelist/columns/frozen.md b/components/treelist/columns/frozen.md
index a9fba51f39..b27d2fb717 100644
--- a/components/treelist/columns/frozen.md
+++ b/components/treelist/columns/frozen.md
@@ -14,7 +14,7 @@ The treelist lets you freeze one or more columns. This will allow the user to sc
 
 To enable the column freezing, set the `Locked` parameter of the column to `true`.
 
-If the column you want to freeze is not the first in the list, the treelist must be scrollable. This requires that there are enough columns with their `Width` set so that the treelist has a horizontal scrollbar (the sum of the Widths of the columns exceeds the Width of the treelist). You can read more about the scrolling behavior of the treelist in the [TreeList Column Width Behavior]({%slug treelist-columns-width%}) article.
+If the column you want to freeze is not the first in the list, the treelist must be scrollable. This requires that there are enough columns with their `Width` set so that the treelist has a horizontal scrollbar (the sum of the Widths of the columns exceeds the Width of the treelist). You can read more about the scrolling behavior of the treelist in the [TreeList Column Width Behavior](slug://treelist-columns-width) article.
 
 >caption Frozen columns in the beginning, middle and at the end of the treelist
 
diff --git a/components/treelist/columns/menu.md b/components/treelist/columns/menu.md
index eb4f5f3da5..8fa3fa094c 100644
--- a/components/treelist/columns/menu.md
+++ b/components/treelist/columns/menu.md
@@ -10,7 +10,7 @@ position: 20
 
 # Column Menu
 
-The TreeList enables you to show a menu with quick actions for its columns. The Column Menu enables you to perform high-level customization like [sorting]({%slug treelist-sorting%}), [filtering]({%slug treelist-filtering%}), [showing or hiding]({%slug treelist-columns-visible%}) columns and [freezing or unfreezing]({%slug treelist-columns-frozen%}) them.
+The TreeList enables you to show a menu with quick actions for its columns. The Column Menu enables you to perform high-level customization like [sorting](slug://treelist-sorting), [filtering](slug://treelist-filtering), [showing or hiding](slug://treelist-columns-visible) columns and [freezing or unfreezing](slug://treelist-columns-frozen) them.
 
 >caption In this article:
 * [Basics](#basics)
@@ -134,7 +134,7 @@ The **Apply** button sets the column visibility according to the current checkbo
 
 To control whether filtering is possible from the Column Menu, set the `FilterMode` parameter of the `TreeListColumnMenuSettings` tag to a member of the `ColumnMenuFilterMode` enum:
 
-* `None`—disables the filtering from the Column Menu. This is the recommended option if you use the [`FilterRow` mode]({%slug treelist-filter-row%}).
+* `None`—disables the filtering from the Column Menu. This is the recommended option if you use the [`FilterRow` mode](slug://treelist-filter-row).
 * `FilterMenu`—enables filtering from a filter menu.
 
 ### Frozen Columns
@@ -155,7 +155,7 @@ The TreeList Column Menu lets you group the columns in the [Column Chooser](#col
 
 1. Use the `TreeListColumnMenuChooser` tag (child to the `TreeListColumnMenuSettings`).
 
-1. Add the [Template]({%slug treelist-templates-column-chooser%}) tag.
+1. Add the [Template](slug://treelist-templates-column-chooser) tag.
 
 1. Provide a `TreeListColumnMenuChooserGroup` which is a collection of the columns that will be in the section. To render a title for the section, use the `Title` parameter.
 
@@ -249,7 +249,7 @@ The example shows the following things:
 
 * Settings applied to a TreeList column take precedence over the settings applied to the Column Menu through the `<TreeListColumnMenuSettings>` tag. For example, if you set `Filterable="false"` to a TreeList column and `Filterable="true"` to a TreeList Column Menu, the filtering functionality will be disabled.
 
-* When using the [Column Chooser Template]({%slug treelist-templates-column-chooser%}) or grouping the columns into [sections](#column-sections), add the `Title` parameter to all TreeList Columns.
+* When using the [Column Chooser Template](slug://treelist-templates-column-chooser) or grouping the columns into [sections](#column-sections), add the `Title` parameter to all TreeList Columns.
 
 ## See Also
   * [Live Demo: TreeList Column Menu](https://demos.telerik.com/blazor-ui/treelist/column-menu)
diff --git a/components/treelist/columns/multi-column-headers.md b/components/treelist/columns/multi-column-headers.md
index e4723cd209..772fe987af 100644
--- a/components/treelist/columns/multi-column-headers.md
+++ b/components/treelist/columns/multi-column-headers.md
@@ -14,7 +14,7 @@ The Treelist allows you to stack several columns under one header to visually gr
 
 To use multiple column headers:
 
-1. Define a `TreeListColumn` instance for each multi-column header you want. Set its `Title` or [`HeaderTemplate`]({%slug treelist-templates-column-header%}).
+1. Define a `TreeListColumn` instance for each multi-column header you want. Set its `Title` or [`HeaderTemplate`](slug://treelist-templates-column-header).
 1. Under its `<Columns>` nested tag, add the columns you want it to contain.
 
 While you can set all the parameters of such a multi-column header column, it only supports and works with the `Title`, and the nested `HeaderTemplate` and `Columns` tags (templates).
diff --git a/components/treelist/columns/resize.md b/components/treelist/columns/resize.md
index 3f6f16056e..febb9b1f66 100644
--- a/components/treelist/columns/resize.md
+++ b/components/treelist/columns/resize.md
@@ -29,7 +29,7 @@ Here a few notes on the resizing behavior:
 
 * If the column `Width` is less than `MinResizableWidth` and the user tries to resize the column, it will snap to its minimum width.
 * Similarly, if the column `Width` is greater than `MaxResizableWidth`, the column will snap to its maximum width.
-* In [multi-column header scenarios]({%slug treelist-columns-multiple-column-headers%}), you may set `MinResizableWidth` or `MaxResizableWidth` to child columns only. Setting these attributes to parent columns will have no effect.
+* In [multi-column header scenarios](slug://treelist-columns-multiple-column-headers), you may set `MinResizableWidth` or `MaxResizableWidth` to child columns only. Setting these attributes to parent columns will have no effect.
 
 ## Autofit Columns
 
diff --git a/components/treelist/columns/virtual.md b/components/treelist/columns/virtual.md
index ee36945b2a..956185a84f 100644
--- a/components/treelist/columns/virtual.md
+++ b/components/treelist/columns/virtual.md
@@ -10,7 +10,7 @@ position: 5
 
 # Virtualized Columns
 
-The Telerik Blazor TreeList provides Virtual Scrolling for its Columns. This means that columns and the corresponding data will be rendered only for the currently visible viewport. When changing the [Page]({%slug treelist-paging%}), [filtering]({%slug treelist-filtering%}) or [Sorting]({%slug treelist-sorting%}) the treelist, fewer elements are rendered which improves the responsiveness and the overall user experience.
+The Telerik Blazor TreeList provides Virtual Scrolling for its Columns. This means that columns and the corresponding data will be rendered only for the currently visible viewport. When changing the [Page](slug://treelist-paging), [filtering](slug://treelist-filtering) or [Sorting](slug://treelist-sorting) the treelist, fewer elements are rendered which improves the responsiveness and the overall user experience.
 
 This article provides the following sections:
 * [Basics](#basics)
@@ -29,7 +29,7 @@ To enable Virtualized Columns:
 1. Set the `ColumnVirtualization` parameter of the treelist to `true`.
 
 1. Set the `Width` parameter of all columns in `px` so that the total sum is greater than the `Width` of the treelist.
-    * This will enable horizontal scrollbar which is required. You can read more about the scrolling behavior of the treelist in the [TreeList Column Width Behavior]({%slug treelist-columns-width%}) article.
+    * This will enable horizontal scrollbar which is required. You can read more about the scrolling behavior of the treelist in the [TreeList Column Width Behavior](slug://treelist-columns-width) article.
 
 <!-- 1. Set the `RowHeight` so that the content of all cells fits in the row. For more information see the [Notes](#notes) section. -->
 
@@ -205,13 +205,13 @@ The Virtualized Columns are a feature for improving the responsiveness and perfo
 
 List of known limitations of the Virtualized columns:
 
-* [Frozen]({%slug treelist-columns-frozen%}) columns are not supported.
+* [Frozen](slug://treelist-columns-frozen) columns are not supported.
 
 ## More Examples
 
 ### Virtualized Autogenerated Columns
 
-Column virtualization is commonly used when you have many columns. You may not have to declare them yourself, the treelist can do this for you through its [Automatically Generated Columns]({%slug treelist-columns-automatically-generated%}) feature.
+Column virtualization is commonly used when you have many columns. You may not have to declare them yourself, the treelist can do this for you through its [Automatically Generated Columns](slug://treelist-columns-automatically-generated) feature.
 
 >note In order to add Virtualized Autogenerated Columns, the `ColumnWidth` parameter must be set in pixels.
 
@@ -359,5 +359,5 @@ Column virtualization is commonly used when you have many columns. You may not h
 
 ## See also
  * [Live demo: Virtual Columns](https://demos.telerik.com/blazor-ui/treelist/column-virtualization)
- * [TreeList Column Width Behavior]({%slug treelist-columns-width%})
- * [Automatically Generated Columns]({%slug treelist-columns-automatically-generated%})
+ * [TreeList Column Width Behavior](slug://treelist-columns-width)
+ * [Automatically Generated Columns](slug://treelist-columns-automatically-generated)
diff --git a/components/treelist/columns/visible.md b/components/treelist/columns/visible.md
index f2db4bbda8..187e1ea54b 100644
--- a/components/treelist/columns/visible.md
+++ b/components/treelist/columns/visible.md
@@ -120,9 +120,9 @@ To hide a TreeList column set its `Visible` parameter to `false`. To hide a colu
 
 Non-visible columns (`Visible="false"`) will have the following behavior:
 
-* Will not be [editable]({%slug treelist-editing-overview%}).
-* [Templates]({%slug treelist-templates-overview%}) will not be rendered.
-    * When using [Row Template]({%slug treelist-templates-row%}) the visibility of the column should be implemented by the application in the row template itself - the treelist can only toggle the visibility of the header.
+* Will not be [editable](slug://treelist-editing-overview).
+* [Templates](slug://treelist-templates-overview) will not be rendered.
+    * When using [Row Template](slug://treelist-templates-row) the visibility of the column should be implemented by the application in the row template itself - the treelist can only toggle the visibility of the header.
 
 
 ## Examples
diff --git a/components/treelist/columns/width.md b/components/treelist/columns/width.md
index 74489ffc4f..bd9f71ffad 100644
--- a/components/treelist/columns/width.md
+++ b/components/treelist/columns/width.md
@@ -24,9 +24,9 @@ With regard to the widths of its columns, the scrollable (default) treelist typi
 
 * When no column widths are set, the available width is distributed evenly between all treelist columns.
 
-* To allow the users to auto-fit the column widths to the content, enable [column resizing]({%slug treelist-columns-resize%}) - a double click on the border between the headers will have the treelist adjust the column width according to the size of the data, and header content. It is also possible to [auto-fit columns programmatically]({%slug treelist-columns-resize%}#autofit-columns).
+* To allow the users to auto-fit the column widths to the content, enable [column resizing](slug://treelist-columns-resize) - a double click on the border between the headers will have the treelist adjust the column width according to the size of the data, and header content. It is also possible to [auto-fit columns programmatically](slug://treelist-columns-resize#autofit-columns).
 
 
 # See Also
 
-* [Column Resizing]({%slug treelist-columns-resize%})
+* [Column Resizing](slug://treelist-columns-resize)
diff --git a/components/treelist/data-binding/flat-data.md b/components/treelist/data-binding/flat-data.md
index cc311a7279..59fb1c61ff 100644
--- a/components/treelist/data-binding/flat-data.md
+++ b/components/treelist/data-binding/flat-data.md
@@ -117,8 +117,8 @@ If there are child items for a certain node (items whose `ParentId` points to th
 
 ## See Also
 
-  * [TreeList Data Binding Basics]({%slug treelist-data-binding-overview%})
+  * [TreeList Data Binding Basics](slug://treelist-data-binding-overview)
   * [Live Demo: TreeList Flat Data](https://demos.telerik.com/blazor-ui/treelist/binding-flat-data)
-  * [Binding to Hierarchical Data]({%slug treelist-data-binding-hierarchical-data%})
-  * [Load on Demand]({%slug treelist-data-binding-load-on-demand%})
+  * [Binding to Hierarchical Data](slug://treelist-data-binding-hierarchical-data)
+  * [Load on Demand](slug://treelist-data-binding-load-on-demand)
 
diff --git a/components/treelist/data-binding/hierarchical-data.md b/components/treelist/data-binding/hierarchical-data.md
index eedbdd8fdc..2aa56104a8 100644
--- a/components/treelist/data-binding/hierarchical-data.md
+++ b/components/treelist/data-binding/hierarchical-data.md
@@ -122,8 +122,8 @@ If there are items for a certain node, it will have an expand icon. The `HasChil
 
 ## See Also
 
-  * [TreeList Data Binding Basics]({%slug treelist-data-binding-overview%})
+  * [TreeList Data Binding Basics](slug://treelist-data-binding-overview)
   * [Live Demo: TreeList Hierarchical Data](https://demos.telerik.com/blazor-ui/treelist/binding-hierarchical-data)
-  * [Binding to Flat Data]({%slug treelist-data-binding-flat-data%})
-  * [Load on Demand]({%slug treelist-data-binding-load-on-demand%})
+  * [Binding to Flat Data](slug://treelist-data-binding-flat-data)
+  * [Load on Demand](slug://treelist-data-binding-load-on-demand)
 
diff --git a/components/treelist/data-binding/interface.md b/components/treelist/data-binding/interface.md
index 838b763929..3f5cf20302 100644
--- a/components/treelist/data-binding/interface.md
+++ b/components/treelist/data-binding/interface.md
@@ -12,11 +12,11 @@ position: 4
 
 Since version 2.27, the TreeList supports binding to a collection of multiple model types that implement the same interface.
 
-Note the usage of [`OnModelInit`]({%slug treelist-events%}#onmodelinit) in the example below. The event handler sets the model type to be used for new items in the TreeList. One-type model creation is supported out-of-the-box. If you need to support adding instances of different types:
+Note the usage of [`OnModelInit`](slug://treelist-events#onmodelinit) in the example below. The event handler sets the model type to be used for new items in the TreeList. One-type model creation is supported out-of-the-box. If you need to support adding instances of different types:
 
-* Use custom **Add** buttons in the [TreeList Toolbar]({%slug treelist-toolbar%}), one for each model type.
-* In each button click handler, define an `InsertedItem` of the correct type in the [TreeList State]({%slug treelist-state%}).
-* [Put the TreeList in Insert mode]({%slug treelist-state%}#initiate-editing-or-inserting-of-an-item) with the [SetStateAsync method]({%slug treelist-state%}#methods).
+* Use custom **Add** buttons in the [TreeList Toolbar](slug://treelist-toolbar), one for each model type.
+* In each button click handler, define an `InsertedItem` of the correct type in the [TreeList State](slug://treelist-state).
+* [Put the TreeList in Insert mode](slug://treelist-state#initiate-editing-or-inserting-of-an-item) with the [SetStateAsync method](slug://treelist-state#methods).
 
 >caption Data Binding the TreeList to an Interface
 
@@ -121,9 +121,9 @@ Note the usage of [`OnModelInit`]({%slug treelist-events%}#onmodelinit) in the e
 
 ## See Also
 
-  * [Binding to Flat Data]({%slug treelist-data-binding-flat-data%})
-  * [Binding to Hierarchical Data]({%slug treelist-data-binding-hierarchical-data%})
-  * [Load on Demand]({%slug treelist-data-binding-load-on-demand%})
+  * [Binding to Flat Data](slug://treelist-data-binding-flat-data)
+  * [Binding to Hierarchical Data](slug://treelist-data-binding-hierarchical-data)
+  * [Load on Demand](slug://treelist-data-binding-load-on-demand)
   * [Live Demo: TreeList Flat Data](https://demos.telerik.com/blazor-ui/treelist/binding-flat-data)
   * [Live Demo: TreeList Hierarchical Data](https://demos.telerik.com/blazor-ui/treelist/binding-hierarchical-data)
   * [Live Demo: TreeList Load on Demand](https://demos.telerik.com/blazor-ui/treelist/load-on-demand)
diff --git a/components/treelist/data-binding/load-on-demand.md b/components/treelist/data-binding/load-on-demand.md
index 6fd19f5d31..b401ae4149 100644
--- a/components/treelist/data-binding/load-on-demand.md
+++ b/components/treelist/data-binding/load-on-demand.md
@@ -15,7 +15,7 @@ This article explains how to load nodes on demand the treelist for Blazor so you
 Loading nodes on demand can improve the performance of your application by requesting less data at any given time.
 
 
-You don't have to provide all the data the treelist will render at once - the root nodes are sufficient for an initial display. You can then use the `OnExpand` event of the treelist to provide [hierarchical data]({%slug treelist-data-binding-hierarchical-data%}) to the node that was just expanded or amend [flat data]({%slug treelist-data-binding-flat-data%}) source with new nodes.
+You don't have to provide all the data the treelist will render at once - the root nodes are sufficient for an initial display. You can then use the `OnExpand` event of the treelist to provide [hierarchical data](slug://treelist-data-binding-hierarchical-data) to the node that was just expanded or amend [flat data](slug://treelist-data-binding-flat-data) source with new nodes.
 
 In the `OnExpand` event, you will receive the current node that was just expanded so you can check whether you need to load items for it. You can then load those items from your data service and update the corresponding data collection.
 
@@ -251,8 +251,8 @@ Below you will find two examples - for [hierarchical](#load-hierarchical-data-on
 
 ## See Also
 
-  * [TreeList Data Binding Basics]({%slug treelist-data-binding-overview%})
+  * [TreeList Data Binding Basics](slug://treelist-data-binding-overview)
   * [Live Demo: TreeList Load on Demand](https://demos.telerik.com/blazor-ui/treelist/load-on-demand)
-  * [Binding to Flat Data]({%slug treelist-data-binding-flat-data%})
-  * [Binding to Hierarchical Data]({%slug treelist-data-binding-hierarchical-data%})
+  * [Binding to Flat Data](slug://treelist-data-binding-flat-data)
+  * [Binding to Hierarchical Data](slug://treelist-data-binding-hierarchical-data)
 
diff --git a/components/treelist/data-binding/overview.md b/components/treelist/data-binding/overview.md
index d622028917..d9908a18d3 100644
--- a/components/treelist/data-binding/overview.md
+++ b/components/treelist/data-binding/overview.md
@@ -57,9 +57,9 @@ For samples of using each data binding approach listed above, see its correspond
 
 ## See Also
 
-  * [Binding to Flat Data]({%slug treelist-data-binding-flat-data%})
-  * [Binding to Hierarchical Data]({%slug treelist-data-binding-hierarchical-data%})
-  * [Load on Demand]({%slug treelist-data-binding-load-on-demand%})
+  * [Binding to Flat Data](slug://treelist-data-binding-flat-data)
+  * [Binding to Hierarchical Data](slug://treelist-data-binding-hierarchical-data)
+  * [Load on Demand](slug://treelist-data-binding-load-on-demand)
   * [Live Demo: TreeList Flat Data](https://demos.telerik.com/blazor-ui/treelist/binding-flat-data)
   * [Live Demo: TreeList Hierarchical Data](https://demos.telerik.com/blazor-ui/treelist/binding-hierarchical-data)
   * [Live Demo: TreeList Load on Demand](https://demos.telerik.com/blazor-ui/treelist/load-on-demand)
diff --git a/components/treelist/editing/built-in-dialogs/delete-confirmation.md b/components/treelist/editing/built-in-dialogs/delete-confirmation.md
index 66861afa1d..b806084af5 100644
--- a/components/treelist/editing/built-in-dialogs/delete-confirmation.md
+++ b/components/treelist/editing/built-in-dialogs/delete-confirmation.md
@@ -183,6 +183,6 @@ The built-in delete confirmation dialog triggers before item deletion. You can e
 * [Live Demo: TreeList InCell Editing](https://demos.telerik.com/blazor-ui/treelist/editing-incell)
 * [Live Demo: TreeList Custom Editor Template](https://demos.telerik.com/blazor-ui/treelist/custom-editor)
 * [Live Demo: TreeList Custom Edit Form](https://demos.telerik.com/blazor-ui/treelist/editing-custom-form)
-* [Customize the Delete Confirmation Dialog]({%slug grid-kb-customize-delete-confirmation-dialog%})
+* [Customize the Delete Confirmation Dialog](slug://grid-kb-customize-delete-confirmation-dialog)
 
 
diff --git a/components/treelist/editing/built-in-dialogs/overview.md b/components/treelist/editing/built-in-dialogs/overview.md
index d15e9f03cb..6464e75fcf 100644
--- a/components/treelist/editing/built-in-dialogs/overview.md
+++ b/components/treelist/editing/built-in-dialogs/overview.md
@@ -14,9 +14,9 @@ You can enable built-in dialogs in TreeList to provide an extra step for the end
 
 The TreeList component can use built-in dialogs for: 
 
-* [delete confirmation]({%slug treelist-delete-confirmation%}) - displays a confirmation dialog when the user clicks the "**delete**" command button.
+* [delete confirmation](slug://treelist-delete-confirmation) - displays a confirmation dialog when the user clicks the "**delete**" command button.
 
-The default texts of the dialogs are exposed in the [localization]({%slug globalization-localization%}) messages of the component, and you can customize them.
+The default texts of the dialogs are exposed in the [localization](slug://globalization-localization) messages of the component, and you can customize them.
 
 ## See Also
 
diff --git a/components/treelist/editing/incell.md b/components/treelist/editing/incell.md
index ce4dc68216..f4f79152c2 100644
--- a/components/treelist/editing/incell.md
+++ b/components/treelist/editing/incell.md
@@ -32,7 +32,7 @@ The InCell edit mode provides a specific user experience and behaves differently
 
 To enable InCell editing mode, set the `EditMode` property of the TreeList to `Telerik.Blazor.TreeListEditMode.Incell`. You can handle the `OnUpdate`, `OnCreate` and `OnDelete` events to perform the CUD operations, as shown in the example below.
 
-To add a new item, you must add a [toolbar]({%slug treelist-toolbar%}) with an `Add` command. `OnCreate` will fire immediately when you click the `Add` button - see [Event Sequence](#event-sequence) below.
+To add a new item, you must add a [toolbar](slug://treelist-toolbar) with an `Add` command. `OnCreate` will fire immediately when you click the `Add` button - see [Event Sequence](#event-sequence) below.
 
 It is up to the data access logic to save the data once it is changed in the data collection. The example above showcases when that happens and adds some code to provide a visual indication of the change. In a real application, the code for handling data updates may be entirely different.
 
@@ -315,9 +315,9 @@ Editing is cancelled for the first record.
 
 ## Event Sequence
 
-* The `OnCreate` event will fire as soon as you click the `Add` button. The Grid will render the new row and enter edit mode for the first editable column (to fire `OnEdit` and let the user alter the column). This means you should have [default values]({%slug grid-kb-default-value-for-new-row%}) that satisfy any initial validation and requirements your models may have.
+* The `OnCreate` event will fire as soon as you click the `Add` button. The Grid will render the new row and enter edit mode for the first editable column (to fire `OnEdit` and let the user alter the column). This means you should have [default values](slug://grid-kb-default-value-for-new-row) that satisfy any initial validation and requirements your models may have.
 
-    * This means that there is no actual inserted item, an item in InCell editing is always in Edit mode, never in Insert mode. Thus, you cannot use the `InsertedItem` field of the TreeList [State]({%slug treelist-state%}). If you want to insert items programmatically in the TreeList, alter the `Data` collection, and use the `OriginalEditItem` feature of the state (see the [Initiate Editing or Inserting of an Item]({%slug treelist-state%}#initiate-editing-or-inserting-of-an-item) example - it can put the InLine and Popup edit modes in Insert mode, but this cannot work for InCell editing).
+    * This means that there is no actual inserted item, an item in InCell editing is always in Edit mode, never in Insert mode. Thus, you cannot use the `InsertedItem` field of the TreeList [State](slug://treelist-state). If you want to insert items programmatically in the TreeList, alter the `Data` collection, and use the `OriginalEditItem` feature of the state (see the [Initiate Editing or Inserting of an Item](slug://treelist-state#initiate-editing-or-inserting-of-an-item) example - it can put the InLine and Popup edit modes in Insert mode, but this cannot work for InCell editing).
 
 * The `OnEdit` event fires every time a cell is opened for editing. Until version **2.27**, the event fired **once per row** - when the user edits a cell from a different row.
 
@@ -330,7 +330,7 @@ Editing is cancelled for the first record.
 
 ## Incell Editing and Selection
 
-* To enable item selection with InCell Edit Mode, add a `<TreeListCheckboxColumn />` to the `<Columns>` collection. More information on that can be read in the [Selection]({%slug treelist-selection-row%}#selection-and-editing-modes ) article.
+* To enable item selection with InCell Edit Mode, add a `<TreeListCheckboxColumn />` to the `<Columns>` collection. More information on that can be read in the [Selection](slug://treelist-selection-row#selection-and-editing-modes ) article.
 
 
 ## Adding Children to Collapsed Items
@@ -362,4 +362,4 @@ The incell editor template requires a focusable element to maintain the tab orde
 ## See Also
 
 * [Live Demo: TreeList InCell Editing](https://demos.telerik.com/blazor-ui/treelist/editing-incell)
-* [TreeList Selection Documentation]({%slug treelist-selection-overview%})
+* [TreeList Selection Documentation](slug://treelist-selection-overview)
diff --git a/components/treelist/editing/inline.md b/components/treelist/editing/inline.md
index 48300de611..51ea462fcd 100644
--- a/components/treelist/editing/inline.md
+++ b/components/treelist/editing/inline.md
@@ -10,7 +10,7 @@ position: 1
 
 # TreeList Inline Editing
 
-Inline editing lets the user click an [Edit command button]({%slug treelist-columns-command%}) on the row, and all its editable columns open up for changes. They can then click a `Save` command button to submit the changes to the data access layer. This fires the `OnUpdate` event of the treelist where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service). 
+Inline editing lets the user click an [Edit command button](slug://treelist-columns-command) on the row, and all its editable columns open up for changes. They can then click a `Save` command button to submit the changes to the data access layer. This fires the `OnUpdate` event of the treelist where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service). 
 
 
 In a similar fashion, the `Cancel` and `Delete` command buttons fire events on the treelist to let you handle the data source operations.
diff --git a/components/treelist/editing/overview.md b/components/treelist/editing/overview.md
index 89a9e11a5b..ea925adb93 100644
--- a/components/treelist/editing/overview.md
+++ b/components/treelist/editing/overview.md
@@ -13,7 +13,7 @@ position: 0
 CRUD operations with the TreeList for Blazor support validation and
 are done through the dedicated CRUD events it exposes for data editing. You can use them to transfer the changes to the underlying data source (for example, call a service that will actually work with the database, and not only with the view data).
 
-To enable TreeList editing, set the [`EditMode` attribute]({%slug treelist-overview%}#editing) to the desired edit mode.
+To enable TreeList editing, set the [`EditMode` attribute](slug://treelist-overview#editing) to the desired edit mode.
 
 Sections in this article:
 
@@ -27,20 +27,20 @@ Sections in this article:
 
 The TreeList offers several editing modes with different user experience through the `EditMode` property that is a member of the `TreeListEditMode` enum:
 
-* `None` - the default `TreeListEditMode` value. The built-in [`Add` and `Edit` commands]({%slug treelist-columns-command%}#built-in-commands) don't work in this mode.
-* `Incell` - editing is done [in the current cell]({%slug treelist-editing-incell%}) with a double click
-* `Inline` - editing is done for the [entire row]({%slug treelist-editing-inline%}) with an [Edit Command Button]({%slug treelist-columns-command%})
-* `Popup` - editing is done in a [popup]({%slug treelist-editing-popup%}) for the entire row with an [Edit Command Button]({%slug treelist-columns-command%}), and model Validation through Data Annotation attributes is available.
+* `None` - the default `TreeListEditMode` value. The built-in [`Add` and `Edit` commands](slug://treelist-columns-command#built-in-commands) don't work in this mode.
+* `Incell` - editing is done [in the current cell](slug://treelist-editing-incell) with a double click
+* `Inline` - editing is done for the [entire row](slug://treelist-editing-inline) with an [Edit Command Button](slug://treelist-columns-command)
+* `Popup` - editing is done in a [popup](slug://treelist-editing-popup) for the entire row with an [Edit Command Button](slug://treelist-columns-command), and model Validation through Data Annotation attributes is available.
 
 
 ## Events
 
 Here are the available events and command buttons that you need to use for editing records in a TreeList.
 
-* `OnAdd` - fires when the `Add` [command button]({%slug treelist-columns-command%}) for a newly added item is clicked. Cancellable.
-* `OnCreate` - fires when the `Save` [command button]({%slug treelist-columns-command%}) for a newly added item is clicked. Cancellable.
+* `OnAdd` - fires when the `Add` [command button](slug://treelist-columns-command) for a newly added item is clicked. Cancellable.
+* `OnCreate` - fires when the `Save` [command button](slug://treelist-columns-command) for a newly added item is clicked. Cancellable.
 * `OnUpdate` - fires when the `Save` command button is clicked on an existing item. Cancellable. The model reference is a copy of the original data source item.
-* `OnDelete` - fires when the `Delete` command button is clicked. The event is cancellable, and you can also display a [delete confirmation dialog]({%slug treelist-delete-confirmation%}) before the deletion.
+* `OnDelete` - fires when the `Delete` command button is clicked. The event is cancellable, and you can also display a [delete confirmation dialog](slug://treelist-delete-confirmation) before the deletion.
 * `OnEdit` - fires when the user is about to enter edit mode for an existing row. Cancellable.
 * `OnCancel` - fires when the user clicks the `Cancel` command button. Allows you to undo the changes to the data in the view data. Cancellable.
 
@@ -50,14 +50,14 @@ The CUD event handlers receive an argument of type `TreeListCommandEventArgs` th
 * `IsNew` - a boolean field indicating whether the item was just added through the treelist. Lets you differentiate a data source Create operation from Update operation in the `OnClick` event of a command button.
 * `Item` - an object you can cast to your model class to obtain the current data item.
 * `ParentItem` - an object you can cast to your model class to obtain the parent of current data item. Will be `null` if the current item is at the root level.
-* `Field` - specific to [InCell editing]({%slug treelist-editing-incell%}) - indicates which is the model field the user changed when updating data.
-* `Value` - specific to [InCell editing]({%slug treelist-editing-incell%}) - indicates what is the new value the user changed when updating data.
+* `Field` - specific to [InCell editing](slug://treelist-editing-incell) - indicates which is the model field the user changed when updating data.
+* `Value` - specific to [InCell editing](slug://treelist-editing-incell) - indicates what is the new value the user changed when updating data.
 
-You can initiate editing or inserting of an item from anywhere on the page (buttons outside of the treelist, or components in a column template) through the [treelist state]({%slug treelist-state%}#initiate-editing-or-inserting-of-an-item).
+You can initiate editing or inserting of an item from anywhere on the page (buttons outside of the treelist, or components in a column template) through the [treelist state](slug://treelist-state#initiate-editing-or-inserting-of-an-item).
 
 ## Customize The Editor Fields
 
-You can customize the editors rendered in the TreeList by providing the `EditorType` attribute, exposed on the `<TreeListColumn>`, or by using the [Editor Template]({%slug treelist-templates-editor%}). The `EditorType` attribute accepts a member of the `TreeListEditorType` enum:
+You can customize the editors rendered in the TreeList by providing the `EditorType` attribute, exposed on the `<TreeListColumn>`, or by using the [Editor Template](slug://treelist-templates-editor). The `EditorType` attribute accepts a member of the `TreeListEditorType` enum:
 
 | Field data type | TreeListEditorType enum members              |
 |-----------------|------------------------------------------|
@@ -633,13 +633,13 @@ There are a few considerations to keep in mind with the CUD operations of the tr
 
     * When the method returns `void`, the execution of the context operations is not actually awaited, and you may get errors from the context (such as "Cannot access a disposed object. A common cause of this error is disposing a context that was resolved from dependency injection and then later trying to use the same context instance elsewhere in your application" or "A second operation started on this context before a previous operation completed. This is usually caused by different threads using the same instance of DbContext"). The treelist may also re-render before the actual data update happens and you may not see the result.
 
-* The treelist uses `Activator.CreateInstance<TItem>();` to generate a new item when an Insert or Edit action is invoked, so the Model should have a parameterless constructor defined. If you cannot have such a constructor, you must use the [OnModelInit]({%slug treelist-events%}#onmodelinit) event.
+* The treelist uses `Activator.CreateInstance<TItem>();` to generate a new item when an Insert or Edit action is invoked, so the Model should have a parameterless constructor defined. If you cannot have such a constructor, you must use the [OnModelInit](slug://treelist-events#onmodelinit) event.
 
-* While editing, the Treelist creates a **copy of your original object** which has a **different reference**. You receive that copy in the `OnUpdate` event handler. The `OnEdit` event receives the original item from the pristine `Data` collection, because it is a cancellable event and fires before the treelist logic creates the copy. The built-in editors and [editor templates]({%slug treelist-templates-editor%}) receive the copy for their `context` that the treelist will create after `OnEdit`.
+* While editing, the Treelist creates a **copy of your original object** which has a **different reference**. You receive that copy in the `OnUpdate` event handler. The `OnEdit` event receives the original item from the pristine `Data` collection, because it is a cancellable event and fires before the treelist logic creates the copy. The built-in editors and [editor templates](slug://treelist-templates-editor) receive the copy for their `context` that the treelist will create after `OnEdit`.
 
 * The validation the treelist provides is based on the <a href="https://docs.microsoft.com/en-us/aspnet/core/blazor/forms-validation?view=aspnetcore-5.0#validator-components" target="_blank">`DataAnnotationValidator`</a> and creates its own `EditContext` for a row that is in edit/insert mode. When the row is not in edit/insert mode, the `EditContext` is `null`. The `EditContext` is a cascading parameter and overrides any cascading parameters from parent components (such as an `<EditForm>` that may wrap the treelist).
 
-* When an input receives an `EditContext` (usually comes down as a cascading parameter), the framework also requires a `ValueExpression`. If you use two-way binding (the `@bind-Value` syntax), the `ValueExpression` is deducted from there. However, if you use only the `Value` property, you have to pass the `ValueExpression` yourself. This is a lambda expression that tells the framework what field in the model to update. The following sample demonstrates how to achieve that. You can also check the [Requires a value for ValueExpression]({%slug common-kb-requires-valueexpression%}) knowledge base article for more details.
+* When an input receives an `EditContext` (usually comes down as a cascading parameter), the framework also requires a `ValueExpression`. If you use two-way binding (the `@bind-Value` syntax), the `ValueExpression` is deducted from there. However, if you use only the `Value` property, you have to pass the `ValueExpression` yourself. This is a lambda expression that tells the framework what field in the model to update. The following sample demonstrates how to achieve that. You can also check the [Requires a value for ValueExpression](slug://common-kb-requires-valueexpression) knowledge base article for more details.
 
 <div class="skip-repl"></div>
 ````RAZOR
@@ -652,7 +652,7 @@ There are a few considerations to keep in mind with the CUD operations of the tr
 @* Applies to the other input type components as well *@
 ````
 
-* If you want to perform other data operations while the component is in Edit mode (applicable for [InCell]({%slug treelist-editing-incell%}) and [Inline]({%slug treelist-editing-inline%}) editing) the following behavior will occur:
+* If you want to perform other data operations while the component is in Edit mode (applicable for [InCell](slug://treelist-editing-incell) and [Inline](slug://treelist-editing-inline) editing) the following behavior will occur:
 
 @[template](/_contentTemplates/common/grid-treelist-editing-notes.md#grid-treelist-data-operations-while-editing)
 
diff --git a/components/treelist/editing/popup.md b/components/treelist/editing/popup.md
index 70a9387967..9153a7d576 100644
--- a/components/treelist/editing/popup.md
+++ b/components/treelist/editing/popup.md
@@ -22,7 +22,7 @@ In this article:
 
 ## Basics
 
-Popup editing lets the user click an [Edit command button]({%slug treelist-columns-command%}) on the row, and a popup shows up with all its editable columns open up for changes. They can then click the `Save` button in the dialog to submit the changes to the model. This fires the `OnUpdate` event of the treelist where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service).
+Popup editing lets the user click an [Edit command button](slug://treelist-columns-command) on the row, and a popup shows up with all its editable columns open up for changes. They can then click the `Save` button in the dialog to submit the changes to the model. This fires the `OnUpdate` event of the treelist where your code receives the updated model so you can work with the data (for example, to call the appropriate method of your service).
 
 In a similar fashion, the `Cancel`, `Delete` command buttons and the `Add` toolbar button fire events on the treelist to let you handle the data source operations.
 
@@ -30,7 +30,7 @@ You can also cancel the events by setting the `IsCancelled` property of the even
 
 To enable Popup editing in the treelist, set its `EditMode` property to `Telerik.Blazor.TreeListEditMode.Popup`, then handle the CRUD events as shown in the example below.
 
-The Popup editing mode supports [validation]({%slug common-features/input-validation%}). To use it, all you need to do is decorate your model with the desired annotations. Validation errors will be shown in the popup and will prevent the Update operation.
+The Popup editing mode supports [validation](slug://common-features/input-validation). To use it, all you need to do is decorate your model with the desired annotations. Validation errors will be shown in the popup and will prevent the Update operation.
 
 
 >caption The Command buttons and the treelist events let you handle data operations in Popup edit mode
@@ -322,7 +322,7 @@ The TreeList exposes options to customize the edit popup and its form. You can d
 
 ### Editability of Hidden Columns
 
-Staring from version 7.0, the TreeList allows users to edit [hidden columns]({%slug treelist-columns-visible%}) by default. To disable editing of a hidden column, set `Editable="false"` to the respective `<TreeListColumn>` tag.
+Staring from version 7.0, the TreeList allows users to edit [hidden columns](slug://treelist-columns-visible) by default. To disable editing of a hidden column, set `Editable="false"` to the respective `<TreeListColumn>` tag.
 
 ### Popup Customization
 
@@ -330,7 +330,7 @@ The `TreeListPopupEditSettings` nested tag exposes the following parameters to a
 
 @[template](/_contentTemplates/common/popup-edit-customization.md#popup-settings)
 
-For example, here is [how to set the TreeList popup edit form's title, so that it matches a property value of the edited data item]({%slug grid-kb-popup-edit-title%}).
+For example, here is [how to set the TreeList popup edit form's title, so that it matches a property value of the edited data item](slug://grid-kb-popup-edit-title).
 
 ### Edit Form Customization
 
@@ -456,14 +456,14 @@ The `TreeListPopupEditFormSettings` nested tag exposes the following parameters
 
 ### Popup Form Customization
 
-In the `TreeListPopupEditFormSettings`, you can declare a `FormTemplate`. This template enables you to fully customize the appearance and content of the create/edit Popup window in the TreeList. For more information and examples on customizing the TreeList Popup window, refer to the [Popup Form Template]({%slug treelist-templates-popup-form%}) article.
+In the `TreeListPopupEditFormSettings`, you can declare a `FormTemplate`. This template enables you to fully customize the appearance and content of the create/edit Popup window in the TreeList. For more information and examples on customizing the TreeList Popup window, refer to the [Popup Form Template](slug://treelist-templates-popup-form) article.
 
 ### Popup Buttons Customization
 
-You can specify a `ButtonsTemplate` in the `TreeListPopupEditFormSettings` to customize how the buttons look in the create/edit Popup window of the TreeList. To learn more and see an example of customizing the TreeList Popup buttons, refer to the [Popup Buttons Template]({%slug treelist-templates-popup-buttons%}) article.
+You can specify a `ButtonsTemplate` in the `TreeListPopupEditFormSettings` to customize how the buttons look in the create/edit Popup window of the TreeList. To learn more and see an example of customizing the TreeList Popup buttons, refer to the [Popup Buttons Template](slug://treelist-templates-popup-buttons) article.
 
 ## See Also
 
   * [Live Demo: TreeList Popup Editing](https://demos.telerik.com/blazor-ui/treelist/editing-popup)
-  * [Custom Editor Template Per Field]({%slug treelist-templates-editor%})
+  * [Custom Editor Template Per Field](slug://treelist-templates-editor)
 
diff --git a/components/treelist/editing/validation.md b/components/treelist/editing/validation.md
index 6e8cbaab73..a427885449 100644
--- a/components/treelist/editing/validation.md
+++ b/components/treelist/editing/validation.md
@@ -10,7 +10,7 @@ position: 40
 
 # TreeList Validation
 
-The Telerik UI for Blazor TreeList supports built-in validation that is enabled by default. The component passes an `EditContext` as a cascading value to the editable cells. If any validation messages are present the TreeList will render them as [Validation Tooltips]({%slug validation-tools-tooltip%}) on hover of the specific editor. 
+The Telerik UI for Blazor TreeList supports built-in validation that is enabled by default. The component passes an `EditContext` as a cascading value to the editable cells. If any validation messages are present the TreeList will render them as [Validation Tooltips](slug://validation-tools-tooltip) on hover of the specific editor. 
 
 #### In this Article:
 
@@ -302,5 +302,5 @@ You can validate the TreeList with any validator that uses the `EditContext`. To
 
 ## See Also
 
-  * [TreeList Editing]({%slug treelist-editing-overview%})
+  * [TreeList Editing](slug://treelist-editing-overview)
    
diff --git a/components/treelist/events.md b/components/treelist/events.md
index 8632f915c9..9f61d9c8bc 100644
--- a/components/treelist/events.md
+++ b/components/treelist/events.md
@@ -21,7 +21,7 @@ The `OnAdd`, `OnCreate`, `OnUpdate` and `OnDelete` events let you get the data i
 
 The `OnEdit` and `OnCancel` events let you respond to user actions - when they want to edit an item and when they want to cancel changes on an item they have been editing. You can use them to, for example, prevent editing of certain items based on some condition.
 
-You can read more about the CUD events in the [Editing Overview]({%slug treelist-editing-overview%}) article.
+You can read more about the CUD events in the [Editing Overview](slug://treelist-editing-overview) article.
 
 ## Other Events
 
@@ -43,7 +43,7 @@ You can read more about the CUD events in the [Editing Overview]({%slug treelist
 The `OnExpand` event fires when the user clicks the expand arrow on a row that has children but they are collapsed. It receives arguments of type `TreeListExpandEventArgs<T>` where `T` is the model you bind the treelist to, and the `Item` field in the event arguments is the current model.
 
 
-You can use `OnExpand` to know the user action and/or to [load data on demand]({%slug treelist-data-binding-load-on-demand%}).
+You can use `OnExpand` to know the user action and/or to [load data on demand](slug://treelist-data-binding-load-on-demand).
 
 The `OnCollapse` event fires when the user collapses an expanded row through the collapse arrow. It receives arguments of type `TreeListCollapseEventArgs<T>` where `T` is the model you bind the treelist to, and the `Item` field in the event arguments is the current model.
 
@@ -165,19 +165,19 @@ The `OnCollapse` event fires when the user collapses an expanded row through the
 
 ## Command Button Click
 
-The command buttons of a treelist provide an `OnClick` event before firing their built-in command (such as opening a row for editing, or adding a new row). You can do this to implement some additional logic and to also handle custom commands - both from a [Command Column]({%slug treelist-columns-command%}), and from a [Toolbar Button]({%slug treelist-toolbar%}).
+The command buttons of a treelist provide an `OnClick` event before firing their built-in command (such as opening a row for editing, or adding a new row). You can do this to implement some additional logic and to also handle custom commands - both from a [Command Column](slug://treelist-columns-command), and from a [Toolbar Button](slug://treelist-toolbar).
 
 ## SelectedItemsChanged
 
-Fires when [row selection is enabled]({%slug treelist-selection-overview%}#enable-row-or-cell-selection) and the user selects or deselects one or multiple rows, depending on the [selection mode]({%slug treelist-selection-overview%}#use-single-or-multiple-selection).
+Fires when [row selection is enabled](slug://treelist-selection-overview#enable-row-or-cell-selection) and the user selects or deselects one or multiple rows, depending on the [selection mode](slug://treelist-selection-overview#use-single-or-multiple-selection).
 
-Visit the [TreeList Row Selection article to see an example]({%slug treelist-selection-row%}#selecteditemschanged-event).
+Visit the [TreeList Row Selection article to see an example](slug://treelist-selection-row#selecteditemschanged-event).
 
 ## SelectedCellsChanged
 
-Fires when [cell selection is enabled]({%slug treelist-selection-overview%}#enable-row-or-cell-selection) and the user selects or deselects one cell or multiple cells, depending on the [selection mode]({%slug treelist-selection-overview%}#use-single-or-multiple-selection).
+Fires when [cell selection is enabled](slug://treelist-selection-overview#enable-row-or-cell-selection) and the user selects or deselects one cell or multiple cells, depending on the [selection mode](slug://treelist-selection-overview#use-single-or-multiple-selection).
 
-Visit the [TreeList Cell Selection article to see an example]({%slug treelist-selection-cell%}#selectedcellschanged-event).
+Visit the [TreeList Cell Selection article to see an example](slug://treelist-selection-cell#selectedcellschanged-event).
 
 ## OnModelInit
 
@@ -1396,7 +1396,7 @@ This event fires upon the rendering of the TreeList rows. It receives an argumen
 
 ## OnRowDrop
 
-The `OnRowDrop` event fires when the user drags and drops rows in the TreeList or between TreeLists. You can read more on setting it up and using the TreeList row dragging feature in the [Row Drag and Drop]({%slug treelist-drag-drop-overview%}) article.
+The `OnRowDrop` event fires when the user drags and drops rows in the TreeList or between TreeLists. You can read more on setting it up and using the TreeList row dragging feature in the [Row Drag and Drop](slug://treelist-drag-drop-overview) article.
 
 ## PageChanged
 
@@ -1574,6 +1574,6 @@ Make sure to update the current page size when using the event.
 
 ## See Also
 
-* [TreeList Overview]({%slug treelist-overview%})
-* [TreeList Column Events]({%slug treelist-column-events%})
-* [TreeList Editing Overview]({%slug treelist-editing-overview%})
+* [TreeList Overview](slug://treelist-overview)
+* [TreeList Column Events](slug://treelist-column-events)
+* [TreeList Editing Overview](slug://treelist-editing-overview)
diff --git a/components/treelist/filter/checkboxlist.md b/components/treelist/filter/checkboxlist.md
index 6b47e3a7ab..8cc7e3efec 100644
--- a/components/treelist/filter/checkboxlist.md
+++ b/components/treelist/filter/checkboxlist.md
@@ -10,7 +10,7 @@ position: 15
 
 # TreeList CheckBoxList Filtering
 
-You can change the [filter menu]({%slug treelist-filter-menu%}) to show a list of checkboxes with the distinct values from the data source. This lets your users filter records by a commonly found value quickly, and select multiple values with ease. The behavior is similar to Excel filtering.
+You can change the [filter menu](slug://treelist-filter-menu) to show a list of checkboxes with the distinct values from the data source. This lets your users filter records by a commonly found value quickly, and select multiple values with ease. The behavior is similar to Excel filtering.
 
 To enable the checkbox list filtering in the treelist:
 
@@ -108,7 +108,7 @@ You can also change the filter menu behavior for a particular column - its own `
 
 By default, the treelist takes the `Distinct` values from its `Data` to populate the checkbox list filter for each field.
 
-To customize the checkbox list behavior, you should use the [filter menu template]({%slug treelist-templates-filter%}#filter-menu-template). To help you with that, we have exposed the `TelerikCheckBoxListFilter` component that you can place inside the `FilterMenuTemplate` to get the default treelist UI. It provides the following settings:
+To customize the checkbox list behavior, you should use the [filter menu template](slug://treelist-templates-filter#filter-menu-template). To help you with that, we have exposed the `TelerikCheckBoxListFilter` component that you can place inside the `FilterMenuTemplate` to get the default treelist UI. It provides the following settings:
 
 * `FilterDescriptor` - the filter descriptor where filters will be populated when checkboxes are selected. The component creates the necessary descriptors for you and reads existing ones. This makes it easy to plug into the treelist without any additional code through two-way binding (`@bind-FilterDescriptor="@context.FilterDescriptor"`).
 
@@ -242,6 +242,6 @@ In this sample the Team column lets you filter only by the CEO Team settings, or
 
 ## See Also
 
-  * [Treelist Filtering Overview]({%slug treelist-filtering%})
+  * [Treelist Filtering Overview](slug://treelist-filtering)
   * [Live Demo: Treelist CheckBox List Filter](https://demos.telerik.com/blazor-ui/treelist/filter-checkboxlist)
   
\ No newline at end of file
diff --git a/components/treelist/filter/filter-menu.md b/components/treelist/filter/filter-menu.md
index fe31c11d42..54e1b05a16 100644
--- a/components/treelist/filter/filter-menu.md
+++ b/components/treelist/filter/filter-menu.md
@@ -10,7 +10,7 @@ position: 10
 
 # TreeList Filter Menu
 
-One of the [filter modes of the treelist]({%slug treelist-filtering%}) is a popup menu with filter options that you can open from the column headers.
+One of the [filter modes of the treelist](slug://treelist-filtering) is a popup menu with filter options that you can open from the column headers.
 
 In this article:
 
@@ -24,7 +24,7 @@ To enable the filter menu, set the `FilterMode` property of the grid to `Telerik
 
 The treelist will render a button in the column header that you click to get a popup with filtering options. The popup lets you choose filter operator, filter criteria, to apply and clear the filter.
 
-A key difference in the behavior from the [filter row]({%slug treelist-filter-row%}) is that the filter is now applied only upon a button click, not upon input change. This may improve performance with large data sets.
+A key difference in the behavior from the [filter row](slug://treelist-filter-row) is that the filter is now applied only upon a button click, not upon input change. This may improve performance with large data sets.
 
 >caption Filter Menu in Telerik TreeList
 
@@ -103,7 +103,7 @@ A key difference in the behavior from the [filter row]({%slug treelist-filter-ro
 
 ## Filter From Code
 
-You can set the TreeList filters from your code through the component [state]({%slug treelist-state%}).
+You can set the TreeList filters from your code through the component [state](slug://treelist-state).
 
 @[template](/_contentTemplates/treelist/state.md#initial-state)
 
@@ -209,10 +209,10 @@ You can override the default Filter Row behavior for each column through the fol
 
 ### Filter Menu Template
 
-The template will let you have full control over the Filter Row rendering and behavior. See how you can implement it and explore the example in the [Filter Row Template]({%slug grid-templates-filter%}#filter-menu-template) article.
+The template will let you have full control over the Filter Row rendering and behavior. See how you can implement it and explore the example in the [Filter Row Template](slug://grid-templates-filter#filter-menu-template) article.
 
 
 ## See Also
 
-  * [Treelist Filtering Overview]({%slug treelist-filtering%})
+  * [Treelist Filtering Overview](slug://treelist-filtering)
   * [Live Demo: TreeList Filter Menu](https://demos.telerik.com/blazor-ui/treelist/filter-menu)
diff --git a/components/treelist/filter/filter-row.md b/components/treelist/filter/filter-row.md
index 5c7b003775..fb4245dc13 100644
--- a/components/treelist/filter/filter-row.md
+++ b/components/treelist/filter/filter-row.md
@@ -10,7 +10,7 @@ position: 5
 
 # TreeList Filter Row
 
-One of the [filter modes of the treelist]({%slug treelist-filtering%}) is a row of filter elements below the column headers.
+One of the [filter modes of the treelist](slug://treelist-filtering) is a row of filter elements below the column headers.
 
 In this article:
 
@@ -104,7 +104,7 @@ The treelist will render a row below the column headers with UI that you can use
 
 ## Filter From Code
 
-You can set the TreeList filters from your code through the component [state]({%slug treelist-state%}).
+You can set the TreeList filters from your code through the component [state](slug://treelist-state).
 
 @[template](/_contentTemplates/treelist/state.md#initial-state)
 
@@ -222,10 +222,10 @@ You can override the default Filter Row behavior for each column through the fol
 
 ### Filter Row Template
 
-The template will let you have full control over the Filter Row rendering and behavior. See how you can implement it and explore the example [Filter Row Template]({%slug treelist-templates-filter%}#filter-row-template) article.
+The template will let you have full control over the Filter Row rendering and behavior. See how you can implement it and explore the example [Filter Row Template](slug://treelist-templates-filter#filter-row-template) article.
 
 
 ## See Also
 
-  * [Treelist Filtering Overview]({%slug treelist-filtering%})
+  * [Treelist Filtering Overview](slug://treelist-filtering)
   * [Live Demo: TreeList Filter Row](https://demos.telerik.com/blazor-ui/treelist/filter-row)
diff --git a/components/treelist/filter/overview.md b/components/treelist/filter/overview.md
index 31a5cd0026..c22474c68b 100644
--- a/components/treelist/filter/overview.md
+++ b/components/treelist/filter/overview.md
@@ -17,9 +17,9 @@ The TreeList component offers built-in support for filtering.
 
 To enable filtering, set the `FilterMode` property of the treelist to one of the following values:
 
-* [`Telerik.Blazor.TreeListFilterMode.FilterRow`]({%slug treelist-filter-row%}) - a row of filter options is rendered below the column headers
+* [`Telerik.Blazor.TreeListFilterMode.FilterRow`](slug://treelist-filter-row) - a row of filter options is rendered below the column headers
 
-* [`Telerik.Blazor.TreeListFilterMode.FilterMenu`]({%slug treelist-filter-menu%}) - the column headers render a button that shows a popup with filtering options
+* [`Telerik.Blazor.TreeListFilterMode.FilterMenu`](slug://treelist-filter-menu) - the column headers render a button that shows a popup with filtering options
 
 The behavior of the filter input and the available filter operators will depend on the column data type. For example, a boolean field will only have the options "is true" and "is false" and will not have operators like "contains" or "greater than".
 
@@ -36,15 +36,15 @@ Filtering keeps the expanded/collapsed state of items. For example, if filtering
 
 In addition to the two main filtering modes, the treelist offers two more features that can enhance the user experience when looking for data:
 
-* A [searchbox in the toolbar]({%slug treelist-searchbox%}) can amend the filters and let the user look up many fields at once
+* A [searchbox in the toolbar](slug://treelist-searchbox) can amend the filters and let the user look up many fields at once
 
-* The filter menu can show a [list of checkboxes]({%slug treelist-checklist-filter%}) with the distinct values from the data to make filtering resemble Excel.
+* The filter menu can show a [list of checkboxes](slug://treelist-checklist-filter) with the distinct values from the data to make filtering resemble Excel.
 
-* You can customize the appearance and behavior of the filters through the [filter templates]({%slug treelist-templates-filter%}).
+* You can customize the appearance and behavior of the filters through the [filter templates](slug://treelist-templates-filter).
 
 ## Filter Descriptors
 
-You can get the applied filtering criteria for each filtered field. Use the [TreeList state]({%slug treelist-state%}) to obtain the user input, the filter operator and other filtering properties. Find out how in the [Data Operation Descriptors article]({%slug common-features-descriptors%}#filtering).
+You can get the applied filtering criteria for each filtered field. Use the [TreeList state](slug://treelist-state) to obtain the user input, the filter operator and other filtering properties. Find out how in the [Data Operation Descriptors article](slug://common-features-descriptors#filtering).
 
 ## Customize The Filter Editors
 
diff --git a/components/treelist/filter/searchbox.md b/components/treelist/filter/searchbox.md
index 1522860077..b9bb1cb68b 100644
--- a/components/treelist/filter/searchbox.md
+++ b/components/treelist/filter/searchbox.md
@@ -10,7 +10,7 @@ position: 20
 
 # TreeList Toolbar Searchbox
 
-In addition to [TreeList filtering]({%slug treelist-filtering%}), you can also add a `SearchBox` in the [TreeList Toolbar]({%slug treelist-toolbar%}). The search box can filter in multiple TreeList columns at he same time.
+In addition to [TreeList filtering](slug://treelist-filtering), you can also add a `SearchBox` in the [TreeList Toolbar](slug://treelist-toolbar). The search box can filter in multiple TreeList columns at he same time.
 
 >caption In this Article:
 
@@ -25,7 +25,7 @@ The SearchBox lets the user type their query and the TreeList will look up all v
 
 The SearchBox is independent from the TreeList filtering. If the TreeList has applied filters, the SearchBox will respect them and add additional filtering criteria. Thus, you can also apply filtering to search results.
 
-To enable the SearchBox, add the `<TreeListSearchBox>` tag in the [`<TreeListToolBarTemplate>`]({%slug treelist-toolbar%}).
+To enable the SearchBox, add the `<TreeListSearchBox>` tag in the [`<TreeListToolBarTemplate>`](slug://treelist-toolbar).
 
 >caption TreeList SearchBox
 
@@ -74,7 +74,7 @@ To enable the SearchBox, add the `<TreeListSearchBox>` tag in the [`<TreeListToo
 
 ## Search From Code
 
-You can set or remove the search filters programmatically through the `SearchFilter` property of the [TreeList state]({%slug treelist-state%}).
+You can set or remove the search filters programmatically through the `SearchFilter` property of the [TreeList state](slug://treelist-state).
 
 >caption Set and clear the TreeList SearchBox filter programmatically
 
@@ -192,8 +192,8 @@ The `TreeListSearchBox` component offers the following parameters to customize i
 | --- | --- | --- |
 | `Class` | `string`| The custom CSS class that renders on the SearchBox wrapper (`<span class="k-searchbox">`). |
 | `DebounceDelay` | `int` <br /> (`300`) | The time in milliseconds between the user typing ends and the search starts. Filtering does not occur on every keystroke during fast typing, unless `DebounceDelay` is set to `0`. |
-| `Fields` | `List<string>` | The collection of model properties to search in. By default, the TreeList searches in all visible columns that are bound to `string` fields. You can only define a subset of those fields. It is also possible to programmatically [search in `string` fields, which are not displayed in the TreeList]({%slug grid-kb-search-in-hidden-fields%}). |
-| `Placeholder` | `string` <br /> (`"Search..."`) | The textbox placeholder that hints the user what the SearchBox does. The built-in default value is [localized]({%slug globalization-localization%}). |
+| `Fields` | `List<string>` | The collection of model properties to search in. By default, the TreeList searches in all visible columns that are bound to `string` fields. You can only define a subset of those fields. It is also possible to programmatically [search in `string` fields, which are not displayed in the TreeList](slug://grid-kb-search-in-hidden-fields). |
+| `Placeholder` | `string` <br /> (`"Search..."`) | The textbox placeholder that hints the user what the SearchBox does. The built-in default value is [localized](slug://globalization-localization). |
 | `Width` | `string` | Specifies the width of the SearchBox component. |
 
 The example below demonstrates all SearchBox settings in action, and also how to move the SearchBox on the opposite side of the TreeList toolbar.
@@ -258,8 +258,8 @@ The example below demonstrates all SearchBox settings in action, and also how to
 ## See Also
 
 * [Live Demo: TreeList SearchBox](https://demos.telerik.com/blazor-ui/treelist/searchbox)
-* [Format or Bold Search Results in the TreeList]({%slug grid-kb-search-highlight-results%})
-* [Search the TreeList in Numeric and Date Model Fields]({%slug grid-kb-search-numeric-fields%})
-* [Search the TreeList with a `StartsWith` operator]({%slug grid-kb-search-startswith%})
-* [Search the TreeList on Button Click]({%slug grid-kb-search-button-click%})
-* [Treelist Filtering Overview]({%slug treelist-filtering%})
+* [Format or Bold Search Results in the TreeList](slug://grid-kb-search-highlight-results)
+* [Search the TreeList in Numeric and Date Model Fields](slug://grid-kb-search-numeric-fields)
+* [Search the TreeList with a `StartsWith` operator](slug://grid-kb-search-startswith)
+* [Search the TreeList on Button Click](slug://grid-kb-search-button-click)
+* [Treelist Filtering Overview](slug://treelist-filtering)
diff --git a/components/treelist/overview.md b/components/treelist/overview.md
index 4189c0994f..2337e45f5d 100644
--- a/components/treelist/overview.md
+++ b/components/treelist/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor TreeList Component Overview
 
-The <a href = "https://www.telerik.com/blazor-ui/treelist" target="_blank">Blazor TreeList component</a> displays hierarchical data in a tabular format and allows [sorting]({%slug treelist-sorting%}), [filtering]({%slug treelist-filtering%}), [data editing]({%slug treelist-editing-overview%}); provides item [selection]({%slug treelist-selection-overview%}), [templates]({%slug treelist-templates-overview%}) and [load on demand]({%slug treelist-data-binding-load-on-demand%}).
+The <a href = "https://www.telerik.com/blazor-ui/treelist" target="_blank">Blazor TreeList component</a> displays hierarchical data in a tabular format and allows [sorting](slug://treelist-sorting), [filtering](slug://treelist-filtering), [data editing](slug://treelist-editing-overview); provides item [selection](slug://treelist-selection-overview), [templates](slug://treelist-templates-overview) and [load on demand](slug://treelist-data-binding-load-on-demand).
 
 
 ## Creating Blazor TreeList
@@ -82,62 +82,62 @@ The Telerik Blazor TreeList is datasource agnostic. You can use any database and
 
 The following resources provide details and examples for data binding a TreeList:
 
-* [TreeList Data Binding Overview]({%slug treelist-data-binding-overview%}) - general information on how data binding works
-* [Bind TreeList to Flat Self-Referencing Data]({%slug treelist-data-binding-flat-data%})
-* [Bind TreeList to Hierarchical Data]({%slug treelist-data-binding-hierarchical-data%}) - in this case, each data item may contain a nested item collection
-* [Load On Demand in TreeList]({%slug treelist-data-binding-load-on-demand%}) - how to load child items only when necessary
+* [TreeList Data Binding Overview](slug://treelist-data-binding-overview) - general information on how data binding works
+* [Bind TreeList to Flat Self-Referencing Data](slug://treelist-data-binding-flat-data)
+* [Bind TreeList to Hierarchical Data](slug://treelist-data-binding-hierarchical-data) - in this case, each data item may contain a nested item collection
+* [Load On Demand in TreeList](slug://treelist-data-binding-load-on-demand) - how to load child items only when necessary
 
 
 ## Data Operations
 
 The Blazor TreeList supports all fundamental data operations out-of-the-box:
 
-* [TreeList Paging]({%slug treelist-paging%})
-* [TreeList Sorting]({%slug treelist-sorting%})
-* [TreeList Filtering]({%slug treelist-filtering%})
+* [TreeList Paging](slug://treelist-paging)
+* [TreeList Sorting](slug://treelist-sorting)
+* [TreeList Filtering](slug://treelist-filtering)
 
 
 ## Editing
 
-The TreeList can perform CRUD operations on its current data. It exposes events that let you control the operations and transfer changes to the actual data source. See [TreeList CRUD Operations Overview]({%slug treelist-editing-overview%}) for more details.
+The TreeList can perform CRUD operations on its current data. It exposes events that let you control the operations and transfer changes to the actual data source. See [TreeList CRUD Operations Overview](slug://treelist-editing-overview) for more details.
 
 
 ## Column Features
 
 The Treelist columns are one of its main building blocks. They offer a rich set of functionality to enable flexibility for different application scenarios.
 
-* [Bound Columns]({%slug treelist-columns-bound%})
-* [Column display Format]({%slug treelist-columns-displayformat%}) for numeric and date values
-* [Column reordering]({%slug treelist-columns-reorder%})
-* [Column resizing]({%slug treelist-columns-resize%})
-* [Column Menu]({%slug treelist-column-menu%}) to control data operations and column visibility
-* [How column width works]({%slug treelist-columns-width%})
-* [CheckBox column]({%slug treelist-columns-checkbox%})
-* [Command column]({%slug treelist-columns-command%})
-* [Frozen (Locked) columns]({%slug treelist-columns-frozen%})
-* [UI Virtualization]({%slug treelist-columns-virtual%})
-* [Visibility]({%slug treelist-columns-visible%})
-* [Autogenerated columns]({%slug treelist-columns-automatically-generated%})
-* [Multi-column Headers]({%slug treelist-columns-multiple-column-headers%})
-* [Column events]({%slug treelist-column-events%})
+* [Bound Columns](slug://treelist-columns-bound)
+* [Column display Format](slug://treelist-columns-displayformat) for numeric and date values
+* [Column reordering](slug://treelist-columns-reorder)
+* [Column resizing](slug://treelist-columns-resize)
+* [Column Menu](slug://treelist-column-menu) to control data operations and column visibility
+* [How column width works](slug://treelist-columns-width)
+* [CheckBox column](slug://treelist-columns-checkbox)
+* [Command column](slug://treelist-columns-command)
+* [Frozen (Locked) columns](slug://treelist-columns-frozen)
+* [UI Virtualization](slug://treelist-columns-virtual)
+* [Visibility](slug://treelist-columns-visible)
+* [Autogenerated columns](slug://treelist-columns-automatically-generated)
+* [Multi-column Headers](slug://treelist-columns-multiple-column-headers)
+* [Column events](slug://treelist-column-events)
 
 
 ## Templates
 
-The various [TreeList templates]({%slug treelist-templates-overview%}) provide better control over the rendering of:
+The various [TreeList templates](slug://treelist-templates-overview) provide better control over the rendering of:
 
-* [data cells]({%slug treelist-templates-column%}) and [data rows]({%slug treelist-templates-row%})
-* [header cells]({%slug treelist-templates-column-header%})
-* [filter menus and rows]({%slug treelist-templates-filter%})
-* [data editors]({%slug treelist-templates-editor%})
-* [no data message]({%slug treelist-templates-no-data%})
+* [data cells](slug://treelist-templates-column) and [data rows](slug://treelist-templates-row)
+* [header cells](slug://treelist-templates-column-header)
+* [filter menus and rows](slug://treelist-templates-filter)
+* [data editors](slug://treelist-templates-editor)
+* [no data message](slug://treelist-templates-no-data)
 
 
 ## More TreeList Features
 
-* [Selection - single and multiple]({%slug treelist-selection-overview%}).
-* [State - get or set the TreeList configuration programmatically]({%slug treelist-state%})
-* [Toolbar - define custom TreeList actions]({%slug treelist-toolbar%})
+* [Selection - single and multiple](slug://treelist-selection-overview).
+* [State - get or set the TreeList configuration programmatically](slug://treelist-state)
+* [Toolbar - define custom TreeList actions](slug://treelist-toolbar)
 
 
 ## TreeList Parameters
@@ -148,24 +148,24 @@ The following table lists Tree List parameters, which are not related to other f
 
 | Parameter | Type and Default&nbsp;Value | Description |
 |---|---|---|
-| `Class` | `string` | The additional CSS class that will be rendered to the `div.k-treelist` element. Use it to apply custom styles or [override the theme]({%slug themes-override%}). For example, [change the TreeList font size]({%slug grid-kb-change-font-size%}). |
-| `Height` | `string` | The height value in [any supported CSS unit]({%slug common-features/dimensions%}). |
-| `Navigable` | `bool` | Whether [keyboard navigation]({%slug accessibility-overview%}#keyboard-navigation) is enabled. |
-| `Width` | `string` | The width value in [any supported CSS unit]({%slug common-features/dimensions%}). The TreeList has no default width, but expands horizontally to fill its container. |
+| `Class` | `string` | The additional CSS class that will be rendered to the `div.k-treelist` element. Use it to apply custom styles or [override the theme](slug://themes-override). For example, [change the TreeList font size](slug://grid-kb-change-font-size). |
+| `Height` | `string` | The height value in [any supported CSS unit](slug://common-features/dimensions). |
+| `Navigable` | `bool` | Whether [keyboard navigation](slug://accessibility-overview#keyboard-navigation) is enabled. |
+| `Width` | `string` | The width value in [any supported CSS unit](slug://common-features/dimensions). The TreeList has no default width, but expands horizontally to fill its container. |
 
 
 ## TreeList Reference and Methods
 
 The TreeList component has methods to to execute actions such as:
 
-* [Rebind to refresh the data]({%slug treelist-refresh-data%}#rebind-method)
-* [Automatically resize columns to fit their content]({%slug treelist-columns-resize%})
-* [Get or set the TreeList configuration state]({%slug treelist-state%})
-* [Get the dragged data item and its drop index from the destination TreeList]({%slug treelist-drag-drop-overview%})
+* [Rebind to refresh the data](slug://treelist-refresh-data#rebind-method)
+* [Automatically resize columns to fit their content](slug://treelist-columns-resize)
+* [Get or set the TreeList configuration state](slug://treelist-state)
+* [Get the dragged data item and its drop index from the destination TreeList](slug://treelist-drag-drop-overview)
 
 To execute these methods, obtain reference to the Grid instance via `@ref`. 
 
-The TreeList is a generic component.Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters]({%slug common-features-data-binding-overview%}#component-type).
+The TreeList is a generic component.Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters](slug://common-features-data-binding-overview#component-type).
 
 >caption Store the TreeList instance reference and execute methods
 
@@ -237,8 +237,8 @@ The TreeList is a generic component.Its type depends on the type of its model an
 
 # Next Steps
 
-* [Explore Tree List data binding]({%slug treelist-data-binding-overview%})
-* [Learn about Tree List columns]({%slug treelist-columns-bound%})
+* [Explore Tree List data binding](slug://treelist-data-binding-overview)
+* [Learn about Tree List columns](slug://treelist-columns-bound)
 
 
 ## See Also
diff --git a/components/treelist/paging.md b/components/treelist/paging.md
index eaa60e4382..f589c6893a 100644
--- a/components/treelist/paging.md
+++ b/components/treelist/paging.md
@@ -201,7 +201,7 @@ Dynamic page size change
 
 ## Events
 
-The TreeList exposes several relevant events. You can find related examples in the [Events]({%slug treelist-events%}) article.
+The TreeList exposes several relevant events. You can find related examples in the [Events](slug://treelist-events) article.
 
 * `PageChanged` - you can use this to react to the user changing the page.
 * `PageSizeChanged` - fires when the user changes the page size via the pager DropDownList.
diff --git a/components/treelist/refresh-data.md b/components/treelist/refresh-data.md
index 6aeabcf382..9ee1f5d414 100644
--- a/components/treelist/refresh-data.md
+++ b/components/treelist/refresh-data.md
@@ -340,6 +340,6 @@ In this article:
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui)
\ No newline at end of file
diff --git a/components/treelist/row-drag-drop.md b/components/treelist/row-drag-drop.md
index 7e7199e6b4..a0c3733cf9 100644
--- a/components/treelist/row-drag-drop.md
+++ b/components/treelist/row-drag-drop.md
@@ -589,7 +589,7 @@ public class Employee
 
 ### Drag and Drop between TreeList, Grid, TreeView and Scheduler
 
-The functionality allows dragging items between TreeList, [Grid]({%slug grid-drag-drop-overview%}), [TreeView]({%slug treeview-drag-drop-overview%}), and [Scheduler]({%slug scheduler-overview%}). To achieve it, set the `Draggable`/`RowDraggable` parameter, and implement it through an event -  `OnDrop`/`OnRowDrop`.
+The functionality allows dragging items between TreeList, [Grid](slug://grid-drag-drop-overview), [TreeView](slug://treeview-drag-drop-overview), and [Scheduler](slug://scheduler-overview). To achieve it, set the `Draggable`/`RowDraggable` parameter, and implement it through an event -  `OnDrop`/`OnRowDrop`.
 
 >important Drag and Drop from **Scheduler** to Grid, TreeList, TreeView is **not** yet supported. Only the reversed way.
 
@@ -931,11 +931,11 @@ public enum ProductSize
     }
 ````
 
-See more applicable examples in the [Grid Drag and Drop article]({%slug grid-drag-drop-overview%}).
+See more applicable examples in the [Grid Drag and Drop article](slug://grid-drag-drop-overview).
 
 ### Drag and Drop multiple Rows
 
-You can drag and drop multiple rows in one or between multiple instances of the TreeList. To enable it, you should set the [`SelectionMode`]({%slug treelist-selection-overview%}) parameter of the TelerikTreeList to `TreeListSelectionMode.Multiple`. Then, if you drag a selected row, you will effectively drag all the selected rows.
+You can drag and drop multiple rows in one or between multiple instances of the TreeList. To enable it, you should set the [`SelectionMode`](slug://treelist-selection-overview) parameter of the TelerikTreeList to `TreeListSelectionMode.Multiple`. Then, if you drag a selected row, you will effectively drag all the selected rows.
 
 When you select multiple rows, the row drag clue will be `N items selected` where `N` is the number of selected rows.
 
@@ -1155,5 +1155,5 @@ public class Employee
 ## See Also
 
 * [Live Demo: TreeList Drag and Drop](https://demos.telerik.com/blazor-ui/treelist/drag-drop)
-* [Drag and Drop between Different Parent Components]({%slug grid-kb-drag-drop-in-different-components%})
+* [Drag and Drop between Different Parent Components](slug://grid-kb-drag-drop-in-different-components)
 * [TreeList API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikTreeList-1)
diff --git a/components/treelist/selection/cells.md b/components/treelist/selection/cells.md
index 07c85be02e..54a1d9daa7 100644
--- a/components/treelist/selection/cells.md
+++ b/components/treelist/selection/cells.md
@@ -9,7 +9,7 @@ position: 5
 
 # Cell Selection
 
-The TreeList component supports [single or multiple cell selection]({%slug treelist-selection-overview%}#use-single-or-multiple-selection). You can select a cell with mouse click anywhere in the cell. You can access the collection of selected cells, use this collection and manipulate it. You can subscribe to selection events.
+The TreeList component supports [single or multiple cell selection](slug://treelist-selection-overview#use-single-or-multiple-selection). You can select a cell with mouse click anywhere in the cell. You can access the collection of selected cells, use this collection and manipulate it. You can subscribe to selection events.
 
 ## Basics
 
@@ -17,7 +17,7 @@ To select a cell, click anywhere in it.
 
 To select a range of cells in one or more columns, hold the **Shift** key, while clicking on the first and last cell of the range. To select or deselect multiple cells that don't belong to a range, hold the **Ctrl** key.
 
-You can also select a cell range by holding and dragging the mouse cursor. The dragging motion defines the diagonal of a rectangle and the TreeList will select the cells under this rectangle. To allow this kind of cell selection, set the `DragToSelect` parameter in [`TreeListSelectionSettings`]({%slug treelist-selection-overview%}#enable-row-or-cell-selection). The **Shift** and **Ctrl** modifiers are not supported in drag-to-select mode.
+You can also select a cell range by holding and dragging the mouse cursor. The dragging motion defines the diagonal of a rectangle and the TreeList will select the cells under this rectangle. To allow this kind of cell selection, set the `DragToSelect` parameter in [`TreeListSelectionSettings`](slug://treelist-selection-overview#enable-row-or-cell-selection). The **Shift** and **Ctrl** modifiers are not supported in drag-to-select mode.
 
 To enable cell selection:
 
@@ -98,7 +98,7 @@ To enable cell selection:
 
 You can respond to user selection actions through the `SelectedCellsChanged` event. The event handler receives a collection of type `IEnumerable<TreeListSelectedCellDescriptor>`. The collection may have multiple, single, or no objects in it, depending on the `SelectionMode` and the last user selection.
 
-> The `SelectedCellsChanged` event handler cannot be awaited. To execute asynchronous operations when the user selects rows, use the [`OnRowClick`]({%slug treelist-events%}#onrowclick) or [`OnRowDoubleClick`]({%slug treelist-events%}#onrowdoubleclick) event instead.
+> The `SelectedCellsChanged` event handler cannot be awaited. To execute asynchronous operations when the user selects rows, use the [`OnRowClick`](slug://treelist-events#onrowclick) or [`OnRowDoubleClick`](slug://treelist-events#onrowdoubleclick) event instead.
 
 >caption Using the TreeList SelectedCellsChanged event
 
@@ -202,9 +202,9 @@ The `TreeListSelectedCellDescriptor` type exposes the following properties:
 
 When the TreeList `Data` collection changes, the `SelectedCells` collection has the following behavior:
 
-* When the user updates a selected cell and the item instance is replaced, you have to also replace the `DataItem` object in the `SelectedCells` collection. Do that in the [TreeList `OnUpdate` event]({%slug treelist-editing-overview%}#events).
+* When the user updates a selected cell and the item instance is replaced, you have to also replace the `DataItem` object in the `SelectedCells` collection. Do that in the [TreeList `OnUpdate` event](slug://treelist-editing-overview#events).
 * When the user deletes a row with selected cells, update the `SelectedCells` collection in the the TreeList `OnDelete` event handler.
-* To select cells from a new item in the TreeList you can use the [`OnCreate` event]({%slug treelist-editing-overview%}#events) to update the `SelectedCells` collection.
+* To select cells from a new item in the TreeList you can use the [`OnCreate` event](slug://treelist-editing-overview#events) to update the `SelectedCells` collection.
 
 ### Equals Comparison
 
@@ -212,7 +212,7 @@ The items in `SelectedCells` are compared against the items in the TreeList data
 
 * The `SelectedCells` are obtained from a different data source than the all TreeList items, for example, from a separate service.
 
-In such cases, the selected cells may not appear as expected. You have to [override the `Equals` method of the TreeList model class]({%slug treelist-state%}#basics) so that the items are compared by a unique identifier rather than by reference. When you override `Equals`, it is also recommended to override the [`GetHashCode`](https://docs.microsoft.com/en-us/dotnet/api/system.object.gethashcode) method.
+In such cases, the selected cells may not appear as expected. You have to [override the `Equals` method of the TreeList model class](slug://treelist-state#basics) so that the items are compared by a unique identifier rather than by reference. When you override `Equals`, it is also recommended to override the [`GetHashCode`](https://docs.microsoft.com/en-us/dotnet/api/system.object.gethashcode) method.
 
 ## Cell Selection and Other TreeList Features
 
@@ -222,12 +222,12 @@ The selection feature behavior may vary when the TreeList configuration combines
 
 When you want to edit a TreeList item, the cell selection has the following behavior:
 
-* Cell selection is not supported with [`Incell` edit mode]({%slug treelist-editing-incell%}) due to the overlapping pointer events that trigger selection and editing. If both features are enabled, only the editing will work.
-* [`Inline` edit mode]({%slug treelist-editing-inline%}) and [`Popup` edit mode]({%slug treelist-editing-popup%}) integrate with cell selection without limitations.
+* Cell selection is not supported with [`Incell` edit mode](slug://treelist-editing-incell) due to the overlapping pointer events that trigger selection and editing. If both features are enabled, only the editing will work.
+* [`Inline` edit mode](slug://treelist-editing-inline) and [`Popup` edit mode](slug://treelist-editing-popup) integrate with cell selection without limitations.
 
 ### Selection and Virtual Scrolling
 
-When the TreeList has [virtual scrolling]({%slug treelist-virtual-scrolling%}), the component is able to select a range of cells with **Shift** only if all rows in that range are currently rendered. Consider the following scenario:
+When the TreeList has [virtual scrolling](slug://treelist-virtual-scrolling), the component is able to select a range of cells with **Shift** only if all rows in that range are currently rendered. Consider the following scenario:
 
 1. Select a cell.
 1. Scroll down, so that virtualization kicks in and the rendered rows are no longer the same.
@@ -241,10 +241,10 @@ The `SelectedCells` collection persists across paging.
 
 ### Selection and Templates
 
-When using [TreeList templates]({%slug treelist-templates-overview%}) with cell selection:
+When using [TreeList templates](slug://treelist-templates-overview) with cell selection:
 
-* If you are using a [TreeList column template]({%slug treelist-templates-column%}) and you have a clickable element in the template, wrap this element in a container with a `@onclick:stopPropagation` directive. You can check the knowledge base article on [how to prevent row selection when the user clicks another component in the Grid column template]({%slug grid-kb-row-selection-in-column-template%}). It is for the Grid component, but the concept is identical and it applies for both row and cell selection.
-* If you are using a [row template]({%slug treelist-templates-row%}) the TreeList does not support cell selection. The row template removes the built-in cell instances and the HTML markup may not even include the expected number of cells.
+* If you are using a [TreeList column template](slug://treelist-templates-column) and you have a clickable element in the template, wrap this element in a container with a `@onclick:stopPropagation` directive. You can check the knowledge base article on [how to prevent row selection when the user clicks another component in the Grid column template](slug://grid-kb-row-selection-in-column-template). It is for the Grid component, but the concept is identical and it applies for both row and cell selection.
+* If you are using a [row template](slug://treelist-templates-row) the TreeList does not support cell selection. The row template removes the built-in cell instances and the HTML markup may not even include the expected number of cells.
 
 ## See Also
 
diff --git a/components/treelist/selection/overview.md b/components/treelist/selection/overview.md
index 9cf5187526..5d615fde35 100644
--- a/components/treelist/selection/overview.md
+++ b/components/treelist/selection/overview.md
@@ -20,7 +20,7 @@ The TreeList component supports row and cell selection. When you select a row or
 
 ## Enable Row or Cell Selection
 
-You can configure the TreeList either for row or cell selection. See [Row Selection Basics]({%slug treelist-selection-row%}#basics) and [Cell Selection Basics]({%slug treelist-selection-cell%}#basics) for more details and examples.
+You can configure the TreeList either for row or cell selection. See [Row Selection Basics](slug://treelist-selection-row#basics) and [Cell Selection Basics](slug://treelist-selection-cell#basics) for more details and examples.
 
 ## Use Single or Multiple Selection
 
@@ -39,20 +39,20 @@ The TreeList exposes two parameters to get or set its selected rows and cells.
 
 Both parameters support two-way binding. You can also use the parameters to pre-select rows or cells for your users.
 
-See [Row Selection Basics]({%slug treelist-selection-row%}#basics) and [Cell Selection Basics]({%slug treelist-selection-cell%}#basics) for more details.
+See [Row Selection Basics](slug://treelist-selection-row#basics) and [Cell Selection Basics](slug://treelist-selection-cell#basics) for more details.
 
 ## Events
 
 You can respond to the user action of selecting a new item through the TreeList events:
 
-* Use the [`SelectedItemsChanged` event]({%slug treelist-selection-row%}#selecteditemschanged-event) to respond to row selection.
-* Use the [`SelectedCellsChanged` event]({%slug treelist-selection-cell%}#selectedcellschanged-event) to respond to cell selection.
+* Use the [`SelectedItemsChanged` event](slug://treelist-selection-row#selecteditemschanged-event) to respond to row selection.
+* Use the [`SelectedCellsChanged` event](slug://treelist-selection-cell#selectedcellschanged-event) to respond to cell selection.
 
 ## Integration with Other TreeList Features
 
 The selection feature behavior may differ when the TreeList configuration includes row or cell selection and other TreeList features. In these situations, certain limitations might arise, or additional adjustments may be required.
 
-See [Rows Selection and Other TreeList Features]({%slug treelist-selection-row%}#row-selection-and-other-treelist-features) and [Cells Selection and Other TreeList Features]({%slug treelist-selection-cell%}#cell-selection-and-other-treelist-features) for more details.
+See [Rows Selection and Other TreeList Features](slug://treelist-selection-row#row-selection-and-other-treelist-features) and [Cells Selection and Other TreeList Features](slug://treelist-selection-cell#cell-selection-and-other-treelist-features) for more details.
 
 ## See Also
 
diff --git a/components/treelist/selection/rows.md b/components/treelist/selection/rows.md
index f83305b8e1..3714280594 100644
--- a/components/treelist/selection/rows.md
+++ b/components/treelist/selection/rows.md
@@ -10,7 +10,7 @@ position: 3
 
 # Row Selection
 
-The TreeList component supports [single or multiple row selection]({%slug treelist-selection-overview%}#use-single-or-multiple-selection). You can select a row with mouse click and through a checkbox column. You can access the collection of selected rows, use this collection and modify it. You can subscribe to selection events.
+The TreeList component supports [single or multiple row selection](slug://treelist-selection-overview#use-single-or-multiple-selection). You can select a row with mouse click and through a checkbox column. You can access the collection of selected rows, use this collection and modify it. You can subscribe to selection events.
 
 ## Basics
 
@@ -23,10 +23,10 @@ Check the [TreeList Keyboard navigation demo](https://demos.telerik.com/blazor-u
 To enable row selection:
 
 1. Define the selection mode through one of the following options:
-    * Set the [TreeList `SelectionMode` parameter]({%slug treelist-selection-overview%}#use-single-or-multiple-selection), or
+    * Set the [TreeList `SelectionMode` parameter](slug://treelist-selection-overview#use-single-or-multiple-selection), or
     * Add a `<TreeListSelectionSettings>` tag to the `<TreeListSettings>` tag, and set the `SelectionType` parameter to `TreeListSelectionType.Row`.
 1. Set the TreeList `SelectedItems` parameter to a collection of type `IEnumerable<TItem>` where `TItem` is the TreeList model class. The collection must be initialized in advance.
-1. Optionally, add a [checkbox column]({%slug treelist-columns-checkbox%}) to the `TreeListColumns` collection of the TreeList. The `TreeListCheckboxColumn` provides [additional configuration settings related to selection]({%slug treelist-columns-checkbox%}#parameters).
+1. Optionally, add a [checkbox column](slug://treelist-columns-checkbox) to the `TreeListColumns` collection of the TreeList. The `TreeListCheckboxColumn` provides [additional configuration settings related to selection](slug://treelist-columns-checkbox#parameters).
 
 >caption TreeList multiple row selection
 
@@ -91,7 +91,7 @@ To enable row selection:
 
 You can respond to user selection actions through the `SelectedItemsChanged` event. The event handler receives a collection of the TreeList data model. The collection may have multiple, single, or no items in it, depending on the `SelectionMode` and the last user selection.
 
-> The `SelectedItemsChanged` event handler cannot be awaited. To execute asynchronous operations when the user selects rows, use the [`OnRowClick`]({%slug treelist-events%}#onrowclick) or [`OnRowDoubleClick`]({%slug treelist-events%}#onrowdoubleclick) event instead.
+> The `SelectedItemsChanged` event handler cannot be awaited. To execute asynchronous operations when the user selects rows, use the [`OnRowClick`](slug://treelist-events#onrowclick) or [`OnRowDoubleClick`](slug://treelist-events#onrowdoubleclick) event instead.
 
 >caption Using the TreeList SelectedItemsChanged event
 
@@ -171,9 +171,9 @@ You can respond to user selection actions through the `SelectedItemsChanged` eve
 
 When the TreeList `Data` collection changes, the `SelectedItems` collection has the following behavior:
 
-* When the user updates a selected item and the item instance is replaced, you have to also replace the selected item object in the `SelectedItems` collection. Do that in the [TreeList `OnUpdate` event]({%slug treelist-editing-overview%}#events).
+* When the user updates a selected item and the item instance is replaced, you have to also replace the selected item object in the `SelectedItems` collection. Do that in the [TreeList `OnUpdate` event](slug://treelist-editing-overview#events).
 * When the user deletes a selected item, the TreeList automatically deletes it from the `SelectedItems` collection and the [`SelectedItemsChanged` event](#selecteditemschanged-event) fires.
-* To select a new item in the TreeList you can use the [`OnCreate` event]({%slug treelist-editing-overview%}#events) to update the `SelectedItems` collection.
+* To select a new item in the TreeList you can use the [`OnCreate` event](slug://treelist-editing-overview#events) to update the `SelectedItems` collection.
 
 ## Equals Comparison
 
@@ -181,7 +181,7 @@ The items in `SelectedItems` are compared against the items in the TreeList data
 
 * The `SelectedItems` are obtained from a different data source than the all TreeList items, for example, from a separate service.
 
-In such cases, the selected rows may not appear as expected. You have to [override the `Equals` method of the TreeList model class]({%slug treelist-state%}#basics) so that the items are compared by a unique identifier rather than by reference. When you override `Equals`, it is also recommended to override the [`GetHashCode`](https://docs.microsoft.com/en-us/dotnet/api/system.object.gethashcode) method.
+In such cases, the selected rows may not appear as expected. You have to [override the `Equals` method of the TreeList model class](slug://treelist-state#basics) so that the items are compared by a unique identifier rather than by reference. When you override `Equals`, it is also recommended to override the [`GetHashCode`](https://docs.microsoft.com/en-us/dotnet/api/system.object.gethashcode) method.
 
 ## Row Selection and Other TreeList Features
 
@@ -191,12 +191,12 @@ The selection behavior may vary when other TreeList features are enabled, such a
 
 When users edit rows, the row selection has the following behavior:
 
-* In [`Incell` edit mode]({%slug treelist-editing-incell%}) the row selection can work only through a [checkbox column]({%slug treelist-columns-checkbox%}). This is required due to the overlapping pointer events that trigger selection and editing. To see how to select the row that is being edited in `InCell` edit mode without using a `<TreeListCheckboxColumn/>` check out the [Row Selection in Edit with InCell EditMode]({%slug grid-kb-row-select-incell-edit%}) KB article. It is for the Grid component, but the concept is the same.
-* [`Inline` edit mode]({%slug treelist-editing-inline%}) and [`Popup` edit mode]({%slug treelist-editing-popup%}) integrate with row selection without limitations.
+* In [`Incell` edit mode](slug://treelist-editing-incell) the row selection can work only through a [checkbox column](slug://treelist-columns-checkbox). This is required due to the overlapping pointer events that trigger selection and editing. To see how to select the row that is being edited in `InCell` edit mode without using a `<TreeListCheckboxColumn/>` check out the [Row Selection in Edit with InCell EditMode](slug://grid-kb-row-select-incell-edit) KB article. It is for the Grid component, but the concept is the same.
+* [`Inline` edit mode](slug://treelist-editing-inline) and [`Popup` edit mode](slug://treelist-editing-popup) integrate with row selection without limitations.
 
 ### Selection and Virtual Scrolling
 
-When the TreeList has [virtual scrolling]({%slug treelist-virtual-scrolling%}), the component is able to select a range of rows with **Shift** only if all rows in that range are currently rendered. Consider the following scenario:
+When the TreeList has [virtual scrolling](slug://treelist-virtual-scrolling), the component is able to select a range of rows with **Shift** only if all rows in that range are currently rendered. Consider the following scenario:
 
 1. Select a row.
 1. Scroll down, so that virtualization kicks in and the rendered rows are no longer the same.
@@ -210,10 +210,10 @@ The `SelectedItems` collection persists across paging.
 
 ### Selection and Templates
 
-When using [TreeList templates]({%slug treelist-templates-overview%}) with row selection:
+When using [TreeList templates](slug://treelist-templates-overview) with row selection:
 
-* If you are using a [TreeList column template]({%slug treelist-templates-column%}) and you have a clickable element in the template, you can check the knowledge base article on [how to prevent row selection when the user clicks another component in the Grid column template]({%slug grid-kb-row-selection-in-column-template%}). It is for the Grid component, but the concept is identical.
-* If you are using a [row template]({%slug treelist-templates-row%}) the TreeList cannot render a built-in [checkbox column]({%slug treelist-columns-checkbox%}). You have to render checkboxes manually and handle their changed event to populate the `SelectedItems` collection of the TreeList. You can find an example to get started in the following thread: [Grid Row Template with Selection - Unsure how to Bind to Selected Item](https://feedback.telerik.com/blazor/1463819-grid-row-template-with-selection-unsure-how-to-bind-to-selected-item). It is for the Grid component, but the concept is identical.
+* If you are using a [TreeList column template](slug://treelist-templates-column) and you have a clickable element in the template, you can check the knowledge base article on [how to prevent row selection when the user clicks another component in the Grid column template](slug://grid-kb-row-selection-in-column-template). It is for the Grid component, but the concept is identical.
+* If you are using a [row template](slug://treelist-templates-row) the TreeList cannot render a built-in [checkbox column](slug://treelist-columns-checkbox). You have to render checkboxes manually and handle their changed event to populate the `SelectedItems` collection of the TreeList. You can find an example to get started in the following thread: [Grid Row Template with Selection - Unsure how to Bind to Selected Item](https://feedback.telerik.com/blazor/1463819-grid-row-template-with-selection-unsure-how-to-bind-to-selected-item). It is for the Grid component, but the concept is identical.
 
 ### Selection and Row Drag and Drop
 
diff --git a/components/treelist/sorting.md b/components/treelist/sorting.md
index ef98de0f61..2057a10937 100644
--- a/components/treelist/sorting.md
+++ b/components/treelist/sorting.md
@@ -24,7 +24,7 @@ Sorting keeps the expanded/collapsed state of items. For example, if filtering b
 
 You can let the user sort by more than one field by setting the `SortMode` parameter to `Telerik.Blazor.SortMode.Multiple`.
 
-The sorting criteria are stored in a [collection of `SortDescriptor`]({%slug common-features-descriptors%}#sorting).
+The sorting criteria are stored in a [collection of `SortDescriptor`](slug://common-features-descriptors#sorting).
 
 >caption Enable Sorting in Telerik TreeList
 
@@ -100,7 +100,7 @@ Click a column header to sort by its data
 
 ![Blazor TreeList Basic Sorting](images/basic-sorting.png)
 
-You can sort the TreeList from your own code through its [state]({%slug treelist-state%}).
+You can sort the TreeList from your own code through its [state](slug://treelist-state).
 
 @[template](/_contentTemplates/treelist/state.md#initial-state)
 
diff --git a/components/treelist/state.md b/components/treelist/state.md
index 67d2a68d07..9810867e29 100644
--- a/components/treelist/state.md
+++ b/components/treelist/state.md
@@ -68,7 +68,7 @@ If you want to put the TreeList in a certain configuration without preserving th
 
 To reset the TreeList state, call `SetStateAsync(null)`.
 
-You should avoid calling `SetStateAsync` in the treelist [CRUD methods]({%slug treelist-editing-overview%}). Doing so may lead to unexpected results because the grid has more logic to execute after the event.
+You should avoid calling `SetStateAsync` in the treelist [CRUD methods](slug://treelist-editing-overview). Doing so may lead to unexpected results because the grid has more logic to execute after the event.
 
 ## Information in the TreeList State
 
@@ -110,9 +110,9 @@ You can find the following examples in this section:
 
 The following example shows one way you can store the TreeList state - through a custom service that calls the browser's LocalStorage. You can use your own database here, or a file, or Microsoft's ProtectedBrowserStorage package, or any other storage you prefer. This is just an example you can use as base and modify to suit your project.
   
->note If you use [Hierarchical data]({%slug treelist-data-binding-hierarchical-data%}) for the TreeList you need to serialize the current item only and not the entire collection of child items in order not to exceed the size of the LocalStorage.
+>note If you use [Hierarchical data](slug://treelist-data-binding-hierarchical-data) for the TreeList you need to serialize the current item only and not the entire collection of child items in order not to exceed the size of the LocalStorage.
 
->note We support the `System.Text.Json` serialization that is built-in in Blazor. Be aware of its [limitation to not serialize `Type` properties]({%slug kb-grid-json-serializer-null-membertype%}).
+>note We support the `System.Text.Json` serialization that is built-in in Blazor. Be aware of its [limitation to not serialize `Type` properties](slug://kb-grid-json-serializer-null-membertype).
 
 >caption Save, Load, Reset TreeList state on every state change. Uses a sample LocalStorage in the browser.
 
@@ -537,7 +537,7 @@ Sometimes you may want to know what the user changed in the TreeList (e.g., when
 
 The example below shows how to achieve it by using the`OnStateChanged` event.
 
-Find out how to [get the applied filtering and sorting criteria]({%slug common-features-descriptors%}).
+Find out how to [get the applied filtering and sorting criteria](slug://common-features-descriptors).
 
 >caption Know when the TreeList state changes, which parameter changed and amend the change
 
@@ -710,7 +710,7 @@ Find out how to [get the applied filtering and sorting criteria]({%slug common-f
 
 The TreeList state lets you store the item that the user is currently working on - both an existing model that is being edited, and a new item the user is inserting. This happens automatically when you save the TreeList state. If you want to save on every keystroke instead of on `OnChange` - use a custom editor template and update the `EditItem` or `InsertedItem` of the state object as required, then save the state into your service.
 
-In addition to that, you can also use the `EditItem`, `OriginalEditItem`, `InsertItem` and `ParentItem` fields of the state object to put the TreeList in edit/insert mode through your own application code, instead of needing the user to initiate this through a [command button]({%slug treelist-columns-command%}).
+In addition to that, you can also use the `EditItem`, `OriginalEditItem`, `InsertItem` and `ParentItem` fields of the state object to put the TreeList in edit/insert mode through your own application code, instead of needing the user to initiate this through a [command button](slug://treelist-columns-command).
 
 >caption Put and item in Edit mode or start Inserting a new item
 
diff --git a/components/treelist/templates/column-chooser.md b/components/treelist/templates/column-chooser.md
index 46b6f2bc19..6b4034a329 100644
--- a/components/treelist/templates/column-chooser.md
+++ b/components/treelist/templates/column-chooser.md
@@ -10,7 +10,7 @@ position: 40
 
 # Column Chooser Template
 
-The Column Chooser Template lets you control the rendering of the [ColumnChooser]({%slug treelist-column-menu%}#column-chooser). It exposes a [`context`](/blazor-ui/api/Telerik.Blazor.Components.ColumnMenuChooserTemplateContext) object that contains a list of all columns in the TreeList. 
+The Column Chooser Template lets you control the rendering of the [ColumnChooser](slug://treelist-column-menu#column-chooser). It exposes a [`context`](/blazor-ui/api/Telerik.Blazor.Components.ColumnMenuChooserTemplateContext) object that contains a list of all columns in the TreeList. 
 
 When you set up the Column Chooser Template, the list of columns that are rendered by default will not be present.
 
@@ -127,4 +127,4 @@ When you set up the Column Chooser Template, the list of columns that are render
  * [Live Demo: TreeList Templates](https://demos.telerik.com/blazor-ui/treelist/templates)
  * [Live Demo: TreeList Column Menu](https://demos.telerik.com/blazor-ui/treelist/column-menu)
  * [Live Demo: TreeList Custom Column Menu](https://demos.telerik.com/blazor-ui/treelist/custom-column-menu)
- * [Columns Menu]({%slug treelist-column-menu%})
+ * [Columns Menu](slug://treelist-column-menu)
diff --git a/components/treelist/templates/column.md b/components/treelist/templates/column.md
index 98fe6d2f3b..1358f0d6ef 100644
--- a/components/treelist/templates/column.md
+++ b/components/treelist/templates/column.md
@@ -14,7 +14,7 @@ By default, the TreeList renders the value of the field in the column, as it is
 
 Using a template will keep the `Expandable="true"` feature in a column - the expand/collapse arrows that the treelist renders for you. Your template will render after the arrow.
 
->tip If you only want to format numbers, dates, enums, you can do so with the [DisplayFormat feature]({%slug treelist-columns-displayformat%}) without the need to declare a template.
+>tip If you only want to format numbers, dates, enums, you can do so with the [DisplayFormat feature](slug://treelist-columns-displayformat) without the need to declare a template.
 
 The example below shows how to:
 
diff --git a/components/treelist/templates/editor.md b/components/treelist/templates/editor.md
index ade00bf779..3f08c4a4ab 100644
--- a/components/treelist/templates/editor.md
+++ b/components/treelist/templates/editor.md
@@ -10,13 +10,13 @@ position: 15
 
 # Edit Template
 
-The column's `EditTemplate` defines the inline template or component that will be rendered when the user is [editing]({%slug treelist-overview%}#editing) the field. It is also used when inserting a new item.
+The column's `EditTemplate` defines the inline template or component that will be rendered when the user is [editing](slug://treelist-overview#editing) the field. It is also used when inserting a new item.
 
 You can data bind components in it to the current context, which is an instance of the model the treelist is bound to. You will need a global variable that is also an instance of the model to store those changes. The model the template receives is a copy of the original model, so that changes can be canceled (the `Cancel` command).
 
 If you need to perform logic more complex than simple data binding, use the change event of the custom editor component to perform it. You can also consider using a custom edit form outside of the treelist.
 
-The TreeList row creates an `EditContext` and passes it to the `EditorTemplate`. You can read more about it in the [Notes section of the Editing Overview]({%slug gantt-tree-editing%}#notes) article).
+The TreeList row creates an `EditContext` and passes it to the `EditorTemplate`. You can read more about it in the [Notes section of the Editing Overview](slug://gantt-tree-editing#notes) article).
 
 @[template](/_contentTemplates/common/inputs.md#edit-debouncedelay)
 
@@ -218,7 +218,7 @@ The TreeList row creates an `EditContext` and passes it to the `EditorTemplate`.
 
 ## See Also
 
- * [TreeList Editing]({%slug treelist-editing-overview%})
+ * [TreeList Editing](slug://treelist-editing-overview)
  * [Live Demo: TreeList Templates](https://demos.telerik.com/blazor-ui/treelist/templates)
  * [Live Demo: TreeList Custom Editor Template](https://demos.telerik.com/blazor-ui/treelist/custom-editor)
 
diff --git a/components/treelist/templates/filter.md b/components/treelist/templates/filter.md
index dcd4d9a67e..b51abdf9f6 100644
--- a/components/treelist/templates/filter.md
+++ b/components/treelist/templates/filter.md
@@ -13,7 +13,7 @@ position: 35
 
 The Filter Template lets you customize the appearance and logic of the built-in filters. It lets you step on the built-in filtering logic of the treelist and implement your own design and logic for setting their values.
 
-There are two different templates you can use depending on the [Filter Mode]({%slug treelist-filtering%}) that you chose:
+There are two different templates you can use depending on the [Filter Mode](slug://treelist-filtering) that you chose:
 
 * [Filter Row Template](#filter-row-template)
 * [Filter Menu Template](#filter-menu-template)
@@ -25,7 +25,7 @@ By default, the filter row puts an appropriate editor (like a numeric textbox fo
 
 To customize the filter cell, use the `<FilterCellTemplate>` tag of the `<TreeListColumn>`. It receives a `context` of type `FilterCellTemplateContext` that provides the following members:
 
-* `FilterDescriptor` - a [CompositeFilterDescriptor](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor) object that describes the column filter. By default, its `FilterDescriptors` field contains two `FilterDescriptor` instances and its `LogicalOperator` is `AND`. You can populate the filter values in the existing `FilterDescriptors` and add more instances. You can change their [filter operator]({%slug common-features-filter-operators%}) and the `LogicalOperator` of the `CompositeFilterDescriptor`.
+* `FilterDescriptor` - a [CompositeFilterDescriptor](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor) object that describes the column filter. By default, its `FilterDescriptors` field contains two `FilterDescriptor` instances and its `LogicalOperator` is `AND`. You can populate the filter values in the existing `FilterDescriptors` and add more instances. You can change their [filter operator](slug://common-features-filter-operators) and the `LogicalOperator` of the `CompositeFilterDescriptor`.
 
 * `FilterAsync()` - an `async` method that invokes the built-in treelist filtering logic so you can call upon it easily from your template (e.g., when a value changes or a button is clicked).
 
@@ -206,7 +206,7 @@ The example below shows a custom filter that:
 
 >caption Custom Filter Menu Template - Multiple Checkboxes
 
->tip The treelist can create a checkbox filter for you, see the [CheckBoxList Filtering]({%slug treelist-checklist-filter%}) article.
+>tip The treelist can create a checkbox filter for you, see the [CheckBoxList Filtering](slug://treelist-checklist-filter) article.
 
 ````RAZOR
 @using Telerik.DataSource
diff --git a/components/treelist/templates/overview.md b/components/treelist/templates/overview.md
index 12086a552b..5ca8ea25a4 100644
--- a/components/treelist/templates/overview.md
+++ b/components/treelist/templates/overview.md
@@ -14,19 +14,19 @@ You can customize the TreeList appearance and behavior through the various templ
 
 The TreeList component can use templates for: 
 
-* [columns (cells)]({%slug treelist-templates-column%}) - the rendering of each cell (column). You can, for example, change string formats or add your own components.
+* [columns (cells)](slug://treelist-templates-column) - the rendering of each cell (column). You can, for example, change string formats or add your own components.
 
-* [editing of a cell]({%slug treelist-templates-editor%}) - when a cell is in edit mode, it will render this template where you can use custom editors, components and logic.
+* [editing of a cell](slug://treelist-templates-editor) - when a cell is in edit mode, it will render this template where you can use custom editors, components and logic.
 
-* [rows]({%slug treelist-templates-row%}) - the entire rendering of the `tr` element of the row, so you can fully customize the treelist behavior and rendering.
+* [rows](slug://treelist-templates-row) - the entire rendering of the `tr` element of the row, so you can fully customize the treelist behavior and rendering.
 
-* [column header]({%slug treelist-templates-column-header%}) - the title portion of the column.
+* [column header](slug://treelist-templates-column-header) - the title portion of the column.
 
-* [filter]({%slug treelist-templates-filter%}) - the content of the filter cell or filter menu where you can implement custom rendering and logic for the filters.
+* [filter](slug://treelist-templates-filter) - the content of the filter cell or filter menu where you can implement custom rendering and logic for the filters.
 
-* [no data available]({%slug treelist-templates-no-data%}) - when the TreeList Data collection is empty or null, you can customize the content inside.
+* [no data available](slug://treelist-templates-no-data) - when the TreeList Data collection is empty or null, you can customize the content inside.
 
-* [pager]({%slug treelist-templates-pager%}) - the template modifies the layout, content, and functionality of the Pager.
+* [pager](slug://treelist-templates-pager) - the template modifies the layout, content, and functionality of the Pager.
 
 Like other Blazor content, most of them can receive a `context` argument that is the type of the model. To use templates, you must bind the treelist to a named model. The filter and header templates are the exception as they are not related to rows and models.
 
diff --git a/components/treelist/templates/pager.md b/components/treelist/templates/pager.md
index dadfe6ff79..50b2d928a0 100644
--- a/components/treelist/templates/pager.md
+++ b/components/treelist/templates/pager.md
@@ -11,7 +11,7 @@ position: 40
 
 # Pager Template
 
-The `TreeListPagerTemplate` allows you to modify the layout, content, and functionality of the Pager. To paginate the data, you can use any set of Blazor components and DOM elements instead of the default TreeList [Pager]({%slug pager-overview%}).
+The `TreeListPagerTemplate` allows you to modify the layout, content, and functionality of the Pager. To paginate the data, you can use any set of Blazor components and DOM elements instead of the default TreeList [Pager](slug://pager-overview).
 
 
 >caption Using the Telerik UI for Blazor Slider to paginate the TreeList data
diff --git a/components/treelist/templates/popup-buttons-template.md b/components/treelist/templates/popup-buttons-template.md
index f2b55b7293..944e9e28aa 100644
--- a/components/treelist/templates/popup-buttons-template.md
+++ b/components/treelist/templates/popup-buttons-template.md
@@ -13,7 +13,7 @@ position: 50
 
 With the `ButtonsTemplate`, you can personalize the appearance and behavior of the buttons in the create/edit Popup window of the TreeList component.
 
->If a [FormTemplate]({%slug treelist-templates-popup-form%}) is declared, the `ButtonsTemplate` will be ignored.
+>If a [FormTemplate](slug://treelist-templates-popup-form) is declared, the `ButtonsTemplate` will be ignored.
 
 >caption Modifying the buttons in the create/edit Popup by using a `ButtonsTemplate`.
 ````RAZOR
diff --git a/components/treelist/templates/popup-form-template.md b/components/treelist/templates/popup-form-template.md
index 1b4af0f2de..631161cf66 100644
--- a/components/treelist/templates/popup-form-template.md
+++ b/components/treelist/templates/popup-form-template.md
@@ -15,7 +15,7 @@ With the `FormTemplate` feature, you can customize the appearance and content of
 
 You can use the `Context` attribute of the `<FormTemplate>` tag to set the name of the context variable. The context variable is of type `object` and can be cast to the model type to which the TreeList is bound.
     
->When using the template, the default Popup form is replaced by the declared content within the `FormTemplate` tag. Consequently, the default `Update` and `Cancel` buttons are removed. This means the [`OnUpdate` and `OnCancel`]({%slug treelist-editing-overview%}#events) events cannot be triggered. To modify or cancel the update of a record, you need to include custom controls to manage these actions.
+>When using the template, the default Popup form is replaced by the declared content within the `FormTemplate` tag. Consequently, the default `Update` and `Cancel` buttons are removed. This means the [`OnUpdate` and `OnCancel`](slug://treelist-editing-overview#events) events cannot be triggered. To modify or cancel the update of a record, you need to include custom controls to manage these actions.
 
 >caption Using a `FormTemplate` to modify the Edit/Create Popup window.
 ````RAZOR
@@ -242,6 +242,6 @@ You can use the `Context` attribute of the `<FormTemplate>` tag to set the name
 
 ## See Also
 
- * [TreeList Popup Buttons Template]({%slug treelist-templates-popup-buttons%})
+ * [TreeList Popup Buttons Template](slug://treelist-templates-popup-buttons)
  * [Live Demo: TreeList Templates](https://demos.telerik.com/blazor-ui/TreeList/templates)
  * [Live Demo: TreeList Popup Edit Form Template](https://demos.telerik.com/blazor-ui/treelist/popup-edit-form-template)
\ No newline at end of file
diff --git a/components/treelist/toolbar.md b/components/treelist/toolbar.md
index 28dfb50bb7..e9f8930362 100644
--- a/components/treelist/toolbar.md
+++ b/components/treelist/toolbar.md
@@ -12,7 +12,7 @@ position: 45
 
 The treelist provides a toolbar where you can add a variety of actions that are not tied to a concrete row.
 
-To use a toolbar, define the `TreeListToolBarTemplate` tag of the treelist. In it, you can use arbitrary HTML and components to get the desired layout, and also `TreeListCommandButton` instances in (you can read more about the features available in those buttons in the [Command Column]({%slug treelist-columns-command%}) article).
+To use a toolbar, define the `TreeListToolBarTemplate` tag of the treelist. In it, you can use arbitrary HTML and components to get the desired layout, and also `TreeListCommandButton` instances in (you can read more about the features available in those buttons in the [Command Column](slug://treelist-columns-command) article).
 
 >note The toolbar is not associated with an item from the data source. The `Item` and `ParentItem` fields on the click event handler argument of a `TreeListCommandButton` will always be `null`, and the `Edit`, `Update`, `Cancel` commands do not work with it.
 
@@ -29,7 +29,7 @@ The treelist offers built-in commands that you can invoke through its toolbar. T
 
 * `Add` - starts inserting a new item in the treelist.
 
-For an example of using the toolbar to insert a new item, see the [TreeList Editing Overview]({%slug treelist-editing-overview%}) article.
+For an example of using the toolbar to insert a new item, see the [TreeList Editing Overview](slug://treelist-editing-overview) article.
 
 ## Custom Commands
 
diff --git a/components/treeview/accessibility/overview.md b/components/treeview/accessibility/overview.md
index 42295f0b96..50f3fe6056 100644
--- a/components/treeview/accessibility/overview.md
+++ b/components/treeview/accessibility/overview.md
@@ -15,9 +15,9 @@ The UI for Blazor TreeView component is [WCAG 2.2 AA](https://www.w3.org/TR/WCAG
 
 WCAG 2.2 introduces the ["Dragging Movements"](https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements) criterion as an important part of the Operable principle. Its primary goal is to guarantee that any feature reliant on drag actions offers an alternative method that can be executed with a single click, enhancing user accessibility.
 
-In our illustrative example below, we've showcased the item reordering actions, achievable through our [Context Menu]({%slug contextmenu-integration%}#context-menu-for-a-treeview-node). Our goal is to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
+In our illustrative example below, we've showcased the item reordering actions, achievable through our [Context Menu](slug://contextmenu-integration#context-menu-for-a-treeview-node). Our goal is to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
 
-The following example demonstrates the [accessibility compliance of the TreeView component]({%slug treeview-wai-aria-support%}). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch]({%slug accessibility-overview%}#color-contrast).
+The following example demonstrates the [accessibility compliance of the TreeView component](slug://treeview-wai-aria-support). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch](slug://accessibility-overview#color-contrast).
 
 >caption TreeView accessibility compliance example
 
diff --git a/components/treeview/accessibility/wai-aria-support.md b/components/treeview/accessibility/wai-aria-support.md
index b2b6928fd2..7b1d8e57d1 100644
--- a/components/treeview/accessibility/wai-aria-support.md
+++ b/components/treeview/accessibility/wai-aria-support.md
@@ -77,4 +77,4 @@ For details on how the TreeView keyboard navigation works, refer to the [Blazor
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/treeview/checkboxes/multiple.md b/components/treeview/checkboxes/multiple.md
index 321a7bccdc..ea95a54e1c 100644
--- a/components/treeview/checkboxes/multiple.md
+++ b/components/treeview/checkboxes/multiple.md
@@ -36,7 +36,7 @@ This section contains the following examples:
 
 ### Multiple selection using one-way data binding
 
-You can use one-way binding to provide an initial node selection, and respond to the [`CheckedItemsChanged`]({%slug treeview-events%}#checkeditemschanged) event to update the view-model when user selection occurs. If you don't update the model, selection is effectively canceled.
+You can use one-way binding to provide an initial node selection, and respond to the [`CheckedItemsChanged`](slug://treeview-events#checkeditemschanged) event to update the view-model when user selection occurs. If you don't update the model, selection is effectively canceled.
 
 
 ````RAZOR
@@ -407,5 +407,5 @@ You can bind the treeview to different models at each level, and the selection a
 
 ## See Also
 
-  * [Checkboxes Overview]({%slug treeview-checkboxes-overview%})
-  * [Single Node]({%slug treeview-checkboxes-single%})
+  * [Checkboxes Overview](slug://treeview-checkboxes-overview)
+  * [Single Node](slug://treeview-checkboxes-single)
diff --git a/components/treeview/checkboxes/overview.md b/components/treeview/checkboxes/overview.md
index 9a089b4846..88b2e37d81 100644
--- a/components/treeview/checkboxes/overview.md
+++ b/components/treeview/checkboxes/overview.md
@@ -10,7 +10,7 @@ position: 1
 
 # TreeView Checkbox Selection
 
-The Checkbox Selection of nodes is an alternative to the [standard selection]({%slug treeview-selection-overview%}). It provides a different UX by not adding the background highlight color on the selected node. Instead, a checkbox is rendered to the left of each item in the TreeView and the user utilizes them to select the desired nodes. 
+The Checkbox Selection of nodes is an alternative to the [standard selection](slug://treeview-selection-overview). It provides a different UX by not adding the background highlight color on the selected node. Instead, a checkbox is rendered to the left of each item in the TreeView and the user utilizes them to select the desired nodes. 
 
 The TreeView lets the user select one or more nodes by using checkboxes. You can also pre-select them with your own code.
 
@@ -29,13 +29,13 @@ To enable the selection of nodes with checkboxes set the `CheckBoxMode` paramete
 
 * `None` - disable the node selection. This is the default setting.
 
-* [`Single`]({%slug treeview-checkboxes-single%}) - only one node can be checked at a time.
+* [`Single`](slug://treeview-checkboxes-single) - only one node can be checked at a time.
 
-* [`Multiple`]({%slug treeview-checkboxes-multiple%}) - many nodes can be checked simultaneously.
+* [`Multiple`](slug://treeview-checkboxes-multiple) - many nodes can be checked simultaneously.
 
 ## CheckedItems
 
-You get or set the checked nodes through the `CheckedItems` parameter of the treeview. It takes an `IEnumerable<object>` collection that you need to cast to the actual model type. This is required because you can [bind the treeview]({%slug components/treeview/data-binding/overview%}) to different model types at each level. The selection allows two-way binding (`@bind-CheckedItems`) and one-way binding + [`CheckedItemsChanged`]({%slug treeview-events%}#checkeditemschanged) event.
+You get or set the checked nodes through the `CheckedItems` parameter of the treeview. It takes an `IEnumerable<object>` collection that you need to cast to the actual model type. This is required because you can [bind the treeview](slug://components/treeview/data-binding/overview) to different model types at each level. The selection allows two-way binding (`@bind-CheckedItems`) and one-way binding + [`CheckedItemsChanged`](slug://treeview-events#checkeditemschanged) event.
 
 >caption Enable node selection with checkboxes
 
@@ -827,5 +827,5 @@ You can combine both selection and checking nodes. To keep both collections in s
 ## See Also
 
   * [Live Demo: TreeView CheckBoxes](https://demos.telerik.com/blazor-ui/treeview/checkboxes)
-  * [Single Node]({%slug treeview-checkboxes-single%})
-  * [Multiple Nodes]({%slug treeview-checkboxes-multiple%})
+  * [Single Node](slug://treeview-checkboxes-single)
+  * [Multiple Nodes](slug://treeview-checkboxes-multiple)
diff --git a/components/treeview/checkboxes/single.md b/components/treeview/checkboxes/single.md
index 6958d0632a..1cac30fb08 100644
--- a/components/treeview/checkboxes/single.md
+++ b/components/treeview/checkboxes/single.md
@@ -285,5 +285,5 @@ You can use two-way binding to get the node the user has checked. This can be us
 
 ## See Also
 
-  * [Selection Overview]({%slug treeview-checkboxes-overview%})
-  * [Multiple Selection]({%slug treeview-checkboxes-multiple%})
+  * [Selection Overview](slug://treeview-checkboxes-overview)
+  * [Multiple Selection](slug://treeview-checkboxes-multiple)
diff --git a/components/treeview/data-binding/flat-data.md b/components/treeview/data-binding/flat-data.md
index 6d9123e797..e1242d3f8e 100644
--- a/components/treeview/data-binding/flat-data.md
+++ b/components/treeview/data-binding/flat-data.md
@@ -117,7 +117,7 @@ Using self-referencing flat data
 
 ## See Also
 
-  * [TreeView Data Binding Basics]({%slug components/treeview/data-binding/overview%})
+  * [TreeView Data Binding Basics](slug://components/treeview/data-binding/overview)
   * [Live Demo: TreeView Flat Data](https://demos.telerik.com/blazor-ui/treeview/flat-data)
-  * [Binding to Hierarchical Data]({%slug components/treeview/data-binding/hierarchical-data%})
-  * [Load on Demand]({%slug components/treeview/data-binding/load-on-demand%})
+  * [Binding to Hierarchical Data](slug://components/treeview/data-binding/hierarchical-data)
+  * [Load on Demand](slug://components/treeview/data-binding/load-on-demand)
diff --git a/components/treeview/data-binding/hierarchical-data.md b/components/treeview/data-binding/hierarchical-data.md
index c92f957cb3..2a95c137f2 100644
--- a/components/treeview/data-binding/hierarchical-data.md
+++ b/components/treeview/data-binding/hierarchical-data.md
@@ -180,7 +180,7 @@ Experiment with the `TreeLevels`, `RootItems` and `ItemsPerLevel` values below.
 
 ## See Also
 
-  * [TreeView Data Binding Basics]({%slug components/treeview/data-binding/overview%})
+  * [TreeView Data Binding Basics](slug://components/treeview/data-binding/overview)
   * [Live Demo: TreeView Hierarchical Data](https://demos.telerik.com/blazor-ui/treeview/hierarchical-data)
-  * [Binding to Flat Data]({%slug components/treeview/data-binding/flat-data%})
-  * [Load on Demand]({%slug components/treeview/data-binding/load-on-demand%})
+  * [Binding to Flat Data](slug://components/treeview/data-binding/flat-data)
+  * [Load on Demand](slug://components/treeview/data-binding/load-on-demand)
diff --git a/components/treeview/data-binding/load-on-demand.md b/components/treeview/data-binding/load-on-demand.md
index 07857d6126..0fd270ca9e 100644
--- a/components/treeview/data-binding/load-on-demand.md
+++ b/components/treeview/data-binding/load-on-demand.md
@@ -14,7 +14,7 @@ This article explains how to load nodes on demand the TreeView for Blazor.
 @[template](/_contentTemplates/treeview/basic-example.md#data-binding-basics-link)
 
 
-You don't have to provide all the data the treeview will render at once - the root nodes are sufficient for an initial display. You can then use the `OnExpand` event of the treeview to provide [flat]({%slug components/treeview/data-binding/flat-data%}) or [hierarchical]({%slug components/treeview/data-binding/hierarchical-data%}) data to the node that was just expanded. Loading nodes on demand can improve the performance of your application by requesting less data at any given time.
+You don't have to provide all the data the treeview will render at once - the root nodes are sufficient for an initial display. You can then use the `OnExpand` event of the treeview to provide [flat](slug://components/treeview/data-binding/flat-data) or [hierarchical](slug://components/treeview/data-binding/hierarchical-data) data to the node that was just expanded. Loading nodes on demand can improve the performance of your application by requesting less data at any given time.
 
 In this article:
 
@@ -26,7 +26,7 @@ In this article:
 
 ## Hierarchical Data Load on Demand - One Model
 
-The **example** below shows how you can handle hierarchical data load on demand in detail. It uses the same model for the two different [levels of data bindings]({%slug components/treeview/data-binding/overview%}#multiple-level-bindings) it showcases.
+The **example** below shows how you can handle hierarchical data load on demand in detail. It uses the same model for the two different [levels of data bindings](slug://components/treeview/data-binding/overview#multiple-level-bindings) it showcases.
 
 >caption One Model Hierarchical Data Load on Demand in a TreeView with sample handling of the various cases. Review the code comments for details.
 
@@ -234,7 +234,7 @@ The **example** below shows how you can handle flat data load on demand in detai
 
 ## Hierarchical Data Load on Demand - Different Models
 
-The **example** below shows how you can handle hierarchical data load on demand in detail. It uses two different models for the two different [levels of data bindings]({%slug components/treeview/data-binding/overview%}#multiple-level-bindings) it showcases. You do not have to use different models and/or different bindings ( see [Hierarchical Data Load on Demand - One Model](#hierarchical-data-load-on-demand-one-model) ).
+The **example** below shows how you can handle hierarchical data load on demand in detail. It uses two different models for the two different [levels of data bindings](slug://components/treeview/data-binding/overview#multiple-level-bindings) it showcases. You do not have to use different models and/or different bindings ( see [Hierarchical Data Load on Demand - One Model](#hierarchical-data-load-on-demand-one-model) ).
 
 >caption Different Models Hierarchical Data Load on Demand in a TreeView with sample handling of the various cases. Review the code comments for details.
 
@@ -339,7 +339,7 @@ The **example** below shows how you can handle hierarchical data load on demand
 
 ## See Also
 
-  * [TreeView Data Binding Basics]({%slug components/treeview/data-binding/overview%})
+  * [TreeView Data Binding Basics](slug://components/treeview/data-binding/overview)
   * [Live Demo: TreeView Load on Demand](https://demos.telerik.com/blazor-ui/treeview/lazy-loading)
-  * [Binding to Flat Data]({%slug components/treeview/data-binding/flat-data%})
-  * [Binding to Hierarchical Data]({%slug components/treeview/data-binding/hierarchical-data%})
+  * [Binding to Flat Data](slug://components/treeview/data-binding/flat-data)
+  * [Binding to Hierarchical Data](slug://components/treeview/data-binding/hierarchical-data)
diff --git a/components/treeview/data-binding/overview.md b/components/treeview/data-binding/overview.md
index 4f6a436779..c9f82e3f22 100644
--- a/components/treeview/data-binding/overview.md
+++ b/components/treeview/data-binding/overview.md
@@ -18,7 +18,7 @@ This article explains how to relate TreeView item features to properties of the
 
 ## Item Features
 
-The TreeView items have features that map to properties in the model. The following model uses property names that will [work automatically, with no additional TreeView configuration]({%slug treeview-overview%}#creating-blazor-treeview):
+The TreeView items have features that map to properties in the model. The following model uses property names that will [work automatically, with no additional TreeView configuration](slug://treeview-overview#creating-blazor-treeview):
 
 <div class="skip-repl"></div>
 
@@ -52,15 +52,15 @@ The above model properties have the following meaning for the TreeView:
 
 | Property | Description |
 | --- | --- |
-| `Id` | A unique identifier. Required for [binding to **flat data**]({%slug components/treeview/data-binding/flat-data%}). |
-| `Text` | Sets the item content as plain text. For rich content and nested components, use an [item template]({%slug components/treeview/templates%}) |
+| `Id` | A unique identifier. Required for [binding to **flat data**](slug://components/treeview/data-binding/flat-data). |
+| `Text` | Sets the item content as plain text. For rich content and nested components, use an [item template](slug://components/treeview/templates) |
 | **Item relations** | |
-| `HasChildren` | Determines whether the item has children, no matter if they are loaded or not. Required for binding to **flat data** and for [**load on demand**]({%slug components/treeview/data-binding/load-on-demand%}). If `true`, the item will show an expand arrow. With **hierarchical data**, the TreeView renders expand icons based on `Items`, but `HasChildren` will take precedence. |
+| `HasChildren` | Determines whether the item has children, no matter if they are loaded or not. Required for binding to **flat data** and for [**load on demand**](slug://components/treeview/data-binding/load-on-demand). If `true`, the item will show an expand arrow. With **hierarchical data**, the TreeView renders expand icons based on `Items`, but `HasChildren` will take precedence. |
 | `ParentId` | Identifies the item's parent. Required for binding to **flat data**. Set to `null` for root items. **Do not use `ParentId` with hierarchical data.** |
-| `Items` | Defines the item's children. Required for [binding to **hierarchical data**]({%slug components/treeview/data-binding/hierarchical-data%}). The children's type can be different from the parent item type. The TreeView will render an expand arrow on the parent node if its child `Items` collection is not `null`. Also see `HasChildren`. |
-| [**Graphics**]({%slug treeview-icons%}) | |
-| `Icon` | Defines a [Telerik Font and Svg icon]({%slug common-features-icons%}) |
-| [**Navigation**]({%slug treeview-navigation%}) | |
+| `Items` | Defines the item's children. Required for [binding to **hierarchical data**](slug://components/treeview/data-binding/hierarchical-data). The children's type can be different from the parent item type. The TreeView will render an expand arrow on the parent node if its child `Items` collection is not `null`. Also see `HasChildren`. |
+| [**Graphics**](slug://treeview-icons) | |
+| `Icon` | Defines a [Telerik Font and Svg icon](slug://common-features-icons) |
+| [**Navigation**](slug://treeview-navigation) | |
 | `Url` | If set, the TreeView will generate a link to another page in the app, or an external page. |
 
 ## TreeView Bindings
@@ -77,9 +77,9 @@ Each `TreeViewBinding` tag exposes the following parameters that refer to model
 | `HasChildrenField` | `"HasChildren"` |
 | `ParentIdField` (flat data) | `"ParentId"` |
 | `ItemsField` (hierarchical data) | `"Items"` |
-| [**Graphics**]({%slug treeview-icons%}) | |
+| [**Graphics**](slug://treeview-icons) | |
 | `IconField` | `"Icon"` |
-| [**Navigation**]({%slug treeview-navigation%}) | |
+| [**Navigation**](slug://treeview-navigation) | |
 | `UrlField` | `"Url"` |
 
 It is possible to [configure different bindings for different item levels](#multiple-level-bindings). Usually one binding configuration is enough. For example, if the model properties are...
@@ -119,9 +119,9 @@ public class TreeItem
 
 The `TreeViewBinding` tag has one more parameter - **`Level`**. It allows you to define different model properties for different TreeView levels.
 
-Multiple level bindings can make the application more flexible. If you use [hierarchical data binding]({%slug components/treeview/data-binding/hierarchical-data%}), the children can even use a different model type from their parent.
+Multiple level bindings can make the application more flexible. If you use [hierarchical data binding](slug://components/treeview/data-binding/hierarchical-data), the children can even use a different model type from their parent.
 
-`Level` also allows you to define a different [`ItemTemplate`]({%slug components/treeview/templates%}) for different levels.
+`Level` also allows you to define a different [`ItemTemplate`](slug://components/treeview/templates) for different levels.
 
 To define multiple bindings, add multiple `TreeViewBinding` tags and set their `Level`. **Levels are zero-based.**
 
@@ -206,9 +206,9 @@ The third level will use the main data bindings settings that do not have a leve
 
 Learn the three different ways to provide data to a TreeView:
 
-* [Use flat data]({%slug components/treeview/data-binding/flat-data%}) - a collection of self-referencing items with parent-child relationships
-* [Use hierarchical data]({%slug components/treeview/data-binding/hierarchical-data%}) - each item holds its children in a nested property
-* [Load child items on demand]({%slug components/treeview/data-binding/load-on-demand%}) (lazy loading) - load children when the parent node expands. Applies to both types of data.
+* [Use flat data](slug://components/treeview/data-binding/flat-data) - a collection of self-referencing items with parent-child relationships
+* [Use hierarchical data](slug://components/treeview/data-binding/hierarchical-data) - each item holds its children in a nested property
+* [Load child items on demand](slug://components/treeview/data-binding/load-on-demand) (lazy loading) - load children when the parent node expands. Applies to both types of data.
 
 
 ## See Also
diff --git a/components/treeview/drag-drop.md b/components/treeview/drag-drop.md
index 3e8ac048fc..e1caaf69ad 100644
--- a/components/treeview/drag-drop.md
+++ b/components/treeview/drag-drop.md
@@ -295,7 +295,7 @@ The `OnDragEnd` event handler receives as an argument an object of type `TreeVie
 
 ### Drag and Drop between TreeView, Grid, TreeList and Scheduler
 
-The functionality allows dragging items between TreeView, [Grid]({%slug grid-drag-drop-overview%}), [TreeList]({%slug treelist-drag-drop-overview%}) and [Scheduler]({%slug scheduler-overview%}). To achieve it, set the `Draggable`/`RowDraggable` parameter, and implement it through an event -  `OnDrop`/`OnRowDrop`.
+The functionality allows dragging items between TreeView, [Grid](slug://grid-drag-drop-overview), [TreeList](slug://treelist-drag-drop-overview) and [Scheduler](slug://scheduler-overview). To achieve it, set the `Draggable`/`RowDraggable` parameter, and implement it through an event -  `OnDrop`/`OnRowDrop`.
 
 >important Drag and Drop from **Scheduler** to Grid, TreeList, TreeView is **not** yet supported. Only the reversed way.
 
@@ -701,7 +701,7 @@ public class BaseFlatItem
 }
 ````
 
-See more applicable examples in the [Grid Drag and Drop article]({%slug grid-drag-drop-overview%}).
+See more applicable examples in the [Grid Drag and Drop article](slug://grid-drag-drop-overview).
 
 ### Flat Data
 
@@ -1350,6 +1350,6 @@ using System.Collections.ObjectModel;
 ## See Also
 
 * [Live Demo: TreeView Drag and Drop](https://demos.telerik.com/blazor-ui/treeview/drag-drop)
-* [Data Binding a TreeView]({%slug components/treeview/data-binding/overview%})
+* [Data Binding a TreeView](slug://components/treeview/data-binding/overview)
 * [TreeView API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikTreeView)
-* [Drag TreeView Items to a Custom Target]({%slug treeview-kb-drag-to-custom-target%})
+* [Drag TreeView Items to a Custom Target](slug://treeview-kb-drag-to-custom-target)
diff --git a/components/treeview/events.md b/components/treeview/events.md
index 826a6b863c..2319d8ccbe 100644
--- a/components/treeview/events.md
+++ b/components/treeview/events.md
@@ -24,7 +24,7 @@ This article explains the events available in the Telerik TreeView for Blazor:
 
 ## CheckedItemsChanged
 
-The `CheckedItemsChanged` event fires every time the user uses a [checkbox]({%slug treeview-checkboxes-overview%}) to select a new item.
+The `CheckedItemsChanged` event fires every time the user uses a [checkbox](slug://treeview-checkboxes-overview) to select a new item.
 
 ## ExpandedItemsChanged
 
@@ -32,7 +32,7 @@ The `ExpandedItemsChanged` event fires every time the user expands or collapses
 
 ## OnExpand
 
-The `OnExpand` event fires when the user expands or collapses a node (either with the mouse, or with the keyboard). You can use it to know that the user performed that action, and/or to implement [load on demand]({%slug components/treeview/data-binding/load-on-demand%}).
+The `OnExpand` event fires when the user expands or collapses a node (either with the mouse, or with the keyboard). You can use it to know that the user performed that action, and/or to implement [load on demand](slug://components/treeview/data-binding/load-on-demand).
 
 @[template](/_contentTemplates/common/general-info.md#rerender-after-event)
 
@@ -54,7 +54,7 @@ The event handler receives a `TreeViewItemContextMenuEventArgs` argument, which
 
 @[template](/_contentTemplates/common/click-events.md#clickeventargs)
 
-The `OnItemContextMenu` is used to [integrate the Context menu]({%slug contextmenu-integration%}#context-menu-for-a-treeview-node) to the TreeView node.
+The `OnItemContextMenu` is used to [integrate the Context menu](slug://contextmenu-integration#context-menu-for-a-treeview-node) to the TreeView node.
 
 ## OnItemDoubleClick
 
@@ -77,7 +77,7 @@ The event handler receives as an argument an `TreeViewItemRenderEventArgs` objec
 
 ## SelectedItemsChanged
 
-The `SelectedItemsChanged` event fires when the [selection]({%slug treeview-selection-overview%}) is enabled and the user clicks on a new item.
+The `SelectedItemsChanged` event fires when the [selection](slug://treeview-selection-overview) is enabled and the user clicks on a new item.
 
 ## Drag Events
 
@@ -88,7 +88,7 @@ The TreeView implements the Drag and Drop functionality through the following dr
 * The `OnDrop` event fires when the user drops a node into a new location. The event fires only if the new location is a Telerik component.
 * The `OnDragEnd` event fires when a drag operation ends. Unlike the `OnDrop` event, `OnDragEnd` will fire even if the new location is not a Telerik component.   
 
-For more details and examples, see the [Treeview Drag and Drop]({%slug treeview-drag-drop-overview%}) article.
+For more details and examples, see the [Treeview Drag and Drop](slug://treeview-drag-drop-overview) article.
 
 ## Example
 
@@ -324,6 +324,6 @@ For more details and examples, see the [Treeview Drag and Drop]({%slug treeview-
 
 ## See Also
 
-  * [TreeView Overview]({%slug treeview-overview%})
-  * [TreeView Selection]({%slug treeview-selection-overview%})
-  * [TreeView CheckBoxes]({%slug treeview-checkboxes-overview%})
+  * [TreeView Overview](slug://treeview-overview)
+  * [TreeView Selection](slug://treeview-selection-overview)
+  * [TreeView CheckBoxes](slug://treeview-checkboxes-overview)
diff --git a/components/treeview/expanded-items.md b/components/treeview/expanded-items.md
index b5b1a9d9c4..d9b30b243a 100644
--- a/components/treeview/expanded-items.md
+++ b/components/treeview/expanded-items.md
@@ -12,7 +12,7 @@ position: 4
 
 TreeView lets the user expand multiple items. It also gives the option to pre-expand a specific item.
 
-To use the item expansion, set the `ExpandedItems` parameter. It allows two-way binding (`@bind-ExpandedItems`) and one-way binding + [ExpandedItemsChanged]({%slug treeview-events%}#expandeditemschanged) event.
+To use the item expansion, set the `ExpandedItems` parameter. It allows two-way binding (`@bind-ExpandedItems`) and one-way binding + [ExpandedItemsChanged](slug://treeview-events#expandeditemschanged) event.
 
 The `ExpandedItems` collection is of type `IEnumerable<object>`.
 
@@ -119,7 +119,7 @@ The `ExpandedItems` collection is of type `IEnumerable<object>`.
 
 ## See Also
 
-* [TreeView Overview]({%slug treeview-overview%})
-* [TreeView Data Binding]({%slug components/treeview/data-binding/overview%})
-* [TreeView Events]({%slug treeview-events%})
-* [Expand and collapse TreeView items on click]({%slug treeview-kb-expand-collapse-on-item-click%})
+* [TreeView Overview](slug://treeview-overview)
+* [TreeView Data Binding](slug://components/treeview/data-binding/overview)
+* [TreeView Events](slug://treeview-events)
+* [Expand and collapse TreeView items on click](slug://treeview-kb-expand-collapse-on-item-click)
diff --git a/components/treeview/icons.md b/components/treeview/icons.md
index eda3e63061..14cb9efd9a 100644
--- a/components/treeview/icons.md
+++ b/components/treeview/icons.md
@@ -10,7 +10,7 @@ position: 15
 
 # TreeView Icons
 
-You can add [Telerik Font or SVG icons]({%slug common-features-icons%}) to the TreeView items. The component also supports custom icons.
+You can add [Telerik Font or SVG icons](slug://common-features-icons) to the TreeView items. The component also supports custom icons.
 
 To use TreeView item icons, define a property in the component model class and assign the property name to the `IconField` parameter of the respective `TreeViewBinding`.
 
@@ -108,4 +108,4 @@ If the icon property name in the TreeView model is `Icon`, there is no need to s
 
 ## See Also
 
-* [TreeView Overview]({%slug treeview-overview%})
+* [TreeView Overview](slug://treeview-overview)
diff --git a/components/treeview/navigation.md b/components/treeview/navigation.md
index ed4b1c1ae7..d58a2b45d7 100644
--- a/components/treeview/navigation.md
+++ b/components/treeview/navigation.md
@@ -12,14 +12,14 @@ position: 5
 
 The TreeView can navigate between different pages in the application.
 
-* Use a `Url` property in the model, or set the `UrlField` attribute in a [`TreeViewBinding`]({%slug components/treeview/data-binding/overview%}#treeview-bindings). Thus the TreeView will generate navigation links.
+* Use a `Url` property in the model, or set the `UrlField` attribute in a [`TreeViewBinding`](slug://components/treeview/data-binding/overview#treeview-bindings). Thus the TreeView will generate navigation links.
 * It is possible to add the TreeView to the `MainLayout.razor`, outside the app `@Body`.
 
 > External links should include a protocol, for example `https://`.
 >
 > Blazor doesn't support [navigation to page sections](https://www.meziantou.net/anchor-navigation-in-a-blazor-application.htm) out-of-the-box.
 
-For specific scenarios, use a [Template]({%slug components/treeview/templates%}) to generate the desired links manually (e.g. `NavLink` components) to enable fine-tuning.
+For specific scenarios, use a [Template](slug://components/treeview/templates) to generate the desired links manually (e.g. `NavLink` components) to enable fine-tuning.
 
 >caption TreeView for page navigation
 
@@ -119,6 +119,6 @@ For specific scenarios, use a [Template]({%slug components/treeview/templates%})
 
 ## See Also
 
-* [TreeView Overview]({%slug treeview-overview%})
-* [TreeView Data Binding]({%slug components/treeview/data-binding/overview%})
-* [TreeView Templates]({%slug components/treeview/templates%})
+* [TreeView Overview](slug://treeview-overview)
+* [TreeView Data Binding](slug://components/treeview/data-binding/overview)
+* [TreeView Templates](slug://components/treeview/templates)
diff --git a/components/treeview/overview.md b/components/treeview/overview.md
index 382af6ec19..24c97b625a 100644
--- a/components/treeview/overview.md
+++ b/components/treeview/overview.md
@@ -10,13 +10,13 @@ position: 0
 
 # Blazor Treeview Overview
 
-The <a href="https://www.telerik.com/blazor-ui/treeview" target="_blank">Blazor Treeview component</a> displays data in a traditional tree-like structure. The data itself can be flat or hierarchical. In addition to built-in navigation capabilities, you can navigate through the items and their children, define [templates]({%slug components/treeview/templates%}) for the individual nodes, render text, checkboxes and icons, and respond to events.
+The <a href="https://www.telerik.com/blazor-ui/treeview" target="_blank">Blazor Treeview component</a> displays data in a traditional tree-like structure. The data itself can be flat or hierarchical. In addition to built-in navigation capabilities, you can navigate through the items and their children, define [templates](slug://components/treeview/templates) for the individual nodes, render text, checkboxes and icons, and respond to events.
 
 ## Creating Blazor TreeView
 
 1. Use the `TelerikTreeView` tag.
-1. Set the TreeView `Data` attribute to an `IEnumerable<T>`. The TreeView will automatically recognize property names like `Id`, `ParentId`, `Text` and a few others. Otherwise, [use bindings to configure custom property names]({%slug components/treeview/data-binding/overview%}#treeview-bindings).
-1. (optional) Set the [`ExpandedItems`]({%slug treeview-expand-items%}) attribute to a **non-null** `IEnumerable<object>`. Use it to [expand or collapse items programmatically]({%slug treeview-expand-items%}#programmatically-expand-and-collapse-items).
+1. Set the TreeView `Data` attribute to an `IEnumerable<T>`. The TreeView will automatically recognize property names like `Id`, `ParentId`, `Text` and a few others. Otherwise, [use bindings to configure custom property names](slug://components/treeview/data-binding/overview#treeview-bindings).
+1. (optional) Set the [`ExpandedItems`](slug://treeview-expand-items) attribute to a **non-null** `IEnumerable<object>`. Use it to [expand or collapse items programmatically](slug://treeview-expand-items#programmatically-expand-and-collapse-items).
 
 >caption TreeView with flat self-referencing data and icons
 
@@ -94,35 +94,35 @@ The <a href="https://www.telerik.com/blazor-ui/treeview" target="_blank">Blazor
 
 ## Data Binding
 
-The [TreeView provides flexible data binding]({%slug components/treeview/data-binding/overview%}) with the following capabilities:
+The [TreeView provides flexible data binding](slug://components/treeview/data-binding/overview) with the following capabilities:
 
-* [Binding to flat data]({%slug components/treeview/data-binding/flat-data%}) (self-referencing data)
-* [Binding to hierarchical data]({%slug components/treeview/data-binding/hierarchical-data%}). It is possible to use different types for the items at different levels.
-* [Loading child items on demand]({%slug components/treeview/data-binding/load-on-demand%}) to improve performance
-* [Setting property names]({%slug components/treeview/data-binding/overview%}#treeview-bindings) for item IDs, text, parent IDs, icons, links, etc.
+* [Binding to flat data](slug://components/treeview/data-binding/flat-data) (self-referencing data)
+* [Binding to hierarchical data](slug://components/treeview/data-binding/hierarchical-data). It is possible to use different types for the items at different levels.
+* [Loading child items on demand](slug://components/treeview/data-binding/load-on-demand) to improve performance
+* [Setting property names](slug://components/treeview/data-binding/overview#treeview-bindings) for item IDs, text, parent IDs, icons, links, etc.
 
 
 ## Selection
 
 The TreeView supports two selection modes:
 
-* [Standard selection]({%slug treeview-selection-overview%}) via item clicks
-* [Checkbox selection]({%slug treeview-checkboxes-overview%}) that allows selecting all child items at once
+* [Standard selection](slug://treeview-selection-overview) via item clicks
+* [Checkbox selection](slug://treeview-checkboxes-overview) that allows selecting all child items at once
 
 
 ## Templates
 
-Use [templates to customize the TreeView item rendering]({%slug components/treeview/templates%}). Define a single template for all levels, or a [different template for each level]({%slug components/treeview/templates%}#different-templates-for-different-node-levels).
+Use [templates to customize the TreeView item rendering](slug://components/treeview/templates). Define a single template for all levels, or a [different template for each level](slug://components/treeview/templates#different-templates-for-different-node-levels).
 
 
 ## Drag and Drop
 
-Users can [drag and drop TreeView items]({%slug treeview-drag-drop-overview%}) within the same TreeView or between different ones.
+Users can [drag and drop TreeView items](slug://treeview-drag-drop-overview) within the same TreeView or between different ones.
 
 
 ## Navigate Views
 
-The TreeView can [display links to app views and external pages]({%slug treeview-navigation%}).
+The TreeView can [display links to app views and external pages](slug://treeview-navigation).
 
 
 ## TreeView Parameters
@@ -133,7 +133,7 @@ The following table lists TreeView parameters, which are not related to other fe
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | The additional CSS class that will be rendered on the `div.k-treeview` element. Use it to apply custom styles or [override the theme]({%slug themes-override%}). |
+| `Class` | `string` | The additional CSS class that will be rendered on the `div.k-treeview` element. Use it to apply custom styles or [override the theme](slug://themes-override). |
 | `Size` | `string` <br /> `"md"` | Affects the TreeView layout, for example the amount of space between items. The possible valid values are `"lg"` (large), `"md"` (medium) and `"sm"` (small). For easier setting, use the predefined string properties in class [`Telerik.Blazor.ThemeConstants.TreeView.Size`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.TreeView.Size). |
 | `DragThrottleInterval` | `int` <br /> (`0`) | The milliseconds between each firing of the `OnDrag` event during the dragging operations.  |
 
@@ -142,14 +142,14 @@ The following table lists TreeView parameters, which are not related to other fe
 
 To execute TreeView methods, obtain reference to the component instance via `@ref`.
 
-The TreeView is a generic component. Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters]({%slug common-features-data-binding-overview%}#component-type).
+The TreeView is a generic component. Its type depends on the type of its model and the type of its `Value`. In case you cannot provide either the `Value` or `Data` initially, you need to [set the corresponding types to the `TItem` and `TValue` parameters](slug://common-features-data-binding-overview#component-type).
 
 The table below lists the TreeView methods. Also consult the [TreeView API](/blazor-ui/api/Telerik.Blazor.Components.TelerikTreeView).
 
 | Method | Description |
 | --- | --- |
-| `Rebind` | [Refreshes the component data]({%slug treeview-refresh-data%}#rebind-method). |
-| `GetItemFromDropIndex` <br /> `(string index)` | gets the corresponding `TItem` of the destination TreeView from the passed [`DestinationIndex`]({%slug grid-drag-drop-overview%}#event-arguments) |
+| `Rebind` | [Refreshes the component data](slug://treeview-refresh-data#rebind-method). |
+| `GetItemFromDropIndex` <br /> `(string index)` | gets the corresponding `TItem` of the destination TreeView from the passed [`DestinationIndex`](slug://grid-drag-drop-overview#event-arguments) |
 
 <div class="skip-repl"></div>
 ````RAZOR
@@ -162,12 +162,12 @@ The table below lists the TreeView methods. Also consult the [TreeView API](/bla
 
 ## Next Steps
 
-* [Review TreeView data binding]({%slug components/treeview/data-binding/overview%})
-* [Experiment with TreeView Checkboxes]({%slug treeview-checkboxes-overview%})
+* [Review TreeView data binding](slug://components/treeview/data-binding/overview)
+* [Experiment with TreeView Checkboxes](slug://treeview-checkboxes-overview)
 
 
 ## See Also
 
 * [Live TreeView Demos](https://demos.telerik.com/blazor-ui/treeview/overview)
 * [TreeVew API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikTreeView)
-* [Enable TreeView Scrolling]({%slug treeview-kb-horizontal-scrollbar%})
+* [Enable TreeView Scrolling](slug://treeview-kb-horizontal-scrollbar)
diff --git a/components/treeview/refresh-data.md b/components/treeview/refresh-data.md
index 77975b860c..a08df9c504 100644
--- a/components/treeview/refresh-data.md
+++ b/components/treeview/refresh-data.md
@@ -431,7 +431,7 @@ In this article:
 
 ## See Also
 
-  * [ObservableCollection]({%slug common-features-observable-data%})
+  * [ObservableCollection](slug://common-features-observable-data)
   * [INotifyCollectionChanged Interface](https://docs.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=netframework-4.8)
   * [Live Demos](https://demos.telerik.com/blazor-ui/)
   
\ No newline at end of file
diff --git a/components/treeview/selection/multiple.md b/components/treeview/selection/multiple.md
index 5f7cd0fd1a..7db9af1d3f 100644
--- a/components/treeview/selection/multiple.md
+++ b/components/treeview/selection/multiple.md
@@ -41,7 +41,7 @@ This section contains the following examples:
 
 ### Multiple selection using one-way data binding
 
-You can use one-way binding to provide an initial node selection, and respond to the `SelectedItemsChanged` to update the view-model when user selection occurs. If you don't update the model, selection is effectively canceled. If you want to load async data on demand based on the chosen node, use the [`OnItemClick`]({%slug treeview-events%}#onitemclick) event.
+You can use one-way binding to provide an initial node selection, and respond to the `SelectedItemsChanged` to update the view-model when user selection occurs. If you don't update the model, selection is effectively canceled. If you want to load async data on demand based on the chosen node, use the [`OnItemClick`](slug://treeview-events#onitemclick) event.
 
 
 ````RAZOR
@@ -395,5 +395,5 @@ You can bind the treeview to different models at each level, and the selection a
 
 ## See Also
 
-  * [Selection Overview]({%slug treeview-selection-overview%})
-  * [Single Selection]({%slug treeview-selection-single%})
+  * [Selection Overview](slug://treeview-selection-overview)
+  * [Single Selection](slug://treeview-selection-single)
diff --git a/components/treeview/selection/overview.md b/components/treeview/selection/overview.md
index 319ae4f5c4..fbda5f9b1f 100644
--- a/components/treeview/selection/overview.md
+++ b/components/treeview/selection/overview.md
@@ -14,12 +14,12 @@ The TreeView lets the user select one or more nodes. You can also pre-select the
 
 You can configure the node selection behavior by setting the `SelectionMode` parameter to a member of the `TreeViewSelectionMode` enum:
 * `None` - disable the node selection. This is the default setting.
-* [`Single`]({%slug treeview-selection-single%})
-* [`Multiple`]({%slug treeview-selection-single%})
+* [`Single`](slug://treeview-selection-single)
+* [`Multiple`](slug://treeview-selection-single)
 
-You get or set the selected items through the `SelectedItems` parameter. It is an `IEnumerable<object>` collection. The selection allows two-way binding (`@bind-SelectedItems`) and one-way binding + [`SelectedItemsChanged`]({%slug treeview-events%}#selecteditemschanged) event.
+You get or set the selected items through the `SelectedItems` parameter. It is an `IEnumerable<object>` collection. The selection allows two-way binding (`@bind-SelectedItems`) and one-way binding + [`SelectedItemsChanged`](slug://treeview-events#selecteditemschanged) event.
 
-If you want to extract details for the selection from `SelectedItems`, you need to cast the collection to the correct model type. This is required because you can [bind the treeview]({%slug components/treeview/data-binding/overview%}) to different model types at each level. The example below demonstrates this approach - we cast the selected item to the specific model in order to get its details and display them outside of the TreeView.
+If you want to extract details for the selection from `SelectedItems`, you need to cast the collection to the correct model type. This is required because you can [bind the treeview](slug://components/treeview/data-binding/overview) to different model types at each level. The example below demonstrates this approach - we cast the selected item to the specific model in order to get its details and display them outside of the TreeView.
 
 >caption Enable node selection
 
@@ -141,5 +141,5 @@ If you want to extract details for the selection from `SelectedItems`, you need
 ## See Also
 
   * [Live Demo: TreeView Selection](https://demos.telerik.com/blazor-ui/treeview/selection)
-  * [Single Selection]({%slug treeview-selection-single%})
-  * [Multiple Selection]({%slug treeview-selection-multiple%})
+  * [Single Selection](slug://treeview-selection-single)
+  * [Multiple Selection](slug://treeview-selection-multiple)
diff --git a/components/treeview/selection/single.md b/components/treeview/selection/single.md
index fb15806b70..c951c8ea8e 100644
--- a/components/treeview/selection/single.md
+++ b/components/treeview/selection/single.md
@@ -36,7 +36,7 @@ This section contains the following examples:
 
 ### Selection of a single node using one-way data binding
 
-You can use one-way binding to provide an initial node selection, and respond to the `SelectedItemsChanged` to update the view-model when user selection occurs. If you don't update the model, selection is effectively canceled. If you want to load async data on demand based on the chosen node, use the [`OnItemClick`]({%slug treeview-events%}#onitemclick) event.
+You can use one-way binding to provide an initial node selection, and respond to the `SelectedItemsChanged` to update the view-model when user selection occurs. If you don't update the model, selection is effectively canceled. If you want to load async data on demand based on the chosen node, use the [`OnItemClick`](slug://treeview-events#onitemclick) event.
 
 ````RAZOR
 @* Handle single node selection with one-way data binding *@
@@ -282,5 +282,5 @@ You can use two-way binding to get the node the user has selected. This can be u
 
 ## See Also
 
-  * [Selection Overview]({%slug treeview-selection-overview%})
-  * [Multiple Selection]({%slug treeview-selection-multiple%})
+  * [Selection Overview](slug://treeview-selection-overview)
+  * [Multiple Selection](slug://treeview-selection-multiple)
diff --git a/components/treeview/templates.md b/components/treeview/templates.md
index 29252ba1e5..b733ec2f4d 100644
--- a/components/treeview/templates.md
+++ b/components/treeview/templates.md
@@ -33,7 +33,7 @@ You can use the template to render arbitrary content according to your applicati
 
 ### Handle DOM events in a template - e.g., click on a node
 
->tip You can respond to the user click on a node by using the [`OnItemClick`]({%slug treeview-events%}#onitemclick) event.
+>tip You can respond to the user click on a node by using the [`OnItemClick`](slug://treeview-events#onitemclick) event.
 
 ````RAZOR
 @result
@@ -120,7 +120,7 @@ You can use the template to render arbitrary content according to your applicati
 
 ### Use templates to implement navigation between views without the usage of the UrlField feature
 
->tip You can read more information on how to use the Treeview to switch between pages from the [Navigation]({%slug treeview-navigation%}) article
+>tip You can read more information on how to use the Treeview to switch between pages from the [Navigation](slug://treeview-navigation) article
 
 ````RAZOR
 Implement your own navigation through NavLink elements, instead of using the built-in feature
@@ -263,5 +263,5 @@ Multiple templates usage.
 
 ## See Also
 
-  * [Data Binding a TreeView]({%slug components/treeview/data-binding/overview%})
+  * [Data Binding a TreeView](slug://components/treeview/data-binding/overview)
   * [Live Demo: TreeView](https://demos.telerik.com/blazor-ui/treeview/overview)
diff --git a/components/upload/accessibility/wai-aria-support.md b/components/upload/accessibility/wai-aria-support.md
index 0d6cb124ef..0cf6ac896e 100644
--- a/components/upload/accessibility/wai-aria-support.md
+++ b/components/upload/accessibility/wai-aria-support.md
@@ -76,4 +76,4 @@ For details on how the Upload keyboard navigation works, refer to the [Blazor Up
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/upload/events.md b/components/upload/events.md
index 867d98b4db..958d889f29 100644
--- a/components/upload/events.md
+++ b/components/upload/events.md
@@ -25,7 +25,7 @@ First, get familiar with the [**Event Arguments**](#event-arguments) section, as
 * [`OnUpload`](#onupload)
     * [Sending additional custom data with the uploaded file](#send-custom-data-with-the-file)
 
->warning Make sure to also check the section about [Upload security]({%slug upload-overview%}#security).
+>warning Make sure to also check the section about [Upload security](slug://upload-overview#security).
 
 @[template](/_contentTemplates/common/general-info.md#event-callback-can-be-async)
 
@@ -56,9 +56,9 @@ The `UploadFileInfo` object has the following properties:
 |---|---|---|
 | `Extension` | `string` | The file extension (type), together with the dot. |
 | `Id` | `string` | The unique file identifier in GUID format. |
-| `InvalidExtension` | `bool` | Defines if the file violates the [`AllowedExtensions` value]({%slug upload-overview%}#upload-parameters). |
-| `InvalidMaxFileSize` | `bool` | Defines if the file violates the [`MaxFileSize` value]({%slug upload-overview%}#upload-parameters). |
-| `InvalidMinFileSize` | `bool` | Defines if the file violates the [`MinFileSize` value]({%slug upload-overview%}#upload-parameters). |
+| `InvalidExtension` | `bool` | Defines if the file violates the [`AllowedExtensions` value](slug://upload-overview#upload-parameters). |
+| `InvalidMaxFileSize` | `bool` | Defines if the file violates the [`MaxFileSize` value](slug://upload-overview#upload-parameters). |
+| `InvalidMinFileSize` | `bool` | Defines if the file violates the [`MinFileSize` value](slug://upload-overview#upload-parameters). |
 | `Name` | `string` | The **encoded** file name, including the extension. One method to decode it is [`System.Net.WebUtility.HtmlDecode()`](https://learn.microsoft.com/en-us/dotnet/api/system.net.webutility.htmldecode). The file name received by the controller (endpoint) is **not encoded**. The [file can be renamed](#renaming-a-file) in the [`OnSelect`](#onselect) and [`OnUpload`](#onupload) handlers. |
 | `Progress` | `int` | The uploaded percentage of the file in the [`OnProgress` event](#onprogress). |
 | `Size` | `long` | The file size in bytes. |
@@ -98,7 +98,7 @@ See the [full example](#example) below.
 
 ## OnClear
 
-The `OnClear` event fires when the user clicks the *Clear* button below the file list. This button is visible when [`AutoUpload="false"`]({%slug upload-overview%}#upload-parameters).
+The `OnClear` event fires when the user clicks the *Clear* button below the file list. This button is visible when [`AutoUpload="false"`](slug://upload-overview#upload-parameters).
 
 The `UploadClearEventArgs` event argument contains the [properties `Files` and `IsCancelled`](#event-arguments). The `Files` property can contain one or more files.
 
@@ -279,7 +279,7 @@ See the [full example](#example) below.
 
 The `OnSelect` event fires when the user selects one or more new files for upload. The selection of files is achieved either through the *Select files* button or by dropping the files anywhere in the component.
 
-The `UploadSelectEventArgs` event argument contains the [`Files` and `IsCancelled` properties](#event-arguments). The `Files` property can contain one or more files, and it is possible to [count the total number of selected files]({%slug upload-kb-count-selected-uploaded-files%}).
+The `UploadSelectEventArgs` event argument contains the [`Files` and `IsCancelled` properties](#event-arguments). The `Files` property can contain one or more files, and it is possible to [count the total number of selected files](slug://upload-kb-count-selected-uploaded-files).
 
 If you cancel the event, the Upload component will neither list, nor upload the selected files.
 
@@ -339,7 +339,7 @@ The `OnSuccess` event fires when an upload or remove request is successful. The
 
 The [`UploadSuccessEventArgs` event argument](#event-arguments) contains the following properties:
 
-* `Files` that contains one file. See [how to count the total number of uploaded files]({%slug upload-kb-count-selected-uploaded-files%}).
+* `Files` that contains one file. See [how to count the total number of uploaded files](slug://upload-kb-count-selected-uploaded-files).
 * `Operation`
 * `Request`
 
@@ -414,11 +414,11 @@ If you cancel the event, the file upload will not start. If `AutoUpload="false"`
 Use the `OnUpload` and [`OnRemove`](#onremove) event handlers to send additional custom data and request headers to the server, together with the file. For example, the data may be related to:
 
 * Authentication
-* [CSRF/XSRF cross-site antiforgery tokens]({%slug upload-kb-validateantiforgerytoken%})
+* [CSRF/XSRF cross-site antiforgery tokens](slug://upload-kb-validateantiforgerytoken)
 * New file name (also see section [Renaming a File](#renaming-a-file))
 * Any metadata related to the app business logic
 
-To send cookies with the upload request, set the [`WithCredentials` component parameter]({%slug upload-overview%}#upload-parameters) to `true`.
+To send cookies with the upload request, set the [`WithCredentials` component parameter](slug://upload-overview#upload-parameters) to `true`.
 
 To send a complex object or a collection, serialize it first. Receive it as a `string` argument in the controller method and deserialize it.
 
@@ -496,8 +496,8 @@ Make sure to enable controller routing in the app startup file (`Program.cs`). I
 
 Also see:
 
-* Section [Implement Controller Methods]({%slug upload-overview%}#implement-controller-methods)
-* Page [Upload Troubleshooting]({%slug upload-troubleshooting%})
+* Section [Implement Controller Methods](slug://upload-overview#implement-controller-methods)
+* Page [Upload Troubleshooting](slug://upload-troubleshooting)
 
 >caption Using the Upload events
 
@@ -800,6 +800,6 @@ app.Run();
 ## See Also
 
 * [Live Demo: Upload Events](https://demos.telerik.com/blazor-ui/upload/events)
-* [Upload Overview]({%slug upload-overview%})
-* [Upload Methods]({%slug upload-overview%}#upload-reference-and-methods)
-* [Count all selected and uploaded files]({%slug upload-kb-count-selected-uploaded-files%})
+* [Upload Overview](slug://upload-overview)
+* [Upload Methods](slug://upload-overview#upload-reference-and-methods)
+* [Count all selected and uploaded files](slug://upload-kb-count-selected-uploaded-files)
diff --git a/components/upload/initial-files.md b/components/upload/initial-files.md
index 6ac25d9091..0ef26ac1a8 100644
--- a/components/upload/initial-files.md
+++ b/components/upload/initial-files.md
@@ -34,8 +34,8 @@ To configure the initially displayed files, use the `Files` parameter of the Upl
 ## Persist Selected Files
 
 The Initial Files feature of the Upload allows you to save a list of files that the user has selected. Then, you can display them again when the page is reloaded. To achieve this:
-1. Store the [`UploadFileInfo`]({%slug upload-events%}#uploadfileinfo) records received during the [`OnSelect`]({%slug upload-events%}#onselect) event.
-1. Load the [`UploadFileInfo`]({%slug upload-events%}#uploadfileinfo) records in the Upload when the page is loaded.
+1. Store the [`UploadFileInfo`](slug://upload-events#uploadfileinfo) records received during the [`OnSelect`](slug://upload-events#onselect) event.
+1. Load the [`UploadFileInfo`](slug://upload-events#uploadfileinfo) records in the Upload when the page is loaded.
 
 >caption How to load files and display them initially in the Upload
 
@@ -83,4 +83,4 @@ The Initial Files feature of the Upload allows you to save a list of files that
 ## See Also
 
 * [Upload API](/blazor-ui/api/Telerik.Blazor.Components.TelerikUpload)
-* [Upload Overview]({%slug upload-overview%})
\ No newline at end of file
+* [Upload Overview](slug://upload-overview)
\ No newline at end of file
diff --git a/components/upload/overview.md b/components/upload/overview.md
index d435b3e0d6..614495156a 100644
--- a/components/upload/overview.md
+++ b/components/upload/overview.md
@@ -60,14 +60,14 @@ Steps 4 and 5 are optional, but strongly recommended.
     * The argument name (`FormData` request key) must match the Upload [`SaveField` parameter](#upload-parameters) value. By default, that is `files`.
     * The method name must match the last part of the `SaveUrl` value.
     * The correct binding source attribute for the file argument is `[FromForm]`. Normally, .NET will infer and set it automatically.
-    * Use the Upload [`OnUpload` event]({%slug upload-events%}#onupload) to [send additional custom data with the file]({%slug upload-events%}#send-custom-data-with-the-file) as an argument to the `Save` controller method.
+    * Use the Upload [`OnUpload` event](slug://upload-events#onupload) to [send additional custom data with the file](slug://upload-events#send-custom-data-with-the-file) as an argument to the `Save` controller method.
 
 * **Remove** action method
     * Its argument must be `string` or `IEnumerable<string>`.
     * The argument name (`FormData` request key) must match the Upload [`RemoveField` parameter](#upload-parameters) value. By default, that is `files`.
     * The method name must match the last part of the `RemoveUrl` value.
     * The correct binding source attribute for the file name argument is `[FromForm]`. Set it explicitly if you are using an [`[ApiController]` attribute](https://learn.microsoft.com/en-gb/aspnet/core/web-api/).
-    * Use the Upload [`OnRemove` event]({%slug upload-events%}#onremove) to [send additional custom data with the file]({%slug upload-events%}#send-custom-data-with-the-file) as an argument to the `Remove` controller method.
+    * Use the Upload [`OnRemove` event](slug://upload-events#onremove) to [send additional custom data with the file](slug://upload-events#send-custom-data-with-the-file) as an argument to the `Remove` controller method.
 
 Both action methods must accept `POST` requests. Correct request routing depends on the application.
 
@@ -75,7 +75,7 @@ The `UploadController` class below assumes that the project name and namespace i
 
 Make sure to enable controller routing in the app startup file (`Program.cs`). In this case, `app.MapDefaultControllerRoute();` is all that's needed.
 
-Also check the [Upload Troubleshooting]({%slug upload-troubleshooting%}) page.
+Also check the [Upload Troubleshooting](slug://upload-troubleshooting) page.
 
 >caption Sample Upload Controller
 
@@ -163,7 +163,7 @@ namespace TelerikBlazorUpload.Controllers
 
 ### Security
 
-The Telerik Upload component makes XHR requests from the browser to the designated endpoints. If needed, use the [`OnUpload` and `OnRemove` events]({%slug upload-events%}) to add headers, authentication tokens and custom data to the request.
+The Telerik Upload component makes XHR requests from the browser to the designated endpoints. If needed, use the [`OnUpload` and `OnRemove` events](slug://upload-events) to add headers, authentication tokens and custom data to the request.
 
 Authentication and authorization depends on the application.
 
@@ -177,19 +177,19 @@ Authentication and authorization depends on the application.
 
 ## Validation
 
-The Upload includes [built-in client-side validation]({%slug upload-validation%}) for the file size and type (extension). Additional custom validation can take place in the [OnSelect event]({%slug upload-events%}#onselect).
+The Upload includes [built-in client-side validation](slug://upload-validation) for the file size and type (extension). Additional custom validation can take place in the [OnSelect event](slug://upload-events#onselect).
 
 ## Initial Files
 
-The Initial Files feature allows you to display a set of pre-selected files in the Upload when the component loads. This functionality is helpful when you want to show files that were previously provided by the user. [Read more about the Upload Initial Files feature...]({%slug upload-initial-files%})
+The Initial Files feature allows you to display a set of pre-selected files in the Upload when the component loads. This functionality is helpful when you want to show files that were previously provided by the user. [Read more about the Upload Initial Files feature...](slug://upload-initial-files)
 
 ## Templates
 
-You can use the functionality of the built-in template and modify the appearance of the **Select files...** button. [Read more about the Telerik Upload templates...]({%slug upload-templates%})
+You can use the functionality of the built-in template and modify the appearance of the **Select files...** button. [Read more about the Telerik Upload templates...](slug://upload-templates)
 
 ## Large File Uploads
 
-The Upload `MaxFileSize` parameter is used only for [client-side validation]({%slug upload-validation%}). The component sends files in one piece and the server needs a separate configuration to support large file uploads. Here are some examples for common server settings:
+The Upload `MaxFileSize` parameter is used only for [client-side validation](slug://upload-validation). The component sends files in one piece and the server needs a separate configuration to support large file uploads. Here are some examples for common server settings:
 
 * [IIS `maxAllowedContentLength`](https://docs.microsoft.com/en-us/aspnet/core/mvc/models/file-uploads#iis) (also check the [`requestLimits` article](https://docs.microsoft.com/en-us/iis/configuration/system.webserver/security/requestfiltering/requestlimits/) and this [StackOverflow thread](https://stackoverflow.com/questions/10871881/iis7-the-request-filtering-module-is-configured-to-deny-a-request-that-exceeds))
 * [ASP.NET Core `MultipartBodyLengthLimit`](https://docs.microsoft.com/en-us/aspnet/core/mvc/models/file-uploads#multipart-body-length-limit)
@@ -197,9 +197,9 @@ The Upload `MaxFileSize` parameter is used only for [client-side validation]({%s
 
 ## Drag-and-Drop File Support
 
-The Upload provides built-in file drag-and-drop support, which allows users to drag one or multiple files and drop them anywhere in the component. The [`OnSelect`]({%slug upload-events%}#onselect) and [`OnUpload`]({%slug upload-events%}#onupload) events are raised upon dropping the file. You can handle this behavior to perform further actions with the selected file.
+The Upload provides built-in file drag-and-drop support, which allows users to drag one or multiple files and drop them anywhere in the component. The [`OnSelect`](slug://upload-events#onselect) and [`OnUpload`](slug://upload-events#onupload) events are raised upon dropping the file. You can handle this behavior to perform further actions with the selected file.
 
-Additionally, you can define an external drop zone by using the [Telerik UI for Blazor DropZone component]({%slug dropzone-overview%}).
+Additionally, you can define an external drop zone by using the [Telerik UI for Blazor DropZone component](slug://dropzone-overview).
 
 ## Upload Parameters
 
@@ -210,21 +210,21 @@ The following table lists the Upload parameters. Also check the [Upload API Refe
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
 | `Accept` | `string` | The [`accept` HTML attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept) of the file `<input>`. It controls what file types and MIME types the browser will allow users to select. Compare with `AllowedExtensions`. |
-| `AllowedExtensions` | `List<string>` | The list of allowed file types. The component will check if the selected files are compliant **after selection**. Compare with `Accept`. Read more at [Validation]({%slug upload-validation%}). |
+| `AllowedExtensions` | `List<string>` | The list of allowed file types. The component will check if the selected files are compliant **after selection**. Compare with `Accept`. Read more at [Validation](slug://upload-validation). |
 | `AutoUpload` | `bool`<br />(`true`) | When `true`, the upload process starts automatically after file selection. When `false`, the component renders an upload button. |
 | `Capture` | `string` | The [`capture` HTML attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture) of the `<input type="file" />` element. It enables users to provide a file directly from their device camera. |
 | `Class` | `string` | Renders a custom CSS class to the `<div class="k-upload">` element. |
-| `DropZoneId` | `string` | The id that is used to connect the Upload to an external [DropZone]({%slug dropzone-overview%}). Assign a value matching the `Id` of the DropZone you are connecting the component with. |
+| `DropZoneId` | `string` | The id that is used to connect the Upload to an external [DropZone](slug://dropzone-overview). Assign a value matching the `Id` of the DropZone you are connecting the component with. |
 | `Enabled` | `bool`<br />(`true`) | Enables file selection and upload. |
 | `Id` | `string` | Renders an `id` attribute to the `<input type="file" />` element. Can be used together with a `<label>`. |
-| `MaxFileSize` | `long?` | The maximum allowed file size in bytes. Read more in the [Large File Uploads](#large-file-uploads) section and in the [Validation]({%slug upload-validation%}) article. |
-| `MinFileSize` | `long?` | The minimum allowed file size in bytes. Read more at [Validation]({%slug upload-validation%}). |
+| `MaxFileSize` | `long?` | The maximum allowed file size in bytes. Read more in the [Large File Uploads](#large-file-uploads) section and in the [Validation](slug://upload-validation) article. |
+| `MinFileSize` | `long?` | The minimum allowed file size in bytes. Read more at [Validation](slug://upload-validation). |
 | `Multiple` | `bool`<br />(`true`) | Sets if the user can select several files at the same time. The component always uploads files one by one, and the controller method receives them separately. |
 | `RemoveField` | `string`<br />(`"files"`) | Sets the `FormData` key, which contains the file name submitted for deletion to the [`RemoveUrl` endpoint](#implement-controller-methods). The `RemoveField` value must match the delete controller method's argument name. The user triggers remove requests when clicking on the [x] buttons in the uploaded file list. |
 | `RemoveUrl` | `string` | The URL which receives the file names for deletion. |
 | `SaveField` | `string`<br />(`"files"`) | Sets the `FormData` key, which contains the file submitted to the [`SaveUrl` endpoint](#implement-controller-methods). The `SaveField` value must match the save controller method's argument name. |
 | `SaveUrl` | `string` | The URL which receives the uploaded files. `SaveUrl` and `RemoveUrl` **cannot change** between file selection and file upload, because the component will be recreated and the selected files will be lost. |
-| `WithCredentials` | `bool` | Controls if the Upload will send credentials such as cookies or HTTP headers for [**cross-site** requests](#cross-origin-requests). See [XMLHttpRequest.withCredentials](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials). On the other hand, use the [`OnUpload` and `OnRemove` events]({%slug upload-events%}) to add authentication tokens and other metadata to the component requests. |
+| `WithCredentials` | `bool` | Controls if the Upload will send credentials such as cookies or HTTP headers for [**cross-site** requests](#cross-origin-requests). See [XMLHttpRequest.withCredentials](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials). On the other hand, use the [`OnUpload` and `OnRemove` events](slug://upload-events) to add authentication tokens and other metadata to the component requests. |
 | `Files` | `IEnumerable<UploadFileInfo>` | Collection of files that will be initially displayed in the Upload file list. |
 
 
@@ -235,8 +235,8 @@ The Upload exposes methods for programmatic operation. To use them, define a ref
 | Method | Description |
 | --- | --- |
 | `ClearFiles` | Clears all files from the list, both uploaded and in queue. |
-| `OpenSelectFilesDialog` | Shows the browser's file selection dialog. This method [doesn't work in Safari due to browser security restrictions]({%slug upload-kb-openselectfilesdialog-safari%}). |
-| `UploadFiles` | Uploads all valid selected files. Fires the [OnUpload]({%slug upload-events%}#onupload) event. |
+| `OpenSelectFilesDialog` | Shows the browser's file selection dialog. This method [doesn't work in Safari due to browser security restrictions](slug://upload-kb-openselectfilesdialog-safari). |
+| `UploadFiles` | Uploads all valid selected files. Fires the [OnUpload](slug://upload-events#onupload) event. |
 
 >caption Get reference to the Upload and execute methods
 
@@ -277,13 +277,13 @@ The Upload exposes methods for programmatic operation. To use them, define a ref
 
 ## Troubleshooting
 
-The Upload component requires integration with remote endpoints and controller methods to work. See how to [detect and troubleshoot issues with the endpoint implementation, and how to fix them]({%slug upload-troubleshooting%}).
+The Upload component requires integration with remote endpoints and controller methods to work. See how to [detect and troubleshoot issues with the endpoint implementation, and how to fix them](slug://upload-troubleshooting).
 
 
 ## Next Steps
 
-* [Use Upload Validation]({%slug upload-validation%})
-* [Subscribe to Upload Events]({%slug upload-events%})
+* [Use Upload Validation](slug://upload-validation)
+* [Subscribe to Upload Events](slug://upload-events)
 
 
 ## See Also
diff --git a/components/upload/templates.md b/components/upload/templates.md
index deb4fe0941..4950a3defb 100644
--- a/components/upload/templates.md
+++ b/components/upload/templates.md
@@ -10,7 +10,7 @@ position: 30
 
 # Upload Templates
 
-The `SelectFilesButtonTemplate` allows you to modify the **Select Files...** button. It lets you change the default text of the button and include custom content like an [icon]({%slug common-features-icons%}) or image.
+The `SelectFilesButtonTemplate` allows you to modify the **Select Files...** button. It lets you change the default text of the button and include custom content like an [icon](slug://common-features-icons) or image.
 
 >caption Using Upload SelectFilesButtonTemplate
 
@@ -26,6 +26,6 @@ The `SelectFilesButtonTemplate` allows you to modify the **Select Files...** but
 ## See Also
 
 * [Upload API](/blazor-ui/api/Telerik.Blazor.Components.TelerikUpload)
-* [Upload Overview]({%slug upload-overview%})
-* [Upload Validation]({%slug upload-validation%})
-* [Upload Events]({%slug upload-events%})
\ No newline at end of file
+* [Upload Overview](slug://upload-overview)
+* [Upload Validation](slug://upload-validation)
+* [Upload Events](slug://upload-events)
\ No newline at end of file
diff --git a/components/upload/troubleshooting.md b/components/upload/troubleshooting.md
index 75d98d4beb..8bbe0dcce1 100644
--- a/components/upload/troubleshooting.md
+++ b/components/upload/troubleshooting.md
@@ -21,7 +21,7 @@ The action method is hit, but the method argument is `null`
 * Make sure the action method argument names match the `SaveField` and `RemoveField` values. The default value of both parameters is `"files"`.
 * The argument type of the `SaveUrl` action method should be `IFormFile` or `IEnumerable<IFormFile>`.
 * The argument type of the `RemoveUrl` action method should be `string` or `IEnumerable<string>`.
-* The uploaded [file size may be over the web server's maximum]({%slug upload-overview%}#large-file-uploads).
+* The uploaded [file size may be over the web server's maximum](slug://upload-overview#large-file-uploads).
 
 
 ## HTTP 400 Bad request
@@ -48,16 +48,16 @@ The server does not return any response. The browser console shows connection er
 * `Failed to load resource: net::ERR_CONNECTION_RESET`
 * `Failed to load resource: The network connection was lost.`
 
-This means that the uploaded file size [exceeds the web server's maximum]({%slug upload-overview%}#large-file-uploads).
+This means that the uploaded file size [exceeds the web server's maximum](slug://upload-overview#large-file-uploads).
 
 
 ## Antiforgery Validation Blocks the Upload Requests
 
-If the upload controller is decorated with the `[ValidateAntiForgeryToken]` attribute, the Upload component must include antiforgery tokens in its upload and delete requests. Use the [`OnUpload` and `OnRemove`]({%slug upload-events%}) events to [add the required antiforgery tokens]({%slug upload-kb-validateantiforgerytoken%}).
+If the upload controller is decorated with the `[ValidateAntiForgeryToken]` attribute, the Upload component must include antiforgery tokens in its upload and delete requests. Use the [`OnUpload` and `OnRemove`](slug://upload-events) events to [add the required antiforgery tokens](slug://upload-kb-validateantiforgerytoken).
 
 
 ## See Also
 
-* [How to implement Upload controller methods]({%slug upload-overview%}#implement-controller-methods)
-* [Validation]({%slug upload-validation%})
-* [Events]({%slug upload-events%})
+* [How to implement Upload controller methods](slug://upload-overview#implement-controller-methods)
+* [Validation](slug://upload-validation)
+* [Events](slug://upload-events)
diff --git a/components/upload/validation.md b/components/upload/validation.md
index 8bf1735767..d8779a5ad1 100644
--- a/components/upload/validation.md
+++ b/components/upload/validation.md
@@ -52,6 +52,6 @@ Removing invalid files with the [x] button in the Upload interface will not call
 
 ## See Also
 
-* [Upload Overview]({%slug upload-overview%})
-* [Upload Events]({%slug upload-events%})
+* [Upload Overview](slug://upload-overview)
+* [Upload Events](slug://upload-events)
 * [Live Demo: Upload Validation](https://demos.telerik.com/blazor-ui/upload/validation)
diff --git a/components/validation/message.md b/components/validation/message.md
index 09ccf180dd..117b63241f 100644
--- a/components/validation/message.md
+++ b/components/validation/message.md
@@ -16,7 +16,7 @@ The <a href = "https://www.telerik.com/blazor-ui/validation-message" target="_bl
 
 To enable Telerik Validation Messages for a form field:
 
-1. Add a `<TelerikValidationMessage>` tag near the respective `<FormItem>` tag, or [inside a form item `<Template>`]({%slug form-formitems-template%}).
+1. Add a `<TelerikValidationMessage>` tag near the respective `<FormItem>` tag, or [inside a form item `<Template>`](slug://form-formitems-template).
 1. Provide a lambda expression in the `For` parameter that sets the associated property of the model, just like with the standard Blazor `ValidationMessage` component.
 1. (optional) Disable the built-in validation messages of the Telerik Form to avoid repetition. Set `ValidationMessageType="@FormValidationMessageType.None"`.
 
@@ -231,11 +231,11 @@ Use the `Class` parameter of the Validation Message to add a custom CSS class to
 
 ## Next Steps
 
-* Explore [TelerikValidationTooltip]({%slug validation-tools-tooltip%})
+* Explore [TelerikValidationTooltip](slug://validation-tools-tooltip)
 
 ## See Also
 
 * [Live Demo: Validation](https://demos.telerik.com/blazor-ui/validation/overview)
-* [TelerikValidationSummary]({%slug validation-tools-summary%})
-* [TelerikValidationTooltip]({%slug validation-tools-tooltip%})
-* [Form Component]({%slug form-overview%})
+* [TelerikValidationSummary](slug://validation-tools-summary)
+* [TelerikValidationTooltip](slug://validation-tools-tooltip)
+* [Form Component](slug://form-overview)
diff --git a/components/validation/overview.md b/components/validation/overview.md
index 23f85d2cda..8d57cf05ea 100644
--- a/components/validation/overview.md
+++ b/components/validation/overview.md
@@ -10,7 +10,7 @@ position: 0
 
 # Blazor Validation Tools Overview
 
-Telerik UI for Blazor provides different ways to show and customize validation messages. The validation tools can be used together with the [Telerik Form]({%slug form-overview%}) or with any form that provides an [`EditContext`](https://docs.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.forms.editcontext) like the [standard .NET `EditForm`](https://docs.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.forms.editform).
+Telerik UI for Blazor provides different ways to show and customize validation messages. The validation tools can be used together with the [Telerik Form](slug://form-overview) or with any form that provides an [`EditContext`](https://docs.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.forms.editcontext) like the [standard .NET `EditForm`](https://docs.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.forms.editform).
 
 @[template](/_contentTemplates/common/form-validation.md#note-validation)
 
@@ -18,15 +18,15 @@ Telerik UI for Blazor provides different ways to show and customize validation m
 
 Telerik provides the following validation tools to help you style your form validation:
 
-* [Validation Summary]({%slug validation-tools-summary%})
-* [Validation Message]({%slug validation-tools-message%})
-* [Validation Tooltip]({%slug validation-tools-tooltip%})
+* [Validation Summary](slug://validation-tools-summary)
+* [Validation Message](slug://validation-tools-message)
+* [Validation Tooltip](slug://validation-tools-tooltip)
 
 These components add customization options on top of the standard validation tools the frameworks provides - `ValidationSummary` and `ValidationMessage`
 
 ## Integration with the TelerikForm
 
-You can seamlessly integrate the validation tools with the [Form Component]({%slug form-overview%}). To avoid duplication of validation messages, set the [ValidationMessageType]({%slug form-overview%}#form-parameters) parameter of the form to `FormValidationMessageType.None`. You can also use the validation components in [templates with custom editors]({%slug form-formitems-template%}) that you can define with your own code.
+You can seamlessly integrate the validation tools with the [Form Component](slug://form-overview). To avoid duplication of validation messages, set the [ValidationMessageType](slug://form-overview#form-parameters) parameter of the form to `FormValidationMessageType.None`. You can also use the validation components in [templates with custom editors](slug://form-formitems-template) that you can define with your own code.
 
 ````RAZOR
 @* Disable the default validation messages from the Telerik Form and use the validation tools instead *@
@@ -124,11 +124,11 @@ You can seamlessly integrate the validation tools with the [Form Component]({%sl
 
 # Next Steps
 
-* Explore [TelerikValidationSummary]({%slug validation-tools-summary%})
-* Use [TelerikValidationMessage]({%slug validation-tools-message%})
-* Try [TelerikValidationTooltip]({%slug validation-tools-tooltip%})
+* Explore [TelerikValidationSummary](slug://validation-tools-summary)
+* Use [TelerikValidationMessage](slug://validation-tools-message)
+* Try [TelerikValidationTooltip](slug://validation-tools-tooltip)
 
 ## See Also
 
 * [Live Demo: Validation](https://demos.telerik.com/blazor-ui/validation/overview)
-* [Form Component]({%slug form-overview%})
+* [Form Component](slug://form-overview)
diff --git a/components/validation/summary.md b/components/validation/summary.md
index 624b47f93f..d2a3d6e4f3 100644
--- a/components/validation/summary.md
+++ b/components/validation/summary.md
@@ -185,10 +185,10 @@ Use the `Class` parameter of the Validation Summary component to add a custom CS
 
 ## Next Steps
 
-* Use [TelerikValidationMessage]({%slug validation-tools-message%})
-* Try [TelerikValidationTooltip]({%slug validation-tools-tooltip%})
+* Use [TelerikValidationMessage](slug://validation-tools-message)
+* Try [TelerikValidationTooltip](slug://validation-tools-tooltip)
 
 ## See Also
 
 * [Live Demo: Validation](https://demos.telerik.com/blazor-ui/validation/overview)
-* [Form Component]({%slug form-overview%})
+* [Form Component](slug://form-overview)
diff --git a/components/validation/tooltip.md b/components/validation/tooltip.md
index d1469f6e5b..6a9ef78b93 100644
--- a/components/validation/tooltip.md
+++ b/components/validation/tooltip.md
@@ -16,7 +16,7 @@ The <a href = "https://www.telerik.com/blazor-ui/validationtooltip" target="_bla
 
 To enable Telerik Validation Tooltip for a field in the Telerik Form:
 
-1. Add a `<TelerikValidationTooltip>` tag inside the TelerikForm `<FormItems>` tag, or [inside a form item `<Template>`]({%slug form-formitems-template%}).
+1. Add a `<TelerikValidationTooltip>` tag inside the TelerikForm `<FormItems>` tag, or [inside a form item `<Template>`](slug://form-formitems-template).
 1. Provide a lambda expression in the `For` parameter that sets the associated property of the model, just like with the standard Blazor `ValidationMessage`.
 1. Set the `TargetSelector` parameter to a CSS selector that points to the element(s) the Tooltip will associate itself with.
 1. (optional) Disable the built-in validation messages of the Telerik Form to avoid repetition. Set `ValidationMessageType="@FormValidationMessageType.None"`.
@@ -64,7 +64,7 @@ To enable Telerik Validation Tooltip for a field in the Telerik Form:
 }
 ````
 
->tip The Telerik Form can provide tooltips out-of-the-box with a single setting - see [Form Validation - Validation Message Type]({%slug form-validation%}#validation-message-type). Use standalone validation tooltips only to make more advanced customizations such as the ones in this article.
+>tip The Telerik Form can provide tooltips out-of-the-box with a single setting - see [Form Validation - Validation Message Type](slug://form-validation#validation-message-type). Use standalone validation tooltips only to make more advanced customizations such as the ones in this article.
 
 ## Using Validation Tooltip with EditForm
 
@@ -273,6 +273,6 @@ Use the `Class` parameter of the Validation Tooltip to add a custom CSS class to
 ## See Also
 
 * [Live Demo: Validation](https://demos.telerik.com/blazor-ui/validation/overview)
-* [TelerikValidationSummary]({%slug validation-tools-summary%})
-* [TelerikValidationTooltip]({%slug validation-tools-message%})
-* [Form Component]({%slug form-overview%})
+* [TelerikValidationSummary](slug://validation-tools-summary)
+* [TelerikValidationTooltip](slug://validation-tools-message)
+* [Form Component](slug://form-overview)
diff --git a/components/window/accessibility/overview.md b/components/window/accessibility/overview.md
index ec8ac80d8d..b5d1e52ff3 100644
--- a/components/window/accessibility/overview.md
+++ b/components/window/accessibility/overview.md
@@ -15,9 +15,9 @@ The UI for Blazor Window component is <a href="https://www.w3.org/TR/WCAG22" tar
 
 WCAG 2.2 introduces the <a href="https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements" target="_blank">"Dragging Movements"</a> criterion as an important part of the Operable principle. Its primary goal is to guarantee that any feature reliant on drag actions offers an alternative method that can be executed with a single click, enhancing user accessibility.
 
-The illustrative example below shows the window resize action, achievable through the [Dialog]({%slug dialog-overview%}) and window position change through a button. Telerik UI for Blazor to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
+The illustrative example below shows the window resize action, achievable through the [Dialog](slug://dialog-overview) and window position change through a button. Telerik UI for Blazor to offer a versatile API that allows users to trigger all functions programmatically or externally, meeting diverse accessibility requirements for any applications.
 
-The following example demonstrates the [accessibility compliance of the Window component]({%slug window-wai-aria-support%}). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch]({%slug accessibility-overview%}#color-contrast).
+The following example demonstrates the [accessibility compliance of the Window component](slug://window-wai-aria-support). The described level of compliance is achievable with the [Ocean Blue A11y Accessibility Swatch](slug://accessibility-overview#color-contrast).
 
 >caption Window accessibility compliance example
 
diff --git a/components/window/accessibility/wai-aria-support.md b/components/window/accessibility/wai-aria-support.md
index 2687182690..41aafba37c 100644
--- a/components/window/accessibility/wai-aria-support.md
+++ b/components/window/accessibility/wai-aria-support.md
@@ -69,4 +69,4 @@ For details on how the Window keyboard navigation works, refer to the [Blazor Wi
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/window/actions.md b/components/window/actions.md
index 6dc2f0aa64..5a64f56d59 100644
--- a/components/window/actions.md
+++ b/components/window/actions.md
@@ -32,7 +32,7 @@ Action buttons expose the following properties:
 | `Name` | `string` | The name of the action. Can be one of the built-in actions (see above), or a custom action name. |
 | `Hidden` | `bool` | Sets if the action button is rendered. Do not use for `Minimize` and `Maximize` actions - the Window manages their visibility internally, based on the component state. Check the example below for a possible alternative. |
 | `OnClick` | `EventCallback<MouseEventArgs>` | An event handler to respond to custom action clicks. |
-| `Icon` | `string` | The CSS class of the icon to be rendered. Use with the [Telerik font icons]({%slug common-features-icons%}), or set your own font icon class. |
+| `Icon` | `string` | The CSS class of the icon to be rendered. Use with the [Telerik font icons](slug://common-features-icons), or set your own font icon class. |
 | `Title` | `string` | The `title` HTML attribute of the action button. |
 
 
@@ -153,4 +153,4 @@ You can mix custom actions with built-in actions, and you do not have to define
 ## See Also
 
 * [(Demo) Window Actions](https://demos.telerik.com/blazor-ui/window/actions)
-* [(KB) Keep Content in the DOM When the Window Is Closed]({%slug window-kb-keep-content-when-closed%})
+* [(KB) Keep Content in the DOM When the Window Is Closed](slug://window-kb-keep-content-when-closed)
diff --git a/components/window/draggable.md b/components/window/draggable.md
index 537fd49492..e8d28f2f6a 100644
--- a/components/window/draggable.md
+++ b/components/window/draggable.md
@@ -14,7 +14,7 @@ You can move the Window for Blazor by dragging its titlebar with the mouse or wi
 
 **Moving** the Window is **enabled by default** and you can stop it by setting the `Draggable` parameter of the Window component to `false`.
 
->important If you set the `Left` and `Top` parameters, you must use two-way binding for them (or update their values in the corresponding [events]({%slug window-events%})), otherwise the old information in the view-model will reset the position of the window.
+>important If you set the `Left` and `Top` parameters, you must use two-way binding for them (or update their values in the corresponding [events](slug://window-events)), otherwise the old information in the view-model will reset the position of the window.
 
 ````RAZOR
 @* Movable windows *@
diff --git a/components/window/events.md b/components/window/events.md
index b8a3613892..04c4b124ae 100644
--- a/components/window/events.md
+++ b/components/window/events.md
@@ -204,7 +204,7 @@ You can use the `WidthChanged` and `HeightChanged` events to get notifications w
 
 ## Action Click
 
-Window actions expose the `OnClick` event. You can use it to implement custom buttons that invoke application logic from the Window's titlebar. See the [Window Actions]({%slug components/window/actions%}) article for examples.
+Window actions expose the `OnClick` event. You can use it to implement custom buttons that invoke application logic from the Window's titlebar. See the [Window Actions](slug://components/window/actions) article for examples.
 
 If you use the `OnClick` event on a built-in action, it will act as a custom action and it will no longer perform the built-in feature (for example, close the window). If you want the invoke both a built-in action and custom logic from the same button, you have two options:
 
@@ -214,7 +214,7 @@ If you use the `OnClick` event on a built-in action, it will act as a custom act
 
 ## LeftChanged and TopChanged
 
-These two events fire when the user finishes [moving the window]({%slug window-draggable%}). If you set the `Top` and `Left` parameters of the window, you must update their values in these events - either by handling them yourself, or through using two-way binding.
+These two events fire when the user finishes [moving the window](slug://window-draggable). If you set the `Top` and `Left` parameters of the window, you must update their values in these events - either by handling them yourself, or through using two-way binding.
 
 The values will be in pixels, in a `string` format, rounded to one decimal place.
 
@@ -269,7 +269,7 @@ The `LeftChanged` event fires second, so if you intend to store locations in an
 
 ## See Also
 
-* [Window Overview]({%slug window-overview%})
-* [Window State]({%slug components/window/size%})
-* [Window Actions]({%slug components/window/actions%})
-* [Focus TextBox on Window Open]({%slug window-kb-focus-button-textbox-on-open%})
+* [Window Overview](slug://window-overview)
+* [Window State](slug://components/window/size)
+* [Window Actions](slug://components/window/actions)
+* [Focus TextBox on Window Open](slug://window-kb-focus-button-textbox-on-open)
diff --git a/components/window/overview.md b/components/window/overview.md
index 7f29cc2dfc..a8c91239d8 100644
--- a/components/window/overview.md
+++ b/components/window/overview.md
@@ -20,7 +20,7 @@ The Window component displays a popup with a title bar and shows custom content.
 1. Bind the `Visible` parameter to a `bool` property. It supports one-way and two-way binding.
 1. Add content to the `WindowContent` child tag.
 1. (optional) Add some title inside a `WindowTitle` tag. HTML markup and child components are supported, too.
-1. (optional) Add a [`Close` action]({%slug components/window/actions%}) inside a `<WindowActions>` tag.
+1. (optional) Add a [`Close` action](slug://components/window/actions) inside a `<WindowActions>` tag.
 1. (optional) Add a `WindowFooter` tag to include custom content in the bottom section of the Window.
 
 >caption Basic Blazor Window
@@ -50,31 +50,31 @@ The Window component displays a popup with a title bar and shows custom content.
 
 ## Size
 
-The Window can occupy a predefined size on the screen or expand automatically based on the content. By default, users can resize the Window. [Read more about the Blazor Window size...]({%slug components/window/size%})
+The Window can occupy a predefined size on the screen or expand automatically based on the content. By default, users can resize the Window. [Read more about the Blazor Window size...](slug://components/window/size)
 
-You can make the Window component responsive and allow it to adapt to different screen sizes and changes in the browser window. Here is an [example that shows the two possible ways to achieve responsive Window behavior]({%slug window-kb-responsive%}). The first method involves utilizing the `Width` and `Height` parameters of the component. The second method is to apply custom CSS styles.
+You can make the Window component responsive and allow it to adapt to different screen sizes and changes in the browser window. Here is an [example that shows the two possible ways to achieve responsive Window behavior](slug://window-kb-responsive). The first method involves utilizing the `Width` and `Height` parameters of the component. The second method is to apply custom CSS styles.
 
 ## Position
 
 You can set the position of the Window with the `Top` and `Left` parameters. The component features a boolean `Centered` parameter, which is `true` by default when `Top` and `Left` are not set. The Window component also provides a `ContainmentSelector` parameter that can limit resizing and dragging within the boundaries of a specified container.
 
-Read more about the [Blazor Window position...]({%slug components/window/position%})
+Read more about the [Blazor Window position...](slug://components/window/position)
 
 ## Actions
 
-You can maximize, minimize, or close the Window through the action buttons in its titlebar. [Read more about the Blazor Window action buttons...]({%slug components/window/actions%})
+You can maximize, minimize, or close the Window through the action buttons in its titlebar. [Read more about the Blazor Window action buttons...](slug://components/window/actions)
 
 ## Dragging
 
-You can move the Window on the page by dragging its titlebar. [Read more about the Blazor Window dragging option...]({%slug window-draggable%})
+You can move the Window on the page by dragging its titlebar. [Read more about the Blazor Window dragging option...](slug://window-draggable)
 
 ## Modal
 
-The Window can be modal and prevent interacting with the rest of the page until it closes. [Read more about the Blazor Window Modal...]({%slug components/window/modal%})
+The Window can be modal and prevent interacting with the rest of the page until it closes. [Read more about the Blazor Window Modal...](slug://components/window/modal)
 
 ## Events
 
-The Window component fires events for visibility, state, size, and position changes. Use these events to respond to user actions. [Read more about the Blazor Window Events...]({%slug window-events%})
+The Window component fires events for visibility, state, size, and position changes. Use these events to respond to user actions. [Read more about the Blazor Window Events...](slug://window-events)
 
 ## Window Parameters
 
@@ -85,7 +85,7 @@ The following table lists the Window parameters. Also check the [Window API](/bl
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
 | `Centered` | `bool` <br /> (`true`) | Determines if the Window displays in the middle of the viewport. This parameter is ignored if `Top` or `Left` is set to a non-empty string. |
-| `Class` | `string` | The custom CSS class of the `<div class="k-window">` element. Use it to [override theme styles]({%slug themes-override%}). Here is a [custom Window styling example]({%slug window-kb-custom-css-styling%}). |
+| `Class` | `string` | The custom CSS class of the `<div class="k-window">` element. Use it to [override theme styles](slug://themes-override). Here is a [custom Window styling example](slug://window-kb-custom-css-styling). |
 | `CloseOnOverlayClick` | `bool` | Sets if a modal Window will close when the user clicks on the modal overlay that covers the rest of the page content. |
 | `ContainmentSelector` | `string` | A CSS selector that points to a unique HTML element on the page. The Window will render inside the specified container. Window resizing and dragging will be restricted by the boundaries of the specified container. Do not use `ContainmentSelector` with modal Windows. |
 | `Draggable` | `bool` | Sets if the Window allows moving. |
@@ -97,7 +97,7 @@ The following table lists the Window parameters. Also check the [Window API](/bl
 | `MinHeight` | `string` | The minimum height of the Window during resizing or initial display. |
 | `MinWidth` | `string` | The maximum width of the Window during resizing or initial display. |
 | `Modal` | `bool` | Determines if the Window covers the other page content with a semi-transparent overlay. Do not use modality with `ContainmentSelector`. |
-| `PersistContent` | `bool` | Determines if a [minimized Window]({%slug components/window/size%}#maximize-and-minimize) removes its content from the DOM (default) or hides it with CSS. |
+| `PersistContent` | `bool` | Determines if a [minimized Window](slug://components/window/size#maximize-and-minimize) removes its content from the DOM (default) or hides it with CSS. |
 | `Resizable` | `bool` <br /> (`true`) | Determines if the Window allows users to change its dimensions. |
 | `Size` | `string` | A predefined Window width. Use the string members of the static class `ThemeConstants.Window.Size` - `Small`, `Medium`, and `Large`. They translate to widths of `300px`, `800px` and `1200px`, respectively. If set, the `Width` parameter will take precedence over `Size`. |
 | `State` | `WindowState` enum <br /> (`Default`) | The Window state can be `Maximized`, `Minimized`, or `Default`. The parameter supports two-way binding. |
@@ -155,25 +155,25 @@ The Window methods are accessible through its reference.
 
 ## Important Notes
 
-When [`ContainmentSelector`]({%slug components/window/position%}#containmentselector) is not set, the Telerik Window component renders as a child of the [`TelerikRootComponent`]({%slug rootcomponent-overview%}) at the root of the Blazor app. This placement ensures that the Window can show over all the other page content in all scenarios and have a correct position.
+When [`ContainmentSelector`](slug://components/window/position#containmentselector) is not set, the Telerik Window component renders as a child of the [`TelerikRootComponent`](slug://rootcomponent-overview) at the root of the Blazor app. This placement ensures that the Window can show over all the other page content in all scenarios and have a correct position.
 
 In Blazor, however, the render tree structure may be important. In some cases, the special Window placement may put you in one of the following situations:
 
-* [Block all content with a Window]({%slug window-kb-block-all-content%})
-* [CascadingParameter Value is null in the Window]({%slug window-cascading-parameter-null%})
-* [The Window does not display its child items data]({%slug window-kb-does-not-display-child-items-data%})
-* [Returning data from a Window does not update the parent]({%slug window-does-not-update-parent%})
-* [Using an EditContext for a form holding a Window requires updating the EditContext]({%slug window-in-form-edit-context%})
+* [Block all content with a Window](slug://window-kb-block-all-content)
+* [CascadingParameter Value is null in the Window](slug://window-cascading-parameter-null)
+* [The Window does not display its child items data](slug://window-kb-does-not-display-child-items-data)
+* [Returning data from a Window does not update the parent](slug://window-does-not-update-parent)
+* [Using an EditContext for a form holding a Window requires updating the EditContext](slug://window-in-form-edit-context)
 
 ## Next Steps
 
-* [Define Window actions]({%slug components/window/actions%})
-* [Configure the Window position]({%slug components/window/position%})
-* [Set the Window size, minimized, and maximized state]({%slug components/window/size%})
-* [Handle Window events]({%slug window-events%})
+* [Define Window actions](slug://components/window/actions)
+* [Configure the Window position](slug://components/window/position)
+* [Set the Window size, minimized, and maximized state](slug://components/window/size)
+* [Handle Window events](slug://window-events)
 
 ## See Also
 
 * [Live Demo: Window](https://demos.telerik.com/blazor-ui/window/overview)
 * [Window API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikWindow)
-* [Comparison between All Popup Components]({%slug common-kb-popup-component-comparison%})
+* [Comparison between All Popup Components](slug://common-kb-popup-component-comparison)
diff --git a/components/window/position.md b/components/window/position.md
index c7e4daae7a..dcbfd78c7e 100644
--- a/components/window/position.md
+++ b/components/window/position.md
@@ -16,7 +16,7 @@ The Window offers several ways to control its position:
 * [`ContainmentSelector` parameter](#containmentselector)
 * [`Top` and `Left` parameters](#top-and-left)
 
-The Window renders [in the root of the application]({%slug window-overview%}#important-notes) or in its [containment element](#containmentselector). If the app is using special CSS positioning, margins, or other offsets on the Window ancestors, these CSS styles may [affect the position of the Window]({%slug troubleshooting-general-issues%}#wrong-popup-position).
+The Window renders [in the root of the application](slug://window-overview#important-notes) or in its [containment element](#containmentselector). If the app is using special CSS positioning, margins, or other offsets on the Window ancestors, these CSS styles may [affect the position of the Window](slug://troubleshooting-general-issues#wrong-popup-position).
 
 
 ## Centered
@@ -57,7 +57,7 @@ By default, users can drag and resize the Window without constraints. You can re
 1. Set the Window `ContainmentSelector` parameter to a unique CSS selector, which points to the container.
 1. Apply a `position:relative` style to the container.
 
-In this case, the Window will render inside the specified container and not as a child of the [`TelerikRootComponent`]({%slug rootcomponent-overview%}).
+In this case, the Window will render inside the specified container and not as a child of the [`TelerikRootComponent`](slug://rootcomponent-overview).
 
 >caption Using ContainmentSelector to limit Window dragging and resizing
 
diff --git a/components/window/size.md b/components/window/size.md
index 9f20287481..5549dacf49 100644
--- a/components/window/size.md
+++ b/components/window/size.md
@@ -19,7 +19,7 @@ The Window offers different features to control its size:
 
 ## Width and Height
 
-If you know the size you need, just set the `Width` or `Height` parameters. They can take valid CSS values (see the [Dimensions]({%slug common-features/dimensions%}) article).
+If you know the size you need, just set the `Width` or `Height` parameters. They can take valid CSS values (see the [Dimensions](slug://common-features/dimensions) article).
 
 The Window also provides parameters that control its dimensions in a more flexible way:
 
@@ -30,7 +30,7 @@ The Window also provides parameters that control its dimensions in a more flexib
 
 Min/max dimensions take precedence over [user resizing](#resizing) and `Width` / `Height` settings.
 
-If no dimensions are set, the Window will expand, according to its contents, like any other `<div>` element. This may affect the [Window's positioning]({%slug components/window/position%}).
+If no dimensions are set, the Window will expand, according to its contents, like any other `<div>` element. This may affect the [Window's positioning](slug://components/window/position).
 
 If you set dimensions and the Window content does not fit, scrollbars will show.
 
@@ -60,7 +60,7 @@ If you set dimensions and the Window content does not fit, scrollbars will show.
 
 ## Maximize and Minimize
 
-The user can maximize and minimize the Window through [action buttons in its titlebar]({%slug components/window/actions%}).
+The user can maximize and minimize the Window through [action buttons in its titlebar](slug://components/window/actions).
 
 You can invoke those actions by setting the `State` parameter. It takes a member of the `Telerik.Blazor.WindowState` enum:
 
@@ -69,7 +69,7 @@ You can invoke those actions by setting the `State` parameter. It takes a member
 | `WindowState`&nbsp;Value | Description |
 | --- | --- |
 | `Default` | The size and position will depend on the `Top`, `Left`, `Centered`, `Width`, `Height`, `Size` parameters. |
-| `Minimized` | The Window will show its titlebar only. The component will dispose its content and remove it from the page DOM. If you prefer to just hide the Window content with CSS, [set `PersistContent` to `true`]({%slug window-overview%}#window-parameters). |
+| `Minimized` | The Window will show its titlebar only. The component will dispose its content and remove it from the page DOM. If you prefer to just hide the Window content with CSS, [set `PersistContent` to `true`](slug://window-overview#window-parameters). |
 | `Maximized` | The Window will take up the entire viewport. |
 
 >caption Maximize, Minimize and Restore the Window programmatically
@@ -107,7 +107,7 @@ You can invoke those actions by setting the `State` parameter. It takes a member
 }
 ````
 
->tip With a maximized window you may want to ensure all other content stays "behind" it. To do that, see the [Block all content with a Window]({%slug window-kb-block-all-content%}) article on ensuring that the CSS rules in the project can enable that.
+>tip With a maximized window you may want to ensure all other content stays "behind" it. To do that, see the [Block all content with a Window](slug://window-kb-block-all-content) article on ensuring that the CSS rules in the project can enable that.
 
 
 ## Resizing
diff --git a/components/wizard/accessibility/wai-aria-support.md b/components/wizard/accessibility/wai-aria-support.md
index 5e13365292..fb14d5464f 100644
--- a/components/wizard/accessibility/wai-aria-support.md
+++ b/components/wizard/accessibility/wai-aria-support.md
@@ -79,4 +79,4 @@ For details on how the Wizard keyboard navigation works, refer to the [Blazor Wi
 
 ## See Also
 
-* [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
\ No newline at end of file
+* [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
\ No newline at end of file
diff --git a/components/wizard/events.md b/components/wizard/events.md
index 94ce560d91..9cd7f217f8 100644
--- a/components/wizard/events.md
+++ b/components/wizard/events.md
@@ -23,7 +23,7 @@ The `OnChange` event is triggered on the current step and fires before the step
 * `TargetIndex` - contains the index of the targeted new Wizard step.
 * `IsCancelled` - specifies whether the event is canceled and the built-in action is prevented.
 
->[Custom Wizard buttons]({%slug wizard-structure-buttons%}#custom-buttons) do not trigger the `OnChange` event. See section [Execute Business Logic With Custom Wizard Buttons]({%slug wizard-structure-buttons%}#execute-business-logic-with-custom-wizard-buttons).
+>[Custom Wizard buttons](slug://wizard-structure-buttons#custom-buttons) do not trigger the `OnChange` event. See section [Execute Business Logic With Custom Wizard Buttons](slug://wizard-structure-buttons#execute-business-logic-with-custom-wizard-buttons).
 
 The `OnChange` event handler is defined in the respective `<WizardStep>` tag.
 
@@ -126,7 +126,7 @@ The `ValueChanged` event fires after the [`OnChange`](#onchange) event, if the l
 
 The `OnFinish` event fires when the **Done** button of the Wizard is clicked.
 
->[Custom Wizard buttons]({%slug wizard-structure-buttons%}#custom-buttons) do not trigger the `OnFinish` event. See section [Execute Business Logic With Custom Wizard Buttons]({%slug wizard-structure-buttons%}#execute-business-logic-with-custom-wizard-buttons).
+>[Custom Wizard buttons](slug://wizard-structure-buttons#custom-buttons) do not trigger the `OnFinish` event. See section [Execute Business Logic With Custom Wizard Buttons](slug://wizard-structure-buttons#execute-business-logic-with-custom-wizard-buttons).
 
 >caption Handle the `OnFinish` event of the Wizard (code snippet below)
 
diff --git a/components/wizard/form-integration.md b/components/wizard/form-integration.md
index 474cd11122..9314f6ec95 100644
--- a/components/wizard/form-integration.md
+++ b/components/wizard/form-integration.md
@@ -10,11 +10,11 @@ position: 5
 
 # Form Integration
 
-The Wizard component provides integration with the [Telerik Form]({%slug form-overview%}).
+The Wizard component provides integration with the [Telerik Form](slug://form-overview).
 
-Each step of the Wizard can include an instance of Telerik Form inside its `Content` tag. You will be able to use all the built-in features of the Form including its [Validation]({%slug form-validation%}) to achieve the desired Wizard configuration.
+Each step of the Wizard can include an instance of Telerik Form inside its `Content` tag. You will be able to use all the built-in features of the Form including its [Validation](slug://form-validation) to achieve the desired Wizard configuration.
 
-If the Form validation is not satisfied, you can cancel the `OnChange` event of the step and prevent the user from moving to the next step until the Form is valid. To even improve the UX, you can also toggle the [`Valid`]({%slug wizard-structure-stepper%}#valid) or [`Disabled`]({%slug wizard-structure-stepper%}#disabled) parameters to add another visual aspect in the validation process.
+If the Form validation is not satisfied, you can cancel the `OnChange` event of the step and prevent the user from moving to the next step until the Form is valid. To even improve the UX, you can also toggle the [`Valid`](slug://wizard-structure-stepper#valid) or [`Disabled`](slug://wizard-structure-stepper#disabled) parameters to add another visual aspect in the validation process.
 
 
 >caption Integrate a Form component in the Telerik Wizard. Use its validation state to control the `Valid` parameter of the Steps. The result from the snippet.
diff --git a/components/wizard/layout.md b/components/wizard/layout.md
index f02579809c..f9ed440efd 100644
--- a/components/wizard/layout.md
+++ b/components/wizard/layout.md
@@ -10,7 +10,7 @@ position: 10
 
 # Wizard Layout
 
-The Wizard component allows you to control its layout. By default, the internal stepper is rendered on top of the Wizard [content]({%slug wizard-structure-content%}). You can customize its position through the `StepperPosition` the `TelerikWizard` exposes. It takes a member if the `WizardStepperPosition` enum:
+The Wizard component allows you to control its layout. By default, the internal stepper is rendered on top of the Wizard [content](slug://wizard-structure-content). You can customize its position through the `StepperPosition` the `TelerikWizard` exposes. It takes a member if the `WizardStepperPosition` enum:
 
 * `Top` (the default)
 * `Bottom`
diff --git a/components/wizard/overview.md b/components/wizard/overview.md
index 549ae3b46e..5c0fb421a8 100644
--- a/components/wizard/overview.md
+++ b/components/wizard/overview.md
@@ -12,14 +12,14 @@ position: 0
 
 The <a href = "https://www.telerik.com/blazor-ui/wizard" target="_blank">Wizard for Blazor component</a> displays content in sequential, stepwise order. Each Wizard step can display any HTML or child components. The Wizard provides flexible layout, form integration and can prevent or allow users to skip steps.
 
-The Wizard uses a [Stepper component]({%slug stepper-overview%}) internally, so knowledge about the Stepper will be a plus, although not required.
+The Wizard uses a [Stepper component](slug://stepper-overview) internally, so knowledge about the Stepper will be a plus, although not required.
 
 ## Creating Blazor Wizard
 
 1. Use the `TelerikWizard` tag
 1. Set the `Value` parameter to an `int`. The parameter supports one-way and two-way binding.
 1. Add some `WizardStep` instances inside a `WizardSteps` tag.
-1. Each `WizardStep` can define a `Label` and an [`Icon`]({%slug common-features-icons%}). Additional [stepper image or text indicators]({%slug wizard-structure-stepper%}#indicators) are discussed later.
+1. Each `WizardStep` can define a `Label` and an [`Icon`](slug://common-features-icons). Additional [stepper image or text indicators](slug://wizard-structure-stepper#indicators) are discussed later.
 
 >caption Basic Telerik Wizard
 
@@ -53,27 +53,27 @@ The Wizard uses a [Stepper component]({%slug stepper-overview%}) internally, so
 
 ## Stepper
 
-The [Wizard Stepper]({%slug wizard-structure-stepper%}) is the area, which shows the user the overall progress. The Stepper can also allow the user to skip steps, if this is enabled explicitly. [Read more about the Wizard Stepper]({%slug wizard-structure-stepper%}).
+The [Wizard Stepper](slug://wizard-structure-stepper) is the area, which shows the user the overall progress. The Stepper can also allow the user to skip steps, if this is enabled explicitly. [Read more about the Wizard Stepper](slug://wizard-structure-stepper).
 
 ## Content
 
-The [`<Content>` tag inside each `WizardStep`]({%slug wizard-structure-content%}) is a standard Blazor `RenderFragment`, which allows any child content.
+The [`<Content>` tag inside each `WizardStep`](slug://wizard-structure-content) is a standard Blazor `RenderFragment`, which allows any child content.
 
 ## Buttons
 
-The [Wizard Buttons]({%slug wizard-structure-buttons%}) enable the user to move forward and backward through the Wizard Steps. The Wizard provides the ability to use the built-in buttons or custom buttons. [Read more about the Wizard Buttons]({%slug wizard-structure-buttons%}).
+The [Wizard Buttons](slug://wizard-structure-buttons) enable the user to move forward and backward through the Wizard Steps. The Wizard provides the ability to use the built-in buttons or custom buttons. [Read more about the Wizard Buttons](slug://wizard-structure-buttons).
 
 ## Form Integration
 
-The [Wizard can contain a Form component with validation]({%slug form-overview%}). In such scenarios, the Wizard Stepper can enhance the form's user experience by changing the step's icon to show the current form validation state.
+The [Wizard can contain a Form component with validation](slug://form-overview). In such scenarios, the Wizard Stepper can enhance the form's user experience by changing the step's icon to show the current form validation state.
 
 ## Events
 
-The [Wizard component fires events]({%slug wizard-events%}) when the current step changes or when the user completes all steps. Step changes can be canceled.
+The [Wizard component fires events](slug://wizard-events) when the current step changes or when the user completes all steps. Step changes can be canceled.
 
 ## Layout
 
-The [Wizard can display its Stepper on either side of the component]({%slug wizard-layout%}) - top (defaut) or bottom, left or right.
+The [Wizard can display its Stepper on either side of the component](slug://wizard-layout) - top (defaut) or bottom, left or right.
 
 ## Wizard Parameters
 
@@ -81,26 +81,26 @@ The [Wizard can display its Stepper on either side of the component]({%slug wiza
 
 | Parameter | Type and Default&nbsp;Value | Description |
 | --- | --- | --- |
-| `Class` | `string` | Renders a custom CSS class to the `<div class="k-wizard">` element. Use it to [override theme styles]({%slug themes-override%}). |
-| `Height` | `string` | Applies a height style in [any supported unit]({%slug common-features/dimensions%}). |
+| `Class` | `string` | Renders a custom CSS class to the `<div class="k-wizard">` element. Use it to [override theme styles](slug://themes-override). |
+| `Height` | `string` | Applies a height style in [any supported unit](slug://common-features/dimensions). |
 | `ShowPager` | `bool` <br /> (`true`) | Renders a "Step X of Y" label at the bottom of the component. |
-| `StepperPosition` | `WizardStepperPosition` enum <br /> (`Top`) | Defines the [Wizard layout and the Stepper position]({%slug wizard-layout%}) with regard to the step content. |
+| `StepperPosition` | `WizardStepperPosition` enum <br /> (`Top`) | Defines the [Wizard layout and the Stepper position](slug://wizard-layout) with regard to the step content. |
 | `Value` | `int` | Sets the **zero-based** index of the current step. Supports two-way binding. |
-| `Width` | `string` | Applies a width style in [any supported unit]({%slug common-features/dimensions%}). |
+| `Width` | `string` | Applies a width style in [any supported unit](slug://common-features/dimensions). |
 
 ### WizardStepperSettings Parameters
 
-See section [General Stepper Settings]({%slug wizard-structure-stepper%}#general-stepper-settings).
+See section [General Stepper Settings](slug://wizard-structure-stepper#general-stepper-settings).
 
 ### WizardStep Parameters
 
-See section [Individual Stepper Settings]({%slug wizard-structure-stepper%}#individual-stepper-settings).
+See section [Individual Stepper Settings](slug://wizard-structure-stepper#individual-stepper-settings).
 
 ## Next Steps
 
-* [Explore the Wizard Stepper settings]({%slug wizard-structure-stepper%})
-* [Handle Wizard events]({%slug wizard-events%})
-* [Integrate the Wizard with a Form]({%slug form-overview%})
+* [Explore the Wizard Stepper settings](slug://wizard-structure-stepper)
+* [Handle Wizard events](slug://wizard-events)
+* [Integrate the Wizard with a Form](slug://form-overview)
 
 ## See Also
 
diff --git a/components/wizard/structure/buttons.md b/components/wizard/structure/buttons.md
index 4da372d495..b8b4ddd389 100644
--- a/components/wizard/structure/buttons.md
+++ b/components/wizard/structure/buttons.md
@@ -24,16 +24,16 @@ In this article:
 The Wizard provides the following default buttons:
 
 * `Next` - navigates to the next step of the Wizard. If the next step is <strong>disabled</strong>, the button will also appear as disabled. If the next step is <strong>enabled</strong> the following process will be triggered:
-    * Invoke [`OnStepChange`]({%slug wizard-events%}#onchange),
+    * Invoke [`OnStepChange`](slug://wizard-events#onchange),
     * Go to the next page (if the event is not canceled from `event args`)
-    * Invoke [`ValueChanged`]({%slug wizard-events%}#valuechanged) after the step is changed
+    * Invoke [`ValueChanged`](slug://wizard-events#valuechanged) after the step is changed
 
 * `Previous` - navigates to the previous step of the Wizard. If the previous step is <strong>disabled</strong>, the button will also appear as disabled. If the previous step is <strong>enabled</strong> the following process will be triggered:
-    * Invoke [`OnStepChange`]({%slug wizard-events%}#onchange),
+    * Invoke [`OnStepChange`](slug://wizard-events#onchange),
     * Go to the previous page (if the event is not canceled from `event args`)
-    * Invoke [`ValueChanged`]({%slug wizard-events%}#valuechanged) after the step is changed
+    * Invoke [`ValueChanged`](slug://wizard-events#valuechanged) after the step is changed
 
-* `Done` - allows the user to complete the wizard. Invokes the [OnFinish]({%slug wizard-events%}#onfinish) event.
+* `Done` - allows the user to complete the wizard. Invokes the [OnFinish](slug://wizard-events#onfinish) event.
 
 >caption Wizard with default buttons
 
@@ -69,7 +69,7 @@ The Wizard component allows you to include your custom buttons. You can define t
 
 This configuration overrides the whole rendering of the bottom-right section of the Wizard, including the built-in buttons and thus provides a full control over it. If you want to include Next and Previous buttons as per the default setup of the Wizard, you need to also add them inside the `WizardButtons`.
 
->Custom Wizard buttons do not trigger the component [`OnChange`]({%slug wizard-events%}#onchange) and [`OnFinish`]({%slug wizard-events%}#onfinish) events. See section [Execute Business Logic With Custom Wizard Buttons](#execute-business-logic-with-custom-wizard-buttons) below.
+>Custom Wizard buttons do not trigger the component [`OnChange`](slug://wizard-events#onchange) and [`OnFinish`](slug://wizard-events#onfinish) events. See section [Execute Business Logic With Custom Wizard Buttons](#execute-business-logic-with-custom-wizard-buttons) below.
 
 >caption Wizard with custom buttons (code snippet below)
 
@@ -124,11 +124,11 @@ This configuration overrides the whole rendering of the bottom-right section of
 
 ### Execute Business Logic With Custom Wizard Buttons
 
-The built-in (default) Wizard buttons fire the Wizard [`OnChange`]({%slug wizard-events%}#onchange) and [`OnFinish`]({%slug wizard-events%}#onfinish) events. This allows the app to execute custom business logic and guide the user to the next or previous step under certain conditions.
+The built-in (default) Wizard buttons fire the Wizard [`OnChange`](slug://wizard-events#onchange) and [`OnFinish`](slug://wizard-events#onfinish) events. This allows the app to execute custom business logic and guide the user to the next or previous step under certain conditions.
 
-Custom Wizard buttons cannot fire the `OnChange` and `OnFinish` events. As a result, custom business logic should be implemented in the `OnClick` events of the buttons. On the other hand, the [Wizard Stepper]({%slug wizard-structure-stepper%}) always fires the Wizard `OnChange` event. This creates a situation where user navigation can trigger different events. To execute business logic between steps, use one of the following options:
+Custom Wizard buttons cannot fire the `OnChange` and `OnFinish` events. As a result, custom business logic should be implemented in the `OnClick` events of the buttons. On the other hand, the [Wizard Stepper](slug://wizard-structure-stepper) always fires the Wizard `OnChange` event. This creates a situation where user navigation can trigger different events. To execute business logic between steps, use one of the following options:
 
-* [Disable all Stepper steps]({%slug wizard-structure-stepper%}#disabled). The user will still be able to navigate with the custom Wizard buttons.
+* [Disable all Stepper steps](slug://wizard-structure-stepper#disabled). The user will still be able to navigate with the custom Wizard buttons.
 * [Disable Stepper clicks with CSS](#disable-stepper-clicks-with-css). In this way, the Stepper will not look disabled. It is also possible to [hide the Stepper completely](#hide-the-stepper).
 * [Call the `OnChange` and `OnFinish` handlers from the button `OnClick` handlers](#call-onchange-and-onfinish-from-button-onclick), to avoid duplicate code.
 * Execute the same code in both the step `OnChange` handlers and the button `OnClick` handlers.
diff --git a/components/wizard/structure/stepper.md b/components/wizard/structure/stepper.md
index 657b5e57a7..6a342c0ebd 100644
--- a/components/wizard/structure/stepper.md
+++ b/components/wizard/structure/stepper.md
@@ -10,7 +10,7 @@ position: 0
 
 # Wizard Stepper
 
-One of the main elements of the Wizard component is the Stepper. The Wizard component utilizes the [Telerik UI for Blazor Stepper]({%slug stepper-overview%}) internally.
+One of the main elements of the Wizard component is the Stepper. The Wizard component utilizes the [Telerik UI for Blazor Stepper](slug://stepper-overview) internally.
 
 You can use the parameters the `WizardStep` exposes to customize the following properties of the internal stepper:
 
@@ -33,7 +33,7 @@ You can set the desired general settings of the internal Stepper through the par
 
 ## StepType
 
-Much like the Stepper component, the internal Stepper of the Wizard provides two [display modes]({%slug stepper-display-modes%}) for the steps. You can configure the desired display mode through the `StepType` parameter of the `WizardStepperSettings` which takes a member of the `StepperStepType` enum:
+Much like the Stepper component, the internal Stepper of the Wizard provides two [display modes](slug://stepper-display-modes) for the steps. You can configure the desired display mode through the `StepType` parameter of the `WizardStepperSettings` which takes a member of the `StepperStepType` enum:
 
 * `Steps` (default) - the Stepper will render both indicators and labels
 * `Labels` - the Stepper will render only labels
@@ -70,7 +70,7 @@ Much like the Stepper component, the internal Stepper of the Wizard provides two
 
 ## Linear flow
 
-The `Linear` flow property of the internal Stepper matches the functionality of the [Stepper component Linear flow]({%slug stepper-linear-flow%}). It allows you to configure it, so that completion of the previous step is required before proceeding to the next step. The user will be able to go one step at a time (back or forth).
+The `Linear` flow property of the internal Stepper matches the functionality of the [Stepper component Linear flow](slug://stepper-linear-flow). It allows you to configure it, so that completion of the previous step is required before proceeding to the next step. The user will be able to go one step at a time (back or forth).
 
 You can enable/disable the Linear flow of the Wizard Stepper through the `Linear` parameter of the `WizardStepperSettings`. It takes a `bool` and its default value is `true`.
 
@@ -116,9 +116,9 @@ You can enable/disable the Linear flow of the Wizard Stepper through the `Linear
 You can configure the content that will be rendered in the step indicators of the internal Stepper through the following parameters the `WizardStep` exposes:
 
 * `Text` - `string` - Specifies the step indicator text
-* `Icon` - `object` - Specifies the [Telerik Font or SVG icon]({%slug common-features-icons%}) which will be put inside the step indicator.
+* `Icon` - `object` - Specifies the [Telerik Font or SVG icon](slug://common-features-icons) which will be put inside the step indicator.
 
-The priority and rules applied for their rendering is the same as for the [Stepper component indicators]({%slug stepper-indicators%}).
+The priority and rules applied for their rendering is the same as for the [Stepper component indicators](slug://stepper-indicators).
 
 >caption Set up the desired content for the Wizard Stepper indicators.
 
@@ -150,7 +150,7 @@ The priority and rules applied for their rendering is the same as for the [Stepp
 
 ### Labels
 
-The Wizard Stepper allows you to set labels for the corresponding step indicators following the [Stepper component Labels]({%slug stepper-labels%}) practice. You can define the desired labels through the `Label` parameter the `WizardStep` exposes. If you don't set value to the `Label` parameter, no label will be rendered for the corresponding step indicator.
+The Wizard Stepper allows you to set labels for the corresponding step indicators following the [Stepper component Labels](slug://stepper-labels) practice. You can define the desired labels through the `Label` parameter the `WizardStep` exposes. If you don't set value to the `Label` parameter, no label will be rendered for the corresponding step indicator.
 
 >caption Set up the desired labels for the Wizard Stepper steps.
 
@@ -182,7 +182,7 @@ The Wizard Stepper allows you to set labels for the corresponding step indicator
 
 ### Optional
 
-Likewise the [Stepper component Optional property]({%slug stepper-state%}#optional), the Wizard Stepper also supports that.
+Likewise the [Stepper component Optional property](slug://stepper-state#optional), the Wizard Stepper also supports that.
 
 To mark a Wizard step as optional, set the `Optional` parameter of the `WizardStep` to `true` (its default value is `false`). This configuration strives to visually notify the user that a certain step is not required by rendering "(Optional)" text underneath the corresponding step. It doesn't come with a built-in functionality to skip the Wizard step if a [linear flow](#linear-flow) is enabled.
 
@@ -222,7 +222,7 @@ To mark a Wizard step as optional, set the `Optional` parameter of the `WizardSt
 
 ### Disabled
 
-The Wizard Stepper also allows you to mark a step as disabled following the functionality if the [Stepper component `Disabled` property]({%slug stepper-state%}#disabled).
+The Wizard Stepper also allows you to mark a step as disabled following the functionality if the [Stepper component `Disabled` property](slug://stepper-state#disabled).
 
 You can disable a step by setting the `Disabled` parameter of the the desired `WizardStep` to `true` (its default value is `false`). You can also toggle its value to conditionally enable/disable the Wizard steps based on your application logic.
 
@@ -279,7 +279,7 @@ Respectively, if the previous step is disabled, the Previous button will be disa
 
 ### Valid
 
-Likewise the [Stepper component validation feature]({%slug stepper-steps-validation%}), the Wizard Stepper also provides an option to set validation logic for each step.
+Likewise the [Stepper component validation feature](slug://stepper-steps-validation), the Wizard Stepper also provides an option to set validation logic for each step.
 
 You can set a visual indication whether a step is valid or not through the `Valid` parameter of the `WizardStep`. It accepts `bool?` and its default value is `null`.
 
diff --git a/deployment/ci-cd-build-server.md b/deployment/ci-cd-build-server.md
index 4675dd21a5..764fe49dba 100644
--- a/deployment/ci-cd-build-server.md
+++ b/deployment/ci-cd-build-server.md
@@ -27,9 +27,9 @@ Often enough, you would want to set up Continuous Integration and/or Continuous
 
 There are a couple of common ways people implement CI/CD automated builds.
 
-* You can [restore the Telerik NuGet packages]({%slug deployment-nuget%}) by downloading them from the Telerik NuGet server. You can achieve this by using the more secure token-based authentication with the Telerik NuGet server. If you prefer the basic authentication with a username and password, you can use your own credentials (or the credentials of the license holder, depending on how your licenses are set up) in the `NuGet.Config` of the build machine/pipeline. In this case, make sure that your credentials are encrypted when you add the Telerik feed source through the CLI. Alternatively, you can copy an encrypted version from your own local config if you have one and if plain text is an issue. See more on setting up the [Telerik NuGet package source]({%slug installation/nuget%}).
+* You can [restore the Telerik NuGet packages](slug://deployment-nuget) by downloading them from the Telerik NuGet server. You can achieve this by using the more secure token-based authentication with the Telerik NuGet server. If you prefer the basic authentication with a username and password, you can use your own credentials (or the credentials of the license holder, depending on how your licenses are set up) in the `NuGet.Config` of the build machine/pipeline. In this case, make sure that your credentials are encrypted when you add the Telerik feed source through the CLI. Alternatively, you can copy an encrypted version from your own local config if you have one and if plain text is an issue. See more on setting up the [Telerik NuGet package source](slug://installation/nuget).
 
-* Creating a local folder (for example, on a shared network drive or other suitable location accessible only by your builds and team) that holds the `.nupkg` files we provide (you can download them from your telerik.com account, or from your local installation - both [automated]({%slug installation/msi%}) and from the [zip archive]({%slug installation/zip%})).
+* Creating a local folder (for example, on a shared network drive or other suitable location accessible only by your builds and team) that holds the `.nupkg` files we provide (you can download them from your telerik.com account, or from your local installation - both [automated](slug://installation/msi) and from the [zip archive](slug://installation/zip)).
 
 You must protect your credentials and/or the Telerik packages and ensure they are used only by you and not by other developers, according to the [license-per-developer policy](https://www.telerik.com/purchase/license-agreement/blazor-ui). As long as your credentials are obfuscated/masked, they can be used by your colleagues (e.g. developers, QAs, designers, front-end devs, DBAs, etc.) for building and running a solution, provided they do not use the Telerik components to create functionality. Most importantly, you must ensure that such credentials or package sources are not available to the general public (for example, in public repositories). 
 
@@ -107,9 +107,9 @@ Finally, you need a `NuGet.Config` file that lists the Telerik server in the `pa
 
 When building or restoring Blazor apps in Docker, the crucial steps are:
 
-1. Have a `NuGet.Config` file in the project or solution folder. The file can [define the Telerik NuGet feed]({%slug installation/nuget%}#edit-the-nuget-config-file), but without the credentials (Telerik account or NuGet API key).
+1. Have a `NuGet.Config` file in the project or solution folder. The file can [define the Telerik NuGet feed](slug://installation/nuget#edit-the-nuget-config-file), but without the credentials (Telerik account or NuGet API key).
 1. Copy the `NuGet.Config` file together with the `.csproj` file(s) to the Docker image.
-1. [Add](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-nuget-add-source) or [update](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-nuget-update-source) the Telerik NuGet feed with the [stored Telerik NuGet credentials (secrets)]({%slug deployment-nuget%}). When specifying the `NuGet.Config` file location, note that file names are case-sensitive on Unix systems.
+1. [Add](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-nuget-add-source) or [update](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-nuget-update-source) the Telerik NuGet feed with the [stored Telerik NuGet credentials (secrets)](slug://deployment-nuget). When specifying the `NuGet.Config` file location, note that file names are case-sensitive on Unix systems.
 1. Restore or build the Blazor app.
 
 The following code is the build portion of a sample `Dockerfile` that builds a .NET 8 Blazor Web App with two projects. The `dotnet restore` command is executed from the `src` folder of the Docker image (where the `NuGet.Config` is copied), so that the `NuGet.Config` file can be used to restore all projects in the solution.
@@ -149,6 +149,6 @@ RUN dotnet build "./MyBlazorApp.csproj" -c Release -o /app/build
 
 * [Blog Post: Azure DevOps and Telerik NuGet Packages](https://www.telerik.com/blogs/azure-devops-and-telerik-nuget-packages)
 * [DevOpsExamples repo by Lance McCarthy](https://github.com/LanceMcCarthy/DevOpsExamples)
-* [Setup of the Telerik Online Private NuGet Feed]({%slug installation/nuget%})
-* [NuGet Feed Troubleshooting]({%slug troubleshooting-nuget%})
+* [Setup of the Telerik Online Private NuGet Feed](slug://installation/nuget)
+* [NuGet Feed Troubleshooting](slug://troubleshooting-nuget)
 
diff --git a/deployment/nuget-keys.md b/deployment/nuget-keys.md
index ccef0a8f7b..e24876a882 100644
--- a/deployment/nuget-keys.md
+++ b/deployment/nuget-keys.md
@@ -10,12 +10,12 @@ position: 10
 
 This article describes how to use token-based authentication for the Telerik NuGet feed. You will learn how to create and use NuGet API keys to restore Telerik NuGet packages in your Continuous Integration (CI) workflow.
 
-The [Telerik NuGet server]({%slug installation/nuget%}) provides two ways to authenticate:
+The [Telerik NuGet server](slug://installation/nuget) provides two ways to authenticate:
 
 * Basic authentication with your Telerik username and password.
 * Token-based authentication with a NuGet API key.
 
-When you need to restore the [Telerik NuGet packages]({%slug getting-started/what-you-need%}#nuget-packages) as part of your CI, a NuGet API key is the more secure way to authenticate. This method does not require you to provide your Telerik credentials anywhere in the CI workflow. A NuGet Key has a limited scope and can be used only with the Telerik NuGet server. If any of your NuGet keys is compromised, you can quickly delete it and create a new one.
+When you need to restore the [Telerik NuGet packages](slug://getting-started/what-you-need#nuget-packages) as part of your CI, a NuGet API key is the more secure way to authenticate. This method does not require you to provide your Telerik credentials anywhere in the CI workflow. A NuGet Key has a limited scope and can be used only with the Telerik NuGet server. If any of your NuGet keys is compromised, you can quickly delete it and create a new one.
 
 
 ## Generating NuGet Keys
@@ -96,12 +96,12 @@ You can use the .NET CLI `add source` or `update source` commands to set the cre
     dotnet nuget add source 'TelerikOnlineFeed' --source 'https://nuget.telerik.com/v3/index.json' --username 'api-key' --password '${{ "{{secrets.TELERIK_NUGET_KEY}}" }}' --configfile './NuGet.Config' --store-password-in-clear-text
     ````
 
-> When restoring NuGet packages through the CLI, [use `dotnet restore` rather than `nuget restore` to avoid compatibility errors]({%slug common-kb-package-telerik-pivot-not-compatible-with-netframework%}).
+> When restoring NuGet packages through the CLI, [use `dotnet restore` rather than `nuget restore` to avoid compatibility errors](slug://common-kb-package-telerik-pivot-not-compatible-with-netframework).
 
 
 ## See Also
 
-* [Telerik NuGet Feed]({%slug installation/nuget%})
-* [CI, CD, Build Server Setup]({%slug deployment-ci-cd-build-pc%})
+* [Telerik NuGet Feed](slug://installation/nuget)
+* [CI, CD, Build Server Setup](slug://deployment-ci-cd-build-pc)
 * [Azure DevOps and Telerik NuGet Packages](https://www.telerik.com/blogs/azure-devops-and-telerik-nuget-packages)
 * [Announcing NuGet Keys](https://www.telerik.com/blogs/announcing-nuget-keys)
diff --git a/deployment/overview.md b/deployment/overview.md
index 65403210f0..9bed454d92 100644
--- a/deployment/overview.md
+++ b/deployment/overview.md
@@ -35,9 +35,9 @@ The Telerik UI for Blazor components consist of:
 * assemblies
 * static CSS and JavaScript assets
 
-These resources are distributed in our [NuGet packages]({%slug getting-started/what-you-need%}#nuget-packages). The .NET SDK is responsible for copying the Telerik `.dll`, `.css`, and `.js` files from the local NuGet cache to the target folder during the build or publish.
+These resources are distributed in our [NuGet packages](slug://getting-started/what-you-need#nuget-packages). The .NET SDK is responsible for copying the Telerik `.dll`, `.css`, and `.js` files from the local NuGet cache to the target folder during the build or publish.
 
->important The build machine must be able to [restore the Telerik NuGet packages from a remote or local NuGet feed]({%slug getting-started/what-you-need%}#getting-the-telerik-nuget-packages). See the [CI, CD, Build Server]({%slug deployment-ci-cd-build-pc%}) article for more details on automation setup.
+>important The build machine must be able to [restore the Telerik NuGet packages from a remote or local NuGet feed](slug://getting-started/what-you-need#getting-the-telerik-nuget-packages). See the [CI, CD, Build Server](slug://deployment-ci-cd-build-pc) article for more details on automation setup.
 
 ## Testing and Building Licenses
 
@@ -47,13 +47,13 @@ The licensing model of Telerik UI for Blazor is based on developer seats. Separa
 
 The following articles provide more information on Telerik UI for Blazor deployment:
 
-* [CI, CD, Build Server]({%slug deployment-ci-cd-build-pc%}) provides guidance on setting up continuous integration, continuous delivery and automated builds. Mostly related to using the Telerik NuGet packages as this is the only specific thing that we require.
-* [Telerik NuGet Feed]({%slug installation/nuget%}) shows how to set up our private NuGet package source.
-* [NuGet Feed Troubleshooting]({%slug troubleshooting-nuget%}) provides troubleshooting tips for the most common issues with our NuGet feed.
-* [Deployment Troubleshooting]({%slug deployment-troubleshooting%}) describes the most common problems and solutions related to deploying Telerik Blazor applications.
+* [CI, CD, Build Server](slug://deployment-ci-cd-build-pc) provides guidance on setting up continuous integration, continuous delivery and automated builds. Mostly related to using the Telerik NuGet packages as this is the only specific thing that we require.
+* [Telerik NuGet Feed](slug://installation/nuget) shows how to set up our private NuGet package source.
+* [NuGet Feed Troubleshooting](slug://troubleshooting-nuget) provides troubleshooting tips for the most common issues with our NuGet feed.
+* [Deployment Troubleshooting](slug://deployment-troubleshooting) describes the most common problems and solutions related to deploying Telerik Blazor applications.
 
 
 ## See Also
 
-* [Removing the Telerik Blazor Trial Message]({%slug upgrade-tutorial%}#i-still-see-the-trial-watermark-and-banner)
-* [Troubleshooting `TelerikBlazor was undefined`]({%slug troubleshooting-js-errors%}#telerikblazor-was-undefined) 
+* [Removing the Telerik Blazor Trial Message](slug://upgrade-tutorial#i-still-see-the-trial-watermark-and-banner)
+* [Troubleshooting `TelerikBlazor was undefined`](slug://troubleshooting-js-errors#telerikblazor-was-undefined) 
diff --git a/deployment/troubleshooting.md b/deployment/troubleshooting.md
index 51533972e3..e4d6c433db 100644
--- a/deployment/troubleshooting.md
+++ b/deployment/troubleshooting.md
@@ -12,7 +12,7 @@ position: 15
 
 This page provides information for common issues you may encounter while deploying applications with the Telerik UI for Blazor components.
 
->important The machine that performs the publish build must be able to properly restore the referenced Telerik NuGet packages. This can be [our online feed](slug://installation/nuget) or a [local feed](slug://installation/zip). See the [CI, CD, Build Server]({%slug deployment-ci-cd-build-pc%}) article for more details on setting automation up.
+>important The machine that performs the publish build must be able to properly restore the referenced Telerik NuGet packages. This can be [our online feed](slug://installation/nuget) or a [local feed](slug://installation/zip). See the [CI, CD, Build Server](slug://deployment-ci-cd-build-pc) article for more details on setting automation up.
 
 @[template](/_contentTemplates/common/general-info.md#status-telerik-com)
 
@@ -20,7 +20,7 @@ This page provides information for common issues you may encounter while deployi
 
 At the time of writing, sometimes the following issues have been reported that pertain to the Telerik UI for Blazor suite:
 
-* `Unable to find package Telerik.UI.for.Blazor` is a common pitfall in build environments. See the [NuGet Troubleshooting]({%slug troubleshooting-nuget%}#unable-to-find-package) article, which also provides other NuGet-related tips.
+* `Unable to find package Telerik.UI.for.Blazor` is a common pitfall in build environments. See the [NuGet Troubleshooting](slug://troubleshooting-nuget#unable-to-find-package) article, which also provides other NuGet-related tips.
 * [404 not found for telerik-blazor.js](#404-not-found-for-telerik-blazor-js)
 * [Trial Message](#trial-message)
 * [Could not load file or assembly 'System.Text.Json, ...](#could-not-load-file-or-assembly-system-text-json)
@@ -33,7 +33,7 @@ At the time of writing, sometimes the following issues have been reported that p
 
 `404 not found for telerik-blazor.js` - this indicates that the framework did not copy our static assets to the publish location.
 
-* Some solutions are available in the [JS Errors - Missing File]({%slug troubleshooting-js-errors%}#missing-file) article.
+* Some solutions are available in the [JS Errors - Missing File](slug://troubleshooting-js-errors#missing-file) article.
 
 * When using `dotnet run` or `dotnet build` to publish an app, the static assets may not work when the `ASPNETCORE_ENVIRONMENT` is _not_ set to `Development`. This may be due to a missing server configuration for allowing static assets ([MSDN link](https://docs.microsoft.com/en-us/aspnet/core/razor-pages/ui-class?view=aspnetcore-3.1&tabs=visual-studio#consume-content-from-a-referenced-rcl)). 
 
@@ -70,16 +70,16 @@ namespace MyBlazorAppName
 }
 ````
 
-* On Linux (and often Docker), paths are case-sensitive. Make sure you have the correct casing when registering the styles and scripts. See the [CSS Theme and JavaScript Files]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files) section of the documentation.
+* On Linux (and often Docker), paths are case-sensitive. Make sure you have the correct casing when registering the styles and scripts. See the [CSS Theme and JavaScript Files](slug://getting-started/what-you-need#css-theme-and-javascript-files) section of the documentation.
 
-    * Some reports indicate that deploying to a Docker container never copies over the static assets and you may have to either copy the file manually, or use it from [our CDN]({%slug common-features-cdn%}). This may be related to the static asset configurations from the previous points, however.
+    * Some reports indicate that deploying to a Docker container never copies over the static assets and you may have to either copy the file manually, or use it from [our CDN](slug://common-features-cdn). This may be related to the static asset configurations from the previous points, however.
 
 * We have had reports that indicate missing project references do not copy the static assets. For example, in an ASP.NET Core hosted WebAssembly project the server project usually has a project reference to the Blazor project. If that reference is missing, the static assets might not be present in the output.
 
 
 ### Trial Message
 
-`Trial Message` - if the machine that performs the build has access to a trial version of our NuGet package, the framework may get confused and copy a trial assembly to the publish location and you may see the trial messages live. Solutions are available in the [Upgrade Troubleshooting - I Still See the Trial Message]({%slug upgrade-tutorial%}#i-still-see-the-trial-watermark-and-banner) article.
+`Trial Message` - if the machine that performs the build has access to a trial version of our NuGet package, the framework may get confused and copy a trial assembly to the publish location and you may see the trial messages live. Solutions are available in the [Upgrade Troubleshooting - I Still See the Trial Message](slug://upgrade-tutorial#i-still-see-the-trial-watermark-and-banner) article.
 
 ### Could not load file or assembly 'System.Text.Json, ...
 
@@ -108,10 +108,10 @@ or
 
 `The remote certificate is invalid because of errors in the certificate chain: PartialChain`
 
-Such errors are related to the local networking security settings and you may need the assistance of your network or system administrators to resolve it. As a first step, make sure the [required Telerik NuGet domains are accessible]({%slug installation/nuget%}#access-nuget-packages-behind-firewall).
+Such errors are related to the local networking security settings and you may need the assistance of your network or system administrators to resolve it. As a first step, make sure the [required Telerik NuGet domains are accessible](slug://installation/nuget#access-nuget-packages-behind-firewall).
 
 
 ## See Also
 
-* [I Still See the Trial Message]({%slug upgrade-tutorial%}#i-still-see-the-trial-watermark-and-banner)
-* [Missing JS Interop File]({%slug troubleshooting-js-errors%}#missing-file) 
+* [I Still See the Trial Message](slug://upgrade-tutorial#i-still-see-the-trial-watermark-and-banner)
+* [Missing JS Interop File](slug://troubleshooting-js-errors#missing-file) 
diff --git a/getting-started/client-blazor.md b/getting-started/client-blazor.md
index f8ce12e193..7996a8658e 100644
--- a/getting-started/client-blazor.md
+++ b/getting-started/client-blazor.md
@@ -17,7 +17,7 @@ This article explains how to get the <a href = "https://www.telerik.com/blazor-u
 > * **Blazor WebAssembly App**, which exists up to .NET 7.
 > * **Blazor WebAssembly Standalone App** for .NET 8 and newer versions.
 >
-> If you prefer the **Blazor Web App** template for .NET 8 and newer versions, then follow the [tutorial about Blazor Web Apps]({%slug getting-started/web-app%}).
+> If you prefer the **Blazor Web App** template for .NET 8 and newer versions, then follow the [tutorial about Blazor Web Apps](slug://getting-started/web-app).
 
 @[template](/_contentTemplates/common/get-started.md#prerequisites-tip)
 
@@ -59,13 +59,13 @@ To enable the Telerik UI for Blazor components, you must add several client-side
 **HTML**
 @[template](/_contentTemplates/common/js-interop-file.md#js-interop-file-snippet)
 
-2\. In the `~/wwwroot/index.html` file of the client web application, add the [theme stylesheet as a static asset]({%slug themes-overview%}#using-a-theme). The theme allows you to select the appearance and color scheme for the Telerik Blazor components.
+2\. In the `~/wwwroot/index.html` file of the client web application, add the [theme stylesheet as a static asset](slug://themes-overview#using-a-theme). The theme allows you to select the appearance and color scheme for the Telerik Blazor components.
 
 @[template](/_contentTemplates/common/js-interop-file.md#theme-static-asset-snippet)
 
 ### 4.2. Include @using Statements
 
-In the `~/_Imports.razor` file, add the `@using` directives below. This configures the project to recognize the Telerik components in all files. You can register one or both icon namespaces, depending on the [icon type you will be using]({%slug common-features-icons%}).
+In the `~/_Imports.razor` file, add the `@using` directives below. This configures the project to recognize the Telerik components in all files. You can register one or both icon namespaces, depending on the [icon type you will be using](slug://common-features-icons).
 
 ````RAZOR.skip-repl
 @using Telerik.Blazor
@@ -105,7 +105,7 @@ If you prefer video instructions, you can also check the video tutorial below.
 
 ## See Also
 
-* [Workflow Details for Telerik UI for Blazor]({%slug getting-started/what-you-need%})
+* [Workflow Details for Telerik UI for Blazor](slug://getting-started/what-you-need)
 * [Getting Started Videos for Blazor](https://www.youtube.com/watch?v=aaRAZYaJ4xc&list=PLvmaC-XMqeBYPTwcm478vs8Rujq2tiVJo)
-* [First Steps with Blazor Web App]({%slug getting-started/web-app%})
-* [First Steps with Blazor Server]({%slug getting-started/server-side%})
+* [First Steps with Blazor Web App](slug://getting-started/web-app)
+* [First Steps with Blazor Server](slug://getting-started/server-side)
diff --git a/getting-started/hybrid-blazor.md b/getting-started/hybrid-blazor.md
index 66d13dc023..32b62808f1 100644
--- a/getting-started/hybrid-blazor.md
+++ b/getting-started/hybrid-blazor.md
@@ -28,21 +28,21 @@ Before adding the Telerik UI for Blazor components, ensure that the correspondin
 
 ## Adding the UI for Blazor Components
 
-The process for adding Telerik UI for Blazor to a WinForms, WPF, or MAUI app is similar to including the components in a [native Blazor app]({%slug getting-started/what-you-need%}) and involves the six steps listed below. 
+The process for adding Telerik UI for Blazor to a WinForms, WPF, or MAUI app is similar to including the components in a [native Blazor app](slug://getting-started/what-you-need) and involves the six steps listed below. 
 
 ### 1. Get the Telerik UI for Blazor Package
 
-To use the  UI for Blazor components, install the `Telerik.UI.for.Blazor` package and include its reference in the `.csproj` file of the app. [Read more on where to get the `Telerik.UI.for.Blazor` package...]({%slug getting-started/what-you-need%}#nuget-packages)
+To use the  UI for Blazor components, install the `Telerik.UI.for.Blazor` package and include its reference in the `.csproj` file of the app. [Read more on where to get the `Telerik.UI.for.Blazor` package...](slug://getting-started/what-you-need#nuget-packages)
 
 ### 2. Add the Telerik Client Assets
 
-To have the Telerik Blazor components look and behave as expected, you need the Telerik [CSS and JavaScript assets]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files). Include the assets inside the `<head>` of the `wwwroot/index.html` file.
+To have the Telerik Blazor components look and behave as expected, you need the Telerik [CSS and JavaScript assets](slug://getting-started/what-you-need#css-theme-and-javascript-files). Include the assets inside the `<head>` of the `wwwroot/index.html` file.
 
-You can add the Telerik resources as [static assets]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files).
+You can add the Telerik resources as [static assets](slug://getting-started/what-you-need#css-theme-and-javascript-files).
 
 ### 3. Include @using Statements 
 
-You can set the project to recognize all Telerik components without explicit `@using` statements in every `.razor` file. To achieve this, add the code below to your `~/_Imports.razor` file. You can register one or both icon namespaces depending on the [icon type you will be using]({%slug common-features-icons%}).
+You can set the project to recognize all Telerik components without explicit `@using` statements in every `.razor` file. To achieve this, add the code below to your `~/_Imports.razor` file. You can register one or both icon namespaces depending on the [icon type you will be using](slug://common-features-icons).
 
 >caption _Imports.razor
 
@@ -57,14 +57,14 @@ You can set the project to recognize all Telerik components without explicit `@u
 
 ### 4. Add the TelerikRootComponent
 
-Use a single [`TelerikRootComponent`]({%slug rootcomponent-overview%}) component as a top-level component in the app and make sure it wraps all content. At the time of writing, custom layouts are not supported, so you can add it to:
+Use a single [`TelerikRootComponent`](slug://rootcomponent-overview) component as a top-level component in the app and make sure it wraps all content. At the time of writing, custom layouts are not supported, so you can add it to:
 
 * `Shared/MainLayout.razor` for MAUI apps
 * `Main.razor` for WPF and WinForms apps
 
 Make sure that the `TelerikRootComponent` matches the web view viewport and remove the default margin of the `<body>` HTML element.
 
-Once custom layouts are supported, you will be able to configure a Telerik layout in the same way as with regular Blazor web apps (check [Common Configuration]({%slug getting-started/what-you-need%}#telerikrootcomponent)).
+Once custom layouts are supported, you will be able to configure a Telerik layout in the same way as with regular Blazor web apps (check [Common Configuration](slug://getting-started/what-you-need#telerikrootcomponent)).
 
 ### 5. Register the Telerik Services
 
@@ -112,7 +112,7 @@ Add your desired Telerik Blazor components in the app as in a native Blazor app.
 
 ## Running the Blazor Hybrid App
 
-You can now run the hybrid application in debug mode, but it's recommended to [be aware of possible caveats during deployment and prevent them upfront]({%slug hybrid-blazor-apps%}#known-issues).
+You can now run the hybrid application in debug mode, but it's recommended to [be aware of possible caveats during deployment and prevent them upfront](slug://hybrid-blazor-apps#known-issues).
 
 Refer to the following articles for more information on each technology stack:
 
@@ -122,12 +122,12 @@ Refer to the following articles for more information on each technology stack:
 
 ## Next Steps
 
-* [Explore the specifics of Telerik UI for Blazor in native MAUI]({%slug hybrid-blazor-apps%})
+* [Explore the specifics of Telerik UI for Blazor in native MAUI](slug://hybrid-blazor-apps)
 
 ## See Also
 
-* [Workflow Details for Telerik UI for Blazor]({%slug getting-started/what-you-need%})
+* [Workflow Details for Telerik UI for Blazor](slug://getting-started/what-you-need)
 * [Getting Started Videos for Blazor](https://www.youtube.com/watch?v=aaRAZYaJ4xc&list=PLvmaC-XMqeBYPTwcm478vs8Rujq2tiVJo)
-* [First Steps with Blazor Web App]({%slug getting-started/web-app%})
-* [First Steps with Blazor Server]({%slug getting-started/server-side%})
-* [First Steps with Blazor WebAssembly]({%slug getting-started/client-side%})
+* [First Steps with Blazor Web App](slug://getting-started/web-app)
+* [First Steps with Blazor Server](slug://getting-started/server-side)
+* [First Steps with Blazor WebAssembly](slug://getting-started/client-side)
diff --git a/getting-started/repl/intergration.md b/getting-started/repl/intergration.md
index 63e941d68b..cfba4b73b2 100644
--- a/getting-started/repl/intergration.md
+++ b/getting-started/repl/intergration.md
@@ -43,7 +43,7 @@ Most code examples in the Telerik UI for Blazor documentation are directly runna
 
 ## Visual Studio and Visual Studio Code Integration
 
-Telerik Extensions for [Visual Studio]({%slug getting-started-vs-integration-overview%}) and [Visual Studio Code]({%slug getting-started-vs-code-integration-overview%}) provide option to easily share your code to the Telerik REPL for Blazor with a few clicks. You can share the whole file or just a selection.
+Telerik Extensions for [Visual Studio](slug://getting-started-vs-integration-overview) and [Visual Studio Code](slug://getting-started-vs-code-integration-overview) provide option to easily share your code to the Telerik REPL for Blazor with a few clicks. You can share the whole file or just a selection.
 
 The command can be used if more than 10 symbols are selected. Otherwise Visual Studio will disable the command, and Visual Studio Code will show an error message ("Expected at least 10 characters"). In case of multiple selection, every new piece will be concatenated on a new line.
 
@@ -66,7 +66,7 @@ If no selection is made, the whole file will be shared to Telerik REPL for Blazo
 
 ### Sharing to REPL Visual Studio Code
 
-1. [Get the Visual Studio Code extension]({%slug getting-started-vs-code-integration-overview%}) from the [Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=TelerikInc.blazortemplatewizard).
+1. [Get the Visual Studio Code extension](slug://getting-started-vs-code-integration-overview) from the [Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=TelerikInc.blazortemplatewizard).
 
 1. Access the command using either the context menu or the command palette:
 
@@ -81,5 +81,5 @@ If no selection is made, the whole file will be shared to Telerik REPL for Blazo
 
 ## See Also
 
-* [User Snippets in Telerik REPL for Blazor]({%slug blazor-repl-user-snippets%})
-* [Predefined Editor Snippets and Scaffolders in Telerik REPL for Blazor]({%slug blazor-repl-snippets-scaffolders%})
\ No newline at end of file
+* [User Snippets in Telerik REPL for Blazor](slug://blazor-repl-user-snippets)
+* [Predefined Editor Snippets and Scaffolders in Telerik REPL for Blazor](slug://blazor-repl-snippets-scaffolders)
\ No newline at end of file
diff --git a/getting-started/repl/overview.md b/getting-started/repl/overview.md
index ab79eb510a..b0eaa5376a 100644
--- a/getting-started/repl/overview.md
+++ b/getting-started/repl/overview.md
@@ -40,7 +40,7 @@ The Toolbar of Telerik REPL for Blazor provides access to the operations that yo
     
 * **Feedback**&mdash;leads to the [public feedback portal for Telerik REPL for Blazor](https://feedback.telerik.com/repl) where you can share your enhancement requests and eventual bug reports. We use it to constantly monitor the community interest and demand and thus improve our products.
 
-* **Login/Register**&mdash;allows you to [login and save snippets to your account]({%slug blazor-repl-user-snippets%}).
+* **Login/Register**&mdash;allows you to [login and save snippets to your account](slug://blazor-repl-user-snippets).
 
 ## Sidebar
 
@@ -50,11 +50,11 @@ The Sidebar provides the following functionalities:
 
 * **Static Asset Manager**&mdash;it allows you to add CDN URLs for your CSS or JavaScript files. Place the file URL in the input and click the download button. This will automatically add references for the corresponding files. Once the desired asset is added, you can easily enable/disable it via a switch. In case some of the installed NuGet packages include CSS/JavaScript files, they will automatically be listed in this section, so you can manage them.
 
-* **User Snippets**&mdash;allows you to review and manage the snippets saved in your account. [Read more about the user snippets...]({%slug blazor-repl-user-snippets%})
+* **User Snippets**&mdash;allows you to review and manage the snippets saved in your account. [Read more about the user snippets...](slug://blazor-repl-user-snippets)
 
-* **Telerik UI Asset Manager**&mdash;shows the Telerik.UI.for.Blazor package version and allows you to change or update it. Starting from September 14, 2022 (R3 2022), each REPL example maintains its Telerik UI package version until changed explicitly. The Asset Manager also shows a list with the available [built-in themes]({%slug themes-overview%}) and their corresponding [theme swatches]({%slug themes-overview%}#basics). When you select a new theme and swatch, you can immediately see the applied styles in the Result View.
+* **Telerik UI Asset Manager**&mdash;shows the Telerik.UI.for.Blazor package version and allows you to change or update it. Starting from September 14, 2022 (R3 2022), each REPL example maintains its Telerik UI package version until changed explicitly. The Asset Manager also shows a list with the available [built-in themes](slug://themes-overview) and their corresponding [theme swatches](slug://themes-overview#basics). When you select a new theme and swatch, you can immediately see the applied styles in the Result View.
 
-* **Snippets and Scaffolders**&mdash;it allows you to add predefined component snippets or scaffold some components defining your desired configuration. [Read more about Snippets and Scaffolders...]({%slug blazor-repl-snippets-scaffolders%})
+* **Snippets and Scaffolders**&mdash;it allows you to add predefined component snippets or scaffold some components defining your desired configuration. [Read more about Snippets and Scaffolders...](slug://blazor-repl-snippets-scaffolders)
 
 * **Startup Config**&mdash;the config icon at the bottom of the Sidebar opens the `Startup.cs` file of the project. You can configure services or other settings there.
 
@@ -76,6 +76,6 @@ The Error list is located at the bottom of the [Editor](#editor).
 
 ## See Also
 
-* [User Snippets in Telerik REPL for Blazor]({%slug blazor-repl-user-snippets%})
-* [Predefined Snippets and Scaffolders in Telerik REPL for Blazor]({%slug blazor-repl-snippets-scaffolders%})
-* [Integration of Telerik REPL for Blazor with VS and VS Code]({%slug blazor-repl-integration%})
\ No newline at end of file
+* [User Snippets in Telerik REPL for Blazor](slug://blazor-repl-user-snippets)
+* [Predefined Snippets and Scaffolders in Telerik REPL for Blazor](slug://blazor-repl-snippets-scaffolders)
+* [Integration of Telerik REPL for Blazor with VS and VS Code](slug://blazor-repl-integration)
\ No newline at end of file
diff --git a/getting-started/repl/snippets-and-scaffolders.md b/getting-started/repl/snippets-and-scaffolders.md
index 8623de9a06..36f3292dac 100644
--- a/getting-started/repl/snippets-and-scaffolders.md
+++ b/getting-started/repl/snippets-and-scaffolders.md
@@ -60,5 +60,5 @@ Telerik REPL for Blazor allows using one scaffolder at a time. By default, the s
 
 ## See Also
 
-* [User Snippets in Telerik REPL for Blazor]({%slug blazor-repl-user-snippets%})
-* [Integration of Telerik REPL for Blazor with VS and VS Code]({%slug blazor-repl-integration%})
\ No newline at end of file
+* [User Snippets in Telerik REPL for Blazor](slug://blazor-repl-user-snippets)
+* [Integration of Telerik REPL for Blazor with VS and VS Code](slug://blazor-repl-integration)
\ No newline at end of file
diff --git a/getting-started/repl/user-snippets.md b/getting-started/repl/user-snippets.md
index a77cea48de..c3cc68b50d 100644
--- a/getting-started/repl/user-snippets.md
+++ b/getting-started/repl/user-snippets.md
@@ -34,4 +34,4 @@ The **User Snippets** menu allows you to review and manage your code snippets:
 
 ## See Also
 
-* [Predefined Editor Snippets and Scaffolders in Telerik REPL for Blazor]({%slug blazor-repl-snippets-scaffolders%})
\ No newline at end of file
+* [Predefined Editor Snippets and Scaffolders in Telerik REPL for Blazor](slug://blazor-repl-snippets-scaffolders)
\ No newline at end of file
diff --git a/getting-started/server-blazor.md b/getting-started/server-blazor.md
index 3d0cb717a1..4316e10c16 100644
--- a/getting-started/server-blazor.md
+++ b/getting-started/server-blazor.md
@@ -12,7 +12,7 @@ position: 15
 
 This article explains how to get the Telerik UI for Blazor components in your .NET 6 or 7 Blazor Server app and start using them quickly. You will create a new application from scratch, learn how to add the UI for Blazor components to a project, and finally, add a UI component to a view.
 
-> This article applies only to the **Blazor Server App** template in Visual Studio, which exists up to .NET 7. If you are using newer .NET versions, then follow the [tutorial about Blazor Web Apps]({%slug getting-started/web-app%}).
+> This article applies only to the **Blazor Server App** template in Visual Studio, which exists up to .NET 7. If you are using newer .NET versions, then follow the [tutorial about Blazor Web Apps](slug://getting-started/web-app).
 
 @[template](/_contentTemplates/common/get-started.md#prerequisites-tip)
 
@@ -58,7 +58,7 @@ To enable the Telerik UI for Blazor components, you must add several client-side
 
 @[template](/_contentTemplates/common/js-interop-file.md#js-interop-file-snippet)
 
-2\. To select the appearance and color scheme for the Telerik Blazor components, add the [theme stylesheet as a static asset]({%slug themes-overview%}#using-a-theme).
+2\. To select the appearance and color scheme for the Telerik Blazor components, add the [theme stylesheet as a static asset](slug://themes-overview#using-a-theme).
 
  * Use the `~/Pages/_Host.cshtml` index file for .NET 7
  * Use the `~/Pages/_Layout.cshtml` index file for .NET 6
@@ -67,7 +67,7 @@ To enable the Telerik UI for Blazor components, you must add several client-side
 
 ### 4.2. Include @using Statements
 
-In the `~/_Imports.razor` file, add the `@using` directives below. This configures the project to recognize the Telerik components in all files. You can register one or both icon namespaces, depending on the [icon type you will be using]({%slug common-features-icons%}).
+In the `~/_Imports.razor` file, add the `@using` directives below. This configures the project to recognize the Telerik components in all files. You can register one or both icon namespaces, depending on the [icon type you will be using](slug://common-features-icons).
 
 ````RAZOR.skip-repl
 @using Telerik.Blazor
@@ -78,7 +78,7 @@ In the `~/_Imports.razor` file, add the `@using` directives below. This configur
 
 ### 4.3. Add the TelerikRootComponent
 
-Use a single [`TelerikRootComponent`]({%slug rootcomponent-overview%}) component as a top-level component in the app.
+Use a single [`TelerikRootComponent`](slug://rootcomponent-overview) component as a top-level component in the app.
 
 @[template](/_contentTemplates/common/get-started.md#root-component-main-layout)
 
@@ -107,7 +107,7 @@ If you prefer video instructions, you can also check the video tutorial below.
 
 ## See Also
 
-* [Workflow Details for Telerik UI for Blazor]({%slug getting-started/what-you-need%})
+* [Workflow Details for Telerik UI for Blazor](slug://getting-started/what-you-need)
 * [Getting Started Videos for Blazor](https://www.youtube.com/watch?v=aaRAZYaJ4xc&list=PLvmaC-XMqeBYPTwcm478vs8Rujq2tiVJo)
-* [First Steps with Blazor Web App]({%slug getting-started/web-app%})
-* [First Steps with Blazor WebAssembly]({%slug getting-started/client-side%})
+* [First Steps with Blazor Web App](slug://getting-started/web-app)
+* [First Steps with Blazor WebAssembly](slug://getting-started/client-side)
diff --git a/getting-started/value-vs-data-binding.md b/getting-started/value-vs-data-binding.md
index e8cf01b03e..7326631342 100644
--- a/getting-started/value-vs-data-binding.md
+++ b/getting-started/value-vs-data-binding.md
@@ -40,7 +40,7 @@ When using one-way binding, you *can* use the `<ParameterName>Changed` event. Fo
 
 To update the view-model in a one-way binding scenario, handle the corresponding `<Parameter>Changed` event. In the handler, update the view-model with the new data. This allows you to apply some synchronous logic to that new value and effectively cancel the update if you don't set the new value to the view-model.
 
-If you use one-way binding inside forms, you may get an error similar to `Unhandled exception rendering component: Telerik.Blazor.Components.TelerikTextBox requires a value for the 'ValueExpression'`. This will not happen when you use two-way binding. You can find more details and ways to solve this in the [Requires a value for ValueExpression]({%slug common-kb-requires-valueexpression%}) article.
+If you use one-way binding inside forms, you may get an error similar to `Unhandled exception rendering component: Telerik.Blazor.Components.TelerikTextBox requires a value for the 'ValueExpression'`. This will not happen when you use two-way binding. You can find more details and ways to solve this in the [Requires a value for ValueExpression](slug://common-kb-requires-valueexpression) article.
 
 ### Two-way Binding
 
diff --git a/getting-started/vs-code-integration/document-processing-wizard.md b/getting-started/vs-code-integration/document-processing-wizard.md
index 79bfdf9da2..df11a627fe 100644
--- a/getting-started/vs-code-integration/document-processing-wizard.md
+++ b/getting-started/vs-code-integration/document-processing-wizard.md
@@ -48,12 +48,12 @@ The table below lists the assemblies that will be selected for each library:
 
 | Library | Packages |
 | --- | --- |
-| [RadPdfProcessing]({%slug dpl-in-blazor%}) | Documents.Core <br /> Documents.Fixed <br /> Zip <br /> Documents.ImageUtils <br /> Documents.Fixed.FormatProviders.Image.Skia <br /> Documents.CMapUtils |
-| [RadSpreadProcessing]({%slug dpl-in-blazor%}) | Documents.Core <br /> Documents.Fixed <br /> Documents.Spreadsheet <br /> Documents.SpreadSheet.FormatProviders.OpenXml <br /> Documents.SpreadSheet.FormatProviders.Pdf <br /> Documents.Spreadsheet.FormatProviders.Xls <br /> Documents.ImageUtils <br /> Zip |
-| [RadWordsProcessing]({%slug dpl-in-blazor%}) | Documents.Core <br /> Documents.Fixed <br /> Documents.Flow <br /> Documents.Flow.FormatProviders.Pdf <br /> Documents.ImageUtils <br /> Documents.Flow.FormatProviders.Doc <br /> Documents.DrawingML <br /> Zip |
+| [RadPdfProcessing](slug://dpl-in-blazor) | Documents.Core <br /> Documents.Fixed <br /> Zip <br /> Documents.ImageUtils <br /> Documents.Fixed.FormatProviders.Image.Skia <br /> Documents.CMapUtils |
+| [RadSpreadProcessing](slug://dpl-in-blazor) | Documents.Core <br /> Documents.Fixed <br /> Documents.Spreadsheet <br /> Documents.SpreadSheet.FormatProviders.OpenXml <br /> Documents.SpreadSheet.FormatProviders.Pdf <br /> Documents.Spreadsheet.FormatProviders.Xls <br /> Documents.ImageUtils <br /> Zip |
+| [RadWordsProcessing](slug://dpl-in-blazor) | Documents.Core <br /> Documents.Fixed <br /> Documents.Flow <br /> Documents.Flow.FormatProviders.Pdf <br /> Documents.ImageUtils <br /> Documents.Flow.FormatProviders.Doc <br /> Documents.DrawingML <br /> Zip |
 
 
 ## See Also
 
-* [Telerik Document Processing Overview]({%slug dpl-in-blazor%})
-* [Visual Studio Code Integration for Telerik UI for Blazor Overview]({% slug getting-started-vs-code-integration-overview %})
+* [Telerik Document Processing Overview](slug://dpl-in-blazor)
+* [Visual Studio Code Integration for Telerik UI for Blazor Overview](slug://getting-started-vs-code-integration-overview)
diff --git a/getting-started/vs-code-integration/introduction.md b/getting-started/vs-code-integration/introduction.md
index ea814d6680..b9a291fa87 100644
--- a/getting-started/vs-code-integration/introduction.md
+++ b/getting-started/vs-code-integration/introduction.md
@@ -16,9 +16,9 @@ The **Telerik UI for Blazor Template Wizard** Extension for [Visual Studio Code]
 
 The extension for Visual Studio Code provides the following advantages:
 
-* It facilitates the [creation of projects]({% slug getting-started-vs-code-integration-new-project %}).
+* It facilitates the [creation of projects](slug://getting-started-vs-code-integration-new-project).
 
-* It allows you to [add the Telerik Components to an existing project]({%slug getting-started-vs-code-integration-convert-project %}) with a few clicks.
+* It allows you to [add the Telerik Components to an existing project](slug://getting-started-vs-code-integration-convert-project ) with a few clicks.
 
 
 
diff --git a/getting-started/vs-code-integration/new-project-wizard.md b/getting-started/vs-code-integration/new-project-wizard.md
index f090d13acc..0577624f99 100644
--- a/getting-started/vs-code-integration/new-project-wizard.md
+++ b/getting-started/vs-code-integration/new-project-wizard.md
@@ -36,7 +36,7 @@ The **Telerik UI for Blazor Template Wizard** provides two options to start you
 * **Start from Template** - the wizard provides a set of predefined project templates:
     * **CRUD, Form, Chart**&mdash;A small app that showcases the Telerik UI Data Grid, Chart, and Form validation. The Data Grid also uses a basic CRUD service (a common pattern for data updates in production-ready applications).
     * **Dashboard**&mdash;A basic dashboard that showcases the Telerik UI TileLayout component and how individual blocks (tiles) can fetch data.
-    * **Admin**&mdash;A small app that showcases a dashboard for administrators. The app uses some of the main Telerik UI components like the [Data Grid]({%slug grid-overview%}), [Chart]({%slug components/chart/overview%}), [TileLayout]({%slug tilelayout-overview%}), [Form]({%slug form-overview%}), and more.
+    * **Admin**&mdash;A small app that showcases a dashboard for administrators. The app uses some of the main Telerik UI components like the [Data Grid](slug://grid-overview), [Chart](slug://components/chart/overview), [TileLayout](slug://tilelayout-overview), [Form](slug://form-overview), and more.
 
 The available templates vary depending on the target framework and hosting model. All of the above templates are available for the Client and Server projects for .NET 6 and .NET 7. The Hybrid projects and the .NET 8 Web App support only the **Start from Blank App** option.
 
@@ -46,11 +46,11 @@ Type your project name and select the output folder for it.
 
 #### Section 3: Select UI for Blazor Version
 
-Select the preferred UI for Blazor version. Make sure that your system has access to the specified version of the UI components. You can achieve this with the [Telerik NuGet feed]({%slug installation/nuget%}).
+Select the preferred UI for Blazor version. Make sure that your system has access to the specified version of the UI components. You can achieve this with the [Telerik NuGet feed](slug://installation/nuget).
 
 #### Section 4: Select Hosting Model
 
-Here you can select the desired hosting model&mdash;[**WebApp**]({%slug getting-started/web-app%}), [**Client** (also: WebAssembly)]({%slug getting-started/client-side%}), [**Server**]({%slug getting-started/server-side%}), or [**Hybrid** (a hybrid Blazor MAUI)]({%slug getting-started/hybrid-blazor%}).
+Here you can select the desired hosting model&mdash;[**WebApp**](slug://getting-started/web-app), [**Client** (also: WebAssembly)](slug://getting-started/client-side), [**Server**](slug://getting-started/server-side), or [**Hybrid** (a hybrid Blazor MAUI)](slug://getting-started/hybrid-blazor).
 
 The available target framework options are updated upon selecting the hosting model.
 
@@ -60,15 +60,15 @@ Select your license type - **Commercial** (**Paid**) or **Trial**.
 
 #### Section 6: Choose How to Distribute the Client Assets
 
-Choose whether to load the required Telerik UI stylesheet and JS Interop file as [static NuGet assets]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files) or load them from the [Telerik CDN]({%slug common-features-cdn%}).
+Choose whether to load the required Telerik UI stylesheet and JS Interop file as [static NuGet assets](slug://getting-started/what-you-need#css-theme-and-javascript-files) or load them from the [Telerik CDN](slug://common-features-cdn).
 
 #### Section 7: Enable or Disable Localization
 
-Choose whether to use [localization]({%slug globalization-localization%}) in the project or not.
+Choose whether to use [localization](slug://globalization-localization) in the project or not.
 
 #### Section 8: Select the Preferred Icon Type
 
-Decide if you want to switch to using [Font Icons]({%slug common-features-icons%}) instead of the default SVG icons.
+Decide if you want to switch to using [Font Icons](slug://common-features-icons) instead of the default SVG icons.
 
 #### Section 9: Select Target Framework
 
@@ -76,7 +76,7 @@ The available .NET framework versions vary depending on the selected hosting mod
 
 #### Section 10: Select Theme
 
-Select your desired [theme]({%slug themes-overview%}) for your project. Click **See All Swatches** to explore the available [theme color variations]({%slug themes-overview%}#basics).
+Select your desired [theme](slug://themes-overview) for your project. Click **See All Swatches** to explore the available [theme color variations](slug://themes-overview#basics).
 
 #### Confirm Project Creation
 
@@ -85,9 +85,9 @@ After configuring the preferred settings, click the **Create Project** button. T
 
 ## See Also
 
-* [Telerik UI for Blazor Visual Studio Code Extensions Overview]({%slug getting-started-vs-code-integration-overview%})
-* [Downloading the Latest Telerik UI for Blazor Versions]({% slug getting-started-vs-integration-latest-version%})
-* [Getting Started with Client-Side Apps]({%slug getting-started/client-side%})
-* [Getting Started with Server-Side Apps]({%slug getting-started/server-side%})
-* [Getting Started with Web Apps]({%slug getting-started/web-app%})
-* [Workflow for Using the UI Components for Blazor]({%slug getting-started/what-you-need%})
+* [Telerik UI for Blazor Visual Studio Code Extensions Overview](slug://getting-started-vs-code-integration-overview)
+* [Downloading the Latest Telerik UI for Blazor Versions](slug://getting-started-vs-integration-latest-version)
+* [Getting Started with Client-Side Apps](slug://getting-started/client-side)
+* [Getting Started with Server-Side Apps](slug://getting-started/server-side)
+* [Getting Started with Web Apps](slug://getting-started/web-app)
+* [Workflow for Using the UI Components for Blazor](slug://getting-started/what-you-need)
diff --git a/getting-started/vs-code-integration/scaffolders.md b/getting-started/vs-code-integration/scaffolders.md
index cf7af7473b..ffe57daa49 100644
--- a/getting-started/vs-code-integration/scaffolders.md
+++ b/getting-started/vs-code-integration/scaffolders.md
@@ -26,15 +26,15 @@ To use the **Telerik UI for Blazor Scaffolders**, install the Telerik UI for Bla
 
 ## Available Scaffolded Components
 
-* [Grid]({%slug grid-overview%})
-* [TreeList]({%slug treelist-overview%})
-* [Scheduler]({%slug scheduler-overview%})
-* [Chart]({%slug components/chart/overview%})
-* [ListView]({%slug listview-overview%})
-* [Gantt]({%slug gantt-overview%})
-* [Form]({%slug form-overview%})
-* [Button]({%slug components/button/overview%})
-* [Drawer]({%slug drawer-overview%})
-* [Menu]({%slug components/menu/overview%})
-* [DropDownList]({%slug components/dropdownlist/overview%})
-* [ComboBox]({%slug components/combobox/overview%})
\ No newline at end of file
+* [Grid](slug://grid-overview)
+* [TreeList](slug://treelist-overview)
+* [Scheduler](slug://scheduler-overview)
+* [Chart](slug://components/chart/overview)
+* [ListView](slug://listview-overview)
+* [Gantt](slug://gantt-overview)
+* [Form](slug://form-overview)
+* [Button](slug://components/button/overview)
+* [Drawer](slug://drawer-overview)
+* [Menu](slug://components/menu/overview)
+* [DropDownList](slug://components/dropdownlist/overview)
+* [ComboBox](slug://components/combobox/overview)
\ No newline at end of file
diff --git a/getting-started/vs-code-integration/troubleshooting.md b/getting-started/vs-code-integration/troubleshooting.md
index a8e5129971..d2a138b1e9 100644
--- a/getting-started/vs-code-integration/troubleshooting.md
+++ b/getting-started/vs-code-integration/troubleshooting.md
@@ -22,4 +22,4 @@ To clear the cache files:
 
 ## Convert Project Command Issues
 
-If you are trying to convert your project through the `Convert Command` in the Telerik UI for Blazor Visual Studio Code Extension and observe any issues, see the dedicated [Convert Project troubleshooting section]({%slug getting-started-vs-code-integration-convert-project%}#troubleshooting).
+If you are trying to convert your project through the `Convert Command` in the Telerik UI for Blazor Visual Studio Code Extension and observe any issues, see the dedicated [Convert Project troubleshooting section](slug://getting-started-vs-code-integration-convert-project#troubleshooting).
diff --git a/getting-started/vs-integration/configure-project-wizard.md b/getting-started/vs-integration/configure-project-wizard.md
index 50ff25f299..cca3b796b9 100644
--- a/getting-started/vs-integration/configure-project-wizard.md
+++ b/getting-started/vs-integration/configure-project-wizard.md
@@ -10,7 +10,7 @@ position: 4
 
 This article demonstrates how to configure an existing Telerik UI for Blazor application by using the Project Configuration Wizard. The wizard comes with the Telerik UI for Blazor VS extensions and helps you to modify settings like the visual theme, CDN utilization, and configuration for content localizing in existing projects.
 
-To use the wizard, your project must be already [configured as a Telerik UI for Blazor application]({%slug getting-started-vs-integration-convert-project%}) and be able to use the Telerik UI components.
+To use the wizard, your project must be already [configured as a Telerik UI for Blazor application](slug://getting-started-vs-integration-convert-project) and be able to use the Telerik UI components.
 
 To open the Project Configuration Wizard, click **Extensions** > **Telerik** > **Telerik UI for Blazor** > **Configure Project**.
 
@@ -22,7 +22,7 @@ The configuration wizard handles the following tasks:
 
 ## Theme Selection
 
-The **Theme Selection** page enables you to change the [CSS theme]({%slug themes-overview%}) of your Telerik UI for Blazor application.
+The **Theme Selection** page enables you to change the [CSS theme](slug://themes-overview) of your Telerik UI for Blazor application.
 
 After selecting the desired theme, click **Next** to navigate to the [Project Settings](#project-settings) page.
 
@@ -30,10 +30,10 @@ After selecting the desired theme, click **Next** to navigate to the [Project Se
 
 The **Project Settings** page allows you to enable or disable:
 
-* The [Telerik UI CDN support]({%slug common-features-cdn%}). Note that this can affect the future [upgrade process of the theme]({%slug upgrade-tutorial%}#upgrade-process).
-* The [Font Icons]({%slug common-features-icons%}) in the project.
+* The [Telerik UI CDN support](slug://common-features-cdn). Note that this can affect the future [upgrade process of the theme](slug://upgrade-tutorial#upgrade-process).
+* The [Font Icons](slug://common-features-icons) in the project.
 
 ## See Also
 
-* [Visual Studio Integration for Telerik UI for Blazor Overview]({% slug getting-started-vs-integration-overview %})
-* [Converting to Telerik Projects]({% slug getting-started-vs-integration-convert-project %})
+* [Visual Studio Integration for Telerik UI for Blazor Overview](slug://getting-started-vs-integration-overview)
+* [Converting to Telerik Projects](slug://getting-started-vs-integration-convert-project)
diff --git a/getting-started/vs-integration/convert-project-wizard.md b/getting-started/vs-integration/convert-project-wizard.md
index dfa3ec4c18..b64d3fbfc1 100644
--- a/getting-started/vs-integration/convert-project-wizard.md
+++ b/getting-started/vs-integration/convert-project-wizard.md
@@ -10,18 +10,18 @@ position: 3
 
 This article demonstrates how to enable the Progress&reg; Telerik&reg; UI for Blazor components in your existing Blazor app with a few mouse clicks. The supported integration is helpful if you already have a substantial app, or if you want to use the Microsoft templates to start with features like authentication and add the UI components later.
 
-To add the Telerik UI components to your existing Blazor application, use the Convert Project Wizard. The wizard detects all installed versions of Telerik UI for Blazor and lists them in the **Version** combobox&mdash;this feature enables you to start your project with the desired version. To make sure you are up to date, you can also [get the latest version]({%slug getting-started-vs-integration-latest-version%}).
+To add the Telerik UI components to your existing Blazor application, use the Convert Project Wizard. The wizard detects all installed versions of Telerik UI for Blazor and lists them in the **Version** combobox&mdash;this feature enables you to start your project with the desired version. To make sure you are up to date, you can also [get the latest version](slug://getting-started-vs-integration-latest-version).
 
 The Convert Project Wizard automates a set of steps that you otherwise must perform manually.
 
 The wizard adds the following client assets to your project:
-* [Telerik stylesheet]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files)
-* [JS Interop file]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files)
+* [Telerik stylesheet](slug://getting-started/what-you-need#css-theme-and-javascript-files)
+* [JS Interop file](slug://getting-started/what-you-need#css-theme-and-javascript-files)
 
 The wizard also configures the project to use the Telerik UI for Blazor components by adding the following utilities:
-* [Required `@using` directives]({%slug getting-started/what-you-need%}#namespaces) to the `~/_Imports.razor` file.
-* [`TelerikLayout.razor` component]({%slug getting-started/what-you-need%}#telerikrootcomponent) at the root level of the DOM.
-* Registration of the [Telerik services]({%slug getting-started/what-you-need%}#service).
+* [Required `@using` directives](slug://getting-started/what-you-need#namespaces) to the `~/_Imports.razor` file.
+* [`TelerikLayout.razor` component](slug://getting-started/what-you-need#telerikrootcomponent) at the root level of the DOM.
+* Registration of the [Telerik services](slug://getting-started/what-you-need#service).
 
 ## Getting the Wizard
 
@@ -72,13 +72,13 @@ This screen provides the ability to:
 * Download the latest available version.
 * Choose a particular version to add to the project.
 * Configure additional project settings like:
-    * Load the required Telerik UI stylesheet and JS Interop file as [static assets]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files) or from the [Telerik CDN]({%slug common-features-cdn%}).
-    * Enable [localization]({%slug globalization-localization%}).
-    * Use [font icons]({%slug common-features-icons%}) instead of the default SVG icons.
+    * Load the required Telerik UI stylesheet and JS Interop file as [static assets](slug://getting-started/what-you-need#css-theme-and-javascript-files) or from the [Telerik CDN](slug://common-features-cdn).
+    * Enable [localization](slug://globalization-localization).
+    * Use [font icons](slug://common-features-icons) instead of the default SVG icons.
 
 ### Step 2: Select Theme
 
-In this step, you can apply one of the available [themes]({%slug themes-overview%}) to your project.
+In this step, you can apply one of the available [themes](slug://themes-overview) to your project.
 
 ### Step 3: Create a Backup
 
@@ -96,7 +96,7 @@ When converting a project, you may encounter the following most common issues:
 
 If you see an error screen in the wizard, make sure that you have selected the UI project in the Solution Explorer. For example, the Issue can occur in WebAssembly apps as they can include a Server and Shared projects, and only the Client project is the actual Blazor UI app that needs the Telerik components.
 
-Some specific project settings can also cause an exception during conversion. The fastest solution is to [manually configure the project for the Telerik components]({%slug getting-started/what-you-need%}).
+Some specific project settings can also cause an exception during conversion. The fastest solution is to [manually configure the project for the Telerik components](slug://getting-started/what-you-need).
 
 ### Components Fail
 
@@ -126,8 +126,8 @@ The fix is to move the `TelerikLayout.razor` file to the original `Shared` folde
 
 ## See Also
 
-* [Telerik UI for Blazor Visual Studio Extensions Overview]({% slug getting-started-vs-integration-overview %})
-* [Downloading the Latest Telerik UI for Blazor Versions]({% slug getting-started-vs-integration-latest-version %})
-* [Getting Started with Client-Side Apps]({%slug getting-started/client-side%})
-* [Getting Started with Server-Side Apps]({%slug getting-started/server-side%})
-* [Workflow for Using the UI Components for Blazor]({%slug getting-started/what-you-need%})
+* [Telerik UI for Blazor Visual Studio Extensions Overview](slug://getting-started-vs-integration-overview)
+* [Downloading the Latest Telerik UI for Blazor Versions](slug://getting-started-vs-integration-latest-version)
+* [Getting Started with Client-Side Apps](slug://getting-started/client-side)
+* [Getting Started with Server-Side Apps](slug://getting-started/server-side)
+* [Workflow for Using the UI Components for Blazor](slug://getting-started/what-you-need)
diff --git a/getting-started/vs-integration/dpl-wizard.md b/getting-started/vs-integration/dpl-wizard.md
index 345db9d703..bba8740b0d 100644
--- a/getting-started/vs-integration/dpl-wizard.md
+++ b/getting-started/vs-integration/dpl-wizard.md
@@ -51,4 +51,4 @@ When you select a package, the main page of the Wizard will appear. In the **SEL
 
 ## See Also
 
-* [Visual Studio Integration for Telerik UI for Blazor Overview]({% slug getting-started-vs-integration-overview %})
\ No newline at end of file
+* [Visual Studio Integration for Telerik UI for Blazor Overview](slug://getting-started-vs-integration-overview)
\ No newline at end of file
diff --git a/getting-started/vs-integration/introduction.md b/getting-started/vs-integration/introduction.md
index c1514ccde7..361660068a 100644
--- a/getting-started/vs-integration/introduction.md
+++ b/getting-started/vs-integration/introduction.md
@@ -16,11 +16,11 @@ To integrate with Visual Studio (VS), Telerik UI for Blazor provides VS extensio
 
 The Telerik UI for Blazor extensions provide the following advantages:
 
-* They facilitate the [creation of projects]({% slug getting-started-vs-integration-new-project %}) and enable you to create a pre-configured project from a template. In this way, you can start using the Telerik UI for Blazor components immediately without additional project setup.
+* They facilitate the [creation of projects](slug://getting-started-vs-integration-new-project) and enable you to create a pre-configured project from a template. In this way, you can start using the Telerik UI for Blazor components immediately without additional project setup.
 
-* They allow you to [add the Telerik UI components to an existing project]({%slug getting-started-vs-integration-convert-project%}) with a few clicks.
+* They allow you to [add the Telerik UI components to an existing project](slug://getting-started-vs-integration-convert-project) with a few clicks.
 
-* They notify you about [new component versions]({%slug getting-started-vs-integration-latest-version %}).
+* They notify you about [new component versions](slug://getting-started-vs-integration-latest-version ).
 
 The Telerik UI for Blazor VS extensions support Visual Studio 2022 and 2019. @[template](/_contentTemplates/common/general-info.md#vsx-download)
 
@@ -30,6 +30,6 @@ To access the VS extensions, go to the **Extensions** > **Telerik** > **Telerik
 
 ## See Also
 
-* [Creating New Projects with Visual Studio]({% slug getting-started-vs-integration-new-project %})
-* [Converting Existing Projects with Visual Studio]({% slug getting-started-vs-integration-convert-project %})
-* [Downloading the Latest Telerik UI for Blazor Versions]({% slug getting-started-vs-integration-latest-version %})
+* [Creating New Projects with Visual Studio](slug://getting-started-vs-integration-new-project)
+* [Converting Existing Projects with Visual Studio](slug://getting-started-vs-integration-convert-project)
+* [Downloading the Latest Telerik UI for Blazor Versions](slug://getting-started-vs-integration-latest-version)
diff --git a/getting-started/vs-integration/latest-version-retrieval.md b/getting-started/vs-integration/latest-version-retrieval.md
index 3353f5ecbd..1321b08224 100644
--- a/getting-started/vs-integration/latest-version-retrieval.md
+++ b/getting-started/vs-integration/latest-version-retrieval.md
@@ -20,7 +20,7 @@ Clicking the **Update Now** button starts the Latest Version Acquirer tool which
 -->
 
 
-Clicking the **Get Latest** button in the [Create New Project]({% slug getting-started-vs-integration-new-project %}) wizard starts the Latest Version Acquirer tool. The tool checks for new versions of the UI components and allows you to download them to your computer. To continue, you must use your Telerik credentials.
+Clicking the **Get Latest** button in the [Create New Project](slug://getting-started-vs-integration-new-project) wizard starts the Latest Version Acquirer tool. The tool checks for new versions of the UI components and allows you to download them to your computer. To continue, you must use your Telerik credentials.
 
 1. Click on the LOG IN button. This will open a browser window with a login form on the telerik.com website.
 
@@ -30,11 +30,11 @@ Clicking the **Get Latest** button in the [Create New Project]({% slug getting-s
 1. Return to Visual Studio and confirm any privacy-related requests.
 1. In the next dialog that appears, click the **Download** button.
 
-1. Return to the [Create New Project]({% slug getting-started-vs-integration-new-project %}) wizard and select the newly downloaded version.
+1. Return to the [Create New Project](slug://getting-started-vs-integration-new-project) wizard and select the newly downloaded version.
 
 The Latest Version Acquirer tool downloads a `.zip` file that contains the latest Telerik UI for Blazor packages. By default, the file is saved in the `%APPDATA%\Telerik\Updates` folder. If the list with the offered packages gets too long and you do not need the prior versions, close VS and use the Windows Explorer to delete these distributions.
 
 ## See Also
 
-* [Telerik UI for Blazor Visual Studio Extensions Overview]({% slug getting-started-vs-integration-overview %})
-* [Creating New Projects with Visual Studio]({% slug getting-started-vs-integration-new-project %})
+* [Telerik UI for Blazor Visual Studio Extensions Overview](slug://getting-started-vs-integration-overview)
+* [Creating New Projects with Visual Studio](slug://getting-started-vs-integration-new-project)
diff --git a/getting-started/vs-integration/new-project-wizard.md b/getting-started/vs-integration/new-project-wizard.md
index 768725ccfd..03fa1cd653 100644
--- a/getting-started/vs-integration/new-project-wizard.md
+++ b/getting-started/vs-integration/new-project-wizard.md
@@ -10,20 +10,20 @@ position: 2
 
 This article demonstrates how to use the Telerik Visual Studio extensions to create a new project that is pre-configured for the Progress&reg; Telerik&reg; UI for Blazor components.
 
-To create a new Telerik UI for Blazor application, use the **Create New Project** wizard. The wizard detects all installed versions of Telerik UI for Blazor and lists them in the **Version** dropdown for selection. To make sure the components are up-to-date, you can also [get the latest version]({%slug getting-started-vs-integration-latest-version%}).
+To create a new Telerik UI for Blazor application, use the **Create New Project** wizard. The wizard detects all installed versions of Telerik UI for Blazor and lists them in the **Version** dropdown for selection. To make sure the components are up-to-date, you can also [get the latest version](slug://getting-started-vs-integration-latest-version).
 
 ## How It Works
 
 The **Create New Project** wizard automates a set of steps that you otherwise must perform manually.
 
 The wizard adds the following client assets to your project:
-* [Telerik stylesheet]({%slug getting-started/what-you-need%}#css-theme).
-* [JS Interop file]({%slug getting-started/what-you-need%}#javascript-file).
+* [Telerik stylesheet](slug://getting-started/what-you-need#css-theme).
+* [JS Interop file](slug://getting-started/what-you-need#javascript-file).
 
 The wizard also configures the project to use the Telerik UI for Blazor components by adding the following utilities:
-* [Required `@using` directives]({%slug getting-started/what-you-need%}#namespaces) to the `~/_Imports.razor` file.
-* `TelerikLayout.razor` component containing the [`TelerikRootComponent`]({%slug getting-started/what-you-need%}#telerikrootcomponent).
-* Registration of the [Telerik services]({%slug getting-started/what-you-need%}#service).
+* [Required `@using` directives](slug://getting-started/what-you-need#namespaces) to the `~/_Imports.razor` file.
+* `TelerikLayout.razor` component containing the [`TelerikRootComponent`](slug://getting-started/what-you-need#telerikrootcomponent).
+* Registration of the [Telerik services](slug://getting-started/what-you-need#service).
 
 ## Getting the Wizard
 
@@ -69,26 +69,26 @@ In this screen, you can choose:
 * Target .NET framework
 * Hosting model&mdash;the options vary depending on the selected target framework.
 * Configure additional project settings like:
-   * Load the required Telerik UI stylesheet and JS Interop file as [static assets]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files) or from the [Telerik CDN]({%slug common-features-cdn%}). Note that this can affect the future [upgrade process of the theme]({%slug upgrade-tutorial%}#upgrade-process).
-   * Enable [localization]({%slug globalization-localization%}).
-   * Use [font icons]({%slug common-features-icons%}) instead of the default SVG icons.
-* Location from where the application will get the Telerik UI for Blazor package&mdash;[remote NuGet feed]({%slug installation/nuget%}) or local files.
+   * Load the required Telerik UI stylesheet and JS Interop file as [static assets](slug://getting-started/what-you-need#css-theme-and-javascript-files) or from the [Telerik CDN](slug://common-features-cdn). Note that this can affect the future [upgrade process of the theme](slug://upgrade-tutorial#upgrade-process).
+   * Enable [localization](slug://globalization-localization).
+   * Use [font icons](slug://common-features-icons) instead of the default SVG icons.
+* Location from where the application will get the Telerik UI for Blazor package&mdash;[remote NuGet feed](slug://installation/nuget) or local files.
 * Telerik UI for Blazor version.
 
 ### Step 2: Select Project Template
 
-The **Create New Project** wizard generates a project that is based on the Microsoft template. The app includes some Telerik UI components and the [required NuGet package reference, static assets, localization service, and the `TelerikRootComponent`]({%slug getting-started/what-you-need%}).
+The **Create New Project** wizard generates a project that is based on the Microsoft template. The app includes some Telerik UI components and the [required NuGet package reference, static assets, localization service, and the `TelerikRootComponent`](slug://getting-started/what-you-need).
 
 > The **Admin**, **Dashboard**, **CRUD**, **Form**, and **Chart** templates were deprecated. Their source code is available in the [`blazor-ui` repo](https://github.com/telerik/blazor-ui/tree/master/common/legacy-project-templates).
 
 ### Step 3: Select Theme
 
-Finally, you can apply one of the available [themes]({%slug themes-overview%}) to your project.
+Finally, you can apply one of the available [themes](slug://themes-overview) to your project.
 
 ## See Also
 
-* [Telerik UI for Blazor Visual Studio Extensions Overview]({% slug getting-started-vs-integration-overview %})
-* [Downloading the Latest Telerik UI for Blazor Versions]({% slug getting-started-vs-integration-latest-version %})
-* [Getting Started with Client-Side Apps]({%slug getting-started/client-side%})
-* [Getting Started with Server-Side Apps]({%slug getting-started/server-side%})
-* [Workflow for Using the UI Components for Blazor]({%slug getting-started/what-you-need%})
+* [Telerik UI for Blazor Visual Studio Extensions Overview](slug://getting-started-vs-integration-overview)
+* [Downloading the Latest Telerik UI for Blazor Versions](slug://getting-started-vs-integration-latest-version)
+* [Getting Started with Client-Side Apps](slug://getting-started/client-side)
+* [Getting Started with Server-Side Apps](slug://getting-started/server-side)
+* [Workflow for Using the UI Components for Blazor](slug://getting-started/what-you-need)
diff --git a/getting-started/vs-integration/options.md b/getting-started/vs-integration/options.md
index cf3d8ecbcb..21a9cf254b 100644
--- a/getting-started/vs-integration/options.md
+++ b/getting-started/vs-integration/options.md
@@ -54,5 +54,5 @@ C:\Users\[username]\AppData\Roaming\Telerik\Updates
 
 ## See Also
 
-* [Creating New Projects with Visual Studio]({%slug getting-started-vs-integration-new-project %})
-* [Updating Projects with Visual Studio]({%slug getting-started-vs-integration-upgrade-project %})
+* [Creating New Projects with Visual Studio](slug://getting-started-vs-integration-new-project )
+* [Updating Projects with Visual Studio](slug://getting-started-vs-integration-upgrade-project )
diff --git a/getting-started/vs-integration/scaffolders.md b/getting-started/vs-integration/scaffolders.md
index 9e302b2c7a..3d2baef254 100644
--- a/getting-started/vs-integration/scaffolders.md
+++ b/getting-started/vs-integration/scaffolders.md
@@ -23,21 +23,21 @@ To use the Telerik UI for Blazor scaffolders, install the Telerik UI for Blazor
 
 ## Supported Components
 
-* [Data Grid]({%slug grid-overview%})
-* [TreeList]({%slug treelist-overview%})
-* [Scheduler]({%slug scheduler-overview%})
-* [Chart]({%slug components/chart/overview%})
-* [ListView]({%slug listview-overview%})
-* [Gantt]({%slug gantt-overview%})
-* [Form]({%slug form-overview%})
-* [Button]({%slug components/button/overview%})
-* [Drawer]({%slug drawer-overview%})
-* [Menu]({%slug components/menu/overview%})
-* [DropDownList]({%slug components/dropdownlist/overview%})
-* [ComboBox]({%slug components/combobox/overview%})
+* [Data Grid](slug://grid-overview)
+* [TreeList](slug://treelist-overview)
+* [Scheduler](slug://scheduler-overview)
+* [Chart](slug://components/chart/overview)
+* [ListView](slug://listview-overview)
+* [Gantt](slug://gantt-overview)
+* [Form](slug://form-overview)
+* [Button](slug://components/button/overview)
+* [Drawer](slug://drawer-overview)
+* [Menu](slug://components/menu/overview)
+* [DropDownList](slug://components/dropdownlist/overview)
+* [ComboBox](slug://components/combobox/overview)
 
 ## See Also
 
-* [Telerik UI for Blazor Visual Studio Extensions Overview]({% slug getting-started-vs-integration-overview %})
-* [Creating New Projects with Visual Studio]({% slug getting-started-vs-integration-new-project %})
-* [Downloading the Latest Telerik UI for Blazor Versions]({% slug getting-started-vs-integration-latest-version %})
+* [Telerik UI for Blazor Visual Studio Extensions Overview](slug://getting-started-vs-integration-overview)
+* [Creating New Projects with Visual Studio](slug://getting-started-vs-integration-new-project)
+* [Downloading the Latest Telerik UI for Blazor Versions](slug://getting-started-vs-integration-latest-version)
diff --git a/getting-started/vs-integration/troubleshooting.md b/getting-started/vs-integration/troubleshooting.md
index 6c1e29f8e9..8242ecf20b 100644
--- a/getting-started/vs-integration/troubleshooting.md
+++ b/getting-started/vs-integration/troubleshooting.md
@@ -42,10 +42,10 @@ If you apply both approaches and the issue persists, generate a Visual Studio [A
 
 ## Issues occur when converting existing projects
 
-For any issues with the **Convert Project** wizard, see its [dedicated troubleshooting section]({%slug getting-started-vs-integration-convert-project%}#troubleshooting).
+For any issues with the **Convert Project** wizard, see its [dedicated troubleshooting section](slug://getting-started-vs-integration-convert-project#troubleshooting).
 
 ## See Also
 
-* [Telerik UI for Blazor Visual Studio Extensions Overview]({% slug getting-started-vs-integration-overview %})
-* [Creating New Projects with Visual Studio]({% slug getting-started-vs-integration-new-project %})
-* [Downloading the Latest Telerik UI for Blazor Versions]({% slug getting-started-vs-integration-latest-version %})
+* [Telerik UI for Blazor Visual Studio Extensions Overview](slug://getting-started-vs-integration-overview)
+* [Creating New Projects with Visual Studio](slug://getting-started-vs-integration-new-project)
+* [Downloading the Latest Telerik UI for Blazor Versions](slug://getting-started-vs-integration-latest-version)
diff --git a/getting-started/vs-integration/upgrade-wizard.md b/getting-started/vs-integration/upgrade-wizard.md
index 5976eb3f85..cf3cc1501c 100644
--- a/getting-started/vs-integration/upgrade-wizard.md
+++ b/getting-started/vs-integration/upgrade-wizard.md
@@ -8,7 +8,7 @@ position: 7
 
 # Upgrading Projects
 
-This article demonstrates how to use the [Telerik Visual Studio Extension]({% slug getting-started-vs-integration-overview %}) to upgrade a project that is pre-configured for the Progress&reg; Telerik&reg; UI for Blazor components.
+This article demonstrates how to use the [Telerik Visual Studio Extension](slug://getting-started-vs-integration-overview) to upgrade a project that is pre-configured for the Progress&reg; Telerik&reg; UI for Blazor components.
 
 ## Basics
 
@@ -23,7 +23,7 @@ The **Upgrade Information** step of the Upgrade Project Wizard describes the fil
 The Telerik Blazor Upgrade Wizard will do the following:
 
 * Update the version of the referenced Blazor NuGet package. It will also update the package source in the solution-based NuGet config file.
-* Update the version of the theme reference, but only when using CDN. Otherwise, [update the theme manually]({%slug getting-started-vs-integration-new-project%}#step-3-select-theme).
+* Update the version of the theme reference, but only when using CDN. Otherwise, [update the theme manually](slug://getting-started-vs-integration-new-project#step-3-select-theme).
 * Update all local script and style and NuGet package references if you upgrade from a Trial to a Dev version.
 * It will add the new keys in the default (English) localization file.
 
@@ -58,8 +58,8 @@ The **Finish** button will display a tooltip, indicating a page error when:
 
 ## See Also
 
-* [Visual Studio Extensions Overview]({% slug getting-started-vs-integration-overview %})
-* [Downloading the Latest Telerik UI for Blazor Versions]({% slug getting-started-vs-integration-latest-version %})
-* [Getting Started with Client-Side Apps]({%slug getting-started/client-side%})
-* [Getting Started with Server-Side Apps]({%slug getting-started/server-side%})
-* [Workflow for Using the UI Components for Blazor]({%slug getting-started/what-you-need%})
+* [Visual Studio Extensions Overview](slug://getting-started-vs-integration-overview)
+* [Downloading the Latest Telerik UI for Blazor Versions](slug://getting-started-vs-integration-latest-version)
+* [Getting Started with Client-Side Apps](slug://getting-started/client-side)
+* [Getting Started with Server-Side Apps](slug://getting-started/server-side)
+* [Workflow for Using the UI Components for Blazor](slug://getting-started/what-you-need)
diff --git a/getting-started/web-app.md b/getting-started/web-app.md
index b4b0c795bd..78994ad441 100644
--- a/getting-started/web-app.md
+++ b/getting-started/web-app.md
@@ -52,13 +52,13 @@ To enable the Telerik UI for Blazor components, you must add several client-side
 
 ### 4.1. Add the Telerik UI for Blazor Client Assets
 
-1\. Add the `telerik-blazor.js` file to your `App.razor` file as a [static asset]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files).
+1\. Add the `telerik-blazor.js` file to your `App.razor` file as a [static asset](slug://getting-started/what-you-need#css-theme-and-javascript-files).
 
 **HTML**
 
 @[template](/_contentTemplates/common/js-interop-file.md#js-interop-file-snippet)
 
-2\. To select the appearance and color scheme for the Telerik Blazor components, add the [theme stylesheet as a static asset]({%slug themes-overview%}#using-a-theme) in your `App.razor` file.
+2\. To select the appearance and color scheme for the Telerik Blazor components, add the [theme stylesheet as a static asset](slug://themes-overview#using-a-theme) in your `App.razor` file.
 
 **HTML**
 
@@ -66,7 +66,7 @@ To enable the Telerik UI for Blazor components, you must add several client-side
 
 ### 4.2. Include @using Statements
 
-Add the `@using` directives below in the `~/_Imports.razor` file in all projects in which you [installed the Telerik NuGet package in **Step 3**](#step-3-install-the-telerik-ui-for-blazor-components). This configures the project to recognize the Telerik components in all files. You can register one or both icon namespaces, depending on the [icon type you use]({%slug common-features-icons%}).
+Add the `@using` directives below in the `~/_Imports.razor` file in all projects in which you [installed the Telerik NuGet package in **Step 3**](#step-3-install-the-telerik-ui-for-blazor-components). This configures the project to recognize the Telerik components in all files. You can register one or both icon namespaces, depending on the [icon type you use](slug://common-features-icons).
 
 ````RAZOR.skip-repl _Imports.razor
 @using Telerik.Blazor
@@ -77,11 +77,11 @@ Add the `@using` directives below in the `~/_Imports.razor` file in all projects
 
 ### 4.3. Add the TelerikRootComponent
 
-Use a single [`TelerikRootComponent`]({%slug rootcomponent-overview%}) component as a top-level component in the app.
+Use a single [`TelerikRootComponent`](slug://rootcomponent-overview) component as a top-level component in the app.
 
 @[template](/_contentTemplates/common/get-started.md#root-component-main-layout)
 
-> The `TelerikRootComponent` requires an [interactive render mode](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes). Layout components are interactive only in applications with **Global** Interactivity location. This section 4.3 applies only to apps with **Global** interactivity. If your app is using **Per page/component** interactivity, then check [Using TelerikRootComponent in apps with per component interactivity]({%slug rootcomponent-percomponent%}) instead.
+> The `TelerikRootComponent` requires an [interactive render mode](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes). Layout components are interactive only in applications with **Global** Interactivity location. This section 4.3 applies only to apps with **Global** interactivity. If your app is using **Per page/component** interactivity, then check [Using TelerikRootComponent in apps with per component interactivity](slug://rootcomponent-percomponent) instead.
 
 ### 4.4. Register the Telerik Blazor Service
 
@@ -104,8 +104,8 @@ The final step in this tutorial is to use a Telerik UI for Blazor component in a
 
 ## See Also
 
-* [Workflow Details for Telerik UI for Blazor]({%slug getting-started/what-you-need%})
-* [Using Blazor Sections inside Telerik Components]({%slug common-kb-net8-sections%})
+* [Workflow Details for Telerik UI for Blazor](slug://getting-started/what-you-need)
+* [Using Blazor Sections inside Telerik Components](slug://common-kb-net8-sections)
 * [Getting Started Videos for Blazor](https://www.youtube.com/watch?v=aaRAZYaJ4xc&list=PLvmaC-XMqeBYPTwcm478vs8Rujq2tiVJo)
-* [First Steps with Blazor Server]({%slug getting-started/server-side%})
-* [First Steps with Blazor WebAssembly]({%slug getting-started/client-side%})
+* [First Steps with Blazor Server](slug://getting-started/server-side)
+* [First Steps with Blazor WebAssembly](slug://getting-started/client-side)
diff --git a/getting-started/what-you-need.md b/getting-started/what-you-need.md
index 103cee63f9..20c257269e 100644
--- a/getting-started/what-you-need.md
+++ b/getting-started/what-you-need.md
@@ -15,10 +15,10 @@ This article describes the required steps to use the Telerik UI for Blazor compo
 
 >tip The information in this article builds on top of the step-by-step tutorials for specific Blazor application types or render modes:
 >
-> * [Blazor Web App]({%slug getting-started/web-app%}) template in .NET 8 or 9
-> * [Blazor WebAssembly Standalone apps]({%slug getting-started/client-side%})
-> * [Blazor Server apps]({%slug getting-started/server-side%}) in .NET 6 or 7
-> * [Blazor Hybrid (MAUI) apps]({%slug getting-started/hybrid-blazor%})
+> * [Blazor Web App](slug://getting-started/web-app) template in .NET 8 or 9
+> * [Blazor WebAssembly Standalone apps](slug://getting-started/client-side)
+> * [Blazor Server apps](slug://getting-started/server-side) in .NET 6 or 7
+> * [Blazor Hybrid (MAUI) apps](slug://getting-started/hybrid-blazor)
 >
 > The differences between the above tutorials and this page are:
 >
@@ -53,11 +53,11 @@ Telerik UI for Blazor is distributed through several private and public NuGet pa
 | [`Telerik.SvgIcons`](https://www.nuget.org/packages/Telerik.SvgIcons) | Contains all Telerik SVG icons. Available on `nuget.org`. |
 | [`Telerik.FontIcons`](https://www.nuget.org/packages/Telerik.FontIcons) | Contains all Telerik font icons. Available on `nuget.org`. |
 | `Telerik.DataSource` | Adds support for data operations. All databound UI components use it for paging, sorting, filtering, or grouping. |
-| `Telerik.Recurrence` | Adds support for recurring appointments in the [Scheduler component]({%slug scheduler-overview%}). |
-| `Telerik.Documents.SpreadsheetStreaming` | Adds support for working with spreadsheet documents, and exporting to Excel or CSV. This package is part of [Telerik Document Processing]({%slug dpl-in-blazor%}). |
-| `Telerik.Zip` | Contains code for working with ZIP archives and Excel files. Excel files are actually ZIP archives and this package takes part in the exporting process. This package is part of [Telerik Document Processing]({%slug dpl-in-blazor%}). |
-| `Telerik.Pivot.Core` | Contains base code for the [PivotGrid component]({%slug pivotgrid-overview%}). This NuGet package must not be used separately without the Telerik PivotGrid component. |
-| `Telerik.Pivot.DataProviders.Xmla` | Adds support for [data binding the PivotGrid component to XMLA]({%slug pivotgrid-data-binding%}). This NuGet package must not be used separately without the Telerik PivotGrid component. |
+| `Telerik.Recurrence` | Adds support for recurring appointments in the [Scheduler component](slug://scheduler-overview). |
+| `Telerik.Documents.SpreadsheetStreaming` | Adds support for working with spreadsheet documents, and exporting to Excel or CSV. This package is part of [Telerik Document Processing](slug://dpl-in-blazor). |
+| `Telerik.Zip` | Contains code for working with ZIP archives and Excel files. Excel files are actually ZIP archives and this package takes part in the exporting process. This package is part of [Telerik Document Processing](slug://dpl-in-blazor). |
+| `Telerik.Pivot.Core` | Contains base code for the [PivotGrid component](slug://pivotgrid-overview). This NuGet package must not be used separately without the Telerik PivotGrid component. |
+| `Telerik.Pivot.DataProviders.Xmla` | Adds support for [data binding the PivotGrid component to XMLA](slug://pivotgrid-data-binding). This NuGet package must not be used separately without the Telerik PivotGrid component. |
 
 >note If you use a trial license, the private package names have a `.Trial` suffix, for example, `Telerik.UI.for.Blazor.Trial`.
 
@@ -70,12 +70,12 @@ To get the two public icon packages, you only need the default NuGet package sou
 
 You can get the private Telerik UI for Blazor packages in four ways:
 
-* [Telerik NuGet package source]({%slug installation/nuget%}). This is usually the most convenient option, and your NuGet client will notify you about new component versions. The other options below can be useful as an emergency alternative, or in environments with restricted Internet connection.
-* [Automated installer]({%slug installation/msi%})
-* [ZIP archive]({%slug installation/zip%})
-* As standalone `.nupkg` files. To use them, follow the instructions at [ZIP archive]({%slug installation/zip%}), but download the `.nupkg` files instead.
+* [Telerik NuGet package source](slug://installation/nuget). This is usually the most convenient option, and your NuGet client will notify you about new component versions. The other options below can be useful as an emergency alternative, or in environments with restricted Internet connection.
+* [Automated installer](slug://installation/msi)
+* [ZIP archive](slug://installation/zip)
+* As standalone `.nupkg` files. To use them, follow the instructions at [ZIP archive](slug://installation/zip), but download the `.nupkg` files instead.
 
-> Always check the [Telerik UI for Blazor release notes](https://www.telerik.com/support/whats-new/blazor-ui/release-history) when updating the components. New [major versions can contain breaking changes]({%slug versions-with-breaking-changes%}).
+> Always check the [Telerik UI for Blazor release notes](https://www.telerik.com/support/whats-new/blazor-ui/release-history) when updating the components. New [major versions can contain breaking changes](slug://versions-with-breaking-changes).
 
 
 ## Namespaces
@@ -121,7 +121,7 @@ global using Telerik.DataSource.Extensions; // use OnRead events and ToDataSourc
 
 ## Service
 
-The Telerik Blazor service provides [component localization]({%slug globalization-localization%}) and registers the default service that implements [`ITelerikStringLocalizer`](/blazor-ui/api/Telerik.Blazor.Services.ITelerikStringLocalizer).
+The Telerik Blazor service provides [component localization](slug://globalization-localization) and registers the default service that implements [`ITelerikStringLocalizer`](/blazor-ui/api/Telerik.Blazor.Services.ITelerikStringLocalizer).
 
 The Telerik Blazor components render all their built-in labels through this localization mechanism for consistency, even when .NET localization is not used.
 
@@ -135,7 +135,7 @@ Register the Telerik service in all projects that use Telerik Blazor components.
 builder.Services.AddTelerikBlazor();
 ````
 
-> To [localize the Telerik Blazor components]({%slug globalization-localization%}), always register your own `ITelerikStringLocalizer` service **after** `builder.Services.AddTelerikBlazor();`.
+> To [localize the Telerik Blazor components](slug://globalization-localization), always register your own `ITelerikStringLocalizer` service **after** `builder.Services.AddTelerikBlazor();`.
 
 
 ## CSS Theme and JavaScript Files
@@ -144,13 +144,13 @@ The Telerik UI for Blazor components require a [theme stylesheet](#css-theme) an
 
 To use static CSS and JS assets from the NuGet package in a project, make sure that the project has [`app.UseStaticFiles();` in its `Program.cs`](https://learn.microsoft.com/en-us/aspnet/core/razor-pages/ui-class?view=aspnetcore-8.0&tabs=visual-studio#consume-content-from-a-referenced-rcl) file. This is true by default.
 
-You can also [add the Telerik UI for Blazor version number to the CSS and JavaScript file URLs to prevent browser caching during version upgrades]({%slug common-kb-browser-cache-buster%}).
+You can also [add the Telerik UI for Blazor version number to the CSS and JavaScript file URLs to prevent browser caching during version upgrades](slug://common-kb-browser-cache-buster).
 
 ### CSS Theme
 
-Register the [Telerik theme stylesheet]({%slug themes-overview%}) in the `<head>` of the web page. Add the theme before the application stylesheet and the [CSS isolation stylesheet](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/css-isolation). This CSS file order lets you [override Telerik theme styles]({%slug themes-override%}) more easily, if necessary.
+Register the [Telerik theme stylesheet](slug://themes-overview) in the `<head>` of the web page. Add the theme before the application stylesheet and the [CSS isolation stylesheet](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/css-isolation). This CSS file order lets you [override Telerik theme styles](slug://themes-override) more easily, if necessary.
 
-Register the [Telerik font icon stylesheet]({%slug common-features-icons%}#font-icon-stylesheet) only if the app uses [Telerik font icons]({%slug common-features-icons%}).
+Register the [Telerik font icon stylesheet](slug://common-features-icons#font-icon-stylesheet) only if the app uses [Telerik font icons](slug://common-features-icons).
 
 >caption Adding the Telerik Blazor CSS files
 
@@ -207,12 +207,12 @@ The recommended way to register the Telerik Blazor JS file for better loading pe
 </html>
 ````
 
->tip All the information in this section also applies when using the [Telerik CDN]({%slug common-features-cdn%}). However, Telerik recommends using static assets, as shown above. Remote asset URLs require a [CDN fallback]({%slug common-kb-cdn-fallback%}) and manual maintenance during [component version updates]({%slug upgrade-tutorial%}).
+>tip All the information in this section also applies when using the [Telerik CDN](slug://common-features-cdn). However, Telerik recommends using static assets, as shown above. Remote asset URLs require a [CDN fallback](slug://common-kb-cdn-fallback) and manual maintenance during [component version updates](slug://upgrade-tutorial).
 
 
 ## TelerikRootComponent
 
-The [`TelerikRootComponent` is a special component]({%slug rootcomponent-overview%}#purpose) in Telerik UI for Blazor:
+The [`TelerikRootComponent` is a special component](slug://rootcomponent-overview#purpose) in Telerik UI for Blazor:
 
 * It can apply settings to all other Telerik Blazor components in the application.
 * It renders all component popups. All Telerik Blazor components that use popups will throw an exception if they cannot detect the `TelerikRootComponent`.
@@ -224,7 +224,7 @@ The `TelerikRootComponent` placement depends on the interactivity location of th
 > * .NET 8 or 9 Blazor Web Apps with **Global** interactivity location
 > * Blazor Server, WebAssembly and Hybrid apps in all .NET versions
 >
-> If you have a Blazor Web App with **Per page/component** interactivity location, then the correct `TelerikRootComponent` usage is different. The component still needs to wrap all other Telerik components, but it cannot reside in a static layout file, because the [other Telerik component will not detect it]({%slug common-kb-component-requires-telerikrootcomponent%}). Refer to section [Interactivity Considerations]({%slug rootcomponent-overview%}#interactivity-considerations) and article [Using TelerikRootComponent with Per Page/Component Interactivity]({%slug rootcomponent-percomponent%}).
+> If you have a Blazor Web App with **Per page/component** interactivity location, then the correct `TelerikRootComponent` usage is different. The component still needs to wrap all other Telerik components, but it cannot reside in a static layout file, because the [other Telerik component will not detect it](slug://common-kb-component-requires-telerikrootcomponent). Refer to section [Interactivity Considerations](slug://rootcomponent-overview#interactivity-considerations) and article [Using TelerikRootComponent with Per Page/Component Interactivity](slug://rootcomponent-percomponent).
 
 ### Optimal TelerikRootComponent Usage
 
@@ -232,7 +232,7 @@ Add a `<TelerikRootComponent>` component in the topmost layout file of the Blazo
 
 @[template](/_contentTemplates/rootcomponent/setup.md#define-in-teleriklayout)
 
-Check the [`TelerikRootComponent` documentation]({%slug rootcomponent-overview%}) for more information about its purpose and usage.
+Check the [`TelerikRootComponent` documentation](slug://rootcomponent-overview) for more information about its purpose and usage.
 
 
 ## Add Telerik Components to a View
@@ -263,8 +263,8 @@ The Blazor application is ready to use Telerik components.
 
 ## See Also
 
-* [Automated MSI installer]({%slug installation/msi%})
-* [ZIP archive]({%slug installation/zip%})
-* [Prevent browser caching during version upgrades]({%slug common-kb-browser-cache-buster%})
-* [JavaScript error troubleshooting]({%slug troubleshooting-js-errors%})
-* [NuGet troubleshooting]({%slug troubleshooting-nuget%})
+* [Automated MSI installer](slug://installation/msi)
+* [ZIP archive](slug://installation/zip)
+* [Prevent browser caching during version upgrades](slug://common-kb-browser-cache-buster)
+* [JavaScript error troubleshooting](slug://troubleshooting-js-errors)
+* [NuGet troubleshooting](slug://troubleshooting-nuget)
diff --git a/globalization/globalization-formats.md b/globalization/globalization-formats.md
index b01806f144..529b023be8 100644
--- a/globalization/globalization-formats.md
+++ b/globalization/globalization-formats.md
@@ -15,7 +15,7 @@ The Telerik UI for Blazor components use the culture of the current thread to re
 | Component | Date And Number Format Specifics |
 |---|---|
 | [Calendar](https://demos.telerik.com/blazor-ui/calendar/globalization) | The names of the months and days of the week are taken from the current culture, and the `FirstDayOfWeek` of the culture is honored when ordering the days of the week. The Calendar uses the  `ShortestDayNames` array to get the short names for the days of the week and it expects them in the default order coming from the framework - Sunday to Saturday. |
-| [Chart](https://demos.telerik.com/blazor-ui/chart/globalization) | The [Label Format Strings]({%slug components/chart/label-template-format%}) and [Tooltip]({%slug chart-tooltip-overview%}) allow using culture-aware content such as formatted numbers and dates. You can find examples at [How to localize numeric labels in the Chart]({%slug chart-kb-localized-numeric-labels%}) and at [Render culture-aware date axis labels](https://feedback.telerik.com/blazor/1629173-render-culture-aware-labels-on-the-date-axis). |
+| [Chart](https://demos.telerik.com/blazor-ui/chart/globalization) | The [Label Format Strings](slug://components/chart/label-template-format) and [Tooltip](slug://chart-tooltip-overview) allow using culture-aware content such as formatted numbers and dates. You can find examples at [How to localize numeric labels in the Chart](slug://chart-kb-localized-numeric-labels) and at [Render culture-aware date axis labels](https://feedback.telerik.com/blazor/1629173-render-culture-aware-labels-on-the-date-axis). |
 | [DateInput](https://demos.telerik.com/blazor-ui/dateinput/globalization) | @[template](/_contentTemplates/common/general-info.md#date-format-per-culture) |
 | [DatePicker](https://demos.telerik.com/blazor-ui/datepicker/globalization) | @[template](/_contentTemplates/common/general-info.md#date-format-per-culture) |
 | [DateRangePicker](https://demos.telerik.com/blazor-ui/daterangepicker/globalization) | @[template](/_contentTemplates/common/general-info.md#date-format-per-culture) |
@@ -30,5 +30,5 @@ The Telerik UI for Blazor components use the culture of the current thread to re
 
 ## See Also
 
-* [Localization]({%slug globalization-localization%})
-* [Supported Date Formats]({%slug components/dateinput/supported-formats%})
+* [Localization](slug://globalization-localization)
+* [Supported Date Formats](slug://components/dateinput/supported-formats)
diff --git a/globalization/localization.md b/globalization/localization.md
index d33f8fb0a5..6b06a673ef 100644
--- a/globalization/localization.md
+++ b/globalization/localization.md
@@ -49,13 +49,13 @@ The purpose of this step is to supply the correct application culture to the `Re
 Create and add localization resource `resx` files to your app, based on the languages that the app must support. Use the following links for reference:
 
 * A full up-to-date list of localization keys is available in the [`Telerik.Blazor.Resources.Messages` API reference](/blazor-ui/api/Telerik.Blazor.Resources.Messages).
-* An up-to-date English resource file is available in the [Telerik UI for Blazor demo site](https://demos.telerik.com/blazor-ui). Download the [UI for Blazor automated installer]({%slug installation/msi%}) or [UI for Blazor ZIP archive]({%slug installation/zip%}). Go to the installation location and open the folder `\demos\TelerikBlazorDemos\Resources\`. The folder contains `resx` localization files for a few different languages.
+* An up-to-date English resource file is available in the [Telerik UI for Blazor demo site](https://demos.telerik.com/blazor-ui). Download the [UI for Blazor automated installer](slug://installation/msi) or [UI for Blazor ZIP archive](slug://installation/zip). Go to the installation location and open the folder `\demos\TelerikBlazorDemos\Resources\`. The folder contains `resx` localization files for a few different languages.
 * Community resource files are available in the <a href="https://github.com/telerik/blazor-ui-messages" target="_blank">`blazor-ui-messages` GitHub repository</a>. These resource files are updated and maintained by the Telerik community. They may not be compatible with the latest product version. You are welcome to contribute your own resource files.
 
 > Update the localization resource files every time you upgrade Telerik UI for Blazor. Otherwise you may see:
 >
 * Missing or non-translated messages in the UI
-* [Exceptions related to missing localization keys]({%slug common-kb-null-value-parameter-format%})
+* [Exceptions related to missing localization keys](slug://common-kb-null-value-parameter-format)
 >
 > Telerik supports the default English strings. The `resx` files for the other languages are provided as-is and you can use them as base for implementing your own.
 
@@ -83,7 +83,7 @@ Make sure the `resx` files are defined as `EmbeddedResource` in the **Build Acti
 
 ### Step 3: Implement ITelerikStringLocalizer Service
 
-Create a service that implements [`Telerik.Blazor.Services.ITelerikStringLocalizer`](/blazor-ui/api/Telerik.Blazor.Services.ITelerikStringLocalizer). The service must implement an indexer that returns the desired string based on the requested localization key. Normally, the returned string also depends on the current culture, unless you are [using the localization mechanism to override specific UI labels only]({%slug common-kb-localize-selected-localization-keys%}).
+Create a service that implements [`Telerik.Blazor.Services.ITelerikStringLocalizer`](/blazor-ui/api/Telerik.Blazor.Services.ITelerikStringLocalizer). The service must implement an indexer that returns the desired string based on the requested localization key. Normally, the returned string also depends on the current culture, unless you are [using the localization mechanism to override specific UI labels only](slug://common-kb-localize-selected-localization-keys).
 
 The example below obtains localized strings from resource `resx` files. You can obtain the required strings from any other source, such as a database, `json` files, hash tables, and so on.
 
@@ -132,7 +132,7 @@ builder.Services.AddSingleton(typeof(ITelerikStringLocalizer), typeof(SampleResx
 
 ### Step 5: Inject Your Localization Service
 
-This step is optional. You need it to manually render localized strings from the Telerik resource files. For example, the Telerik resource files include keys for the [built-in Grid commands]({%slug components/grid/columns/command%}).
+This step is optional. You need it to manually render localized strings from the Telerik resource files. For example, the Telerik resource files include keys for the [built-in Grid commands](slug://components/grid/columns/command).
 
 * Import the `Telerik.Blazor.Services` namespace.
 * Inject your `ITelerikStringLocalizer` service.
@@ -177,17 +177,17 @@ You can find sample runnable projects for both server-side Blazor and for WebAss
 * <a href="https://github.com/telerik/blazor-ui/tree/master/common/localization/ServerLocalizationResx" target="_blank">Localized Telerik Blazor Web App with Server Render Mode</a>
 * <a href="https://github.com/telerik/blazor-ui/tree/master/common/localization/ClientLocalizationResx" target="_blank">Localized Telerik Blazor WebAssembly Standalone App</a>
 
-You can also find a localization implementation in the offline version of the [Telerik UI for Blazor demos](https://demos.telerik.com/blazor-ui). Check your Telerik UI for Blazor installation folder or visit [UI for Blazor automated installer]({%slug installation/msi%}) or [UI for Blazor ZIP archive]({%slug installation/zip%}) for download instructions.
+You can also find a localization implementation in the offline version of the [Telerik UI for Blazor demos](https://demos.telerik.com/blazor-ui). Check your Telerik UI for Blazor installation folder or visit [UI for Blazor automated installer](slug://installation/msi) or [UI for Blazor ZIP archive](slug://installation/zip) for download instructions.
 
 
 ## Troubleshooting
 
-Outdated Telerik resource files may cause [some UI labels to appear in English]({%slug common-kb-partial-localization%}), or the app may trigger a [`Value cannot be null. (Parameter 'format')` exception]({%slug common-kb-value-cannot-be-null-parameter-format%}).
+Outdated Telerik resource files may cause [some UI labels to appear in English](slug://common-kb-partial-localization), or the app may trigger a [`Value cannot be null. (Parameter 'format')` exception](slug://common-kb-value-cannot-be-null-parameter-format).
 
 This is not related to the Telerik components, but setting `ResourcePath` in `services.AddLocalization()` may break the standard `IStringLocalizer` in your app or make it more difficult to use.
 
 
 ## See Also
 
-* [Globalization Overview]({%slug globalization-overview%})
-* [Localize Only Some Component Labels]({%slug common-kb-localize-selected-localization-keys%})
+* [Globalization Overview](slug://globalization-overview)
+* [Localize Only Some Component Labels](slug://common-kb-localize-selected-localization-keys)
diff --git a/globalization/overview.md b/globalization/overview.md
index d241396c13..cd8c5c990e 100644
--- a/globalization/overview.md
+++ b/globalization/overview.md
@@ -12,11 +12,11 @@ position: 0
 
 Internationalization (I18N) is the process of making an app support different languages and regions. In the Telerik UI for Blazor suite, this will consist of the following features:
 
-* [Localization (L10N)]({%slug globalization-localization%})—the ability to show texts and UI elements in the components in different languages (such as button texts and ARIA attributes).
+* [Localization (L10N)](slug://globalization-localization)—the ability to show texts and UI elements in the components in different languages (such as button texts and ARIA attributes).
 
-* [Globalization (G11N)]({%slug globalization-formats%})—the ability to react to the chosen culture where format strings are involved (such as number and date formats).
+* [Globalization (G11N)](slug://globalization-formats)—the ability to react to the chosen culture where format strings are involved (such as number and date formats).
 
-* [Right-to-Left Support]({%slug rtl-support%})—the ability to render the components in a right-to-left direction instead of the default left-to-right direction.
+* [Right-to-Left Support](slug://rtl-support)—the ability to render the components in a right-to-left direction instead of the default left-to-right direction.
 
 ## Internationalization Support
 
@@ -115,7 +115,7 @@ Each Telerik UI for Blazor component supports a different set of internationaliz
 
 ## See Also
 
-  * [Localization]({%slug globalization-localization%})
-  * [Globalization Formats]({%slug globalization-formats%})
-  * [Right-to-Left Support]({%slug rtl-support%})
+  * [Localization](slug://globalization-localization)
+  * [Globalization Formats](slug://globalization-formats)
+  * [Right-to-Left Support](slug://rtl-support)
 
diff --git a/globalization/rtl-support.md b/globalization/rtl-support.md
index 005944f700..493cc693b4 100644
--- a/globalization/rtl-support.md
+++ b/globalization/rtl-support.md
@@ -18,7 +18,7 @@ The default language input for most users on the web is left-to-right. However,
 
 Right-to-left support is configured at the root level so it affects all UI for Blazor components in the application. You cannot mix right-to-left and left-to-right orientation in the same application.
 
-To enable right-to-left direction of the components in your application, set the `EnableRtl` parameter of the [`TelerikRootComponent`]({%slug rootcomponent-overview%})  to `true`.
+To enable right-to-left direction of the components in your application, set the `EnableRtl` parameter of the [`TelerikRootComponent`](slug://rootcomponent-overview)  to `true`.
 
 <div class="skip-repl"></div>
 ````TelerikLayout.razor
@@ -31,7 +31,7 @@ To enable right-to-left direction of the components in your application, set the
 
 ## Supported Components
 
-The majority of the UI for Blazor components incorporate RTL support. Check the [Internationalization Support table]({%slug globalization-overview%}#internationalization-support) for a complete list of the supported components and links to their demo pages.
+The majority of the UI for Blazor components incorporate RTL support. Check the [Internationalization Support table](slug://globalization-overview#internationalization-support) for a complete list of the supported components and links to their demo pages.
 
 ## Limitations
 
@@ -45,10 +45,10 @@ If you need to change the `EnableRtl` parameter of the `TelerikRootComponent` at
 
 ## Keyboard Navigation
 
-When the [right-to-left direction is enabled]({%slug rtl-support%}), the keyboard shortcuts for the components that support keyboard navigation remain unchanged except for the `Left arrow` and `Right arrow` keys—their functionality is reversed to follow the right-to-left direction.
+When the [right-to-left direction is enabled](slug://rtl-support), the keyboard shortcuts for the components that support keyboard navigation remain unchanged except for the `Left arrow` and `Right arrow` keys—their functionality is reversed to follow the right-to-left direction.
 
 
 ## See Also
 
-  * [Localization]({%slug globalization-localization%})
-  * [Globalization Formats]({%slug globalization-formats%})
+  * [Localization](slug://globalization-localization)
+  * [Globalization Formats](slug://globalization-formats)
diff --git a/installation/automated.md b/installation/automated.md
index c855c579fb..97efea0ee0 100644
--- a/installation/automated.md
+++ b/installation/automated.md
@@ -13,7 +13,7 @@ position: 3
 
 This article explains what the automated install wizard does for Telerik UI for Blazor components, and how to get it.
 
-The most common way to install the Telerik UI for Blazor components is to use the [Telerik NuGet feed]({%slug installation/nuget%}). However, you can also use a wizard installer, or a [ZIP archive]({%slug installation/zip%}).
+The most common way to install the Telerik UI for Blazor components is to use the [Telerik NuGet feed](slug://installation/nuget). However, you can also use a wizard installer, or a [ZIP archive](slug://installation/zip).
 
 There is an automated installer for:
 
@@ -23,11 +23,11 @@ There is an automated installer for:
 
 The automated installer provides the following:
 
-* The [necessary `.nupkg` files]({%slug getting-started/what-you-need%}) so you can setup a [local feed in Visual Studio](#set-up-a-local-nuget-feed-in-visual-studio). You can find them in the `packages` folder under the installation folder.
+* The [necessary `.nupkg` files](slug://getting-started/what-you-need) so you can setup a [local feed in Visual Studio](#set-up-a-local-nuget-feed-in-visual-studio). You can find them in the `packages` folder under the installation folder.
 * An offline version of our [demos](https://demos.telerik.com/blazor-ui) that you can run and inspect in your IDE. You can find them in the `demos` folder in the installation. @[template](/_contentTemplates/common/get-started.md#demos-project-net-version)
-* The [document processing]({%slug dpl-in-blazor%}) `.nupkg` files (in the `dpl` folder).
+* The [document processing](slug://dpl-in-blazor) `.nupkg` files (in the `dpl` folder).
 * A shortcut to our [online demos](https://demos.telerik.com/blazor-ui).
-* Our [Visual Studio extension]({%slug getting-started-vs-integration-overview%}). We also have an [extension for VS Code]({%slug getting-started-vs-code-integration-overview%}) and you can <a href="https://marketplace.visualstudio.com/items?itemName=TelerikInc.blazortemplatewizard" target="_blank">install it from the VS Code marketplace</a>.
+* Our [Visual Studio extension](slug://getting-started-vs-integration-overview). We also have an [extension for VS Code](slug://getting-started-vs-code-integration-overview) and you can <a href="https://marketplace.visualstudio.com/items?itemName=TelerikInc.blazortemplatewizard" target="_blank">install it from the VS Code marketplace</a>.
 
 
 ## How to Download the Automated Installer
@@ -71,11 +71,11 @@ There are several approaches you can try:
     
     * Or, get around Apple's security precautions by removing the quarantine Extended Attribute on the `.pkg` file by executing `xattr -d com.apple.quarantine /path/to/file`
 
-* You can, alternatively, obtain all the files you need from the [ZIP archive we provide]({%slug installation/zip%}) which does not require an installation.
+* You can, alternatively, obtain all the files you need from the [ZIP archive we provide](slug://installation/zip) which does not require an installation.
 
 ## See Also
 
-* [What You Need To Install]({%slug getting-started/what-you-need%})
-* [Get Started with Client-side Blazor]({%slug getting-started/client-side%})
-* [Get Started with Server-side Blazor]({%slug getting-started/server-side%})
+* [What You Need To Install](slug://getting-started/what-you-need)
+* [Get Started with Client-side Blazor](slug://getting-started/client-side)
+* [Get Started with Server-side Blazor](slug://getting-started/server-side)
 
diff --git a/installation/nuget.md b/installation/nuget.md
index 7f4884836c..70534461a3 100644
--- a/installation/nuget.md
+++ b/installation/nuget.md
@@ -10,7 +10,7 @@ position: 1
 
 # Telerik Private NuGet Source
 
-This article explains how to add the private Telerik NuGet package feed to your environment. You can use it to obtain the Telerik UI for Blazor components instead of [setting up a local NuGet feed]({%slug installation/zip%}#set-up-a-local-nuget-feed-in-visual-studio).
+This article explains how to add the private Telerik NuGet package feed to your environment. You can use it to obtain the Telerik UI for Blazor components instead of [setting up a local NuGet feed](slug://installation/zip#set-up-a-local-nuget-feed-in-visual-studio).
 
 The benefit of using an online NuGet source is that you will receive notifications for newer component versions.
 
@@ -24,9 +24,9 @@ You can set up the remote Telerik NuGet feed in the following ways:
 
 >warning Never hard-code Telerik account credentials or NuGet API keys in a `NuGet.Config` file in a GitHub repository, Docker image, or any location that may be accessed by unauthorized parties. A NuGet key is valuable and bad actors can use it to access the NuGet packages that are licensed under your account. A credentials abuse can lead to a review of the affected Telerik account.
 
-For NuGet-related issues, see [NuGet Feed Troubleshooting]({%slug troubleshooting-nuget%}).
+For NuGet-related issues, see [NuGet Feed Troubleshooting](slug://troubleshooting-nuget).
 
-For information on automated builds, CI and CD, see [CI, CD, Build Server]({%slug deployment-ci-cd-build-pc%}).
+For information on automated builds, CI and CD, see [CI, CD, Build Server](slug://deployment-ci-cd-build-pc).
 
 
 ## Use Visual Studio
@@ -43,7 +43,7 @@ Refer to the [Microsoft documentation about using packages in Visual Studio](htt
 
 1. Click OK.
 
-1. Open a project that references a Telerik NuGet package. For example, generate one through our [New Project Wizard]({%slug getting-started-vs-integration-new-project%}).
+1. Open a project that references a Telerik NuGet package. For example, generate one through our [New Project Wizard](slug://getting-started-vs-integration-new-project).
     * Make sure to remove local `NuGet.Config` files from the solution that contain information about Telerik packages. 
     
 1. Rebuild the solution.
@@ -52,7 +52,7 @@ Refer to the [Microsoft documentation about using packages in Visual Studio](htt
     * Check the Remember My Password checkbox.
     
 1. Your project should now build and restore all packages - including those from nuget.org and from Telerik.
-    * If you experience issues, see the [NuGet Feed Troubleshooting]({%slug troubleshooting-nuget%}) article.
+    * If you experience issues, see the [NuGet Feed Troubleshooting](slug://troubleshooting-nuget) article.
 
 
 ## Use the .NET CLI
@@ -131,16 +131,16 @@ To edit a `NuGet.Config` file and add the Telerik feed, you need to:
 There are two ways to authenticate with the Telerik NuGet server when you add the Telerik NuGet source [with the .NET CLI](#use-the-net-cli) or [edit the `NuGet.Config` file manually](#edit-the-nuget-config-file):
 
 * Use your Telerik account email as the username, and your Telerik password.
-* Use `api-key` as the username and your personal [NuGet API Key]({%slug deployment-nuget%}) as the password.
+* Use `api-key` as the username and your personal [NuGet API Key](slug://deployment-nuget) as the password.
 
-You can [generate your Telerik NuGet API Key on telerik.com](https://www.telerik.com/account/downloads/nuget-keys). Read more about [using NuGet API Keys in different environments]({%slug deployment-nuget%}).
+You can [generate your Telerik NuGet API Key on telerik.com](https://www.telerik.com/account/downloads/nuget-keys). Read more about [using NuGet API Keys in different environments](slug://deployment-nuget).
 
 > Always use the NuGet API Key in plain text.
 
 
 ## Package Source Mapping
 
-The `Telerik.UI.for.Blazor` NuGet package and most of its dependencies reside on `nuget.telerik.com`. On the other hand, the [Telerik icon packages]({%slug common-features-icons%}) reside on `nuget.org`. The correct [package source mapping](https://learn.microsoft.com/en-us/nuget/consume-packages/package-source-mapping) configuration should be similar to:
+The `Telerik.UI.for.Blazor` NuGet package and most of its dependencies reside on `nuget.telerik.com`. On the other hand, the [Telerik icon packages](slug://common-features-icons) reside on `nuget.org`. The correct [package source mapping](https://learn.microsoft.com/en-us/nuget/consume-packages/package-source-mapping) configuration should be similar to:
 
 > Make sure that the `key` values in the `packageSourceMapping` section match the `key` values in the `packageSources` section, otherwise you will get a "Package not found" error.
 
@@ -196,7 +196,7 @@ In addition to feed URL `https://nuget.telerik.com/v3/index.json`, there is also
 
 ## Troubleshooting
 
-See the [NuGet Troubleshooting]({%slug troubleshooting-nuget%}) article for tips about common pitfalls when working with the Telerik NuGet feed.
+See the [NuGet Troubleshooting](slug://troubleshooting-nuget) article for tips about common pitfalls when working with the Telerik NuGet feed.
 
 
 ## Next Steps
@@ -211,5 +211,5 @@ See the [NuGet Troubleshooting]({%slug troubleshooting-nuget%}) article for tips
 
 ## See Also
 
-* [NuGet Feed Troubleshooting]({%slug troubleshooting-nuget%})
-* [CI, CD, Build Server]({%slug deployment-ci-cd-build-pc%})
+* [NuGet Feed Troubleshooting](slug://troubleshooting-nuget)
+* [CI, CD, Build Server](slug://deployment-ci-cd-build-pc)
diff --git a/installation/zip.md b/installation/zip.md
index c017af22d4..5c06768719 100644
--- a/installation/zip.md
+++ b/installation/zip.md
@@ -12,14 +12,14 @@ position: 4
 
 This article explains what the `zip` archive for Telerik UI for Blazor components includes, and how to get it.
 
-The most common way to install the Telerik UI for Blazor components is to use the [Telerik NuGet feed]({%slug installation/nuget%}). However, you can also use a [wizard installer]({%slug installation/msi%}), or a ZIP archive.
+The most common way to install the Telerik UI for Blazor components is to use the [Telerik NuGet feed](slug://installation/nuget). However, you can also use a [wizard installer](slug://installation/msi), or a ZIP archive.
 
 The `ZIP` archive provides the following:
 
-* The [necessary `.nupkg` files]({%slug getting-started/what-you-need%}) so you can setup a [local feed in Visual Studio](#set-up-a-local-nuget-feed-in-visual-studio). You can find them in the `packages` folder in the archive.
+* The [necessary `.nupkg` files](slug://getting-started/what-you-need) so you can setup a [local feed in Visual Studio](#set-up-a-local-nuget-feed-in-visual-studio). You can find them in the `packages` folder in the archive.
 * An offline version of our [demos](https://demos.telerik.com/blazor-ui) that you can run and inspect in your IDE. You can find them in the `demos` folder in the archive.
-* The [document processing]({%slug dpl-in-blazor%}) `.nupkg` files (in the `dpl` folder).
-* The [built-in themes]({%slug themes-overview%}) and some of their most commonly used [swatches]({%slug themes-overview%}#basics). You can find them in the `styles` folder in the archive.
+* The [document processing](slug://dpl-in-blazor) `.nupkg` files (in the `dpl` folder).
+* The [built-in themes](slug://themes-overview) and some of their most commonly used [swatches](slug://themes-overview#basics). You can find them in the `styles` folder in the archive.
 
 ## How to Download the ZIP Archive
 
@@ -40,7 +40,7 @@ Once the download completes, open the archive and extract the files to a locatio
 
 ## See Also
 
-* [What You Need To Install]({%slug getting-started/what-you-need%})
-* [Get Started with Client-side Blazor]({%slug getting-started/client-side%})
-* [Get Started with Server-side Blazor]({%slug getting-started/server-side%})
+* [What You Need To Install](slug://getting-started/what-you-need)
+* [Get Started with Client-side Blazor](slug://getting-started/client-side)
+* [Get Started with Server-side Blazor](slug://getting-started/server-side)
 
diff --git a/integrations/document-processing-libraries.md b/integrations/document-processing-libraries.md
index 93158409e9..01119510b7 100644
--- a/integrations/document-processing-libraries.md
+++ b/integrations/document-processing-libraries.md
@@ -36,4 +36,4 @@ Telerik Document Processing Libraries' [Configuration Wizard](https://docs.teler
 * [Installing on Your Computer](https://docs.telerik.com/devtools/document-processing/getting-started/installation/installing-on-your-computer)
 * [Trial Version and Commercial License](https://docs.telerik.com/devtools/document-processing/introduction#trial-version-and-commercial-license)
 * [System Requirements](https://docs.telerik.com/devtools/document-processing/getting-started/installation/system-requirements)
-* [Version Conflict Detected Error for Telerik.Zip]({%slug dpl-kb-version-conflict-detected-telerik-zip%})
+* [Version Conflict Detected Error for Telerik.Zip](slug://dpl-kb-version-conflict-detected-telerik-zip)
diff --git a/introduction.md b/introduction.md
index 5449ab82c4..bd8eec326d 100644
--- a/introduction.md
+++ b/introduction.md
@@ -25,14 +25,14 @@ Visit the <a href="https://www.telerik.com/blazor-ui" target="_blank">Telerik UI
 
 If you are new to Telerik UI for Blazor, visit the Getting Started tutorials that demonstrate how to add the Telerik components to your application:
 
-* [Get Started with a .NET 8 or 9 Blazor Web App]({%slug getting-started/web-app%})
-* [Get Started with a Blazor WebAssembly Standalone App]({%slug getting-started/client-side%})
-* [Get Started with a .NET 6 or 7 Blazor Server app]({%slug getting-started/server-side%})
-* [Get Started with Blazor Hybrid]({%slug getting-started/hybrid-blazor%})
+* [Get Started with a .NET 8 or 9 Blazor Web App](slug://getting-started/web-app)
+* [Get Started with a Blazor WebAssembly Standalone App](slug://getting-started/client-side)
+* [Get Started with a .NET 6 or 7 Blazor Server app](slug://getting-started/server-side)
+* [Get Started with Blazor Hybrid](slug://getting-started/hybrid-blazor)
 
 >tip This online Blazor documentation covers the latest version of Telerik UI for Blazor, which is `{{site.uiForBlazorLatestVersion}}`. If needed, [download the offline PDF Blazor documentation](#learning-resources) for the required older product version.
 
-Developers who are familiar with the IDE and Blazor could prefer the [Workflow Details]({%slug getting-started/what-you-need%}) article. This is a shorter, more advanced version of the getting started tutorials above and explains the basics about the Telerik UI packages and how to set up a project.
+Developers who are familiar with the IDE and Blazor could prefer the [Workflow Details](slug://getting-started/what-you-need) article. This is a shorter, more advanced version of the getting started tutorials above and explains the basics about the Telerik UI packages and how to set up a project.
 
 <!--
 If you are not familiar with Blazor yet, you may find our Blazor Quick Start Guide video series useful:
@@ -234,7 +234,7 @@ For any issues you might encounter while working with Telerik UI for Blazor, use
 
 ## Learning Resources
 
-* <a href="https://demos.telerik.com/blazor-ui" target="_blank">Online Demos</a> - also available as a project that you can inspect and run locally. You can find them in the `demos` folder of your [installation]({%slug installation/msi%}).
+* <a href="https://demos.telerik.com/blazor-ui" target="_blank">Online Demos</a> - also available as a project that you can inspect and run locally. You can find them in the `demos` folder of your [installation](slug://installation/msi).
 
 * <a href="https://docs.telerik.com/blazor-ui/knowledge-base" target="_blank">Knowledge Base</a> - contains answers to some common questions, problems and errors. Free-text search is also available.
 
@@ -242,17 +242,17 @@ For any issues you might encounter while working with Telerik UI for Blazor, use
 
 * <a href="https://www.telerik.com/support/blazor-ui" target="_blank">Blazor UI Support and Learning Resources</a> - a hub with links to all resources such as blogs, videos, repos, docs and so on.
 
-* [Video Onboarding Course]({%slug getting-started/video-onboarding%}) - through the Telerik Virtual Classroom, you can watch videos and learn how to build a Blazor app at your leisure.
+* [Video Onboarding Course](slug://getting-started/video-onboarding) - through the Telerik Virtual Classroom, you can watch videos and learn how to build a Blazor app at your leisure.
 
 * [Offline PDF documentation](https://www.telerik.com/account/downloads) for all product versions - select *Telerik UI for Blazor*, then choose a *version* from the dropdown and look for the ZIP files in the *Documentation* section.
 
 
 ## Next Steps
 
-* [First Steps with Blazor Server]({%slug getting-started/server-side%})
-* [First Steps with Blazor WebAssembly]({%slug getting-started/client-side%})
-* [First Steps with Blazor Hybrid]({%slug getting-started/hybrid-blazor%})
-* [Workflow Details for using the Telerik UI for Blazor components]({%slug getting-started/what-you-need%}) (a concise version of the tutorials above)
-* Use guided wizards to generate new Telerik Projects in [Visual Studio]({%slug getting-started-vs-integration-new-project%}) and [Visual Studio Code]({%slug getting-started-vs-code-integration-overview%}).
-* [Convert an existing project to a Telerik-enabled project]({%slug getting-started-vs-integration-convert-project%})
-* [Style the Telerik Blazor Components]({%slug themes-overview%})
+* [First Steps with Blazor Server](slug://getting-started/server-side)
+* [First Steps with Blazor WebAssembly](slug://getting-started/client-side)
+* [First Steps with Blazor Hybrid](slug://getting-started/hybrid-blazor)
+* [Workflow Details for using the Telerik UI for Blazor components](slug://getting-started/what-you-need) (a concise version of the tutorials above)
+* Use guided wizards to generate new Telerik Projects in [Visual Studio](slug://getting-started-vs-integration-new-project) and [Visual Studio Code](slug://getting-started-vs-code-integration-overview).
+* [Convert an existing project to a Telerik-enabled project](slug://getting-started-vs-integration-convert-project)
+* [Style the Telerik Blazor Components](slug://themes-overview)
diff --git a/knowledge-base/animationcontainer-close-on-outside-click.md b/knowledge-base/animationcontainer-close-on-outside-click.md
index e6f5d3cb73..8f1650d832 100644
--- a/knowledge-base/animationcontainer-close-on-outside-click.md
+++ b/knowledge-base/animationcontainer-close-on-outside-click.md
@@ -110,12 +110,12 @@ To achieve the desired scenario:
 ## Notes
 
 * If the AnimationContainer is opened as a result of a button click, consider this in the opening and closing logic. The above example uses a `bool` flag for the AnimatioContainer state.
-* All Telerik Blazor popup and drop-down components are rendered at the root of the app, and not at the place of declaration. For example, if the AnimationContainer contains a ComboBox, its drop-down will render outside the AnimationContainer. This behavior affects the check in [step 3](#solution) above. To distinguish it, use [another Class for the nested popup]({%slug components/combobox/overview%}#popup-settings).
-* The AnimationContainer must reside outside elements with an `overflow` style. Otherwise, it may be clipped or overlapped by other scrollable containers. This limitation does not exist in the [Popup component]({%slug popup-overview%}).
+* All Telerik Blazor popup and drop-down components are rendered at the root of the app, and not at the place of declaration. For example, if the AnimationContainer contains a ComboBox, its drop-down will render outside the AnimationContainer. This behavior affects the check in [step 3](#solution) above. To distinguish it, use [another Class for the nested popup](slug://components/combobox/overview#popup-settings).
+* The AnimationContainer must reside outside elements with an `overflow` style. Otherwise, it may be clipped or overlapped by other scrollable containers. This limitation does not exist in the [Popup component](slug://popup-overview).
 
 
 ## See Also
 
-* [AnimationContainer Documentation]({%slug components/animationcontainer/overview%})
-* [Popup Documentation]({%slug popup-overview%})
-* [Comparison between All Popup Components]({%slug common-kb-popup-component-comparison%})
+* [AnimationContainer Documentation](slug://components/animationcontainer/overview)
+* [Popup Documentation](slug://popup-overview)
+* [Comparison between All Popup Components](slug://common-kb-popup-component-comparison)
diff --git a/knowledge-base/badge-container-no-children.md b/knowledge-base/badge-container-no-children.md
index fe6ae46e4c..21629da35e 100644
--- a/knowledge-base/badge-container-no-children.md
+++ b/knowledge-base/badge-container-no-children.md
@@ -24,7 +24,7 @@ res_type: kb
 
 ## Description
 
-How to add the Telerik Badge to the [Telerik Avatar component]({%slug avatar-overview%}) or another container that cannot have child elements.
+How to add the Telerik Badge to the [Telerik Avatar component](slug://avatar-overview) or another container that cannot have child elements.
 
 ## Solution
 
diff --git a/knowledge-base/blazor-in-asp-net.md b/knowledge-base/blazor-in-asp-net.md
index 1b6cdf435a..781dc52c5e 100644
--- a/knowledge-base/blazor-in-asp-net.md
+++ b/knowledge-base/blazor-in-asp-net.md
@@ -28,10 +28,10 @@ How can I modernize my ASP.NET Core web application by adding Blazor components
 You can use an ASP.NET Core web application to render Blazor components by following the requirements, considerations, and steps below:
 
 1. Add Blazor to the project. This includes the client-side assets, the service, and the SignalR hub. In the sample project linked below, these are added to the layout so that all pages can use them. Make sure you don't add them twice on a certain page.
-1. [Add the Telerik components as usual]({%slug getting-started/what-you-need%}). Add the [`TelerikRootComponent`]({%slug rootcomponent-overview%}) around the contents of every Blazor component. Otherwise, it is not possible to render it in a shared location like in an actual Blazor app.
+1. [Add the Telerik components as usual](slug://getting-started/what-you-need). Add the [`TelerikRootComponent`](slug://rootcomponent-overview) around the contents of every Blazor component. Otherwise, it is not possible to render it in a shared location like in an actual Blazor app.
 1. Use the Blazor components according to the current framework approach by using the `<component type="typeof(MyComponent)" render-mode="ServerPrerendered" param-SomeParameter="@ObjectToPass" />` approach. In previous versions, the recommended approach was by using Razor components like partial views through the `Html.RenderComponentAsync()` helper, where you has to pass their parameters as fields in an anonymous model object.
-1. If you wish to use [Alert, Confirm, or Prompt Dialogs]({%slug dialog-predefined %}), you need to do this in a nested Razor component of the `TelerikRootComponent`. Otherwise, if you try to define the `DialogFactory` `CascadingParameter` in the same Razor component that includes the `TelerikRootComponent`, then the cascading parameter will be `null`.
-1. If you are already using Kendo UI components in such a project, make sure to only use the [Telerik UI for Blazor Themes]({%slug themes-overview%}). They match the [SASS-based themes from Kendo UI](https://docs.telerik.com/kendo-ui/styles-and-layout/sass-themes) and you must only have one theme referenced.
+1. If you wish to use [Alert, Confirm, or Prompt Dialogs](slug://dialog-predefined ), you need to do this in a nested Razor component of the `TelerikRootComponent`. Otherwise, if you try to define the `DialogFactory` `CascadingParameter` in the same Razor component that includes the `TelerikRootComponent`, then the cascading parameter will be `null`.
+1. If you are already using Kendo UI components in such a project, make sure to only use the [Telerik UI for Blazor Themes](slug://themes-overview). They match the [SASS-based themes from Kendo UI](https://docs.telerik.com/kendo-ui/styles-and-layout/sass-themes) and you must only have one theme referenced.
 
     It is recommended that you use the latest Kendo UI and Telerik UI for Blazor versions. If not possible, try using Kendo UI and Telerik UI for Blazor versions that are close together, so that there are as little differences in their theming as possible.
 
diff --git a/knowledge-base/button-change-icons-position.md b/knowledge-base/button-change-icons-position.md
index d7219596ce..baabc0ca67 100644
--- a/knowledge-base/button-change-icons-position.md
+++ b/knowledge-base/button-change-icons-position.md
@@ -31,7 +31,7 @@ This KB article answers the following questions:
 
 ## Solution
 
-You can change the [icon]({%slug common-features-icons%}) position and add more icons in the Button by using the following approaches:
+You can change the [icon](slug://common-features-icons) position and add more icons in the Button by using the following approaches:
 
 * To display multiple icons in one Button, nest the `TelerikIcon` in the `TelerikButton` content.
 * To control the position of the icon in relation to the text content of the Button, use CSS.
diff --git a/knowledge-base/buttongroup-mixed-selection-mode.md b/knowledge-base/buttongroup-mixed-selection-mode.md
index 7b91227aa0..182266e33b 100644
--- a/knowledge-base/buttongroup-mixed-selection-mode.md
+++ b/knowledge-base/buttongroup-mixed-selection-mode.md
@@ -26,9 +26,9 @@ How can I create a third selection mode that is a mix between the `Single` and `
 
 ## Solution
 
-Currently, the ButtonGroup [`SelectionMode`]({%slug buttongroup-selection%}) supports the two `Single` and `Multiple` options.
+Currently, the ButtonGroup [`SelectionMode`](slug://buttongroup-selection) supports the two `Single` and `Multiple` options.
 
-To create a third, multiple selection mode, prevent the deselection of the last selected item, and enable at least one button to always stay selected, handle the [`SelectedChanged`]({%slug buttongroup-events%}#selectedchanged) event of each [`ButtonGroupToggleButton`](/blazor-ui/api/Telerik.Blazor.Components.ButtonGroupToggleButton). When you deselect a button, check if it was the last selected.
+To create a third, multiple selection mode, prevent the deselection of the last selected item, and enable at least one button to always stay selected, handle the [`SelectedChanged`](slug://buttongroup-events#selectedchanged) event of each [`ButtonGroupToggleButton`](/blazor-ui/api/Telerik.Blazor.Components.ButtonGroupToggleButton). When you deselect a button, check if it was the last selected.
 
 ````RAZOR
 <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Multiple">
@@ -64,5 +64,5 @@ To create a third, multiple selection mode, prevent the deselection of the last
 
 ## See Also
 
-* [Exploring the Built-In Selection Modes of the ButtonGroup]({%slug buttongroup-selection%})
-* [Rendering Vertical Telerik UI for Blazor ButtonGroups]({%slug buttongroup-kb-vertical%})
+* [Exploring the Built-In Selection Modes of the ButtonGroup](slug://buttongroup-selection)
+* [Rendering Vertical Telerik UI for Blazor ButtonGroups](slug://buttongroup-kb-vertical)
diff --git a/knowledge-base/buttongroup-vertical.md b/knowledge-base/buttongroup-vertical.md
index c6f7e87ea0..6ca65359d0 100644
--- a/knowledge-base/buttongroup-vertical.md
+++ b/knowledge-base/buttongroup-vertical.md
@@ -27,7 +27,7 @@ How to create a vertical button group? What is the best way to make the buttons
 
 ## Solution
 
-[Override the ButtonGroup styles]({%slug themes-override%}) and change the default horizontal [flexbox layout](https://css-tricks.com/snippets/css/a-guide-to-flexbox/). Make the following changes:
+[Override the ButtonGroup styles](slug://themes-override) and change the default horizontal [flexbox layout](https://css-tricks.com/snippets/css/a-guide-to-flexbox/). Make the following changes:
 
 * Change the `flexbox-flow` style to `column`.
 * Set a `Width` to the button group or leave it expand to 100%.
diff --git a/knowledge-base/calendar-disable-weekends.md b/knowledge-base/calendar-disable-weekends.md
index 1bfb1ae911..5bdd3a588c 100644
--- a/knowledge-base/calendar-disable-weekends.md
+++ b/knowledge-base/calendar-disable-weekends.md
@@ -27,14 +27,14 @@ I want to disable the weekends in the Calendar Month view, so the user is not ab
 
 ## Solution
 
-You can create a collection of weekend days and pass it to the [Disabled Dates]({%slug components/calendar/selection%}#disabled-dates) parameter of the Calendar. This will prevent the user from selecting them.
+You can create a collection of weekend days and pass it to the [Disabled Dates](slug://components/calendar/selection#disabled-dates) parameter of the Calendar. This will prevent the user from selecting them.
 
 To achieve that:
 
 * Set Min and Max parameters of the Calendar.
 * Loop through all the dates between Min and Max.
 * Get only the dates that are Saturday or Sunday.
-* Save them in a collection and pass it to the [Disabled Dates]({%slug components/calendar/selection%}#disabled-dates) parameter of the Calendar.
+* Save them in a collection and pass it to the [Disabled Dates](slug://components/calendar/selection#disabled-dates) parameter of the Calendar.
 
 The example below demonstrates this approach.
  
diff --git a/knowledge-base/calendar-kb-customize-multiview-header.md b/knowledge-base/calendar-kb-customize-multiview-header.md
index f62b2cd270..22c7ae46c0 100644
--- a/knowledge-base/calendar-kb-customize-multiview-header.md
+++ b/knowledge-base/calendar-kb-customize-multiview-header.md
@@ -26,7 +26,7 @@ How to customize the header of a MultiView Calendar to display the month name ab
 
 ## Solution
 
-To display the month name above each view in a MultiView Calendar, use the [`HeaderTemplate`]({%slug calendar-templates-header%}) of the TelerikCalendar and apply custom CSS for styling for label positioning. The following example demonstrates how to achieve this customization. Note that the suggested approach is applicable only for `Horizontal` Calendar `Orientation`.
+To display the month name above each view in a MultiView Calendar, use the [`HeaderTemplate`](slug://calendar-templates-header) of the TelerikCalendar and apply custom CSS for styling for label positioning. The following example demonstrates how to achieve this customization. Note that the suggested approach is applicable only for `Horizontal` Calendar `Orientation`.
 
 >caption MultiView Calendar with Header Template.
 
@@ -74,5 +74,5 @@ To display the month name above each view in a MultiView Calendar, use the [`Hea
 
 ## See Also
 
-* [Calendar Header Template]({%slug calendar-templates-header%})
-* [Calendar Views]({%slug components/calendar/multiview%})
+* [Calendar Header Template](slug://calendar-templates-header)
+* [Calendar Views](slug://components/calendar/multiview)
diff --git a/knowledge-base/calendar-show-days-from-current-month.md b/knowledge-base/calendar-show-days-from-current-month.md
index 4b622bfc05..fd9b4f8ebf 100644
--- a/knowledge-base/calendar-show-days-from-current-month.md
+++ b/knowledge-base/calendar-show-days-from-current-month.md
@@ -43,7 +43,7 @@ This knowledge base article answers the following questions:
 
 ## Solution
 
-Use [custom CSS to override the component theme]({%slug themes-override%}) and hide the days from next and previous months in the Calendar month view. There are two options:
+Use [custom CSS to override the component theme](slug://themes-override) and hide the days from next and previous months in the Calendar month view. There are two options:
 
 * Apply a custom CSS class and target specific Calendar components.
 * Use Telerik CSS classes and target all Calendar components.
diff --git a/knowledge-base/calendar-views-wrap.md b/knowledge-base/calendar-views-wrap.md
index c42e5f6898..0e264f9463 100644
--- a/knowledge-base/calendar-views-wrap.md
+++ b/knowledge-base/calendar-views-wrap.md
@@ -31,7 +31,7 @@ How to use columns and rows for the Blazor Calendar multi-month feature?
 
 ## Solution
 
-1. Set a [`Class`]({%slug components/calendar/overview%}#styling-and-appearance) to the `<TelerikCalendar>` component.
+1. Set a [`Class`](slug://components/calendar/overview#styling-and-appearance) to the `<TelerikCalendar>` component.
 1. Use the custom CSS class to set a `flex-flow: row wrap;` CSS style to `.k-hstack` as a descendant selector.
 1. (optional) Use the custom CSS class to apply a fixed width.
 
@@ -67,6 +67,6 @@ How to use columns and rows for the Blazor Calendar multi-month feature?
 
 ## See Also
 
-* [Calendar MultiView]({%slug components/calendar/multiview%})
-* [Disable Calendar Weekends]({%slug calendar-kb-disable-weekends%})
-* [Hide Calendar Weekends]({%slug calendar-kb-hide-weekends%})
+* [Calendar MultiView](slug://components/calendar/multiview)
+* [Disable Calendar Weekends](slug://calendar-kb-disable-weekends)
+* [Hide Calendar Weekends](slug://calendar-kb-hide-weekends)
diff --git a/knowledge-base/card-icon-buttons-too-large.md b/knowledge-base/card-icon-buttons-too-large.md
index 72437ae194..a790a09a32 100644
--- a/knowledge-base/card-icon-buttons-too-large.md
+++ b/knowledge-base/card-icon-buttons-too-large.md
@@ -57,8 +57,8 @@ There are two CSS styles in the Telerik Blazor theme, which cause the action ico
 
 There are two ways to prevent icon button expansion:
 
-* [Use **Horizontal** `CardOrientation` together with **Center** `CardActionsLayout`]({%slug card-actions%}).
-* Use a custom CSS class to [override the theme styles]({%slug themes-override%}) and remove the square aspect ratio.
+* [Use **Horizontal** `CardOrientation` together with **Center** `CardActionsLayout`](slug://card-actions).
+* Use a custom CSS class to [override the theme styles](slug://themes-override) and remove the square aspect ratio.
 
 >caption Prevent CardAction icon buttons becoming too large
 
diff --git a/knowledge-base/carousel-more-than-one-item-in-viewport.md b/knowledge-base/carousel-more-than-one-item-in-viewport.md
index 6ea468d52c..909fc83fec 100644
--- a/knowledge-base/carousel-more-than-one-item-in-viewport.md
+++ b/knowledge-base/carousel-more-than-one-item-in-viewport.md
@@ -27,7 +27,7 @@ The Carousel component displays one item at a time and scrolls that and then sho
 I wants to display multiple items at a time (e.g., 2, 3, 5) together and then scroll the same number of items and display the next set of multiple items after the scroll.
 
 ## Solution
-The [Template you define in the carousel]({%slug carousel-template%}) will define how many items are shown at any given time. The carousel creates a "page" for every top-level item in its data source. This allows you full control over the presentation by controlling the carousel size and the styles of the nested items.
+The [Template you define in the carousel](slug://carousel-template) will define how many items are shown at any given time. The carousel creates a "page" for every top-level item in its data source. This allows you full control over the presentation by controlling the carousel size and the styles of the nested items.
 
 To have more than one item display at any given time, group the data source in the carousel so the top-level items define the number of "pages" the carousel will scroll through, and use a loop in the template of the carousel to render the desired information for every actual item in the data source.
 
diff --git a/knowledge-base/cdn-fallback.md b/knowledge-base/cdn-fallback.md
index b624b72007..ec61d4b2e6 100644
--- a/knowledge-base/cdn-fallback.md
+++ b/knowledge-base/cdn-fallback.md
@@ -23,7 +23,7 @@ res_type: kb
 
 ## Description
 
-The [CDN]({%slug common-features-cdn%}) is down, or my users have it filtered by a firewall, proxy, admin policy or other problem. This can cause errors or bad looking sites. How do I ensure the necessary resources will be fetched?
+The [CDN](slug://common-features-cdn) is down, or my users have it filtered by a firewall, proxy, admin policy or other problem. This can cause errors or bad looking sites. How do I ensure the necessary resources will be fetched?
 
 
 ## Solution
@@ -100,7 +100,7 @@ A server-side Blazor app is bootstrapped in a Razor page (`_Host.cshtml`) and so
 ````
 
 ## Notes
-You may want to consider using [static assets]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files) as the primary way to obtain the necessary resources. They provide the following benefits in a Blazor app:
+You may want to consider using [static assets](slug://getting-started/what-you-need#css-theme-and-javascript-files) as the primary way to obtain the necessary resources. They provide the following benefits in a Blazor app:
 
 * For server-side Blazor - the necessity for a low-latency connection makes this flavor suitable for Intranet apps, and in such cases the user is likely to be closer to the server than to the cloud. Thus, downloading the files from the app server is likely to be faster than downloading from the CDN.
 
diff --git a/knowledge-base/change-theme-runtime.md b/knowledge-base/change-theme-runtime.md
index 22b24325ac..f91a5b0e16 100644
--- a/knowledge-base/change-theme-runtime.md
+++ b/knowledge-base/change-theme-runtime.md
@@ -32,11 +32,11 @@ This KB article answers the following questions:
 
 ## Solution
 
-The app stylesheets reside outside the Razor component hierarchy, so the Blazor code cannot access them. You can change the current Telerik [theme or swatch]({%slug themes-overview%}) at runtime with [JSInterop](https://learn.microsoft.com/en-us/aspnet/core/blazor/javascript-interoperability/call-javascript-from-dotnet).
+The app stylesheets reside outside the Razor component hierarchy, so the Blazor code cannot access them. You can change the current Telerik [theme or swatch](slug://themes-overview) at runtime with [JSInterop](https://learn.microsoft.com/en-us/aspnet/core/blazor/javascript-interoperability/call-javascript-from-dotnet).
 
-The following algorithm follows the commonly used approach to replace a CSS file in any web app. You can use it for built-in themes and custom themes, regardless of the [CSS theme's physical location]({%slug themes-overview%}#using-a-theme).
+The following algorithm follows the commonly used approach to replace a CSS file in any web app. You can use it for built-in themes and custom themes, regardless of the [CSS theme's physical location](slug://themes-overview#using-a-theme).
 
-1. [Register the initial Telerik theme]({%slug themes-overview%}#using-a-theme) in a way that allows you to get reference to the `<link>` tag. For example, use an `id` attribute.
+1. [Register the initial Telerik theme](slug://themes-overview#using-a-theme) in a way that allows you to get reference to the `<link>` tag. For example, use an `id` attribute.
     
     >caption HTML
     ````HTML
@@ -79,7 +79,7 @@ The following algorithm follows the commonly used approach to replace a CSS file
     ````
 1. Implement UI that triggers the JavaScript theme change. After the new CSS theme is loaded, refresh all Telerik components that use SVG or Canvas rendering, such as Barcodes, Charts, Gauges, and QR Codes.
 
-    > Make sure [the version number in the theme URL is compatible with the version of Telerik UI for Blazor]({%slug themes-overview%}#compatibility-and-maintenance).
+    > Make sure [the version number in the theme URL is compatible with the version of Telerik UI for Blazor](slug://themes-overview#compatibility-and-maintenance).
     >
     > Replace `Index` in the code below with the correct Razor component name.
 
@@ -333,10 +333,10 @@ The following algorithm follows the commonly used approach to replace a CSS file
 
 ## Next Steps
 
-* [Implement CDN Fallback]({%slug common-kb-cdn-fallback%})
+* [Implement CDN Fallback](slug://common-kb-cdn-fallback)
 
 
 ## See Also
 
-* [Themes Overview]({%slug themes-overview%})
-* [Implement CDN Fallback]({%slug common-kb-cdn-fallback%})
+* [Themes Overview](slug://themes-overview)
+* [Implement CDN Fallback](slug://common-kb-cdn-fallback)
diff --git a/knowledge-base/chart-crowded-grid-lines.md b/knowledge-base/chart-crowded-grid-lines.md
index 66ae2a1361..b41da78e02 100644
--- a/knowledge-base/chart-crowded-grid-lines.md
+++ b/knowledge-base/chart-crowded-grid-lines.md
@@ -30,8 +30,8 @@ You can choose which grid lines to show (every `n`-th `Step`) and to `Skip` the
 
 The general approach to customize a Chart is to apply settings using nested tags. In the case of the grid lines the parent tag is
 
-* for [categorical charts]({%slug components/chart/databind%}#series-types): x-axis `<ChartCategoryAxis>` and y-axis `<ChartValueAxis>`.
-* for [numerical charts]({%slug components/chart/databind%}#series-types): x-axis `<ChartXAxis>` and y-axis `<ChartYAxis>`.
+* for [categorical charts](slug://components/chart/databind#series-types): x-axis `<ChartCategoryAxis>` and y-axis `<ChartValueAxis>`.
+* for [numerical charts](slug://components/chart/databind#series-types): x-axis `<ChartXAxis>` and y-axis `<ChartYAxis>`.
 
 You can control the `MajorGridLines` for both axes from their respective nested tags - `<ChartCategoryAxisMajorGridLines />` (the vertical grid lines) and `<ChartValueAxisMajorGridLines />` (the horizontal grid lines).
 
@@ -43,7 +43,7 @@ You can apply the following settings:
 
 You can do the same for the `MinorGridLines` too.
 
-For a [`Date Axis` Chart]({%slug components/chart/date-axis%}), you can set the `BaseUnit` parameter of the `<ChartCategoryAxis>` tag according to the data of your application to further control the granularity of the grid lines - this is what the number of categories and, thus, grid lines, depends on.
+For a [`Date Axis` Chart](slug://components/chart/date-axis), you can set the `BaseUnit` parameter of the `<ChartCategoryAxis>` tag according to the data of your application to further control the granularity of the grid lines - this is what the number of categories and, thus, grid lines, depends on.
 
 >caption Declutter the grid lines of a Categorical Chart
 
@@ -99,4 +99,4 @@ For a [`Date Axis` Chart]({%slug components/chart/date-axis%}), you can set the
 
 ## Notes
 
-You can also see the Knowledge base article regarding [overlapping labels]({%slug chart-kb-crowded-labels%}) to further improve the layout of the Chart.
+You can also see the Knowledge base article regarding [overlapping labels](slug://chart-kb-crowded-labels) to further improve the layout of the Chart.
diff --git a/knowledge-base/chart-crowded-labels.md b/knowledge-base/chart-crowded-labels.md
index 2afd284d30..71583c3f41 100644
--- a/knowledge-base/chart-crowded-labels.md
+++ b/knowledge-base/chart-crowded-labels.md
@@ -36,8 +36,8 @@ You can also skip directly to the examples:
 
 
 The general approach to customize the Chart is to apply settings using nested tags. In the case of the `Labels` the tag is 
-* for [categorical charts]({%slug components/chart/databind%}#series-types) -  `<ChartCategoryAxisLabels>` under the `<ChartCategoryAxis>`.
-* for [numerical charts]({%slug components/chart/databind%}#series-types) - `<ChartXAxisLabels>` and `<ChartYAxisLabels>` under the `<ChartXAxis>` and `<ChartYAxis>`.
+* for [categorical charts](slug://components/chart/databind#series-types) -  `<ChartCategoryAxisLabels>` under the `<ChartCategoryAxis>`.
+* for [numerical charts](slug://components/chart/databind#series-types) - `<ChartXAxisLabels>` and `<ChartYAxisLabels>` under the `<ChartXAxis>` and `<ChartYAxis>`.
 
 
 You can control the `Labels` by applying the following settings to the `<ChartCategoryAxisLabels>` or `<ChartXAxisLabels>` tags depending on the Chart type:
@@ -198,4 +198,4 @@ This example shows how to enable automatic label rotation - try running the page
 
 ## Notes
 
-You can also see the Knowledge base article regarding [clustered grid lines]({%slug chart-kb-crowded-grid-lines%}) to further improve the layout of the Chart.
+You can also see the Knowledge base article regarding [clustered grid lines](slug://chart-kb-crowded-grid-lines) to further improve the layout of the Chart.
diff --git a/knowledge-base/chart-custom-legend.md b/knowledge-base/chart-custom-legend.md
index 467250fc5f..44aebc941d 100644
--- a/knowledge-base/chart-custom-legend.md
+++ b/knowledge-base/chart-custom-legend.md
@@ -33,7 +33,7 @@ This knowledge base article answers the following questions:
 To use a custom Chart legend, you need to:
 
 1. Disable the built-in legend with `<ChartLegend Visible="false" />`
-1. Define specific colors for the Chart series or data points [through `Color` or `ColorField`]({%slug components/chart/types/column%}).
+1. Define specific colors for the Chart series or data points [through `Color` or `ColorField`](slug://components/chart/types/column).
 1. Implement the custom legend UI outside the Chart.
 1. Use the same Chart series or data point colors in custom Chart legend.
 
@@ -229,5 +229,5 @@ To use a custom Chart legend, you need to:
 
 ## See Also
 
-* [Chart Legend Documentation]({%slug chart-legend%})
+* [Chart Legend Documentation](slug://chart-legend)
 * [Chart Legend Customization Demo](https://demos.telerik.com/blazor-ui/chart/legend-customization)
diff --git a/knowledge-base/chart-customize-separate-markers.md b/knowledge-base/chart-customize-separate-markers.md
index 32fa3b4a09..4745a41e44 100644
--- a/knowledge-base/chart-customize-separate-markers.md
+++ b/knowledge-base/chart-customize-separate-markers.md
@@ -35,9 +35,9 @@ The marker type is defined per series level, so it is not possible to set differ
 
 To mark specific data points as "special", follow these steps:
 
-1. Use a Chart type with lines for the first series and provide it with all available data points (for example, [ScatterLine]({%slug components/chart/types/scatterline%})).
+1. Use a Chart type with lines for the first series and provide it with all available data points (for example, [ScatterLine](slug://components/chart/types/scatterline)).
 
-2. Use a Chart type without lines for the second series, so the lines do not mix (for example, [Scatter]({%slug components/chart/types/scatter%})).
+2. Use a Chart type without lines for the second series, so the lines do not mix (for example, [Scatter](slug://components/chart/types/scatter)).
 
 3. In the second series data include only the points that you want to mark as special.
 
@@ -118,5 +118,5 @@ To mark specific data points as "special", follow these steps:
 
 ## See Also
 
-* [ScatterLine Chart Overview]({%slug components/chart/types/scatterline%})
-* [Scatter Chart Overview]({%slug components/chart/types/scatter%})
\ No newline at end of file
+* [ScatterLine Chart Overview](slug://components/chart/types/scatterline)
+* [Scatter Chart Overview](slug://components/chart/types/scatter)
\ No newline at end of file
diff --git a/knowledge-base/chart-datatable-bind.md b/knowledge-base/chart-datatable-bind.md
index 5c31ec8fd7..3889229c15 100644
--- a/knowledge-base/chart-datatable-bind.md
+++ b/knowledge-base/chart-datatable-bind.md
@@ -84,4 +84,4 @@ The Telerik UI for Blazor Chart does not support DataTable binding out of the bo
 
 ## See Also
 
-  * [Chart Data Binding]({%slug components/chart/databind%})
+  * [Chart Data Binding](slug://components/chart/databind)
diff --git a/knowledge-base/chart-draw-horizontal-vertical-lines.md b/knowledge-base/chart-draw-horizontal-vertical-lines.md
index 69c3b903bb..99bcef216e 100644
--- a/knowledge-base/chart-draw-horizontal-vertical-lines.md
+++ b/knowledge-base/chart-draw-horizontal-vertical-lines.md
@@ -32,15 +32,15 @@ This KB article answers the following questions:
 
 ## Solution
 
-To configure the Chart for drawing horizontal and vertical lines, you can use [plot bands]({%slug chart-plot-bands%}) or additional [line series]({%slug components/chart/types/line%}).
+To configure the Chart for drawing horizontal and vertical lines, you can use [plot bands](slug://chart-plot-bands) or additional [line series](slug://components/chart/types/line).
 
 ### Using Plot Bands
 
-Steps for drawing vertical and horizontal lines with [plot bands]({%slug chart-plot-bands%}):
+Steps for drawing vertical and horizontal lines with [plot bands](slug://chart-plot-bands):
 
 1. Add `PlotBand` instances inside the `PlotBands` collection of a Chart axis.
 2. Provide a valid CSS color to the `Color` parameter.
-3. [Set the `From` and `To`]({%slug chart-plot-bands%}#setting-from-and-to) plot band parameters.
+3. [Set the `From` and `To`](slug://chart-plot-bands#setting-from-and-to) plot band parameters.
 
 >caption Drawing Horizontal and Vertical lines with Plot Bands
 
@@ -111,7 +111,7 @@ Steps for drawing vertical and horizontal lines with [plot bands]({%slug chart-p
 
 ### Using Additional ScatterLine Series
 
-Steps for drawing horizontal and vertical lines with additional [ScatterLine Series]({%slug components/chart/types/scatterline%}):
+Steps for drawing horizontal and vertical lines with additional [ScatterLine Series](slug://components/chart/types/scatterline):
 
 1. Add `ChartSeries` instances of type `ChartSeriesType.ScatterLine` based on the needed number of lines.
 2. Set data for the lines based on the information shown from the main Chart.
@@ -220,5 +220,5 @@ Steps for drawing horizontal and vertical lines with additional [ScatterLine Ser
 
 ## See Also
 
-* [Charts Plot Bands]({%slug chart-plot-bands%})
+* [Charts Plot Bands](slug://chart-plot-bands)
 * [ScatterLine Chart](https://demos.telerik.com/blazor-ui/chart/scatter-line-chart)
diff --git a/knowledge-base/chart-dynamic-series.md b/knowledge-base/chart-dynamic-series.md
index deb1470f24..c3588498d7 100644
--- a/knowledge-base/chart-dynamic-series.md
+++ b/knowledge-base/chart-dynamic-series.md
@@ -33,7 +33,7 @@ The standard approach in Blazor is to loop over a view model with the needed dat
 
 This also applies to other collections in other components, or for generating a given number of component instances.
 
-You may also find useful the [Data Binding article]({%slug components/chart/databind%}) on different ways to provide the data to the series and the chart.
+You may also find useful the [Data Binding article](slug://components/chart/databind) on different ways to provide the data to the series and the chart.
 
 
 Here is a simple example:
diff --git a/knowledge-base/chart-format-percent.md b/knowledge-base/chart-format-percent.md
index 194dc0b6eb..6f54f7c684 100644
--- a/knowledge-base/chart-format-percent.md
+++ b/knowledge-base/chart-format-percent.md
@@ -37,9 +37,9 @@ This article shows how to format the percent in a label for a pie or donut chart
 
 To customize the percentage display, you need to:
 
-1. Use a [Chart label template]({%slug components/chart/label-template-format%}#templates). Set the label template function name to the `Template` parameter of `ChartSeriesLabels`.
+1. Use a [Chart label template](slug://components/chart/label-template-format#templates). Set the label template function name to the `Template` parameter of `ChartSeriesLabels`.
 
-1. Use the [`percentage` field]({%slug components/chart/label-template-format%}#series-label-template) of the JavaScript label template function's argument.
+1. Use the [`percentage` field](slug://components/chart/label-template-format#series-label-template) of the JavaScript label template function's argument.
 
 1. Implement the desired additional rounding/formatting in the JavaScript code.
 
@@ -103,5 +103,5 @@ To customize the percentage display, you need to:
 
 ## See Also
 
-* [Knowledge Base article: How to localize numeric labels in the Chart]({%slug chart-kb-localized-numeric-labels%})
+* [Knowledge Base article: How to localize numeric labels in the Chart](slug://chart-kb-localized-numeric-labels)
 * [Sample project: Chart Label Template](https://github.com/telerik/blazor-ui/tree/master/chart/label-template)
diff --git a/knowledge-base/chart-localized-labels.md b/knowledge-base/chart-localized-labels.md
index a9c45a185a..7f165413c2 100644
--- a/knowledge-base/chart-localized-labels.md
+++ b/knowledge-base/chart-localized-labels.md
@@ -39,14 +39,14 @@ There are two different approaches:
 
 ### Using the Format Parameter
 
-If you need to use only the value of the series item, and a single line of text, you can use the [`Format`]({%slug components/chart/label-template-format%}#format-strings) parameter of the `<ChartSeriesLabels>` tag. It takes a [standard numeric format strings](https://docs.microsoft.com/en-us/dotnet/standard/base-types/standard-numeric-format-strings) and is localization aware.
+If you need to use only the value of the series item, and a single line of text, you can use the [`Format`](slug://components/chart/label-template-format#format-strings) parameter of the `<ChartSeriesLabels>` tag. It takes a [standard numeric format strings](https://docs.microsoft.com/en-us/dotnet/standard/base-types/standard-numeric-format-strings) and is localization aware.
 
 ### Using the Template Parameter
 
-If you want to render more information in the label, you can utilize the [`Template`]({%slug components/chart/label-template-format%}#templates) parameter of the `<ChartSeriesLabels>` tag. In a JavaScript file, implement the desired number formatting by using the `toLocaleString` JavaScript method. Below is a sample implementation.
+If you want to render more information in the label, you can utilize the [`Template`](slug://components/chart/label-template-format#templates) parameter of the `<ChartSeriesLabels>` tag. In a JavaScript file, implement the desired number formatting by using the `toLocaleString` JavaScript method. Below is a sample implementation.
 
 
-1. Use a [Chart label template]({%slug components/chart/label-template-format%}#templates).
+1. Use a [Chart label template](slug://components/chart/label-template-format#templates).
 
 1. Implement the desired number formatting in a JavaScript function. For example, use the [`toLocaleString`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString) method.
 
@@ -108,4 +108,4 @@ If you want to render more information in the label, you can utilize the [`Templ
 
 ## See Also
 
-* [Knowledge Base article: How to format the percent in a label for a Pie or Donut Chart]({%slug chart-format-percent%})
+* [Knowledge Base article: How to format the percent in a label for a Pie or Donut Chart](slug://chart-format-percent)
diff --git a/knowledge-base/chart-mark-series-on-click.md b/knowledge-base/chart-mark-series-on-click.md
index 1de8b87142..e66af700fe 100644
--- a/knowledge-base/chart-mark-series-on-click.md
+++ b/knowledge-base/chart-mark-series-on-click.md
@@ -23,7 +23,7 @@ res_type: kb
 
 ## Description
 
-I would like to mark a Chart Series [on click]({%slug chart-events%}#onseriesclick) by changing the color and opacity or to separate the clicked item from the rest.
+I would like to mark a Chart Series [on click](slug://chart-events#onseriesclick) by changing the color and opacity or to separate the clicked item from the rest.
 
 
 ## Solution
diff --git a/knowledge-base/chart-performance-optimization.md b/knowledge-base/chart-performance-optimization.md
index 1fd535b9e7..a06cc5a3c9 100644
--- a/knowledge-base/chart-performance-optimization.md
+++ b/knowledge-base/chart-performance-optimization.md
@@ -41,7 +41,7 @@ There are several things you can do to improve the performance, and you can do a
 
 * Set the `Transitions` property of the chart to `false` to disable the animations.
 
-* Set the `RenderAs` property to `Telerik.Blazor.RenderingMode.Canvas` (it defaults to SVG) - read more in the [Rendering Modes article]({%slug chart-rendering-modes%})
+* Set the `RenderAs` property to `Telerik.Blazor.RenderingMode.Canvas` (it defaults to SVG) - read more in the [Rendering Modes article](slug://chart-rendering-modes)
 
 * Increase the interval over which data updates are made. Very short intervals also make it difficult for human eyes to review the information anyway.
 
diff --git a/knowledge-base/chart-remove-excess-whitespace.md b/knowledge-base/chart-remove-excess-whitespace.md
index a6a4a74c21..3586f90107 100644
--- a/knowledge-base/chart-remove-excess-whitespace.md
+++ b/knowledge-base/chart-remove-excess-whitespace.md
@@ -84,4 +84,4 @@ To reduce the whitespace around a Chart, use the `Padding` parameter of the Char
 ## See Also
 
 - [ChartSeries API Documentation](https://docs.telerik.com/blazor-ui/api/telerik.blazor.components.chartseries)
-- [Chart for Blazor Overview]({%slug components/chart/overview%})
+- [Chart for Blazor Overview](slug://components/chart/overview)
diff --git a/knowledge-base/chart-responsive.md b/knowledge-base/chart-responsive.md
index 8a46916b63..6c0fec8441 100644
--- a/knowledge-base/chart-responsive.md
+++ b/knowledge-base/chart-responsive.md
@@ -33,7 +33,7 @@ This works well for the initial rendering and the Chart will be "responsive" imm
 When the window resizes, you have to resize the Chart dynamically at runtime:
 
 1. Add a JS function that listens for the [window resize event](https://developer.mozilla.org/en-US/docs/Web/API/Window/resize_event) and invokes a C# method. Ensure that the method name in the JS function matches the one in your C# code.
-1. In the C# method call the [Chart `.Refresh()` method]({%slug components/chart/overview%}#chart-reference-and-methods) to re-render the Chart so it matches the new window size.
+1. In the C# method call the [Chart `.Refresh()` method](slug://components/chart/overview#chart-reference-and-methods) to re-render the Chart so it matches the new window size.
 
 
 ````RAZOR
diff --git a/knowledge-base/chart-series-gradient-color.md b/knowledge-base/chart-series-gradient-color.md
index 60fd5259c5..2693678adb 100644
--- a/knowledge-base/chart-series-gradient-color.md
+++ b/knowledge-base/chart-series-gradient-color.md
@@ -27,7 +27,7 @@ How can I apply a gradient color effect on the Telerik UI for Blazor Chart serie
 ## Solution
 
 1. Declare an external [linear gradient with an `svg` tag](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/linearGradient).
-1. Set the [Color]({%slug components/chart/types/area%}#color) parameter of the `ChartSeries` and refer the external gradient via its `id`.
+1. Set the [Color](slug://components/chart/types/area#color) parameter of the `ChartSeries` and refer the external gradient via its `id`.
 
 >caption How to apply gradient effect on Area Chart.
 
@@ -58,4 +58,4 @@ How can I apply a gradient color effect on the Telerik UI for Blazor Chart serie
 
 ## See Also
 
-* [Chart - Overview]({%slug components/chart/overview%})
+* [Chart - Overview](slug://components/chart/overview)
diff --git a/knowledge-base/chart-stacked-series-sum-label.md b/knowledge-base/chart-stacked-series-sum-label.md
index 0fd9cd8221..e22d61dd46 100644
--- a/knowledge-base/chart-stacked-series-sum-label.md
+++ b/knowledge-base/chart-stacked-series-sum-label.md
@@ -43,7 +43,7 @@ This knowledge base article answers the following questions:
 
 ## Solution
 
-The article suggests two scenarios with examples. Both of them use series labels for a different purpose. If users need to see the separate non-stacked series values, consider [Chart tooltips]({%slug chart-tooltip-overview%}).
+The article suggests two scenarios with examples. Both of them use series labels for a different purpose. If users need to see the separate non-stacked series values, consider [Chart tooltips](slug://chart-tooltip-overview).
 
 * [Display a sum of stacked Chart series above each stacked column](#aggregated-stack-column-label)
 * [Display a label on the horizontal Chart axis below each column](#stack-group-or-column-name-as-custom-axis-label)
@@ -52,9 +52,9 @@ The article suggests two scenarios with examples. Both of them use series labels
 
 Here is how to display the total sum of stacked Chart series above each stacked column:
 
-1. Configure [Chart series stacking]({%slug components/chart/stack%}).
-1. Add a `<ChartSeriesLabels>` tag and define a [label template]({%slug components/chart/label-template-format%}#templates) for the series that will display at the top of each stacked column. This is the last `<ChartSeries>` in the Chart declaration from a given stack `Group`.
-1. In the series label template, render the [`stackValue` property]({%slug components/chart/label-template-format%}#series-label-template) of the template argument object (`context`).
+1. Configure [Chart series stacking](slug://components/chart/stack).
+1. Add a `<ChartSeriesLabels>` tag and define a [label template](slug://components/chart/label-template-format#templates) for the series that will display at the top of each stacked column. This is the last `<ChartSeries>` in the Chart declaration from a given stack `Group`.
+1. In the series label template, render the [`stackValue` property](slug://components/chart/label-template-format#series-label-template) of the template argument object (`context`).
 
 >caption Display stack aggregate and group name as axis label with Chart column series
 
@@ -202,7 +202,7 @@ Here is how to display the total sum of stacked Chart series above each stacked
 
 Here is how to display an additional custom label on the horizontal Chart axis below each column. This approach doesn't require stacking and can be used with standalone column series too.
 
-1. Add a `<ChartSeriesLabels>` tag and define a [label template]({%slug components/chart/label-template-format%}#templates) for the series that will display at the bottom of each stacked column. This is the first `<ChartSeries>` in the Chart declaration from a given stack `Group`. If you are not using stacking, then implement this step for all column series.
+1. Add a `<ChartSeriesLabels>` tag and define a [label template](slug://components/chart/label-template-format#templates) for the series that will display at the bottom of each stacked column. This is the first `<ChartSeries>` in the Chart declaration from a given stack `Group`. If you are not using stacking, then implement this step for all column series.
 1. Set `Position="@ChartSeriesLabelsPosition.InsideBase"` to each `<ChartSeriesLabels>` tag.
 1. (optional) Set `Rotation` to each `<ChartSeriesLabels>` tag.
 1. (optional) Set `Background="transparent"` to each `<ChartSeriesLabels>` tag. This will prevent label overlapping and fading if the columns are too close to one another.
@@ -304,6 +304,6 @@ Chart label templates require a different configuration for [Telerik UI for Blaz
 
 ## See Also
 
-* [Chart Series Stacking]({%slug components/chart/stack%})
-* [Chart Label Templates]({%slug components/chart/label-template-format%})
-* [Chart Tooltips]({%slug chart-tooltip-overview%})
+* [Chart Series Stacking](slug://components/chart/stack)
+* [Chart Label Templates](slug://components/chart/label-template-format)
+* [Chart Tooltips](slug://chart-tooltip-overview)
diff --git a/knowledge-base/chart-style-the-series-labels.md b/knowledge-base/chart-style-the-series-labels.md
index beaf3381b3..b46611b12c 100644
--- a/knowledge-base/chart-style-the-series-labels.md
+++ b/knowledge-base/chart-style-the-series-labels.md
@@ -23,7 +23,7 @@ res_type: kb
 
 ## Description
 
-The [UI for Blazor Chart]({%slug components/chart/overview%}) is rendered using the [HTML Canvas API](https://developer.mozilla.org/en-US/docs/web/html/element/canvas) or [Scalable Vector Graphic](https://developer.mozilla.org/en-US/docs/Web/SVG) and that means manipulating the styling and appearance is not possible without an existing API from the chart component.
+The [UI for Blazor Chart](slug://components/chart/overview) is rendered using the [HTML Canvas API](https://developer.mozilla.org/en-US/docs/web/html/element/canvas) or [Scalable Vector Graphic](https://developer.mozilla.org/en-US/docs/Web/SVG) and that means manipulating the styling and appearance is not possible without an existing API from the chart component.
  
 ## Solution
 
@@ -31,7 +31,7 @@ In this case, use the [ChartSeriesLabelsBase API](/blazor-ui/api/Telerik.Blazor.
 
 You can also explore the child tags of the labels for more options on controlling borders, margins and paddings. The third series showcases that.
 
-For more detailed control over the text shown in the labels, see the [Label Template and Format]({%slug components/chart/label-template-format%}) article.
+For more detailed control over the text shown in the labels, see the [Label Template and Format](slug://components/chart/label-template-format) article.
 
 ````RAZOR
 <TelerikChart>
@@ -83,8 +83,8 @@ For more detailed control over the text shown in the labels, see the [Label Temp
 
 ## See Also
 
-*   [UI for Blazor Chart]({%slug components/chart/overview%})
+*   [UI for Blazor Chart](slug://components/chart/overview)
 *   [ChartSeriesLabelsBase API Reference](/blazor-ui/api/Telerik.Blazor.Components.ChartSeriesLabels)
-*   [Label Template and Format]({%slug components/chart/label-template-format%})
+*   [Label Template and Format](slug://components/chart/label-template-format)
 *   [HTML Canvas API](https://developer.mozilla.org/en-US/docs/web/html/element/canvas)
 *   [Scalable Vector Graphic](https://developer.mozilla.org/en-US/docs/Web/SVG)
diff --git a/knowledge-base/checkbox-custom-icon.md b/knowledge-base/checkbox-custom-icon.md
index 64178d3e87..e26507878a 100644
--- a/knowledge-base/checkbox-custom-icon.md
+++ b/knowledge-base/checkbox-custom-icon.md
@@ -31,7 +31,7 @@ This knowledge base article answers the following questions:
 
 ## Solution
 1. Set a custom CSS class to the Tooltip through the `Class` parameter. This configuration will allow you to target specific Checkbox instances.
-2. Use the defiend class to [override the theme styles]({%slug themes-override%}) with the following CSS approach.
+2. Use the defiend class to [override the theme styles](slug://themes-override) with the following CSS approach.
 
 >caption How to change the Checkbox icons
 
@@ -85,6 +85,6 @@ This knowledge base article answers the following questions:
 ````
 
 ## See Also
-* [Built-in Font and SVG Icons]({%slug common-features-icons%})
-* [Checkbox Indeterminate State]({%slug checkbox-indeterminate-state%})
+* [Built-in Font and SVG Icons](slug://common-features-icons)
+* [Checkbox Indeterminate State](slug://checkbox-indeterminate-state)
 
diff --git a/knowledge-base/combo-debounce-onread.md b/knowledge-base/combo-debounce-onread.md
index aebd7bd5a5..ac65198501 100644
--- a/knowledge-base/combo-debounce-onread.md
+++ b/knowledge-base/combo-debounce-onread.md
@@ -33,8 +33,8 @@ I also want to implement a minimum filter length, if the input is below that len
 
 There are two ways to implement debouncing:
 
-* Use the built-in [ComboBox `DebounceDelay` parameter]({%slug components/combobox/overview%}#parameters).
-* Implement logic in the [ComboBox `OnRead` event]({%slug components/combobox/events%}#onread) to debounce the calls to the data service with the desired timeout. For example, use a `CancellationTokenSource`.
+* Use the built-in [ComboBox `DebounceDelay` parameter](slug://components/combobox/overview#parameters).
+* Implement logic in the [ComboBox `OnRead` event](slug://components/combobox/events#onread) to debounce the calls to the data service with the desired timeout. For example, use a `CancellationTokenSource`.
 
 For minimum filter length, add a check in the `OnRead` event handler for the desired string length.
 
diff --git a/knowledge-base/combobox-case-insensitive-matching.md b/knowledge-base/combobox-case-insensitive-matching.md
index 0a59cb1f21..954132f3db 100644
--- a/knowledge-base/combobox-case-insensitive-matching.md
+++ b/knowledge-base/combobox-case-insensitive-matching.md
@@ -26,7 +26,7 @@ This article showcases how to match case insensitive user input with the `AllowC
 
 ## Solution
 
-Depending on your business logic and application workflow you need to use either [OnChange]({%slug components/combobox/events%}#onchange) or [ValueChanged]({%slug components/combobox/events%}#valuechanged) events of the ComboBox.
+Depending on your business logic and application workflow you need to use either [OnChange](slug://components/combobox/events#onchange) or [ValueChanged](slug://components/combobox/events#valuechanged) events of the ComboBox.
 
 In the event handler you can use a `Where()` statement to filter out the result. In case you want the filter to be applied on every keystroke of the user input - use `ValueChanged`, otherwise use `OnChange` event. There are examples of both below.
 
diff --git a/knowledge-base/combobox-clear-button-click.md b/knowledge-base/combobox-clear-button-click.md
index cf40308138..0412106d35 100644
--- a/knowledge-base/combobox-clear-button-click.md
+++ b/knowledge-base/combobox-clear-button-click.md
@@ -96,4 +96,4 @@ Monitor the console to see when the events fire in these examples. You can use o
 ````
 
 ## See Also
-[ComboBox Events]({%slug components/combobox/events%})
+[ComboBox Events](slug://components/combobox/events)
diff --git a/knowledge-base/combobox-not-closing.md b/knowledge-base/combobox-not-closing.md
index 1791014f5d..672c75b5e7 100644
--- a/knowledge-base/combobox-not-closing.md
+++ b/knowledge-base/combobox-not-closing.md
@@ -60,7 +60,7 @@ Selected value: @selectedValue
 
 To avoid the above described behavior you need to bind the `Value` parameter to a field of the same type as the `ValueField` is bound to.
 
->tip If you are looking for more fields from the view-model that describes the dropdown items, not just the `Value`, see the [Get model from dropdown]({%slug dropdowns-get-model%}) KB article and the [OnChange]({%slug components/combobox/events%}#onchange) event.
+>tip If you are looking for more fields from the view-model that describes the dropdown items, not just the `Value`, see the [Get model from dropdown](slug://dropdowns-get-model) KB article and the [OnChange](slug://components/combobox/events#onchange) event.
 >
 > You may also want to review/join the discussion and Vote for this request: <a href="https://www.telerik.com/forums/binding-dropdownlist-value-to-complex-model" target="_blank">Binding DropDownList Value to complex model</a>
 
diff --git a/knowledge-base/common-animations-decrease.md b/knowledge-base/common-animations-decrease.md
index 8a78f7a5b8..3154a3f841 100644
--- a/knowledge-base/common-animations-decrease.md
+++ b/knowledge-base/common-animations-decrease.md
@@ -33,7 +33,7 @@ This knowledge base article discusses the following scenarios:
 
 ## Solution
 
-You can use a [CSS rule override]({%slug themes-override%}) to change or disable the animation of the Telerik dropdowns.
+You can use a [CSS rule override](slug://themes-override) to change or disable the animation of the Telerik dropdowns.
 
 >caption Disable Telerik Blazor dropdown animations
 
diff --git a/knowledge-base/common-browser-cache-buster.md b/knowledge-base/common-browser-cache-buster.md
index eb152ec461..2ef2103cd2 100644
--- a/knowledge-base/common-browser-cache-buster.md
+++ b/knowledge-base/common-browser-cache-buster.md
@@ -33,22 +33,22 @@ This KB article answers the following questions:
 
 To avoid browser caching issues when upgrading the Telerik UI for Blazor version, use the so-called cache busting. Add the components' version number to the Telerik client asset URLs as a query string. In this way, the browser will always load the correct version of the CSS stylesheet and the JSInterop file. Browsers will still use cached Telerik client assets as long as the components version stays the same.
 
-Using the correct client assets [avoids Telerik-related JavaScript errors]({%slug troubleshooting-js-errors%}).
+Using the correct client assets [avoids Telerik-related JavaScript errors](slug://troubleshooting-js-errors).
 
 The required approach varies, depending on the Blazor application:
 
 * [Blazor Web Apps and legacy Blazor Server apps](#blazor-web-apps-and-legacy-blazor-server-apps)
 * [Standalone Blazor WebAssembly apps and Hybrid apps](#standalone-blazor-webassembly-apps-and-hybrid-apps)
 
-Normally, there is no need for cache busting when [using the Telerik CDN]({%slug common-features-cdn%}), because the client asset URLs are unique for every Telerik UI for Blazor version.
+Normally, there is no need for cache busting when [using the Telerik CDN](slug://common-features-cdn), because the client asset URLs are unique for every Telerik UI for Blazor version.
 
 ### Blazor Web Apps and Legacy Blazor Server Apps
 
 You can use reflection to get the Telerik UI for Blazor version at runtime.
 
-1. Pick a type (class) from the Telerik UI for Blazor product. A good candidate is a component that exists in both old and new product versions, such as the [`TelerikRootComponent`]({%slug rootcomponent-overview%}).
+1. Pick a type (class) from the Telerik UI for Blazor product. A good candidate is a component that exists in both old and new product versions, such as the [`TelerikRootComponent`](slug://rootcomponent-overview).
 1. Get the component type with `typeof(TelerikRootComponent)`. You may need to use `typeof(Telerik.Blazor.Components.TelerikRootComponent)` if:
-    * The [`Telerik.Blazor.Components` namespace is not registered in `_Imports.razor` as it should]({%slug getting-started/what-you-need%}#namespaces).
+    * The [`Telerik.Blazor.Components` namespace is not registered in `_Imports.razor` as it should](slug://getting-started/what-you-need#namespaces).
     * The Telerik CSS and JS assets are placed in a `.cshtml` file instead of `App.razor`, for example, in legacy Blazor apps.
 1. Use the [`Assembly.GetName()` method](https://learn.microsoft.com/en-us/dotnet/api/system.reflection.assembly.getname?view=net-8.0) and the [`AssemblyName.Version` property](https://learn.microsoft.com/en-us/dotnet/api/system.reflection.assemblyname?view=net-8.0#properties) to extract the Telerik UI for Blazor version.
 
@@ -80,8 +80,8 @@ If the Telerik CSS theme and JavaScript file reside in the `index.html` file, yo
 
 ## Notes
 
-In addition to cache busting, you can [use a `defer` attribute to load the `telerik-blazor.js` file asynchronously]({%slug getting-started/what-you-need%}#javascript-file) and improve the client-side app performance.
+In addition to cache busting, you can [use a `defer` attribute to load the `telerik-blazor.js` file asynchronously](slug://getting-started/what-you-need#javascript-file) and improve the client-side app performance.
 
 ## See Also
 
-* [Adding the Telerik CSS and JavaScript files to a Blazor app]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files)
+* [Adding the Telerik CSS and JavaScript files to a Blazor app](slug://getting-started/what-you-need#css-theme-and-javascript-files)
diff --git a/knowledge-base/common-cannot-read-properties-of-null-reading-addeventlistener.md b/knowledge-base/common-cannot-read-properties-of-null-reading-addeventlistener.md
index 50c6d215e6..55349342fe 100644
--- a/knowledge-base/common-cannot-read-properties-of-null-reading-addeventlistener.md
+++ b/knowledge-base/common-cannot-read-properties-of-null-reading-addeventlistener.md
@@ -58,8 +58,8 @@ The error indicates that the app is still using the old version of our `telerik-
 
 To resolve the error:
 
-* (if using [CDN]({%slug common-features-cdn%})) Update the `telerik-blazor.js` file URL to the correct version.
-* (if using static assets) Clear the browser cache and [add a cache buster for the Telerik assets]({%slug common-kb-browser-cache-buster%}).
+* (if using [CDN](slug://common-features-cdn)) Update the `telerik-blazor.js` file URL to the correct version.
+* (if using static assets) Clear the browser cache and [add a cache buster for the Telerik assets](slug://common-kb-browser-cache-buster).
 * (if using a local JS file) Replace the `telerik-blazor.js` file with the new version.
 
 ## Notes
@@ -68,6 +68,6 @@ The Blazor framework should normally take care of caching issues with static ass
 
 ## See Also
 
-* [Telerik UI for Blazor version upgrade steps]({%slug upgrade-tutorial%})
-* [Troubleshooting JavaScript Errors]({%slug troubleshooting-js-errors%})
-* [Fix styling issues after component version update]({%slug common-kb-upgrade-breaks-css-theme-styles%})
+* [Telerik UI for Blazor version upgrade steps](slug://upgrade-tutorial)
+* [Troubleshooting JavaScript Errors](slug://troubleshooting-js-errors)
+* [Fix styling issues after component version update](slug://common-kb-upgrade-breaks-css-theme-styles)
diff --git a/knowledge-base/common-change-selected-localization-keys.md b/knowledge-base/common-change-selected-localization-keys.md
index bd875e05a0..73894f422e 100644
--- a/knowledge-base/common-change-selected-localization-keys.md
+++ b/knowledge-base/common-change-selected-localization-keys.md
@@ -38,8 +38,8 @@ This knowledge base article addresses the following scenarios.
 To localize selected keys with custom strings:
 
 1. Create a project with Telerik UI for Blazor. For detailed instructions, see:
-    * [Getting Started with client-side Blazor]({%slug getting-started/client-side%})
-    * [Getting Started with server-side Blazor]({%slug getting-started/server-side%})
+    * [Getting Started with client-side Blazor](slug://getting-started/client-side)
+    * [Getting Started with server-side Blazor](slug://getting-started/server-side)
 2. Create a `Services` folder and implement the Telerik localization service with a list of all needed localization keys and their corresponding custom strings. The service also relies on a `~/Resources` folder with the necessary `.resx` files. You can find an up-to-date list of the used strings in the [Blazor API documentation](/blazor-ui/api/Telerik.Blazor.Resources.Messages) and the [offline version](https://www.telerik.com/account/my-downloads) of the [Blazor Demo solution](https://demos.telerik.com/blazor-ui). Telerik updates the main `TelerikMessages.resx` file (in English) with each new release.
     >caption ResxLocalizer.cs
     
@@ -153,4 +153,4 @@ To localize selected keys with custom strings:
 
 ## See Also
 
-* [Localization]({%slug globalization-localization%})
+* [Localization](slug://globalization-localization)
diff --git a/knowledge-base/common-component-requires-telerikrootcomponent.md b/knowledge-base/common-component-requires-telerikrootcomponent.md
index 2a13f80b59..91973f0b80 100644
--- a/knowledge-base/common-component-requires-telerikrootcomponent.md
+++ b/knowledge-base/common-component-requires-telerikrootcomponent.md
@@ -45,17 +45,17 @@ More specifically, the exception implies the following issues with the applicati
 
 To fix and avoid the `TelerikRootComponent` exception:
 
-* [Add a `TelerikRootComponent` to one or more layout files]({%slug getting-started/what-you-need%}#telerikrootcomponent), depending on the application's layout structure.
+* [Add a `TelerikRootComponent` to one or more layout files](slug://getting-started/what-you-need#telerikrootcomponent), depending on the application's layout structure.
 * When using the Blazor Web App project template, [create the app with a **Global** interactivity location](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-9.0#apply-a-render-mode-to-the-entire-app).
-* If your scenario requires a **Per page/component** interactivity location, place the `TelerikRootComponent` in an interactive Razor component. Refer to [Using `TelerikRootComponent` with Per Component Interactivity]({%slug rootcomponent-percomponent%}).
+* If your scenario requires a **Per page/component** interactivity location, place the `TelerikRootComponent` in an interactive Razor component. Refer to [Using `TelerikRootComponent` with Per Component Interactivity](slug://rootcomponent-percomponent).
 
-> To avoid [problems with popup positioning]({%slug troubleshooting-general-issues%}#wrong-popup-position), wrap all the web page content in a `TelerikRootComponent`.
+> To avoid [problems with popup positioning](slug://troubleshooting-general-issues#wrong-popup-position), wrap all the web page content in a `TelerikRootComponent`.
 >
 > Do not nest multiple `TelerikRootComponent` instances.
 
 
 ## See Also
 
-* [`TelerikRootComponent` Purpose and Overview]({%slug rootcomponent-overview%})
-* [Typical Usage of the `TelerikRootComponent`]({%slug getting-started/what-you-need%}#telerikrootcomponent)
-* [Using `TelerikRootComponent` with Per Component Interactivity]({%slug rootcomponent-percomponent%})
+* [`TelerikRootComponent` Purpose and Overview](slug://rootcomponent-overview)
+* [Typical Usage of the `TelerikRootComponent`](slug://getting-started/what-you-need#telerikrootcomponent)
+* [Using `TelerikRootComponent` with Per Component Interactivity](slug://rootcomponent-percomponent)
diff --git a/knowledge-base/common-connection-closed.md b/knowledge-base/common-connection-closed.md
index 1f3dff1e9e..6a9ed33f99 100644
--- a/knowledge-base/common-connection-closed.md
+++ b/knowledge-base/common-connection-closed.md
@@ -75,7 +75,7 @@ Blazor Server apps use a **SignalR WebSocket** to communicate between the client
 
 ## Solution
 
-[Increase the maximum SignalR WebSocket message size (`MaximumReceiveMessageSize`) for the Blazor application in `HubOptions`]({%slug common-kb-increase-signalr-max-message-size%}).
+[Increase the maximum SignalR WebSocket message size (`MaximumReceiveMessageSize`) for the Blazor application in `HubOptions`](slug://common-kb-increase-signalr-max-message-size).
 
 ## Notes
 
diff --git a/knowledge-base/common-custom-font-icons-fail.md b/knowledge-base/common-custom-font-icons-fail.md
index 52bee2df88..b7ebf36afb 100644
--- a/knowledge-base/common-custom-font-icons-fail.md
+++ b/knowledge-base/common-custom-font-icons-fail.md
@@ -36,7 +36,7 @@ If I use similar code with the `IconClass` of a plain component like a `TelerikB
 
 ## Possible Cause
 
-The most common reason for such a problem is that the model field that carries the classes for the custom font matches the default name that the Telerik component uses for the built-in [Telerik icons]({%slug common-features-icons%}) - `Icon`.
+The most common reason for such a problem is that the model field that carries the classes for the custom font matches the default name that the Telerik component uses for the built-in [Telerik icons](slug://common-features-icons) - `Icon`.
 
 The databinding settings of the databound components have default field names and they look for Telerik icons in the `Icon` field of the model, unless you specify otherwise.
 
diff --git a/knowledge-base/common-dynamic-refs.md b/knowledge-base/common-dynamic-refs.md
index c8d157bab9..429ece0931 100644
--- a/knowledge-base/common-dynamic-refs.md
+++ b/knowledge-base/common-dynamic-refs.md
@@ -29,7 +29,7 @@ How to have unique references a collection of components that are generated in a
 
 ## Solution
 
-The algorithm below is using a `TelerikGrid`, but it's identical for all Telerik Blazor components. The only difference is the type of the `Dictionary` `Value`s, which must match the component type (`TelerikTextBox`, `TelerikUpload`, etc.). The type of some components may [depend on the model type]({%slug common-features-data-binding-overview%}#component-type), as in this example.
+The algorithm below is using a `TelerikGrid`, but it's identical for all Telerik Blazor components. The only difference is the type of the `Dictionary` `Value`s, which must match the component type (`TelerikTextBox`, `TelerikUpload`, etc.). The type of some components may [depend on the model type](slug://common-features-data-binding-overview#component-type), as in this example.
 
 1. Create a `Dictionary<object, TelerikGrid<GridModel>>`. The actual `Key` type will depend on the data or the component generation algorithm.
 1. Add a new `KeyValuePair` to the `Dictionary` for every new component instance. Check if the dictionary key already exists to prevent duplications during UI refresh.
diff --git a/knowledge-base/common-icon-names-list.md b/knowledge-base/common-icon-names-list.md
index 70d11adf32..7065c86d2d 100644
--- a/knowledge-base/common-icon-names-list.md
+++ b/knowledge-base/common-icon-names-list.md
@@ -27,7 +27,7 @@ res_type: kb
 
 ## Description
 
-If you have used the obsolete `Telerik.Blazor.IconName` class, here is the list of icon names in its stead. The [Built-in Icons page]({%slug common-features-icons%}#icons-list) provides an up-to-date list of all available font icons in our themes.
+If you have used the obsolete `Telerik.Blazor.IconName` class, here is the list of icon names in its stead. The [Built-in Icons page](slug://common-features-icons#icons-list) provides an up-to-date list of all available font icons in our themes.
 
 * IconName.Undo -> `undo`;
 * IconName.Redo -> `redo`;
diff --git a/knowledge-base/common-increase-signalr-max-message-size.md b/knowledge-base/common-increase-signalr-max-message-size.md
index 9f1d50e5ba..7a662c7db1 100644
--- a/knowledge-base/common-increase-signalr-max-message-size.md
+++ b/knowledge-base/common-increase-signalr-max-message-size.md
@@ -113,6 +113,6 @@ Make sure that `AddServerSideBlazor()` is called **only once**. All configuratio
 
 ## See Also
 
-* [Connection Closed Error in Blazor Server Apps]({%slug common-kb-connection-closed%})
+* [Connection Closed Error in Blazor Server Apps](slug://common-kb-connection-closed)
 * [ASP.NET Core SignalR configuration](https://learn.microsoft.com/en-us/aspnet/core/signalr/configuration)
 * [SignalR Buffer management](https://learn.microsoft.com/en-us/aspnet/core/signalr/security?view=aspnetcore-7.0#buffer-management)
diff --git a/knowledge-base/common-layout-components-bootstrap-alternatives.md b/knowledge-base/common-layout-components-bootstrap-alternatives.md
index fc495c53ad..f3f0886d9b 100644
--- a/knowledge-base/common-layout-components-bootstrap-alternatives.md
+++ b/knowledge-base/common-layout-components-bootstrap-alternatives.md
@@ -53,7 +53,7 @@ If you want to build layouts only with Telerik UI for Blazor, there are several
 Other components that may be relevant to application layouts are:
 
 * The [Card](https://demos.telerik.com/blazor-ui/card/overview) lets you display items and sets of information through predefined building blocks.
-* [Various popup components]({%slug common-kb-popup-component-comparison%}) let you conserve real estate on the screen.
+* [Various popup components](slug://common-kb-popup-component-comparison) let you conserve real estate on the screen.
 * Many other components help with navigation and layouts, review the [list of available components in our demos](https://demos.telerik.com/blazor-ui).
 
 
diff --git a/knowledge-base/common-lazy-load-assemblies-wasm.md b/knowledge-base/common-lazy-load-assemblies-wasm.md
index c76f08d30f..554f014436 100644
--- a/knowledge-base/common-lazy-load-assemblies-wasm.md
+++ b/knowledge-base/common-lazy-load-assemblies-wasm.md
@@ -61,8 +61,8 @@ All general guidance from the [Microsoft documentation](https://learn.microsoft.
 ````
 
 * The assembly requirements depend on component usage, and not on feature usage. For example, both icon assemblies are always required, as our components render icons internally and must be aware of both types of icons. The assemblies, which are related to Excel export, are always required when using a Grid. `Telerik.Recurrence.dll` is required only when using the Scheduler.
-* Move the [`<TelerikRootComponent>`]({%slug rootcomponent-overview%}) to a layout that is used only on pages that have the Telerik assemblies loaded.
-* Lazy loading of assemblies does not support dynamic service injection. As a result, remove the Telerik service registration (`builder.Services.AddTelerikBlazor();`) from `Program.cs`. If you are using [localization for the Telerik Blazor components]({%slug globalization-localization%}), define the the localization service for the Telerik components with the `Localizer` parameter of the `<TelerikRootComponent>`. The key thing is to instantiate the localization service inline. It cannot be injected as a variable from the `@code { }` block, because that will throw runtime errors.
+* Move the [`<TelerikRootComponent>`](slug://rootcomponent-overview) to a layout that is used only on pages that have the Telerik assemblies loaded.
+* Lazy loading of assemblies does not support dynamic service injection. As a result, remove the Telerik service registration (`builder.Services.AddTelerikBlazor();`) from `Program.cs`. If you are using [localization for the Telerik Blazor components](slug://globalization-localization), define the the localization service for the Telerik components with the `Localizer` parameter of the `<TelerikRootComponent>`. The key thing is to instantiate the localization service inline. It cannot be injected as a variable from the `@code { }` block, because that will throw runtime errors.
 
 
 ````RAZOR.skip-repl
diff --git a/knowledge-base/common-maximum-call-stack-exceeded.md b/knowledge-base/common-maximum-call-stack-exceeded.md
index e8b9c3d4be..a76c193714 100644
--- a/knowledge-base/common-maximum-call-stack-exceeded.md
+++ b/knowledge-base/common-maximum-call-stack-exceeded.md
@@ -44,8 +44,8 @@ The possible causes for the `Maximum call stack size exceeded` error are:
 
 To resolve the error:
 
-* Use a Telerik UI for Blazor version, which is [compatible with .NET 8]({%slug system-requirements%}#supported-net-versions).
-* Clear the browser cache and [add a cache buster for the Telerik CSS and JavaScript files]({%slug common-kb-browser-cache-buster%}).
+* Use a Telerik UI for Blazor version, which is [compatible with .NET 8](slug://system-requirements#supported-net-versions).
+* Clear the browser cache and [add a cache buster for the Telerik CSS and JavaScript files](slug://common-kb-browser-cache-buster).
 
 Clearing the browser cache will reload the `telerik-blazor.js` file and the error should go away.
 
@@ -58,8 +58,8 @@ If the Telerik UI for Blazor version is up-to-date and the error persists, then
 
 ## Notes
 
-If you receive a `TelerikBlazor was undefined` JavaScript error after you clear the browser cache, then refer to the [documentation about `TelerikBlazor was undefined`]({%slug troubleshooting-js-errors%}#telerikblazor-was-undefined).
+If you receive a `TelerikBlazor was undefined` JavaScript error after you clear the browser cache, then refer to the [documentation about `TelerikBlazor was undefined`](slug://troubleshooting-js-errors#telerikblazor-was-undefined).
 
 ## See Also
 
-* [Troubleshoot JavaScript Errors]({%slug troubleshooting-js-errors%})
+* [Troubleshoot JavaScript Errors](slug://troubleshooting-js-errors)
diff --git a/knowledge-base/common-net8-sections.md b/knowledge-base/common-net8-sections.md
index 80364ccde1..19ac9e7ca0 100644
--- a/knowledge-base/common-net8-sections.md
+++ b/knowledge-base/common-net8-sections.md
@@ -106,4 +106,4 @@ We don't recommend and don't officially support custom markup or custom componen
 
 ## See Also
 
-* [Add Telerik Blazor components to the Blazor Web App Template]({%slug getting-started/web-app%})
+* [Add Telerik Blazor components to the Blazor Web App Template](slug://getting-started/web-app)
diff --git a/knowledge-base/common-newtonsoft-breaks-datasourcerequest-serialization.md b/knowledge-base/common-newtonsoft-breaks-datasourcerequest-serialization.md
index fe52b47304..29b6295c5f 100644
--- a/knowledge-base/common-newtonsoft-breaks-datasourcerequest-serialization.md
+++ b/knowledge-base/common-newtonsoft-breaks-datasourcerequest-serialization.md
@@ -110,5 +110,5 @@ There are three other paths forward you can consider:
 
 ## Notes
 
-Telerik supports serialization of the `DataSourceRequest` as part of the [`Telerik.DataSource` package]({%slug common-features-datasource-package%}) (which is used by UI for Blazor) with the `System.Text.Json` serializer only.
+Telerik supports serialization of the `DataSourceRequest` as part of the [`Telerik.DataSource` package](slug://common-features-datasource-package) (which is used by UI for Blazor) with the `System.Text.Json` serializer only.
 
diff --git a/knowledge-base/common-null-value-parameter-format.md b/knowledge-base/common-null-value-parameter-format.md
index 26330c8d3d..12f752dbf3 100644
--- a/knowledge-base/common-null-value-parameter-format.md
+++ b/knowledge-base/common-null-value-parameter-format.md
@@ -56,16 +56,16 @@ The app either needs to implement localization for the Telerik components correc
 
 To solve the issue, make sure that:
 
-* The [application is correctly configured to use localization]({%slug globalization-localization%})
+* The [application is correctly configured to use localization](slug://globalization-localization)
 * The resx files are up-to-date and contain [all required localization strings](/blazor-ui/api/Telerik.Blazor.Resources.Messages)
 
 Find the latest localization files in two places:
 
-* (maintained by Telerik) In the offline version of our [Blazor demo site](https://demos.telerik.com/blazor-ui). Download our [UI for Blazor automated installer]({%slug installation/msi%}) or [UI for Blazor ZIP archive]({%slug installation/zip%}). Then, look inside folder `/demos/TelerikBlazorDemos/Resources/`.
+* (maintained by Telerik) In the offline version of our [Blazor demo site](https://demos.telerik.com/blazor-ui). Download our [UI for Blazor automated installer](slug://installation/msi) or [UI for Blazor ZIP archive](slug://installation/zip). Then, look inside folder `/demos/TelerikBlazorDemos/Resources/`.
 * (maintained by the community) In the [telerik/blazor-ui-messages](https://github.com/telerik/blazor-ui-messages) GitHub repository
 
-In some cases, you might not get an error, but components may appear partially localized (some texts are missing). More details on that are available at [Partially Localized Components, Missing Text, Not Translated Text]({%slug common-kb-partial-localization%}).
+In some cases, you might not get an error, but components may appear partially localized (some texts are missing). More details on that are available at [Partially Localized Components, Missing Text, Not Translated Text](slug://common-kb-partial-localization).
 
 ## See Also
 
-* [Telerik Blazor localization]({%slug globalization-localization%})
+* [Telerik Blazor localization](slug://globalization-localization)
diff --git a/knowledge-base/common-package-telerik-pivot-not-compatible-with-netframework.md b/knowledge-base/common-package-telerik-pivot-not-compatible-with-netframework.md
index a6d1f59771..62fac04c6a 100644
--- a/knowledge-base/common-package-telerik-pivot-not-compatible-with-netframework.md
+++ b/knowledge-base/common-package-telerik-pivot-not-compatible-with-netframework.md
@@ -57,7 +57,7 @@ To fix and avoid NuGet restore errors, use the [.NET CLI `dotnet restore` comman
 
 ## See Also
 
-* [Setting up the Telerik NuGet Source]({%slug installation/nuget%})
-* [Troubleshooting the Telerik NuGet Source]({%slug troubleshooting-nuget%})
+* [Setting up the Telerik NuGet Source](slug://installation/nuget)
+* [Troubleshooting the Telerik NuGet Source](slug://troubleshooting-nuget)
 * [.NET CLI dotnet restore command](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-restore)
 * [.NET CLI dotnet nuget commands](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-nuget-add-source)
diff --git a/knowledge-base/common-partial-localization.md b/knowledge-base/common-partial-localization.md
index b0a7e47d2e..45fbedaf46 100644
--- a/knowledge-base/common-partial-localization.md
+++ b/knowledge-base/common-partial-localization.md
@@ -23,7 +23,7 @@ res_type: kb
 
 
 ## Description
-I am using [localization]({%slug globalization-localization%}) for my components, but some strings (texts) are not translated. 
+I am using [localization](slug://globalization-localization) for my components, but some strings (texts) are not translated. 
 
 For example, the column menu stays in English, or is missing its texts altogether. Or, the filter option messages are not translated. 
 
@@ -55,7 +55,7 @@ Depending on the particular service implementation, an empty string or the Engli
 ## Solution
 Ensure that all the keys used by the Telerik components are present and translated in your application. 
 
-You can find an up-to-date list of those keys in the `demos` folder of your local installation (both [automated]({%slug installation/msi%}) and the [zip archive]({%slug installation/zip%})) - this is our online demos solution and the `Resources` folder in it contains a few sample localization files. We add the new keys for every release in the default translation file.
+You can find an up-to-date list of those keys in the `demos` folder of your local installation (both [automated](slug://installation/msi) and the [zip archive](slug://installation/zip)) - this is our online demos solution and the `Resources` folder in it contains a few sample localization files. We add the new keys for every release in the default translation file.
 
 ## Notes
 
@@ -67,4 +67,4 @@ Apart from missing localization strings, you may occasionally experience an erro
 
 `Unhandled exception rendering component: Value cannot be null. (Parameter 'format')`
 
-See knowledge base article [Value cannot be null. (Parameter 'format')]({%slug common-kb-null-value-parameter-format%}) for more details.
+See knowledge base article [Value cannot be null. (Parameter 'format')](slug://common-kb-null-value-parameter-format) for more details.
diff --git a/knowledge-base/common-popup-component-comparison.md b/knowledge-base/common-popup-component-comparison.md
index c50c322ab6..2ffd9b5a2f 100644
--- a/knowledge-base/common-popup-component-comparison.md
+++ b/knowledge-base/common-popup-component-comparison.md
@@ -43,10 +43,10 @@ This KB article answers the following questions:
 
 Here are the unique features and distinguishing characteristics of all Telerik UI for Blazor popup components:
 
-* The [AnimationContainer]({%slug components/animationcontainer/overview%}) is a blank animated element that [renders at the same place where it is declared]({%slug components/animationcontainer/overview%}#position). The rendering location can matter a lot in some cases, for example, in scenarios with scrollable conatiners.
-* The [Dialog]({%slug dialog-overview%}) and [Window]({%slug window-overview%}) are very similar. Basically, the Dialog is a modal Window that cannot be resized or dragged. The Dialog has [built-in layouts for action buttons in its footer]({%slug dialog-action-buttons%}).
-* The [Popover]({%slug popover-overview%}) and [Tooltip]({%slug tooltip-overview%}) are also similar. The Popover is designed to work with a single anchor (target), while the Tooltip works with multiple targets. Both components can show a callout. Similar to the [Dialog]({%slug dialog-overview%}), the Popover supports action buttons in its footer.
-* The [Popup]({%slug popup-overview%}) UX can be similar to a [Window]({%slug window-overview%}) or a drop down, depending on its animation and position settings. Similar to the [Popover]({%slug popover-overview%}), the Popup also works with a single anchor and is positioned relative to it. The Popup has the [most comprehensive set of parameters that position and align it to its anchor]({%slug popup-position-collision%}). Use the Popup to implement custom drop down components, which do not exist in the product.
+* The [AnimationContainer](slug://components/animationcontainer/overview) is a blank animated element that [renders at the same place where it is declared](slug://components/animationcontainer/overview#position). The rendering location can matter a lot in some cases, for example, in scenarios with scrollable conatiners.
+* The [Dialog](slug://dialog-overview) and [Window](slug://window-overview) are very similar. Basically, the Dialog is a modal Window that cannot be resized or dragged. The Dialog has [built-in layouts for action buttons in its footer](slug://dialog-action-buttons).
+* The [Popover](slug://popover-overview) and [Tooltip](slug://tooltip-overview) are also similar. The Popover is designed to work with a single anchor (target), while the Tooltip works with multiple targets. Both components can show a callout. Similar to the [Dialog](slug://dialog-overview), the Popover supports action buttons in its footer.
+* The [Popup](slug://popup-overview) UX can be similar to a [Window](slug://window-overview) or a drop down, depending on its animation and position settings. Similar to the [Popover](slug://popover-overview), the Popup also works with a single anchor and is positioned relative to it. The Popup has the [most comprehensive set of parameters that position and align it to its anchor](slug://popup-position-collision). Use the Popup to implement custom drop down components, which do not exist in the product.
 
 The following table provides another point of view for easier comparison.
 
@@ -54,14 +54,14 @@ The following table provides another point of view for easier comparison.
 
 | Component | Rendering Location * | Position Relative To | Anchor Elements | Built-in Styled Content | Modality | Resizing and Dragging |
 | --- | --- | --- | --- | --- | --- | --- |
-| AnimationContainer | in-place | depends on positioned containers and [`Top` and `Left`]({%slug components/animationcontainer/overview%}#position) | 0, but can be simulated | none | no | no |
-| Dialog | root | page | 0 | header with [optional close button]({%slug dialog-overview%}#dialog-parameters), footer with action buttons | yes | no |
+| AnimationContainer | in-place | depends on positioned containers and [`Top` and `Left`](slug://components/animationcontainer/overview#position) | 0, but can be simulated | none | no | no |
+| Dialog | root | page | 0 | header with [optional close button](slug://dialog-overview#dialog-parameters), footer with action buttons | yes | no |
 | Popover | root | anchor element | 1, [limited support for multiple](https://demos.telerik.com/blazor-ui/popover/overview) | header, footer with action buttons, callout | no | no |
 | Popup | root | anchor element | 1 | none | no | no |
 | Tooltip | root | anchor element | unlimited | icons, callout | no | no |
-| Window | depends on [`ContainmentSelector`]({%slug components/window/position%}#containmentselector) | page | 0 | header with actions | depends on [`Modal`]({%slug components/window/modal%}) | yes |
+| Window | depends on [`ContainmentSelector`](slug://components/window/position#containmentselector) | page | 0 | header with actions | depends on [`Modal`](slug://components/window/modal) | yes |
 
-\* **Root** rendering location means as a direct child of the [`TelerikRootComponent`]({%slug rootcomponent-overview%}). **In-place** is how Blazor components normally work.
+\* **Root** rendering location means as a direct child of the [`TelerikRootComponent`](slug://rootcomponent-overview). **In-place** is how Blazor components normally work.
 
 
 ## See Also
diff --git a/knowledge-base/common-remove-components-from-telerik-blazor-js.md b/knowledge-base/common-remove-components-from-telerik-blazor-js.md
index 2442e722d5..4181753128 100644
--- a/knowledge-base/common-remove-components-from-telerik-blazor-js.md
+++ b/knowledge-base/common-remove-components-from-telerik-blazor-js.md
@@ -33,7 +33,7 @@ This KB article answers the following questions:
 * How to build the `telerik-blazor.js` file without some of the components?
 * How to exclude components from the Telerik Blazor JSInterop file and rebuild `telerik-blazor.js`?
 * How to remove components from the client-side code of Telerik UI for Blazor?
-* How to remove the Spreadsheet component from `telerik-blazor.js` in order to achieve [strict Content Security Policy compliance]({%slug troubleshooting-csp%})?
+* How to remove the Spreadsheet component from `telerik-blazor.js` in order to achieve [strict Content Security Policy compliance](slug://troubleshooting-csp)?
 * How to remove the PDF Viewer component from `telerik-blazor.js` in order to avoid conflicts with other third-party tools that depend on PDF.js?
 * How to reduce the file size of the Telerik Blazor JavaScript asset?
 
@@ -58,10 +58,10 @@ Here are the required steps to exclude Telerik UI for Blazor components from `te
 1. Run `npm install` in the `javascript` folder.
 1. Run `gulp build-cdn` in the `javascript` folder.
 1. Copy the generated `telerik-blazor.js` file to the `wwwroot` folder or your Blazor app.
-1. Remove the existing `telerik-blazor.js` file registration as a [static asset]({%slug getting-started/what-you-need%}#javascript-file) or [CDN URL]({%slug common-features-cdn%}#javascript-urls). Register the custom `telerik-blazor.js` from `wwwroot`.
+1. Remove the existing `telerik-blazor.js` file registration as a [static asset](slug://getting-started/what-you-need#javascript-file) or [CDN URL](slug://common-features-cdn#javascript-urls). Register the custom `telerik-blazor.js` from `wwwroot`.
 
-> Repeat the above steps and rebuild `telerik-blazor.js` after every [version update of Telerik UI for Blazor]({%slug upgrade-tutorial%}).
+> Repeat the above steps and rebuild `telerik-blazor.js` after every [version update of Telerik UI for Blazor](slug://upgrade-tutorial).
 
 ## See Also
 
-* [Adding Telerik UI for Blazor to a Blazor app]({%slug getting-started/what-you-need%})
+* [Adding Telerik UI for Blazor to a Blazor app](slug://getting-started/what-you-need)
diff --git a/knowledge-base/common-stackoverflowexception-editing-circular-references.md b/knowledge-base/common-stackoverflowexception-editing-circular-references.md
index 9f4d5e31ab..3321e8d6bb 100644
--- a/knowledge-base/common-stackoverflowexception-editing-circular-references.md
+++ b/knowledge-base/common-stackoverflowexception-editing-circular-references.md
@@ -44,7 +44,7 @@ public class Employee
 }
 ```
 
-Modify the class to [include a primitive property that holds a unique identifier]({%slug grids-foreign-key%}):
+Modify the class to [include a primitive property that holds a unique identifier](slug://grids-foreign-key):
 
 ```csharp
 public class Employee
@@ -56,8 +56,8 @@ public class Employee
 
 ## See Also
 
-* [Grid Editing]({%slug components/grid/editing/overview%})
-* [Gantt Editing]({%slug gantt-tree-editing%})
-* [ListView Editing]({%slug listview-editing%})
-* [Scheduler Editing]({%slug scheduler-appointments-edit%})
-* [TreeList Editing]({%slug treelist-editing-overview%})
+* [Grid Editing](slug://components/grid/editing/overview)
+* [Gantt Editing](slug://gantt-tree-editing)
+* [ListView Editing](slug://listview-editing)
+* [Scheduler Editing](slug://scheduler-appointments-edit)
+* [TreeList Editing](slug://treelist-editing-overview)
diff --git a/knowledge-base/common-struct-error.md b/knowledge-base/common-struct-error.md
index 4917f93acd..c854fb48fc 100644
--- a/knowledge-base/common-struct-error.md
+++ b/knowledge-base/common-struct-error.md
@@ -83,7 +83,7 @@ To reproduce the problem, you can use the following code sample:
 The cause for this null exception is the binding of Telerik UI for Blazor components to a `struct` component model.
 
 ## Solution
-The solution is to always bind the component to a `class` model, not a `struct`. For more information, see [Data Binding Overview]({%slug common-features-data-binding-overview%}#how-to-provide-data).
+The solution is to always bind the component to a `class` model, not a `struct`. For more information, see [Data Binding Overview](slug://common-features-data-binding-overview#how-to-provide-data).
 
 <div class="skip-repl"></div>
 ````CS
@@ -99,4 +99,4 @@ public class Product
 
 ## See Also
 
-- [Data Binding Overview]({%slug common-features-data-binding-overview%})
\ No newline at end of file
+- [Data Binding Overview](slug://common-features-data-binding-overview)
\ No newline at end of file
diff --git a/knowledge-base/common-telerik-themes-libman.md b/knowledge-base/common-telerik-themes-libman.md
index 7d7a7a0552..f942970995 100644
--- a/knowledge-base/common-telerik-themes-libman.md
+++ b/knowledge-base/common-telerik-themes-libman.md
@@ -29,7 +29,7 @@ This KB article answers the following questions:
 * How to use LibMan to add Telerik themes to your Telerik Blazor app.
 * How to update local themes in `wwwroot` automatically when a new version is available.
 
-[LibMan](https://learn.microsoft.com/en-us/aspnet/core/client-side/libman/) is a client-side dependency manager, which is included in ASP.NET Core. You can use it to automatically download a Telerik theme to the `wwwroot` folder of your app, instead of using [static NuGet assets]({%slug themes-overview%}#loading-themes-from-the-nuget-package) or [Telerik CDN]({%slug common-features-cdn%}).
+[LibMan](https://learn.microsoft.com/en-us/aspnet/core/client-side/libman/) is a client-side dependency manager, which is included in ASP.NET Core. You can use it to automatically download a Telerik theme to the `wwwroot` folder of your app, instead of using [static NuGet assets](slug://themes-overview#loading-themes-from-the-nuget-package) or [Telerik CDN](slug://common-features-cdn).
 
 The benefits of Libman are:
 
@@ -42,8 +42,8 @@ The benefits of Libman are:
 
 You can use Libman to consume the following **npm** packages that are published on the **UNPKG** CDN:
 
-* [`@progress/kendo-font-icons`](https://www.npmjs.com/package/@progress/kendo-font-icons) provides font icon styles when using [font icons instead of SVG icons]({%slug common-features-icons%}).
-* All [built-in themes]({%slug themes-overview%}) and their [swatches]({%slug themes-overview%}#basics):
+* [`@progress/kendo-font-icons`](https://www.npmjs.com/package/@progress/kendo-font-icons) provides font icon styles when using [font icons instead of SVG icons](slug://common-features-icons).
+* All [built-in themes](slug://themes-overview) and their [swatches](slug://themes-overview#basics):
     * [`@progress/kendo-theme-bootstrap`](https://www.npmjs.com/package/@progress/kendo-theme-bootstrap)
     * [`@progress/kendo-theme-default`](https://www.npmjs.com/package/@progress/kendo-theme-default)
     * [`@progress/kendo-theme-fluent`](https://www.npmjs.com/package/@progress/kendo-theme-fluent)
@@ -68,9 +68,9 @@ Use the following information when creating the `libman.json` file:
 
 > Using the `@latest` theme version requires the latest Telerik UI for Blazor version as well.
 
-> In rare cases the `@latest` version may produce an error similar to `The "@progress/kendo-theme-default@latest" library could not be resolved by the "unpkg" provider`. In such cases, replace the `@latest` moniker with a [specific theme version](https://github.com/telerik/kendo-themes/releases), depending on the [theme version compatibility with Telerik UI for Blazor]({%slug themes-overview%}#compatibility-and-maintenance). For example, use `^8.0.0` to get the latest version of the major release `8`.
+> In rare cases the `@latest` version may produce an error similar to `The "@progress/kendo-theme-default@latest" library could not be resolved by the "unpkg" provider`. In such cases, replace the `@latest` moniker with a [specific theme version](https://github.com/telerik/kendo-themes/releases), depending on the [theme version compatibility with Telerik UI for Blazor](slug://themes-overview#compatibility-and-maintenance). For example, use `^8.0.0` to get the latest version of the major release `8`.
 
-The `libman.json` file below adds the **Main** swatches of [all built-in themes]({%slug themes-overview%}#built-in-themes) and the font icon stylesheet. Remove the theme or font icons entries that you don't need.
+The `libman.json` file below adds the **Main** swatches of [all built-in themes](slug://themes-overview#built-in-themes) and the font icon stylesheet. Remove the theme or font icons entries that you don't need.
 
 >caption libman.js
 
@@ -143,4 +143,4 @@ Install the `Microsoft.Web.LibraryManager.Build` NuGet package in your Blazor ap
 
 ## See Also
 
-* [Themes Overview]({%slug themes-overview%})
+* [Themes Overview](slug://themes-overview)
diff --git a/knowledge-base/common-theme-customization-options.md b/knowledge-base/common-theme-customization-options.md
index 1e65a78713..8f8c93a70d 100644
--- a/knowledge-base/common-theme-customization-options.md
+++ b/knowledge-base/common-theme-customization-options.md
@@ -38,18 +38,18 @@ Is there a simple and streamlined way to customize all component styles?
 
 Generally, there are **four** ways to customize the appearance of the Telerik Blazor components. All of them, except the first one, add an extra step to **every** UI for Blazor version update.
 
-1. [Use color CSS variables to modify an existing theme]({%slug themes-customize%}#setting-theme-variables).
+1. [Use color CSS variables to modify an existing theme](slug://themes-customize#setting-theme-variables).
     * This approach is supported for theme versions `8.0.0` and Telerik UI for Blazor versions `6.0.0` and above.
     * It is a simple and sustainable way to make minor or major customizations to the **colors** of an existing CSS theme, even at runtime.
     * Upgrading the Blazor components does not require any additional steps with regard to the CSS code, unless there are breaking changes in the CSS variable names.
     * The apperance of the Telerik components depends on CSS code in two different files. If you prefer to avoid this, then create a custom theme.
-1. [Use the ThemeBuilder to create a custom theme]({%slug themes-customize%}#using-themebuilder).
+1. [Use the ThemeBuilder to create a custom theme](slug://themes-customize#using-themebuilder).
     * This option allows [customization of the theme **colors** with the free version, or **full control** with the Pro version](https://docs.telerik.com/themebuilder/introduction#themebuilder-tiers).
     * Upgrading the custom theme is straight-forward via [manual](https://docs.telerik.com/themebuilder/web-app/migrating-projects) or [automatic](https://docs.telerik.com/themebuilder/web-app/automatic-migrations) approach.
-2. [Build a custom theme from the SASS source]({%slug themes-customize%}#building-themes-from-source-code).
+2. [Build a custom theme from the SASS source](slug://themes-customize#building-themes-from-source-code).
     * This option provides **full control** over the resulting CSS code.
     * Upgrading requires you to pull the changes from the [**`kendo-themes`** repo](https://github.com/telerik/kendo-themes) and **rebuild** the custom theme. Ideally, make only [variable and style overrides](https://github.com/telerik/kendo-themes/wiki/Core-Code-Concepts) with minimal edits to our source code itself. However, major customizations may require more changes and maintenance.
-3. [Override theme styles with additional CSS code]({%slug themes-override%}).
+3. [Override theme styles with additional CSS code](slug://themes-override).
     * This approach is possible with **both built-in themes or custom themes** made by the ThemeBuilder.
     * This option allows **full control** over the styling, but makes sense only up to a certain amount of customization. Beyond that, resort to building the theme from the source.
     * Upgrading may require changes to the additional custom CSS code, but only if there are breaking changes in the HTML output and styling.
@@ -58,10 +58,10 @@ To change the sizing and layout of most or all our components, go for manual the
 
 The final decision depends on what and how much you need to customize and what other requirements may appear.
 
-[**Figma UI Kits**](https://www.telerik.com/figma-kits) allow designers to include visual representations of the Telerik components in their application designs. Custom kits still require you to [create a custom theme]({%slug themes-customize%}) afterwards.
+[**Figma UI Kits**](https://www.telerik.com/figma-kits) allow designers to include visual representations of the Telerik components in their application designs. Custom kits still require you to [create a custom theme](slug://themes-customize) afterwards.
 
 
 ## See Also
 
-* [Custom Themes]({%slug themes-customize%})
-* [Use best practives when overriding theme styles]({%slug themes-override%}#best-practices)
+* [Custom Themes](slug://themes-customize)
+* [Use best practives when overriding theme styles](slug://themes-override#best-practices)
diff --git a/knowledge-base/common-time-duration-input.md b/knowledge-base/common-time-duration-input.md
index b7829e2f9a..39d1434725 100644
--- a/knowledge-base/common-time-duration-input.md
+++ b/knowledge-base/common-time-duration-input.md
@@ -29,7 +29,7 @@ The use case would be to choose a start datetime and then the user inputs a time
 
 ## Solution
 
-You can create a custom input for time duration using a [MaskedTextBox]({%slug maskedtextbox-overview%}). The used mask could be `00:00:00` and you can [include the literals in the value]({%slug maskedtextbox-mask-prompt%}#include-literals-in-the-value), so you can then split the MaskedTextBox value string by them and assign the separate hours, minutes, seconds values to corresponding variables.
+You can create a custom input for time duration using a [MaskedTextBox](slug://maskedtextbox-overview). The used mask could be `00:00:00` and you can [include the literals in the value](slug://maskedtextbox-mask-prompt#include-literals-in-the-value), so you can then split the MaskedTextBox value string by them and assign the separate hours, minutes, seconds values to corresponding variables.
 
 Then, use the `AddHours`, `AddMinutes`, `AddSeconds` methods of `DateTime` objects to add the hours, minutes, seconds values to the start datetime and thus calculate the end datetime.
 
diff --git a/knowledge-base/common-upgrade-breaks-css-theme-styles.md b/knowledge-base/common-upgrade-breaks-css-theme-styles.md
index 66c78ea9d9..5d4f5dbfc5 100644
--- a/knowledge-base/common-upgrade-breaks-css-theme-styles.md
+++ b/knowledge-base/common-upgrade-breaks-css-theme-styles.md
@@ -37,15 +37,15 @@ The application is using an outdated CSS theme or swatch.
 
 ## Solution
 
-To resolve the problem, follow the [recommended UI for Blazor upgrade procedure]({%slug upgrade-tutorial%}):
+To resolve the problem, follow the [recommended UI for Blazor upgrade procedure](slug://upgrade-tutorial):
 
-* If using the [Telerik **CDN**]({%slug common-features-cdn%}) - update the [stylesheet file URL]({%slug themes-overview%}#using-a-theme) to the correct version.
-* If using a **local** CSS file in `wwwroot` - replace the stylesheet with a compatible one. If the application is using a [**custom theme**, then recreate it]({%slug themes-customize%}).
-* If using **static assets** from the NuGet package - clear the browser cache and [add a cache buster for the Telerik CSS and JavaScript files]({%slug common-kb-browser-cache-buster%}).
+* If using the [Telerik **CDN**](slug://common-features-cdn) - update the [stylesheet file URL](slug://themes-overview#using-a-theme) to the correct version.
+* If using a **local** CSS file in `wwwroot` - replace the stylesheet with a compatible one. If the application is using a [**custom theme**, then recreate it](slug://themes-customize).
+* If using **static assets** from the NuGet package - clear the browser cache and [add a cache buster for the Telerik CSS and JavaScript files](slug://common-kb-browser-cache-buster).
 
 A version update might break custom application CSS styles that are outside the Telerik theme. In this case, then check if the component HTML rendering or CSS classes have changed, and adjust the custom CSS code.
 
 ## See Also
 
-* [Telerik UI for Blazor version upgrade steps]({%slug upgrade-tutorial%})
-* [Troubleshooting JavaScript errors after version upgrade]({%slug common-kb-cannot-read-properties-of-null-reading-addeventlistener%})
+* [Telerik UI for Blazor version upgrade steps](slug://upgrade-tutorial)
+* [Troubleshooting JavaScript errors after version upgrade](slug://common-kb-cannot-read-properties-of-null-reading-addeventlistener)
diff --git a/knowledge-base/common-validation-error-in-tooltip.md b/knowledge-base/common-validation-error-in-tooltip.md
index 27b9af8e11..195e563f5c 100644
--- a/knowledge-base/common-validation-error-in-tooltip.md
+++ b/knowledge-base/common-validation-error-in-tooltip.md
@@ -38,11 +38,11 @@ This article contains several different ways to implement validation notificatio
 
 ### TelerikValidationTooltip
 
-You can use the [TelerikValidationTooltip]({%slug validation-tools-tooltip%}) to enable tooltip validation messages either in the [Telerik Form]({%slug form-overview%}) or in the Microsoft EditForm.
+You can use the [TelerikValidationTooltip](slug://validation-tools-tooltip) to enable tooltip validation messages either in the [Telerik Form](slug://form-overview) or in the Microsoft EditForm.
 
 ### TelerikForm
 
-The [Telerik Form]({%slug form-overview%}) component comes with a [popup validation mode]({%slug form-validation%}#validation-message-type) out-of-the-box.
+The [Telerik Form](slug://form-overview) component comes with a [popup validation mode](slug://form-validation#validation-message-type) out-of-the-box.
 
 ### Validation Summary in a Popup
 
diff --git a/knowledge-base/common-value-cannot-be-null-parameter-format.md b/knowledge-base/common-value-cannot-be-null-parameter-format.md
index 7b91b1a196..c43c69a119 100644
--- a/knowledge-base/common-value-cannot-be-null-parameter-format.md
+++ b/knowledge-base/common-value-cannot-be-null-parameter-format.md
@@ -57,7 +57,7 @@ This exception will occur if the type of TItem is different from the type of the
 
 ## Solution
 
-* [Configure the application to use localization]({%slug globalization-localization%}).
+* [Configure the application to use localization](slug://globalization-localization).
 * Include resource files for all required languages.
 * Update the resource files and make sure they [contain all required localization strings](/blazor-ui/api/Telerik.Blazor.Resources.Messages).
 
diff --git a/knowledge-base/common-wasm-prerendering.md b/knowledge-base/common-wasm-prerendering.md
index ad191646cc..42eceaab77 100644
--- a/knowledge-base/common-wasm-prerendering.md
+++ b/knowledge-base/common-wasm-prerendering.md
@@ -38,7 +38,7 @@ You can read more about it in the following resources:
 
 ## Solution
 
-You can see how to add Telerik assets, services and the root component in the [What You Need]({%slug getting-started/what-you-need%}) article. Make sure you are familiar with it before you continue reading. Both the client-side, and the server-side information is necessary.
+You can see how to add Telerik assets, services and the root component in the [What You Need](slug://getting-started/what-you-need) article. Make sure you are familiar with it before you continue reading. Both the client-side, and the server-side information is necessary.
 
 There are a couple of things specific to the Telerik components that you need to do:
 
diff --git a/knowledge-base/confirm-button-click-message-box.md b/knowledge-base/confirm-button-click-message-box.md
index e1fbc6939f..713dc65c6f 100644
--- a/knowledge-base/confirm-button-click-message-box.md
+++ b/knowledge-base/confirm-button-click-message-box.md
@@ -31,9 +31,9 @@ Sometimes user actions can be sensitive or result in data deletion. For such cas
 
 ## Solution
 
-UI for Blazor includes [Alert, Confirm and Prompt popup dialogs]({%slug dialog-predefined%}), which can be used to interact with the user.
+UI for Blazor includes [Alert, Confirm and Prompt popup dialogs](slug://dialog-predefined), which can be used to interact with the user.
 
-Another option is to use the [Window component]({%slug window-overview%}), if the predefined Dialogs do not provide enough flexibility for a specific scenario. Here are two examples:
+Another option is to use the [Window component](slug://window-overview), if the predefined Dialogs do not provide enough flexibility for a specific scenario. Here are two examples:
 
 * [https://github.com/telerik/blazor-ui/tree/master/common/confirm-button](https://github.com/telerik/blazor-ui/tree/master/common/confirm-button)
 * [https://github.com/telerik/blazor-ui/tree/master/common/message-box](https://github.com/telerik/blazor-ui/tree/master/common/message-box)
diff --git a/knowledge-base/contextmenu-no-data-source.md b/knowledge-base/contextmenu-no-data-source.md
index 62f6fea8d6..b4ce195d69 100644
--- a/knowledge-base/contextmenu-no-data-source.md
+++ b/knowledge-base/contextmenu-no-data-source.md
@@ -28,7 +28,7 @@ That way we can use this control to provide a popup of items that we can control
 
 ## Solution
 
-If you don't want to define a data source, you can provide an empty `List<object>` to the `Data` parameter of the Context menu. This way, you will meet the component's requirement of providing data and in the same time you will be able to actually create the content for it yourself using the [Content Template]({%slug contextmenu-content-template%}).
+If you don't want to define a data source, you can provide an empty `List<object>` to the `Data` parameter of the Context menu. This way, you will meet the component's requirement of providing data and in the same time you will be able to actually create the content for it yourself using the [Content Template](slug://contextmenu-content-template).
 
 
 
diff --git a/knowledge-base/contextmenu-treeview-items.md b/knowledge-base/contextmenu-treeview-items.md
index fba94d7beb..4fd1af46d8 100644
--- a/knowledge-base/contextmenu-treeview-items.md
+++ b/knowledge-base/contextmenu-treeview-items.md
@@ -27,10 +27,10 @@ I would like to add the ContextMenu component to every item (node) in the TreeVi
 
 ## Solution
 
-The ContextMenu exposes an API to associate the component to any DOM element through the [ShowAsync]({%slug contextmenu-integration%}) method. You can use the [oncontextmenu](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/oncontextmenu) event of an HTML element in the [treeview item template]({%slug components/treeview/templates%}) to show the context menu by using the `MouseEventArgs`. 
+The ContextMenu exposes an API to associate the component to any DOM element through the [ShowAsync](slug://contextmenu-integration) method. You can use the [oncontextmenu](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/oncontextmenu) event of an HTML element in the [treeview item template](slug://components/treeview/templates) to show the context menu by using the `MouseEventArgs`. 
 
 
->tip As of version 2.27, the TreeView exposes [`OnItemContextMenu` event]({%slug treeview-events%}#onitemcontextmenu) that you can use to integrate Telerik Context menu for the TreeView nodes. Here is an example of such a configuration - [Context menu for a TreeView node]({%slug contextmenu-integration%}#context-menu-for-a-treeview-node)
+>tip As of version 2.27, the TreeView exposes [`OnItemContextMenu` event](slug://treeview-events#onitemcontextmenu) that you can use to integrate Telerik Context menu for the TreeView nodes. Here is an example of such a configuration - [Context menu for a TreeView node](slug://contextmenu-integration#context-menu-for-a-treeview-node)
 
 
 ````RAZOR
diff --git a/knowledge-base/date-input-select-am-pm-on-keypress.md b/knowledge-base/date-input-select-am-pm-on-keypress.md
index 0ed5794310..ab08d8076e 100644
--- a/knowledge-base/date-input-select-am-pm-on-keypress.md
+++ b/knowledge-base/date-input-select-am-pm-on-keypress.md
@@ -33,7 +33,7 @@ Any way to make the AM/PM change the way the hh mm ss does by directly entering
 
 While A and P might be very common symbols, there are many other symbols that might be used in different countries and cultures. Thus, the component cannot track all such possible combinations, and it exposes the Up and Down Arrows as options to change the time segments, including the AM/PM indicator.
 
-In order to change AM/PM by pressing A or P on keyboard you can get the input events (such as keydown) by capturing them as they bubble up the DOM in a parent element, as described in this article - [Capture input keyboard events]({%slug inputs-kb-handle-keyboard-events%}).
+In order to change AM/PM by pressing A or P on keyboard you can get the input events (such as keydown) by capturing them as they bubble up the DOM in a parent element, as described in this article - [Capture input keyboard events](slug://inputs-kb-handle-keyboard-events).
 
 If you detect an A or P key you could change the Value as desired (e.g., add or subtract 12 hours depending on the current hours).
 
diff --git a/knowledge-base/datepicker-calendar-templates.md b/knowledge-base/datepicker-calendar-templates.md
index 6da73acf2d..f94264020f 100644
--- a/knowledge-base/datepicker-calendar-templates.md
+++ b/knowledge-base/datepicker-calendar-templates.md
@@ -28,18 +28,18 @@ res_type: kb
 
 ## Description
 
-How to use calendar [month cell template]({%slug calendar-templates-month%}) (`MonthCellTemplate`) with the TelerikDatePicker? I need to modify color and font size of enabled and disabled dates inside the Calendar.
+How to use calendar [month cell template](slug://calendar-templates-month) (`MonthCellTemplate`) with the TelerikDatePicker? I need to modify color and font size of enabled and disabled dates inside the Calendar.
 
 ## Solution
 
-At the time of writing (UI for Blazor version 2.29), the DatePicker does not expose [Calendar templates]({%slug calendar-templates-overview%}). However, it is possible to achieve the desired result with a combination of a few components:
+At the time of writing (UI for Blazor version 2.29), the DatePicker does not expose [Calendar templates](slug://calendar-templates-overview). However, it is possible to achieve the desired result with a combination of a few components:
 
-* [DateInput]({%slug components/dateinput/overview%}),
-* [icon button]({%slug button-icons%})
-* [Calendar]({%slug components/calendar/overview%})
-* [AnimationContainer]({%slug components/animationcontainer/overview%}).
+* [DateInput](slug://components/dateinput/overview),
+* [icon button](slug://button-icons)
+* [Calendar](slug://components/calendar/overview)
+* [AnimationContainer](slug://components/animationcontainer/overview).
 
-The only difference to a DatePicker is that the Calendar will not hide automatically when the user clicks outside the popup. The user will need to click on the icon button, or select a date. To improve the experience, you can add a "close" button inside the AnimationContainer or [close it with JavaScript]({%slug animationcontainer-kb-close-on-outside-click%}).
+The only difference to a DatePicker is that the Calendar will not hide automatically when the user clicks outside the popup. The user will need to click on the icon button, or select a date. To improve the experience, you can add a "close" button inside the AnimationContainer or [close it with JavaScript](slug://animationcontainer-kb-close-on-outside-click).
 
 The components are wrapped in a container with a `position:relative` style. This is needed to align the AnimationContainer popup position to the DateInput.
 
@@ -109,4 +109,4 @@ TelerikDateInput:
 
 ## See Also
 
-* [Hide the AnimationContainer on outside click]({%slug animationcontainer-kb-close-on-outside-click%})
+* [Hide the AnimationContainer on outside click](slug://animationcontainer-kb-close-on-outside-click)
diff --git a/knowledge-base/datepicker-hide-input.md b/knowledge-base/datepicker-hide-input.md
index 3e7c73b3ef..bed25e41d9 100644
--- a/knowledge-base/datepicker-hide-input.md
+++ b/knowledge-base/datepicker-hide-input.md
@@ -33,11 +33,11 @@ Is there a way to hide the input portion of the DatePicker and leave only the se
 
 ## Solution
 
-Use [custom CSS]({%slug themes-override%}) to hide the textbox and leave only the button and icon.
+Use [custom CSS](slug://themes-override) to hide the textbox and leave only the button and icon.
 
 To customize only specific Date/Time Pickers, use their Class parameter.
 
-This technique prevents automatic closing of the DatePicker popup after the user selects a date. To hide the popup, call JavaScript from the [`ValueChanged` event handler]({%slug components/datepicker/events%}#valuechanged). This workaround is not necessary for DateTimePickers and TimePickers.
+This technique prevents automatic closing of the DatePicker popup after the user selects a date. To hide the popup, call JavaScript from the [`ValueChanged` event handler](slug://components/datepicker/events#valuechanged). This workaround is not necessary for DateTimePickers and TimePickers.
 
 >caption Hide Date/Time Picker TextBox
 
diff --git a/knowledge-base/datepicker-kb-change-starting-day-of-week.md b/knowledge-base/datepicker-kb-change-starting-day-of-week.md
index 8396d637c1..e63839e4c9 100644
--- a/knowledge-base/datepicker-kb-change-starting-day-of-week.md
+++ b/knowledge-base/datepicker-kb-change-starting-day-of-week.md
@@ -30,7 +30,7 @@ This KB article answers the following questions:
 
 To set the start of the week to a different one in the Telerik DatePicker for Blazor, override the `FirstDayOfWeek` property of the current culture in your application. Follow the steps below to implement this solution:
 
-1. Include the necessary namespaces for [globalization]({%slug globalization-formats%}) in your component.
+1. Include the necessary namespaces for [globalization](slug://globalization-formats) in your component.
 2. Add the Telerik DatePicker component to your razor page.
 3. Override the `OnInitialized` method to change the current culture's `FirstDayOfWeek` to the desired one.
 
@@ -57,4 +57,4 @@ By setting the `FirstDayOfWeek` property to `DayOfWeek.Monday`, the DatePicker w
 
 ## See Also
 
-- [DatePicker Overview Documentation]({%slug components/datepicker/overview%})
+- [DatePicker Overview Documentation](slug://components/datepicker/overview)
diff --git a/knowledge-base/daterangepicker-css-customization.md b/knowledge-base/daterangepicker-css-customization.md
index b0b9258dff..ee826b0199 100644
--- a/knowledge-base/daterangepicker-css-customization.md
+++ b/knowledge-base/daterangepicker-css-customization.md
@@ -95,4 +95,4 @@ This KB article answers the following questions:
 
 ## See Also
 
-* [DateRangePicker Overview]({%slug daterangepicker-overview%})
\ No newline at end of file
+* [DateRangePicker Overview](slug://daterangepicker-overview)
\ No newline at end of file
diff --git a/knowledge-base/daterangepicker-vertical-input-alignment.md b/knowledge-base/daterangepicker-vertical-input-alignment.md
index 9c48fc191d..5bb29a41d8 100644
--- a/knowledge-base/daterangepicker-vertical-input-alignment.md
+++ b/knowledge-base/daterangepicker-vertical-input-alignment.md
@@ -58,7 +58,7 @@ Here is an example implementation:
 }
 ```
 
-This CSS ensures that the labels and inputs of the DateRangePicker display one below the other. Adjust the styles as needed to fit your design requirements better. Additionally, consider [repositioning the labels so they appear on the side and not on top of the inputs]({%slug daterangepicker-kb-reposition-labels%}).
+This CSS ensures that the labels and inputs of the DateRangePicker display one below the other. Adjust the styles as needed to fit your design requirements better. Additionally, consider [repositioning the labels so they appear on the side and not on top of the inputs](slug://daterangepicker-kb-reposition-labels).
 
 ## See Also
 
diff --git a/knowledge-base/dialog-dialogfactory-alert-confirm-prompt-width.md b/knowledge-base/dialog-dialogfactory-alert-confirm-prompt-width.md
index 5cbaf74707..288e777469 100644
--- a/knowledge-base/dialog-dialogfactory-alert-confirm-prompt-width.md
+++ b/knowledge-base/dialog-dialogfactory-alert-confirm-prompt-width.md
@@ -30,7 +30,7 @@ This KB answers the following questions:
 
 ## Solution
 
-All [Telerik Blazor Dialogs]({%slug dialog-overview%}) render a `k-dialog` CSS class. In addition, the [predefined dialogs]({%slug dialog-predefined%}) render a `k-alert` CSS class. Use this distinguishing CSS class to target popups that are generated by the Telerik `DialogFactory` and apply CSS styles.
+All [Telerik Blazor Dialogs](slug://dialog-overview) render a `k-dialog` CSS class. In addition, the [predefined dialogs](slug://dialog-predefined) render a `k-alert` CSS class. Use this distinguishing CSS class to target popups that are generated by the Telerik `DialogFactory` and apply CSS styles.
 
 >caption Set width to Telerik Blazor DialogFactory modal popups
 
@@ -85,5 +85,5 @@ All [Telerik Blazor Dialogs]({%slug dialog-overview%}) render a `k-dialog` CSS c
 
 ## See Also
 
-* [Predefined Telerik Dialogs]({%slug dialog-predefined%})
-* [Dialog Component Overview]({%slug dialog-overview%})
+* [Predefined Telerik Dialogs](slug://dialog-predefined)
+* [Dialog Component Overview](slug://dialog-overview)
diff --git a/knowledge-base/dialog-dialogfactory-null.md b/knowledge-base/dialog-dialogfactory-null.md
index 8da29c8804..8846567ef2 100644
--- a/knowledge-base/dialog-dialogfactory-null.md
+++ b/knowledge-base/dialog-dialogfactory-null.md
@@ -25,7 +25,7 @@ res_type: kb
 
 ## Description
 
-The following exception may occur when calling the `AlertAsync()`, `ConfirmAsync()`, or `PromptAsync()` methods of the [Telerik Blazor `DialogFactory`]({%slug dialog-predefined%}):
+The following exception may occur when calling the `AlertAsync()`, `ConfirmAsync()`, or `PromptAsync()` methods of the [Telerik Blazor `DialogFactory`](slug://dialog-predefined):
 
 `System.NullReferenceException: Object reference not set to an instance of an object`
 
@@ -35,9 +35,9 @@ The following exception may occur on initial page load:
 
 ## Cause
 
-The null reference exception occurs [if the `DialogFactory` `CascadingParameter` was not populated by the `TelerikRootComponent`]({%slug dialog-predefined%}#telerikrootcomponent-dependency). This in turn indicates one of the following:
+The null reference exception occurs [if the `DialogFactory` `CascadingParameter` was not populated by the `TelerikRootComponent`](slug://dialog-predefined#telerikrootcomponent-dependency). This in turn indicates one of the following:
 
-* The [`TelerikRootComponent`]({%slug rootcomponent-overview%}) is missing in the Blazor app.
+* The [`TelerikRootComponent`](slug://rootcomponent-overview) is missing in the Blazor app.
 * The root component is present, but it's in the same `.razor` file as the `DialogFactory` cascading parameter.
 * The Blazor app is using <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-9.0#apply-a-render-mode-to-a-component-definition" target="_blank">**Per Page / Component** Interactity Location</a> and the root component is present, but it's in a static `.razor` component or layout.
 
@@ -47,14 +47,14 @@ The invalid operation exception occurs if the app tries to inject the `DialogFac
 
 The following technical requirements ensure correct `DialogFactory` setup:
 
-* [Place a `TelerikRootComponent` in a layout `.razor` file]({%slug rootcomponent-overview%}#using-telerikrootcomponent) in the app when using the application types below. If the `DialogFactory` must be avalable in the layout file itself, then [place the `TelerikRootComponent` in a parent layout file]({%slug getting-started/what-you-need%}#optimal-telerikrootcomponent-usage).
-    * [Blazor Web App]({%slug getting-started/web-app%}) with <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-9.0#apply-a-render-mode-to-the-entire-app" target="_blank">**Global** Interactivity Location</a>.
-    * [WebAssembly standalone app]({%slug getting-started/client-side%})
-    * [Blazor Hybrid app]({%slug getting-started/hybrid-blazor%})
-* When using a Blazor Web App with <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-9.0#apply-a-render-mode-to-a-component-definition" target="_blank">**Per Page / Component** Interactity Location</a>, [place the `TelerikRootComponent` inside an interactive Razor component]({%slug rootcomponent-percomponent%}), which is a parent of the component that consumes the `DialogFactory`.
-* Always [consume the `DialogFactory` as a `[CascadingParameter]`]({%slug dialog-predefined%}), and not as a dependency injection with `@inject`.
+* [Place a `TelerikRootComponent` in a layout `.razor` file](slug://rootcomponent-overview#using-telerikrootcomponent) in the app when using the application types below. If the `DialogFactory` must be avalable in the layout file itself, then [place the `TelerikRootComponent` in a parent layout file](slug://getting-started/what-you-need#optimal-telerikrootcomponent-usage).
+    * [Blazor Web App](slug://getting-started/web-app) with <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-9.0#apply-a-render-mode-to-the-entire-app" target="_blank">**Global** Interactivity Location</a>.
+    * [WebAssembly standalone app](slug://getting-started/client-side)
+    * [Blazor Hybrid app](slug://getting-started/hybrid-blazor)
+* When using a Blazor Web App with <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-9.0#apply-a-render-mode-to-a-component-definition" target="_blank">**Per Page / Component** Interactity Location</a>, [place the `TelerikRootComponent` inside an interactive Razor component](slug://rootcomponent-percomponent), which is a parent of the component that consumes the `DialogFactory`.
+* Always [consume the `DialogFactory` as a `[CascadingParameter]`](slug://dialog-predefined), and not as a dependency injection with `@inject`.
 
 ## See Also
 
-* [Predefined Blazor Dialogs]({%slug dialog-predefined%})
-* [TelerikRootComponent Overview]({%slug rootcomponent-overview%})
+* [Predefined Blazor Dialogs](slug://dialog-predefined)
+* [TelerikRootComponent Overview](slug://rootcomponent-overview)
diff --git a/knowledge-base/dpl-version-conflict-detected-telerik-zip.md b/knowledge-base/dpl-version-conflict-detected-telerik-zip.md
index d650427a32..129be52d52 100644
--- a/knowledge-base/dpl-version-conflict-detected-telerik-zip.md
+++ b/knowledge-base/dpl-version-conflict-detected-telerik-zip.md
@@ -47,8 +47,8 @@ Warning NU1605: Detected package downgrade: Telerik.Zip from ... to .... Referen
 
 `Telerik.Zip` is a transitive dependency of multiple other Telerik NuGet packages:
 
-* Telerik UI for Blazor (the `Telerik.UI.for.Blazor` NuGet package) depends on the `Telerik.Documents.SpreadsheetStreaming` NuGet package in order to support [Grid Excel export]({%slug grid-export-excel%}). `Telerik.Documents.SpreadsheetStreaming` depends on `Telerik.Zip`.
-* Most [Telerik Document Processing]({%slug dpl-in-blazor%}) NuGet packages depend on `Telerik.Documents.Core`, which also depends on `Telerik.Zip`.
+* Telerik UI for Blazor (the `Telerik.UI.for.Blazor` NuGet package) depends on the `Telerik.Documents.SpreadsheetStreaming` NuGet package in order to support [Grid Excel export](slug://grid-export-excel). `Telerik.Documents.SpreadsheetStreaming` depends on `Telerik.Zip`.
+* Most [Telerik Document Processing](slug://dpl-in-blazor) NuGet packages depend on `Telerik.Documents.Core`, which also depends on `Telerik.Zip`.
 
 Telerik UI for Blazor and Telerik Document Processing use different release cycles. As a result, the latest version of Telerik UI for Blazor may not be compatible with the latest version of Telerik Document Processing.
 
@@ -61,7 +61,7 @@ Telerik UI for Blazor and Telerik Document Processing use different release cycl
 
 There are several ways to fix the NuGet conflict errors:
 
-* [Upgrade Telerik UI for Blazor]({%slug upgrade-tutorial%}), if a [newer version is available](https://www.telerik.com/support/whats-new/blazor-ui/release-history).
+* [Upgrade Telerik UI for Blazor](slug://upgrade-tutorial), if a [newer version is available](https://www.telerik.com/support/whats-new/blazor-ui/release-history).
 * Downgrade Telerik Document Processing to the older version that `Telerik.UI.for.Blazor` expects for `Telerik.Zip`.
 * [Reference the newer version of `Telerik.Zip` explicitly in the project.](#reference-the-telerik-zip-package-explicitly)
 * [Reference the newer version of `Telerik.Documents.SpreadsheetStreaming` explicitly in the project.](#reference-the-telerik-documents-spreadsheetstreaming-package-explicitly)
@@ -120,4 +120,4 @@ Register the newer `Telerik.Documents.SpreadsheetStreaming` NuGet package versio
 
 ## See Also
 
-* [Telerik Document Processing Libraries Overview]({%slug dpl-in-blazor%})
+* [Telerik Document Processing Libraries Overview](slug://dpl-in-blazor)
diff --git a/knowledge-base/drawer-add-expand-collapse-handle.md b/knowledge-base/drawer-add-expand-collapse-handle.md
index e4cf306aa2..67042d520e 100644
--- a/knowledge-base/drawer-add-expand-collapse-handle.md
+++ b/knowledge-base/drawer-add-expand-collapse-handle.md
@@ -105,5 +105,5 @@ To achieve the desired result you can try the following:
 
 ## See Also
 
-* [CSS Isolation does not work for Telerik components]({%slug common-kb-css-isolation%})
-* [Override Theme Styles]({%slug themes-override%})
+* [CSS Isolation does not work for Telerik components](slug://common-kb-css-isolation)
+* [Override Theme Styles](slug://themes-override)
diff --git a/knowledge-base/drawer-add-tooltip.md b/knowledge-base/drawer-add-tooltip.md
index 9c3b450f3f..d89d3f1416 100644
--- a/knowledge-base/drawer-add-tooltip.md
+++ b/knowledge-base/drawer-add-tooltip.md
@@ -23,15 +23,15 @@ res_type: kb
 
 ## Description
 
-I would like to add [Tooltips]({%slug tooltip-overview%}) to the [Drawer's]({%slug drawer-overview%}) navigation icons.
+I would like to add [Tooltips](slug://tooltip-overview) to the [Drawer's](slug://drawer-overview) navigation icons.
 
 ## Solution
 
-To add a tooltip to the drawer navigation icons you have to use the [ItemTemplate]({%slug drawer-templates%}#itemtemplate) to set a `title` attribute to the desired element (like the `span` that contains the icon).
+To add a tooltip to the drawer navigation icons you have to use the [ItemTemplate](slug://drawer-templates#itemtemplate) to set a `title` attribute to the desired element (like the `span` that contains the icon).
 
 If using a [TelerikTooltip](https://demos.telerik.com/blazor-ui/tooltip/overview), add a suitable CSS selector, which targets the span with the icon, to the `TargetSelector` parameter of the component.
 
-When using an `ItemTemplate`, the Drawer can still [navigate automatically if the `UrlField` parameter is set, or if the Drawer data items have a populated `Url` property]({%slug drawer-navigation%}).
+When using an `ItemTemplate`, the Drawer can still [navigate automatically if the `UrlField` parameter is set, or if the Drawer data items have a populated `Url` property](slug://drawer-navigation).
 
 >caption Add a tooltip to the Drawer navigation icons
 
diff --git a/knowledge-base/drawer-chart-refresh.md b/knowledge-base/drawer-chart-refresh.md
index 20191503bc..eba0009893 100644
--- a/knowledge-base/drawer-chart-refresh.md
+++ b/knowledge-base/drawer-chart-refresh.md
@@ -29,8 +29,8 @@ This knowledge base article answers the following questions:
 
 ## Solution
 
-1. To indicate when the Chart requires a refresh, create a bool flag and set it within the Drawer's [`ExpandedChanged`]({%slug drawer-events%}#expandedchanged) handler.
-2. Call the Chart's [`Refresh()` method]({%slug components/chart/overview%}#chart-reference-and-methods) within the `OnAfterRenderAsync` lifecycle method. Set a brief delay to allow the Drawer to finish expanding before the refresh.
+1. To indicate when the Chart requires a refresh, create a bool flag and set it within the Drawer's [`ExpandedChanged`](slug://drawer-events#expandedchanged) handler.
+2. Call the Chart's [`Refresh()` method](slug://components/chart/overview#chart-reference-and-methods) within the `OnAfterRenderAsync` lifecycle method. Set a brief delay to allow the Drawer to finish expanding before the refresh.
 
 ````RAZOR
 <TelerikButton OnClick="@(() => DrawerRef.ToggleAsync())" Icon="@SvgIcon.Menu">Toggle Drawer</TelerikButton>
@@ -148,6 +148,6 @@ This knowledge base article answers the following questions:
 
 ## See Also
 
-* [Drawer Events]({%slug drawer-events%})
-* [Charts Overview]({%slug components/chart/overview%})
-* [Prevent Drawer from collapsing on item click]({%slug drawer-kb-prevent-collapse%})
\ No newline at end of file
+* [Drawer Events](slug://drawer-events)
+* [Charts Overview](slug://components/chart/overview)
+* [Prevent Drawer from collapsing on item click](slug://drawer-kb-prevent-collapse)
\ No newline at end of file
diff --git a/knowledge-base/drawer-click-in-dropdown-closes-drawer.md b/knowledge-base/drawer-click-in-dropdown-closes-drawer.md
index 358e52eede..e6e5a6447e 100644
--- a/knowledge-base/drawer-click-in-dropdown-closes-drawer.md
+++ b/knowledge-base/drawer-click-in-dropdown-closes-drawer.md
@@ -42,9 +42,9 @@ How I can prevent this? How to keep the Drawer open when selecting items in the
 
 ## Possible Cause
 
-By design, the popup elements of our components are not rendered in their place of declaration but at root level in the Razor component tree. Thus, when you are using a [DropDownList]({%slug components/dropdownlist/overview%}), for example, its popup is not technically part of the DropDownList component, it is rendered outside of it.
+By design, the popup elements of our components are not rendered in their place of declaration but at root level in the Razor component tree. Thus, when you are using a [DropDownList](slug://components/dropdownlist/overview), for example, its popup is not technically part of the DropDownList component, it is rendered outside of it.
 
-As the popup of the DropDownList is rendered at root level, it is practically outside of the Drawer as well. So, when you click on an item in the dropdown, you are basically clicking outside of the Drawer. By design in [Overlay mode]({%slug drawer-modes%}#overlay-mode), clicking outside of the Drawer container is expected to close the Drawer.
+As the popup of the DropDownList is rendered at root level, it is practically outside of the Drawer as well. So, when you click on an item in the dropdown, you are basically clicking outside of the Drawer. By design in [Overlay mode](slug://drawer-modes#overlay-mode), clicking outside of the Drawer container is expected to close the Drawer.
 
 You can verify this yourself using your dev tools to inspect the rendering. You can also test selecting an item from the DropDownList with keyboard navigation only (no click in the popup) - as a result, the Drawer will remain opened as you haven't clicked outside of it, in the DropDownList popup. The same behavior can be observed if you scroll without a click in the scrollbar.
 
@@ -61,7 +61,7 @@ You may try the Push mode of the Drawer. When this mode is enabled, clicking out
 
 This mode, however, introduces different appearance and positioning of the Drawer compared to the Overlay mode. If you'd like to keep the styles of the Overlay mode but prevent the Drawer from closing on click in the popup, try the following:
 
-* Select the [Push mode]({%slug drawer-modes%}#push-mode).
+* Select the [Push mode](slug://drawer-modes#push-mode).
 * Customize the Drawer to incorporate the styles of the Overlay mode.
 
 The example below demonstrates the described approach. In this case, the Drawer will not close when you click outside of it, so you may consider some UI option for that. In the sample below, the Drawer contains a close button, for instance.
@@ -136,8 +136,8 @@ The example below demonstrates the described approach. In this case, the Drawer
 
 ### Use AnimationContainer component 
 
-The [AnimationContainer]({%slug components/animationcontainer/overview%}) allows you to create similar expandable container. You can toggle its visibility through the ShowAsync() and HideAsync() methods. In addition, you can control the size and animation type of the container. If needed, you can copy the styles of an Overlay Drawer to achieve the same look. 
+The [AnimationContainer](slug://components/animationcontainer/overview) allows you to create similar expandable container. You can toggle its visibility through the ShowAsync() and HideAsync() methods. In addition, you can control the size and animation type of the container. If needed, you can copy the styles of an Overlay Drawer to achieve the same look. 
 
 ## See Also
 
-* [Prevent Drawer from collapsing on item click]({%slug drawer-kb-prevent-collapse%})
+* [Prevent Drawer from collapsing on item click](slug://drawer-kb-prevent-collapse)
diff --git a/knowledge-base/drawer-prevent-collapse.md b/knowledge-base/drawer-prevent-collapse.md
index 9981e6822c..19850a1af7 100644
--- a/knowledge-base/drawer-prevent-collapse.md
+++ b/knowledge-base/drawer-prevent-collapse.md
@@ -27,7 +27,7 @@ I would like to prevent the Drawer from collapsing when an item from the navigat
 
 ## Solution
 
-1. Use the [Template]({%slug drawer-templates%}#template) to take control over the rendering of the entire component. The Drawer renders as `ul` with `li` elements for the individual items.
+1. Use the [Template](slug://drawer-templates#template) to take control over the rendering of the entire component. The Drawer renders as `ul` with `li` elements for the individual items.
 2. In order to stop the component from collapsing on item click you need to add the `@onclick:stopPropagation` to the `<li>` tag.
 
 >caption Stop the Drawer from collapsing on item click
@@ -106,4 +106,4 @@ I would like to prevent the Drawer from collapsing when an item from the navigat
 
 ## See Also
 
-* [Click in dropdown closes the Drawer]({%slug drawer-kb-click-in-dropdown-closes-drawer%})
+* [Click in dropdown closes the Drawer](slug://drawer-kb-click-in-dropdown-closes-drawer)
diff --git a/knowledge-base/drawer-small-screen.md b/knowledge-base/drawer-small-screen.md
index ff159ee91f..972692929b 100644
--- a/knowledge-base/drawer-small-screen.md
+++ b/knowledge-base/drawer-small-screen.md
@@ -23,13 +23,13 @@ res_type: kb
 
 ## Description
 
-I would like to put the Drawer in [MiniMode]({%slug drawer-mini-mode%}) on small screens. This behavior would be great for mobile devices. 
+I would like to put the Drawer in [MiniMode](slug://drawer-mini-mode) on small screens. This behavior would be great for mobile devices. 
 
 
 ## Solution
 
-1. The Blazor application has to be aware of the current browser width. One way to achieve this is to use the [TelerikMediaQuery component]({%slug mediaquery-overview%}).
-2. Use the MediaQuery `[OnChange event]({%slug mediaquery-events%})` to put the Drawer in MiniMode.
+1. The Blazor application has to be aware of the current browser width. One way to achieve this is to use the [TelerikMediaQuery component](slug://mediaquery-overview).
+2. Use the MediaQuery `[OnChange event](slug://mediaquery-events)` to put the Drawer in MiniMode.
 
 >caption Put the Drawer in MiniMode on small screens
 
diff --git a/knowledge-base/dropdown-all-items-are-selected.md b/knowledge-base/dropdown-all-items-are-selected.md
index e5774d7b02..06e5f93f17 100644
--- a/knowledge-base/dropdown-all-items-are-selected.md
+++ b/knowledge-base/dropdown-all-items-are-selected.md
@@ -169,5 +169,5 @@ The test page below demonstrates several incorrect and correct configurations fo
 
 # See Also
 
-* [ComboBox data binding to model]({%slug components/combobox/databind%}#bind-to-a-model)
-* [DropDownList data binding to model]({%slug components/dropdownlist/databind%}#bind-to-a-model)
+* [ComboBox data binding to model](slug://components/combobox/databind#bind-to-a-model)
+* [DropDownList data binding to model](slug://components/dropdownlist/databind#bind-to-a-model)
diff --git a/knowledge-base/dropdownlist-change-icon-when-popup-opened.md b/knowledge-base/dropdownlist-change-icon-when-popup-opened.md
index 64c4ae230d..5ec2fcd76d 100644
--- a/knowledge-base/dropdownlist-change-icon-when-popup-opened.md
+++ b/knowledge-base/dropdownlist-change-icon-when-popup-opened.md
@@ -29,12 +29,12 @@ Specifically, I want the icon to point up when the dropdown is expanded and to p
 
 To change the DropDownList icon when the popup is opened, follow these steps:
 
-1. Handle the [`OnOpen`]({%slug components/dropdownlist/events%}#onopen) and [`OnClose`]({%slug components/dropdownlist/events%}#onclose) events of the DropDownList component.
+1. Handle the [`OnOpen`](slug://components/dropdownlist/events#onopen) and [`OnClose`](slug://components/dropdownlist/events#onclose) events of the DropDownList component.
 2. Declare a flag to save the opened or closed state of the popup.
 3. Toggle the flag value in the `OnOpen` and `OnClose` event handlers.
 4. Use CSS to change the icon based on the flag value. Conditionally add a `<style>` tag to achieve this.
    - All components, including the DropDownList, use SVG icons. To change the icon, you can alter the `path` of the `<svg>` element.
-   - To get the path of the [desired icon](https://www.telerik.com/design-system/docs/foundation/iconography/icon-list), render an [`SvgIcon`]({%slug common-features-icons%}#svgicon-component) component, inspect it, and copy its path.
+   - To get the path of the [desired icon](https://www.telerik.com/design-system/docs/foundation/iconography/icon-list), render an [`SvgIcon`](slug://common-features-icons#svgicon-component) component, inspect it, and copy its path.
 
 >caption Change the DropDownList icon when expanded
 
diff --git a/knowledge-base/dropdownlist-custom-sorting-order-groups.md b/knowledge-base/dropdownlist-custom-sorting-order-groups.md
index c30585db89..57bf082f9b 100644
--- a/knowledge-base/dropdownlist-custom-sorting-order-groups.md
+++ b/knowledge-base/dropdownlist-custom-sorting-order-groups.md
@@ -22,16 +22,16 @@ ticketid: 1666981, 1579415
 
 ## Description
 
-I am using the [grouping feature of the DropDownList]({%slug components/dropdownlist/grouping%}). My DropDownList model has a nested model as property. The DropDownList `GroupField` parameter is bound to a property of the nested model. I want the groups to appear in a non-alphabetical, custom order. I can see that there is a feature request to add a <a href="https://feedback.telerik.com/blazor/1565506-sort-direction-parameter-for-grouping" target="_blank">sort direction option when grouping</a>. But in the meantime how can I customize the grouping order in the DropDownList?
+I am using the [grouping feature of the DropDownList](slug://components/dropdownlist/grouping). My DropDownList model has a nested model as property. The DropDownList `GroupField` parameter is bound to a property of the nested model. I want the groups to appear in a non-alphabetical, custom order. I can see that there is a feature request to add a <a href="https://feedback.telerik.com/blazor/1565506-sort-direction-parameter-for-grouping" target="_blank">sort direction option when grouping</a>. But in the meantime how can I customize the grouping order in the DropDownList?
 
 ## Solution
 
-To sort the groups in a DropDownList by a custom order, perform a manual sorting operation in the [`OnRead` event]({%slug components/dropdownlist/events%}#onread) handler. Follow these steps:
+To sort the groups in a DropDownList by a custom order, perform a manual sorting operation in the [`OnRead` event](slug://components/dropdownlist/events#onread) handler. Follow these steps:
 
 1. Create a list of strings that represents the values of the group headers. This list will determine the preferred sorting order.
-2. Cast the [`DataSourceResult`]({%slug common-features-data-binding-onread%}#event-argument) to [`AggregateFunctionsGroup`](/blazor-ui/api/Telerik.DataSource.AggregateFunctionsGroup).
+2. Cast the [`DataSourceResult`](slug://common-features-data-binding-onread#event-argument) to [`AggregateFunctionsGroup`](/blazor-ui/api/Telerik.DataSource.AggregateFunctionsGroup).
 3. Sort the casted data using the <a href="https://learn.microsoft.com/en-us/dotnet/api/system.collections.generic.list-1.sort?view=net-8.0" target="_blank">`Sort` method</a> with a custom comparison function.
-4. Pass the sorted data as [`args.Data`]({%slug common-features-data-binding-onread%}#todatasourceresult-method).
+4. Pass the sorted data as [`args.Data`](slug://common-features-data-binding-onread#todatasourceresult-method).
 
 >caption Apply a custom grouping order in the DropDownList
 ````RAZOR
@@ -106,7 +106,7 @@ To sort the groups in a DropDownList by a custom order, perform a manual sorting
 
 ## See Also
 
-- [Telerik DropDownList for Blazor - Overview]({%slug components/dropdownlist/overview%})
-- [OnRead Event in Telerik DropDownList]({%slug components/dropdownlist/events%}#onread)
-- [Grouping in Telerik DropDownList]({%slug components/dropdownlist/grouping%})
-- [Custom Grouping Order in Grid]({%slug grid-custom-grouping-order%})
+- [Telerik DropDownList for Blazor - Overview](slug://components/dropdownlist/overview)
+- [OnRead Event in Telerik DropDownList](slug://components/dropdownlist/events#onread)
+- [Grouping in Telerik DropDownList](slug://components/dropdownlist/grouping)
+- [Custom Grouping Order in Grid](slug://grid-custom-grouping-order)
diff --git a/knowledge-base/dropdownlist-kb-nodatatext.md b/knowledge-base/dropdownlist-kb-nodatatext.md
index edba1992a5..7e7d22e470 100644
--- a/knowledge-base/dropdownlist-kb-nodatatext.md
+++ b/knowledge-base/dropdownlist-kb-nodatatext.md
@@ -33,7 +33,7 @@ The default `min-height` of the `.k-nodata` class is `140px`. The default `heigh
 
 ## Solution
 
-You need to change the default minimum height of the popup element. The DropDownList [popup setting `Class`]({%slug components/dropdownlist/overview%}#popup-settings) lets you define a CSS class. The defined rules from the CSS will change the appearance and properties of the popup element. With the CSS rule `min-height: auto` the popup element's height is flexible and adjusts dynamically based on its content.
+You need to change the default minimum height of the popup element. The DropDownList [popup setting `Class`](slug://components/dropdownlist/overview#popup-settings) lets you define a CSS class. The defined rules from the CSS will change the appearance and properties of the popup element. With the CSS rule `min-height: auto` the popup element's height is flexible and adjusts dynamically based on its content.
 
 >caption Use a Class to set the min-height of the .k-nodata class to auto.
 
@@ -129,4 +129,4 @@ You need to change the default minimum height of the popup element. The DropDown
 
 ## See Also
 
-[Override Theme Styles]({%slug themes-override%})
+[Override Theme Styles](slug://themes-override)
diff --git a/knowledge-base/dropdowns-custom-item-background.md b/knowledge-base/dropdowns-custom-item-background.md
index 723112192e..eab4e72055 100644
--- a/knowledge-base/dropdowns-custom-item-background.md
+++ b/knowledge-base/dropdowns-custom-item-background.md
@@ -33,9 +33,9 @@ How to change the background color of individual items in the ComboBox or DropDo
 
 ## Solution
 
-It is possible to apply a custom background color to each item inside the ComboBox/DropDownList dropdown. To achieve that, use an [**ItemTemplate**]({%slug components/dropdownlist/templates%}). The same customization is possible for the AutoComplete and MultiSelect.
+It is possible to apply a custom background color to each item inside the ComboBox/DropDownList dropdown. To achieve that, use an [**ItemTemplate**](slug://components/dropdownlist/templates). The same customization is possible for the AutoComplete and MultiSelect.
 
-On the other hand, to apply a custom background color to the value inside the component, use a [**ValueTemplate**]({%slug components/dropdownlist/templates%}). This customization is supported for the DropDownList only.
+On the other hand, to apply a custom background color to the value inside the component, use a [**ValueTemplate**](slug://components/dropdownlist/templates). This customization is supported for the DropDownList only.
 
 Here are some additional notes to keep in mind, and an example.
 
diff --git a/knowledge-base/dropdowns-get-model.md b/knowledge-base/dropdowns-get-model.md
index 757166c61b..31c6eee997 100644
--- a/knowledge-base/dropdowns-get-model.md
+++ b/knowledge-base/dropdowns-get-model.md
@@ -27,7 +27,7 @@ I want to get an instance of my model when I select an item from a dropdown (suc
 
 ## Description
 
-All Telerik UI for Blazor dropdown components support a string and [built-in value-type](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/value-types) `Value` so that [validation]({%slug common-features/input-validation%}) and filtering can work. The Value and Text cannot be classes (models) because that would prevent validation from working and filtering/comparing entire classes is an operation that is not defined.
+All Telerik UI for Blazor dropdown components support a string and [built-in value-type](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/value-types) `Value` so that [validation](slug://common-features/input-validation) and filtering can work. The Value and Text cannot be classes (models) because that would prevent validation from working and filtering/comparing entire classes is an operation that is not defined.
 
 ## Solution
 
diff --git a/knowledge-base/dropdowns-readonly-struct-error.md b/knowledge-base/dropdowns-readonly-struct-error.md
index c7942dabf0..13b2f1586d 100644
--- a/knowledge-base/dropdowns-readonly-struct-error.md
+++ b/knowledge-base/dropdowns-readonly-struct-error.md
@@ -67,7 +67,7 @@ The components require a model when binding so it can be instantiated with a par
 ## Solution
 There are two approaches to avoiding this error:
 
-* Use a model (class), not a struct, as shown [here]({%slug components/combobox/databind%}#bind-to-a-model), for example
+* Use a model (class), not a struct, as shown [here](slug://components/combobox/databind#bind-to-a-model), for example
 
 * When setting the `Data` of the dropdown, make it a collection of anonymous objects, for example:
 
diff --git a/knowledge-base/dropdowns-search-in-multiple-fields.md b/knowledge-base/dropdowns-search-in-multiple-fields.md
index 0080400752..9faddd8872 100644
--- a/knowledge-base/dropdowns-search-in-multiple-fields.md
+++ b/knowledge-base/dropdowns-search-in-multiple-fields.md
@@ -33,7 +33,7 @@ My dropdown data model has one numeric property in `ValueField` and two string p
 
 ## Solution
 
-* [Bind the component with the `OnRead` event]({%slug common-features-data-binding-onread%}). This will allow programmatic changes to the data request filter.
+* [Bind the component with the `OnRead` event](slug://common-features-data-binding-onread). This will allow programmatic changes to the data request filter.
 * Create a new [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) object in the `OnRead` handler. Set its `Filters` collection to include one [`CompositeFilterDescriptor`](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor) instead of the default [`FilterDescriptor`](/blazor-ui/api/Telerik.DataSource.FilterDescriptor) (see note below).
 * The `CompositeFilterDescriptor` object should have its `LogicalOperator` set to `FilterCompositionLogicalOperator.Or` (unless you want **all** searchable fields to contain the search string).
 * The `CompositeFilterDescriptor` object should have its `FilterDescriptors` collection contain one `FilterDescriptor` for each searchable field in the data.
diff --git a/knowledge-base/editor-add-icons.md b/knowledge-base/editor-add-icons.md
index 1bfc361140..981e0ef03f 100644
--- a/knowledge-base/editor-add-icons.md
+++ b/knowledge-base/editor-add-icons.md
@@ -32,15 +32,15 @@ This KB article answers the following questions:
 
 The default schema of the Telerik Editor does not include an `<i>` tag, so the Editor strips such elements automatically. To allow adding font icons through `<i>` tags in the Editor content:
 
-1. [Modify the ProseMirror schema]({%slug editor-modify-default-schema%}) to include a node for the `<i>` element.
-2. Ensure the required font icon stylesheets can affect the Editor content. The approach varies depending on the [edit mode of the Editor]({%slug editor-edit-modes-overview%}):
+1. [Modify the ProseMirror schema](slug://editor-modify-default-schema) to include a node for the `<i>` element.
+2. Ensure the required font icon stylesheets can affect the Editor content. The approach varies depending on the [edit mode of the Editor](slug://editor-edit-modes-overview):
     * [Iframe Edit Mode](#add-icons-in-iframe-edit-mode)
     * [Div Edit Mode](#add-icons-in-div-edit-mode)
 
 
 ### Add Icons in Iframe Edit Mode
 
-When the [Editor `EditMode` is set to `EditorEditMode.Iframe`]({%slug editor-edit-modes-iframe%}), the content area is inside an `<iframe>` element that does not apply the CSS rules from the current page.
+When the [Editor `EditMode` is set to `EditorEditMode.Iframe`](slug://editor-edit-modes-iframe), the content area is inside an `<iframe>` element that does not apply the CSS rules from the current page.
 
 This means that you need to inject the icons stylesheet into the `<iframe>`, so the icons are properly rendered. At the time of writing (UI for Blazor **6.1.0**), [the Editor does not support injecting your CSS files into the iframe](https://feedback.telerik.com/blazor/1543925-add-the-ability-to-inject-css-files-into-the-iframe) but you can inject them with JSInterop in `OnAfterRenderAsync`.
 
@@ -133,7 +133,7 @@ This means that you need to inject the icons stylesheet into the `<iframe>`, so
 
 ### Add Icons in Div Edit Mode
 
-When the [Editor `EditMode` is set to `EditorEditMode.Div`]({%slug editor-edit-modes-div%}), the content area is a `<div contenteditable="true">` element that inherits the CSS rules from the current page.
+When the [Editor `EditMode` is set to `EditorEditMode.Div`](slug://editor-edit-modes-div), the content area is a `<div contenteditable="true">` element that inherits the CSS rules from the current page.
 
 This allows you to include the icon stylesheets in the `<head>` of the web page along with the other stylesheets. 
 
@@ -206,5 +206,5 @@ Make sure to use the correct way and resources for your actual project *@
 
 ## See Also
 
-* [Custom Editor Tools]({%slug editor-custom-tools%})
-* [Modify the ProseMirror Schema]({%slug editor-modify-default-schema%})
+* [Custom Editor Tools](slug://editor-custom-tools)
+* [Modify the ProseMirror Schema](slug://editor-modify-default-schema)
diff --git a/knowledge-base/editor-add-text-templates.md b/knowledge-base/editor-add-text-templates.md
index e2adf4bd8e..cb6fc6acd4 100644
--- a/knowledge-base/editor-add-text-templates.md
+++ b/knowledge-base/editor-add-text-templates.md
@@ -31,11 +31,11 @@ I want to have a tool that prefills various templates in the Editor. How to achi
 
 Create a custom tool that programmatically changes the Editor value (inserts the desired templated text in the Editor).
 
-1. [Create a custom tool]({%slug editor-custom-tools%}). If you want to include more than one template option, consider a [DropDownList]({%slug components/dropdownlist/overview%}), as per the example below. Thus, users will be able to easily select one of the suggested templates.
+1. [Create a custom tool](slug://editor-custom-tools). If you want to include more than one template option, consider a [DropDownList](slug://components/dropdownlist/overview), as per the example below. Thus, users will be able to easily select one of the suggested templates.
 
-1. Provide a [collection of your templates to the `Data` parameter of the DropDownList]({%slug components/dropdownlist/databind%}). The example below shows how you can use a complex model for the templates. The DropDownList only uses an `Id` and `Title` to show the available templates to the user. Once the user selects the desired template, you may retrieve its content from the database, for example. The key part is that the content of the template should be provided to the Editor as `string`, so the component can render it.
+1. Provide a [collection of your templates to the `Data` parameter of the DropDownList](slug://components/dropdownlist/databind). The example below shows how you can use a complex model for the templates. The DropDownList only uses an `Id` and `Title` to show the available templates to the user. Once the user selects the desired template, you may retrieve its content from the database, for example. The key part is that the content of the template should be provided to the Editor as `string`, so the component can render it.
 
-1. Handle the [`ValueChanged`]({%slug components/dropdownlist/events%}#valuechanged) event of the DropDownList to get the template value and update the Editor value. In the example below, the selected value is deliberately not updated in the viewport, so it is not shown in the main element in the DropDownList - this allows the user to select the same template more than once. You may add the template value to the Editor or replace the whole content depending on the exact desired result. You may also control the position at which the template will be inserted.
+1. Handle the [`ValueChanged`](slug://components/dropdownlist/events#valuechanged) event of the DropDownList to get the template value and update the Editor value. In the example below, the selected value is deliberately not updated in the viewport, so it is not shown in the main element in the DropDownList - this allows the user to select the same template more than once. You may add the template value to the Editor or replace the whole content depending on the exact desired result. You may also control the position at which the template will be inserted.
 
 ````RAZOR
 @using Telerik.Blazor.Components.Editor
diff --git a/knowledge-base/editor-convert-to-plain-text.md b/knowledge-base/editor-convert-to-plain-text.md
index c594cd0141..e211cbd495 100644
--- a/knowledge-base/editor-convert-to-plain-text.md
+++ b/knowledge-base/editor-convert-to-plain-text.md
@@ -27,11 +27,11 @@ How to convert the HTML string value of the Editor and retrieve it as plain text
 
 ## Solution
 
-The HTML value of the Editor can be [converted to plain text and other formats]({%slug editor-import-export%}) with our [Document Processing library]({%slug dpl-in-blazor%}).
+The HTML value of the Editor can be [converted to plain text and other formats](slug://editor-import-export) with our [Document Processing library](slug://dpl-in-blazor).
 
 Here are the required steps:
 
-1. Add the [`Telerik.Documents.Core` and `Telerik.Documents.Flow`]({%slug dpl-in-blazor%}) NuGet packages to your project.
+1. Add the [`Telerik.Documents.Core` and `Telerik.Documents.Flow`](slug://dpl-in-blazor) NuGet packages to your project.
 1. Import the required namespaces:
     * `Telerik.Windows.Documents.Flow.FormatProviders.Html`
     * `Telerik.Windows.Documents.Flow.FormatProviders.Txt`
@@ -85,4 +85,4 @@ To export to another format, use the corresponding namespace and format provider
 
 ## See Also 
 
-  * [Configuring Document Processing Libraries]({%slug getting-started-vs-integration-dpl%})
+  * [Configuring Document Processing Libraries](slug://getting-started-vs-integration-dpl)
diff --git a/knowledge-base/editor-copy-paste.md b/knowledge-base/editor-copy-paste.md
index 8e1d41d40e..1d67069340 100644
--- a/knowledge-base/editor-copy-paste.md
+++ b/knowledge-base/editor-copy-paste.md
@@ -31,16 +31,16 @@ How can I copy and paste in the Editor component programmatically?
 
 To programmatically copy from the Editor:
 
-1. Use a [custom Editor tool]({%slug editor-custom-tools%}) that relies on plain HTML and completely client-side event handling. Do not use `@onclick` directives or Razor component events.
+1. Use a [custom Editor tool](slug://editor-custom-tools) that relies on plain HTML and completely client-side event handling. Do not use `@onclick` directives or Razor component events.
 1. On tool click (pure JavaScript event), [obtain the window selection](https://developer.mozilla.org/en-US/docs/Web/API/Window/getSelection).
 1. Use the [`write()`](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/write) method of the browser [`Clipboard`](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard).
 
 To programmatically paste in the Editor:
 
-1. Use a [custom Editor tool]({%slug editor-custom-tools%}) that relies on plain HTML and completely client-side event handling. Do not use `@onclick` directives or Razor component events.
+1. Use a [custom Editor tool](slug://editor-custom-tools) that relies on plain HTML and completely client-side event handling. Do not use `@onclick` directives or Razor component events.
 1. On tool click (pure JavaScript event), use the [`read()`](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/read) method of the browser Clipboard.
 1. Pass the clipboard content to the [.NET runtime with `JSInterop`](https://learn.microsoft.com/en-us/aspnet/core/blazor/javascript-interoperability/call-dotnet-from-javascript).
-1. Use the [`insertHtml` Editor command]({%slug editor-built-in-tools%}#commands-without-built-in-tools). For more information, see the section on [programmatic execution]({%slug editor-built-in-tools%}#programmatic-execution) and analyze if you will be pasting block content or inline content.
+1. Use the [`insertHtml` Editor command](slug://editor-built-in-tools#commands-without-built-in-tools). For more information, see the section on [programmatic execution](slug://editor-built-in-tools#programmatic-execution) and analyze if you will be pasting block content or inline content.
 
 >caption Programmatic copy and paste in the Telerik UI for Blazor Editor
 
@@ -213,5 +213,5 @@ To programmatically paste in the Editor:
 
 # See Also
 
-* [Built-in Editor Tools]({%slug editor-built-in-tools%})
-* [Custom Editor Tools]({%slug editor-custom-tools%})
+* [Built-in Editor Tools](slug://editor-built-in-tools)
+* [Custom Editor Tools](slug://editor-custom-tools)
diff --git a/knowledge-base/editor-default-font.md b/knowledge-base/editor-default-font.md
index dc176b096a..55e2eba4d5 100644
--- a/knowledge-base/editor-default-font.md
+++ b/knowledge-base/editor-default-font.md
@@ -28,7 +28,7 @@ I would like to set a default font typeface to the Editor.
 
 ## Solutions
 
-The default font typeface of the content area of the Editor is based on the default font of the browser it is run under. When you are using the Editor in [Div]({%slug editor-edit-modes-div%}) edit mode you can use CSS rules to define the default font-family for the content area of the component. The control exposes a `Class` parameter that takes a custom CSS class which can be used to cascade the required styles. 
+The default font typeface of the content area of the Editor is based on the default font of the browser it is run under. When you are using the Editor in [Div](slug://editor-edit-modes-div) edit mode you can use CSS rules to define the default font-family for the content area of the component. The control exposes a `Class` parameter that takes a custom CSS class which can be used to cascade the required styles. 
 
 >caption Set a default font family for the content area of the Editor in Div edit mode
 
diff --git a/knowledge-base/editor-get-selection.md b/knowledge-base/editor-get-selection.md
index 7271bc53d6..17dc0e0bcb 100644
--- a/knowledge-base/editor-get-selection.md
+++ b/knowledge-base/editor-get-selection.md
@@ -29,7 +29,7 @@ I would like to get the content of the Editor selected (highlighted) by the user
 
 In order to receive or modify the selected (highlighted) content of the Editor, you need to use JavaScript. The `selection` object is inherently JavaScript-based because HTML editing is based on the rich text editing engine of the browser, and so it has no .NET counterpart.
 
-Since the Editor has two different edit modes - [Div]({%slug editor-edit-modes-div%}) and [Iframe]({%slug editor-edit-modes-iframe%}), the examples below will showcase how to get the selected text for both of them. 
+Since the Editor has two different edit modes - [Div](slug://editor-edit-modes-div) and [Iframe](slug://editor-edit-modes-iframe), the examples below will showcase how to get the selected text for both of them. 
 
 ## Examples
 
@@ -45,7 +45,7 @@ At this point, you can apply changes to it with JavaScript.
 If you want to use it on the .NET (Blazor) side, you need to:
 
 1. Serialize the selection to a string so .NET can understand it, by using the `toString()` method.
-1. Call a JavaScript function from a [Custom Tool]({%slug editor-custom-tools%}) in the Editor that will return that selection.
+1. Call a JavaScript function from a [Custom Tool](slug://editor-custom-tools) in the Editor that will return that selection.
 
 <div class="skip-repl"></div>
 ````RAZOR Component
@@ -104,7 +104,7 @@ At this point, you can apply changes to it with JavaScript.
 If you want to use it on the .NET (Blazor) side, you need to:
 
 1. Serialize the selection to a string so .NET can understand it, by using the `toString()` method.
-1. Call a JavaScript function from a [Custom Tool]({%slug editor-custom-tools%}) in the Editor that will return that selection.
+1. Call a JavaScript function from a [Custom Tool](slug://editor-custom-tools) in the Editor that will return that selection.
 
 <div class="skip-repl"></div>
 ````RAZOR Component
diff --git a/knowledge-base/editor-missing-br-in-value.md b/knowledge-base/editor-missing-br-in-value.md
index d3c2f28d29..ad356ead1b 100644
--- a/knowledge-base/editor-missing-br-in-value.md
+++ b/knowledge-base/editor-missing-br-in-value.md
@@ -101,4 +101,4 @@ Note that the Editor uses the [ProseMirror engine](https://prosemirror.net). By
 
 ## See Also
 
-* [Editor Paste Cleanup]({%slug editor-paste-cleanup%})
+* [Editor Paste Cleanup](slug://editor-paste-cleanup)
diff --git a/knowledge-base/editor-new-line-break.md b/knowledge-base/editor-new-line-break.md
index 00885fd132..c6edbe78bf 100644
--- a/knowledge-base/editor-new-line-break.md
+++ b/knowledge-base/editor-new-line-break.md
@@ -41,7 +41,7 @@ Here is some more context.
 
 The Telerik Blazor Editor uses the [**ProseMirror engine**](https://prosemirror.net). The [Enter] behavior depends on the engine.
 
-The Editor can render `<br />` tags instead of `<p>` tags if you [use a ProseMirror plugin]({%slug editor-prosemirror-plugins%}) that changes the default engine behavior.
+The Editor can render `<br />` tags instead of `<p>` tags if you [use a ProseMirror plugin](slug://editor-prosemirror-plugins) that changes the default engine behavior.
 
 ## Side Effects
 
diff --git a/knowledge-base/editor-paragraph-in-list-item.md b/knowledge-base/editor-paragraph-in-list-item.md
index 51b9d75cc0..4d327b7168 100644
--- a/knowledge-base/editor-paragraph-in-list-item.md
+++ b/knowledge-base/editor-paragraph-in-list-item.md
@@ -41,8 +41,8 @@ By default, HTML paragraphs have top and bottom margins.
 Here are the possible workarounds to remove extra empty space between list items:
 
 * Remove the `<p>` tags via string manipulation of the submitted Editor value.
-* Remove the paragraph margins with CSS in the app stylesheet. This is applicable when the Editor's [`EditMode`]({%slug editor-edit-modes-overview%}) is [`Div`]({%slug editor-edit-modes-div%}) and the Editor content is within the same web document as the Editor itself.
-* Remove the paragraphs margins by injecting additional CSS into the Editor's iframe. This is applicable when the Editor's `EditMode` is [`Iframe`]({%slug editor-edit-modes-iframe%}) and the Editor content is in a separate web document.
+* Remove the paragraph margins with CSS in the app stylesheet. This is applicable when the Editor's [`EditMode`](slug://editor-edit-modes-overview) is [`Div`](slug://editor-edit-modes-div) and the Editor content is within the same web document as the Editor itself.
+* Remove the paragraphs margins by injecting additional CSS into the Editor's iframe. This is applicable when the Editor's `EditMode` is [`Iframe`](slug://editor-edit-modes-iframe) and the Editor content is in a separate web document.
 
 >caption Remove empty space between list items in the Editor
 
@@ -112,4 +112,4 @@ It is possible to [hack the ProseMirror engine and disable usage of `p` inside `
 
 ## See Also
 
-* [How to render new line break in the Editor on Enter]({%slug editor-kb-new-line-break%})
+* [How to render new line break in the Editor on Enter](slug://editor-kb-new-line-break)
diff --git a/knowledge-base/editor-print-content.md b/knowledge-base/editor-print-content.md
index a525deea4e..55112ef221 100644
--- a/knowledge-base/editor-print-content.md
+++ b/knowledge-base/editor-print-content.md
@@ -33,8 +33,8 @@ Programmatic printing relies on the [JavaScript `print()` method](https://develo
 
 The example below shows three possible techniques:
 
-1. If the Editor's [`EditMode`]({%slug editor-edit-modes-overview%}) is [`Iframe`]({%slug editor-edit-modes-iframe%}), then call the `print()` method of the iframe `window` object.
-1. If `EditMode` is [`Div`]({%slug editor-edit-modes-div%}), there are two options:
+1. If the Editor's [`EditMode`](slug://editor-edit-modes-overview) is [`Iframe`](slug://editor-edit-modes-iframe), then call the `print()` method of the iframe `window` object.
+1. If `EditMode` is [`Div`](slug://editor-edit-modes-div), there are two options:
     * Call the `print()` method of the current page's `window` object. Use [CSS `@media` query](https://developer.mozilla.org/en-US/docs/Web/CSS/@media) to implement print-only styles and hide everything outside the Editor's content area.
     * Open a new browser window with JavaScript. Inject the Editor value as content of the new window. Call the `print()` method of the new `window` object. Note that browser popups may be disabled by the user.
 
diff --git a/knowledge-base/fileselect-autofac.md b/knowledge-base/fileselect-autofac.md
index e78ccf6383..b1420a746b 100644
--- a/knowledge-base/fileselect-autofac.md
+++ b/knowledge-base/fileselect-autofac.md
@@ -81,4 +81,4 @@ builder.Services.AddHubOptions(options =>
 
 ## See Also
 
-* [FileSelect Overview]({%slug fileselect-overview%})
+* [FileSelect Overview](slug://fileselect-overview)
diff --git a/knowledge-base/fileselect-loader.md b/knowledge-base/fileselect-loader.md
index 637f306fbc..d3a86d0735 100644
--- a/knowledge-base/fileselect-loader.md
+++ b/knowledge-base/fileselect-loader.md
@@ -32,11 +32,11 @@ This KB article answers the following questions:
 
 ## Solution
 
-You can use the [`Loader`]({%slug loader-overview%}). Set the [Loader `Visible` parameter]({%slug loader-overview%}#loader-parameters) to `true` in the [FileSelect `OnSelect` event]({%slug fileselect-events%}#onselect). The Loader will display while the files are being handled, so that the app is more user-friendly.
+You can use the [`Loader`](slug://loader-overview). Set the [Loader `Visible` parameter](slug://loader-overview#loader-parameters) to `true` in the [FileSelect `OnSelect` event](slug://fileselect-events#onselect). The Loader will display while the files are being handled, so that the app is more user-friendly.
 
 When you show the Loader in a method, which is blocking the UI thread with synchronous operations, the Loader may not appear when expected. To avoid this, add a small delay, which helps Blazor refresh the UI during the `OnSelect` handler execution.
 
-Another option is to use the [`LoaderContainer`]({%slug loadercontainer-overview%}). The benefit is that it can overlay the whole page or [cover part of the page that contains the FileSelect]({%slug loadercontainer-overview%}#fill-a-parent-container).
+Another option is to use the [`LoaderContainer`](slug://loadercontainer-overview). The benefit is that it can overlay the whole page or [cover part of the page that contains the FileSelect](slug://loadercontainer-overview#fill-a-parent-container).
 
 ````RAZOR
 <TelerikLoader Visible="@LoaderVisible" />
@@ -71,5 +71,5 @@ Another option is to use the [`LoaderContainer`]({%slug loadercontainer-overview
 
 ## See Also
 
-* [FileSelect Events]({%slug fileselect-events%})
-* [Loader Overview]({%slug loader-overview%})
+* [FileSelect Events](slug://fileselect-events)
+* [Loader Overview](slug://loader-overview)
diff --git a/knowledge-base/fileselect-stream-exception.md b/knowledge-base/fileselect-stream-exception.md
index ab29f9e10b..209512c024 100644
--- a/knowledge-base/fileselect-stream-exception.md
+++ b/knowledge-base/fileselect-stream-exception.md
@@ -24,7 +24,7 @@ res_type: kb
 
 ## Description
 
-The `file.Stream` object in the [FileSelect `OnSelect` event handler]({%slug fileselect-events%}#onselect) throws a `NotImplementedException`.
+The `file.Stream` object in the [FileSelect `OnSelect` event handler](slug://fileselect-events#onselect) throws a `NotImplementedException`.
 
 The FileSelect `Stream` (`FileInfoStream`) has exposed methods that are "not implemented".
 
@@ -46,11 +46,11 @@ The same exception will occur for the following methods and properties:
 
 ## Possible Cause
 
-Due to Blazor framework limitations, [`FileInfoStream` does not support synchronous operations]({%slug fileselect-events%}#fileselectfileinfo) such as `Read`, `Seek`, `Flush` and `Write`. The methods exist, but throw an exception.
+Due to Blazor framework limitations, [`FileInfoStream` does not support synchronous operations](slug://fileselect-events#fileselectfileinfo) such as `Read`, `Seek`, `Flush` and `Write`. The methods exist, but throw an exception.
 
 ## Solution
 
-Copy the `FileInfoStream` **asynchronously** to another `Stream` via `CopyToAsync()`. Apart from the example below, also check the [FileSelect `OnSelect` event documentation]({%slug fileselect-events%}#onselect).
+Copy the `FileInfoStream` **asynchronously** to another `Stream` via `CopyToAsync()`. Apart from the example below, also check the [FileSelect `OnSelect` event documentation](slug://fileselect-events#onselect).
 
 >caption Copy the FileSelect Stream to another one and use sync methods
 
@@ -78,4 +78,4 @@ Copy the `FileInfoStream` **asynchronously** to another `Stream` via `CopyToAsyn
 
 ## See Also
 
-* [FileSelect Overview]({%slug fileselect-overview%})
+* [FileSelect Overview](slug://fileselect-overview)
diff --git a/knowledge-base/fileselect-upload-hide-file-list.md b/knowledge-base/fileselect-upload-hide-file-list.md
index 1619cc7ad4..99707a19d4 100644
--- a/knowledge-base/fileselect-upload-hide-file-list.md
+++ b/knowledge-base/fileselect-upload-hide-file-list.md
@@ -36,7 +36,7 @@ How to resize or remove the frame around the FileSelect and Upload button?
 
 ## Solution
 
-Add a custom CSS class to the FileSelect / Upload and [override the theme styles]({%slug themes-override%}).
+Add a custom CSS class to the FileSelect / Upload and [override the theme styles](slug://themes-override).
 
 1. Set the `Class` parameter. The custom class will render in the `<div class="k-upload">` element.
 1. Implement custom styles, which remove the component border, padding, file names, status icon.
diff --git a/knowledge-base/font-icons-not-rendering.md b/knowledge-base/font-icons-not-rendering.md
index d476abf05f..3da32f9ec9 100644
--- a/knowledge-base/font-icons-not-rendering.md
+++ b/knowledge-base/font-icons-not-rendering.md
@@ -44,7 +44,7 @@ To keep using Font icons in your application use one of the two approaches:
 <link href="https://blazor.cdn.telerik.com/blazor/4.6.0/kendo-font-icons/font-icons.css" rel="stylesheet" type="text/css" />
 ````
 
-* Download the [Telerik UI for Blazor package]({%slug installation/msi%}#how-to-download-the-automated-installer) and reference the static assets for the Font Icons in the `_Host.cshtml` or `index.html` (based on the hosting model) file in your application:
+* Download the [Telerik UI for Blazor package](slug://installation/msi#how-to-download-the-automated-installer) and reference the static assets for the Font Icons in the `_Host.cshtml` or `index.html` (based on the hosting model) file in your application:
 
 ````RAZOR
 <!-- For Trial licenses, use
diff --git a/knowledge-base/form-chrome-autofill.md b/knowledge-base/form-chrome-autofill.md
index 778617d6bd..f77da2f2c7 100644
--- a/knowledge-base/form-chrome-autofill.md
+++ b/knowledge-base/form-chrome-autofill.md
@@ -148,6 +148,6 @@ You can also add a standard HTML `<label>` element to have a label for your inpu
 
 ## See Also
 
-* [Label not moved from input on browser autofill in Chrome]({%slug textbox-chrome-autofill-label%})
+* [Label not moved from input on browser autofill in Chrome](slug://textbox-chrome-autofill-label)
 
-* [Empty TextBox value on Chrome autofill]({%slug textbox-kb-empty-value-on-autofill%})
+* [Empty TextBox value on Chrome autofill](slug://textbox-kb-empty-value-on-autofill)
diff --git a/knowledge-base/form-conditional-validation.md b/knowledge-base/form-conditional-validation.md
index 5abc54f6a6..f3a720132b 100644
--- a/knowledge-base/form-conditional-validation.md
+++ b/knowledge-base/form-conditional-validation.md
@@ -34,13 +34,13 @@ How to set dynamic validation for Blazor form fields? I want to update the valid
 
 ## Solution
 
-The **TelerikForm** supports any [validator that is compatible with the Blazor EditForm and EditContext]({%slug form-validation%}). There are several options to validate form values conditionally:
+The **TelerikForm** supports any [validator that is compatible with the Blazor EditForm and EditContext](slug://form-validation). There are several options to validate form values conditionally:
 
-* Use a [third-party validator that allows conditional validation]({%slug form-validation%}#fluent-validation).
-* Perform custom validation in the [Form's `OnSubmit` event]({%slug form-events%}#onsubmit).
+* Use a [third-party validator that allows conditional validation](slug://form-validation#fluent-validation).
+* Perform custom validation in the [Form's `OnSubmit` event](slug://form-events#onsubmit).
 * Implement [remote (server-side) custom validation](https://github.com/telerik/blazor-ui/tree/master/form/remote-validation).
-* Use [`FormItem` Templates]({%slug form-formitems-template%}). Subscribe to the **change** handlers of the field editors to execute custom logic, show notifications, etc.
-* Implement a [custom conditional `DataAnnotations` attribute]({%slug validation-kb-custom-dataannotations-validator%}). To see inline error messages next to the field editor, return the [`ValidationResult` overload that accepts the invalid field name(s)](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.dataannotations.validationresult). In this way the form validator will know which field has failed validation.
+* Use [`FormItem` Templates](slug://form-formitems-template). Subscribe to the **change** handlers of the field editors to execute custom logic, show notifications, etc.
+* Implement a [custom conditional `DataAnnotations` attribute](slug://validation-kb-custom-dataannotations-validator). To see inline error messages next to the field editor, return the [`ValidationResult` overload that accepts the invalid field name(s)](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.dataannotations.validationresult). In this way the form validator will know which field has failed validation.
 
     <div class="skip-repl"></div>
 
@@ -53,6 +53,6 @@ The **TelerikForm** supports any [validator that is compatible with the Blazor E
 
 ## See Also
 
-* [Custom `DataAnnotations` Validation]({%slug validation-kb-custom-dataannotations-validator%})
-* [Fluent Validation]({%slug form-validation%}#fluent-validation)
+* [Custom `DataAnnotations` Validation](slug://validation-kb-custom-dataannotations-validator)
+* [Fluent Validation](slug://form-validation#fluent-validation)
 * [Live Demo: DateRangePicker Custom DataAnnotation Attribute](https://demos.telerik.com/blazor-ui/daterangepicker/validation)
diff --git a/knowledge-base/form-focus-formitem.md b/knowledge-base/form-focus-formitem.md
index cd9a1a0dce..8af75348c2 100644
--- a/knowledge-base/form-focus-formitem.md
+++ b/knowledge-base/form-focus-formitem.md
@@ -29,7 +29,7 @@ How to set initial focus to a specific input in the `TelerikForm`?
 
 The `<FormItem>` is an abstraction of the real editor that is rendered in the browser. To set programmatic focus you must:
 
-1. Use a [`FormItem` `Template`]({%slug form-formitems-template%}) to provide the desired editor.
+1. Use a [`FormItem` `Template`](slug://form-formitems-template) to provide the desired editor.
 1. Use the `FocusAsync()` method accessible through the `@ref` of the added editor.
 
 >caption Set programmatic focus to the first FormItem
diff --git a/knowledge-base/form-justify-formbuttons.md b/knowledge-base/form-justify-formbuttons.md
index 56f43a65ab..983b065bee 100644
--- a/knowledge-base/form-justify-formbuttons.md
+++ b/knowledge-base/form-justify-formbuttons.md
@@ -21,11 +21,11 @@ res_type: kb
 
 ## Description
 
-I am using the Telerik Form for Blazor and I would like to justify the [FormButtons]({%slug form-formitems-buttons%}) to the right side of the Form.
+I am using the Telerik Form for Blazor and I would like to justify the [FormButtons](slug://form-formitems-buttons) to the right side of the Form.
 
 ## Solution
 
->tip As of [UI for Blazor 3.1.0](https://www.telerik.com/support/whats-new/blazor-ui/release-history/ui-for-blazor-3-1-0) the Form exposes a [`ButtonsLayout` parameter]({%slug form-overview%}#form-layout-customization) that you can use to configure the position of the buttons.
+>tip As of [UI for Blazor 3.1.0](https://www.telerik.com/support/whats-new/blazor-ui/release-history/ui-for-blazor-3-1-0) the Form exposes a [`ButtonsLayout` parameter](slug://form-overview#form-layout-customization) that you can use to configure the position of the buttons.
 
 For versions before UI for Blazor 3.1.0, you can customize the appearance of the Telerik Form by using CSS. To justify the FormButtons in a single instance of the Telerik Form you can take advantage of the `Class` parameter that the component provides and cascade the necessary CSS rules to the FormButton HTML element. The example below showcases a sample implementation that you can use as a base in your application.
 
diff --git a/knowledge-base/form-keep-fields-order.md b/knowledge-base/form-keep-fields-order.md
index 7a4d04e213..e101f68043 100644
--- a/knowledge-base/form-keep-fields-order.md
+++ b/knowledge-base/form-keep-fields-order.md
@@ -102,4 +102,4 @@ To preserve the rendering place of each form item, you need to use the `TelerikF
 
 ## See Also
 
-* [Form Template for All Items]({%slug form-formitems-formitemstemplate%})
\ No newline at end of file
+* [Form Template for All Items](slug://form-formitems-formitemstemplate)
\ No newline at end of file
diff --git a/knowledge-base/form-stop-cascading-editcontext.md b/knowledge-base/form-stop-cascading-editcontext.md
index c0e42d9045..5a3342f120 100644
--- a/knowledge-base/form-stop-cascading-editcontext.md
+++ b/knowledge-base/form-stop-cascading-editcontext.md
@@ -25,7 +25,7 @@ I would like to stop the cascading `EditContext` for a specific editor in my For
 
 ## Solution
 
-To stop the cascading `EditContext` for a specific editor in the TelerikForm you should use the [Template]({%slug form-formitems-template%}) and wrap the custom editor in a `<CascadingValue>` tag. In the `Value` attribute of the `CascadingValue` you should reset the `EditContext`.
+To stop the cascading `EditContext` for a specific editor in the TelerikForm you should use the [Template](slug://form-formitems-template) and wrap the custom editor in a `<CascadingValue>` tag. In the `Value` attribute of the `CascadingValue` you should reset the `EditContext`.
 
 ````RAZOR
 @* Stop the cascading EditContext for the Edit the DoB checkbox. *@ 
diff --git a/knowledge-base/form-use-items-in-custom-component.md b/knowledge-base/form-use-items-in-custom-component.md
index 6c389049c5..02178c8fd8 100644
--- a/knowledge-base/form-use-items-in-custom-component.md
+++ b/knowledge-base/form-use-items-in-custom-component.md
@@ -36,9 +36,9 @@ This KB article answers the following questions:
 
 To render Form items inside custom Razor components:
 
-1. Define all [`<FormGroup>`]({%slug form-formgroups%}) and [`<FormItem>`]({%slug form-formitems%}) instances inside the `<FormItems>` tag of the Form.
-1. Add a [`<FormItemsTemplate>`]({%slug form-formitems-formitemstemplate%}) tag to the Form.
-1. Define [group renderers]({%slug form-formitems-formitemstemplate%}#form-group-renderer) and [item renderers]({%slug form-formitems-formitemstemplate%}#form-item-renderer) for the Form groups and items, which will be children of the `<FormItemsTemplate>`.
+1. Define all [`<FormGroup>`](slug://form-formgroups) and [`<FormItem>`](slug://form-formitems) instances inside the `<FormItems>` tag of the Form.
+1. Add a [`<FormItemsTemplate>`](slug://form-formitems-formitemstemplate) tag to the Form.
+1. Define [group renderers](slug://form-formitems-formitemstemplate#form-group-renderer) and [item renderers](slug://form-formitems-formitemstemplate#form-item-renderer) for the Form groups and items, which will be children of the `<FormItemsTemplate>`.
 1. Add the custom Razor components inside `<FormItemsTemplate>`.
 1. Define parameters for the custom Razor components, which will receive Form groups or Form items.
 1. Define the required renderers inside the custom Razor components, according to the parameters from the previous step.
@@ -202,5 +202,5 @@ namespace YourAppName.Data
 
 ## See Also
 
-* [Form Template for All Items]({%slug form-formitems-formitemstemplate%})
-* [Form Items]({%slug form-formitems%})
+* [Form Template for All Items](slug://form-formitems-formitemstemplate)
+* [Form Items](slug://form-formitems)
diff --git a/knowledge-base/gantt-different-colors-for-tasks.md b/knowledge-base/gantt-different-colors-for-tasks.md
index b3ef07a7e5..a453d1f1a0 100644
--- a/knowledge-base/gantt-different-colors-for-tasks.md
+++ b/knowledge-base/gantt-different-colors-for-tasks.md
@@ -30,7 +30,7 @@ I want to set different colors for the Gantt tasks. I store the colors in my dat
 
 Follow these steps to apply the desired colors to the Gantt tasks:
 
-1. Use a [Task Template]({%slug gantt-task-template%}) to override the default task rendering.
+1. Use a [Task Template](slug://gantt-task-template) to override the default task rendering.
 1. In the template, declare a wrapping element that will contain all the task details. Specify the desired task information inside.
 1. Add an attribute `style="background-color"` to the wrapper and set the desired color. If your model has a color field that you want to use, you may get its value from the template's `context`.
 1. Use custom CSS to remove the default padding of the task template element (`<div class="k-task-template">`) and adjust the custom wrapper, so it covers the whole task element. This ensures that the background color covers the whole task.
@@ -231,7 +231,7 @@ Follow these steps to apply the desired colors to the Gantt tasks:
 
 ## See Also
 
-* [Gantt Task Overview]({%slug gantt-overview%})
-* [Gantt Task Template]({%slug gantt-task-template%})
+* [Gantt Task Overview](slug://gantt-overview)
+* [Gantt Task Template](slug://gantt-task-template)
 * [Live Demos: Gantt](https://demos.telerik.com/blazor-ui/gantt/overview)
 * [Gantt API Reference](/blazor-ui/api/Telerik.Blazor.Components.TelerikGantt-1)
diff --git a/knowledge-base/gantt-tooltip-access-model-fields.md b/knowledge-base/gantt-tooltip-access-model-fields.md
index 4334cea9d5..96e3c7d5e7 100644
--- a/knowledge-base/gantt-tooltip-access-model-fields.md
+++ b/knowledge-base/gantt-tooltip-access-model-fields.md
@@ -21,7 +21,7 @@ ticketid: 1653280
 
 ## Description
 
-I want to access and display model fields in the Gantt Timeline Tooltip. In the [`TooltipTemplate`]({%slug gantt-tooltip-template%}) I can access some of the model fields, which [match the properties of a Gantt Tree item]({%slug gantt-data-binding-overview%}#data-bindings). But how to access and show all model fields?
+I want to access and display model fields in the Gantt Timeline Tooltip. In the [`TooltipTemplate`](slug://gantt-tooltip-template) I can access some of the model fields, which [match the properties of a Gantt Tree item](slug://gantt-data-binding-overview#data-bindings). But how to access and show all model fields?
 
 ## Solution
 
@@ -35,7 +35,7 @@ You have two options to display the other fields form you model in the Tooltip:
 
 This solution relies on finding the task item in your data based on the properties that the `TooltipTemplateContext` provides. The approach is applicable only if all items in your data have unique values for these properties and the task titles are not localized.
 
-1. Cast the [`TooltipTemplate`]({%slug gantt-tooltip-template%}) `context` to `TooltipTemplateContext`.
+1. Cast the [`TooltipTemplate`](slug://gantt-tooltip-template) `context` to `TooltipTemplateContext`.
 2. Use the [available properties of the `TooltipTemplateContext`](/blazor-ui/api/Telerik.Blazor.Components.TooltipTemplateContext) to find the data item in the Gantt data collection. The example below uses the `Title` property.
 3. Display the desired fields of the model instance in the `TooltipTemplate`.
 
@@ -152,12 +152,12 @@ This solution relies on finding the task item in your data based on the properti
 This solution relies on disabling the built-in Tooltip and adding a custom one, so you have full control over its rendering and content.
 
 1. Disable the built-in Tooltip by setting the Gantt `ShowTooltip` parameter to `false`.
-1. Use a [`TaskTemplate`]({%slug gantt-task-template%}) to render a unique `id` attribute to each task.
-1. Add a [TelerikTooltip]({%slug tooltip-overview%}) in the `TaskTemplate`.
-1. Set the Tooltip's [`TargetSelector`]({%slug tooltip-overview%}#tooltip-parameters) to point to the task wrapper unique `id`.
+1. Use a [`TaskTemplate`](slug://gantt-task-template) to render a unique `id` attribute to each task.
+1. Add a [TelerikTooltip](slug://tooltip-overview) in the `TaskTemplate`.
+1. Set the Tooltip's [`TargetSelector`](slug://tooltip-overview#tooltip-parameters) to point to the task wrapper unique `id`.
 1. Access the model from the `context` of the `TaskTemplate` and get the needed properties to display in the Tooltip.
 
-> This approach renders a dedicated Tooltip for each task. This makes it useful if you don't have too many tasks - otherwise, you may face performance issues. In this case, either use the [above approach](#get-the-gantt-data-item-from-context-properties) or [add only one Tooltip instance as shown here]({%slug tooltip-kb-in-grid%}).
+> This approach renders a dedicated Tooltip for each task. This makes it useful if you don't have too many tasks - otherwise, you may face performance issues. In this case, either use the [above approach](#get-the-gantt-data-item-from-context-properties) or [add only one Tooltip instance as shown here](slug://tooltip-kb-in-grid).
 
 >caption Use a custom Tooltip component
 
@@ -272,5 +272,5 @@ This solution relies on disabling the built-in Tooltip and adding a custom one,
 
 ## See Also
 
-- [Gantt Overview - Telerik UI for Blazor]({%slug gantt-overview%})
+- [Gantt Overview - Telerik UI for Blazor](slug://gantt-overview)
 - <a href="https://demos.telerik.com/blazor-ui/gantt/templates" target="_blank">Live Demo: Gantt Templates</a>
\ No newline at end of file
diff --git a/knowledge-base/gauge-pointer-tooltip.md b/knowledge-base/gauge-pointer-tooltip.md
index 13c7f5b85e..e1309219a9 100644
--- a/knowledge-base/gauge-pointer-tooltip.md
+++ b/knowledge-base/gauge-pointer-tooltip.md
@@ -34,9 +34,9 @@ How can I add a Tooltip to the Blazor Arc or Radial Gauge? I want to show a Tool
 
 To add a Tooltip for the pointer of the Gauge:
 
-1. Set the [`Color` of the Gauge Pointer]({%slug arc-gauge-pointers%}#color).
-1. Declare an instance of `TelerikTooltip` ([Telerik UI for Blazor Tooltip])({%slug tooltip-overview%}).
-1. Set the [`TargetSelector`]({%slug tooltip-overview%}#tooltip-parameters) of the Tooltip to a specific path element within the SVG rendered by the Gauge. Use the specified pointer color in the selector.
+1. Set the [`Color` of the Gauge Pointer](slug://arc-gauge-pointers#color).
+1. Declare an instance of `TelerikTooltip` ([Telerik UI for Blazor Tooltip])(slug://tooltip-overview).
+1. Set the [`TargetSelector`](slug://tooltip-overview#tooltip-parameters) of the Tooltip to a specific path element within the SVG rendered by the Gauge. Use the specified pointer color in the selector.
 
 The example below demonstrates how to add a Tooltip to the Arc Gauge. The same approach applies to all other Gauge types.
 
diff --git a/knowledge-base/grid-add-edit-state.md b/knowledge-base/grid-add-edit-state.md
index ee568c25db..94c0ef211f 100644
--- a/knowledge-base/grid-add-edit-state.md
+++ b/knowledge-base/grid-add-edit-state.md
@@ -26,7 +26,7 @@ res_type: kb
 
 How to enter edit mode from code?
 
-How to initiate insert and edit operations programmatically, instead of using [command buttons]({%slug components/grid/columns/command%})?
+How to initiate insert and edit operations programmatically, instead of using [command buttons](slug://components/grid/columns/command)?
 
 How to add new Grid rows with a custom button, which is outside the component?
 
@@ -39,10 +39,10 @@ How to implement Grid command buttons outside the Grid?
 
 ## Solution
 
-This scenario requires knowledge about the [Grid State]({%slug grid-state%}). Get familiar with the following sections first:
+This scenario requires knowledge about the [Grid State](slug://grid-state). Get familiar with the following sections first:
 
-* [Information in the Grid State]({%slug grid-state%}#information-in-the-grid-state)
-* [Grid State Methods]({%slug grid-state%}#methods)
+* [Information in the Grid State](slug://grid-state#information-in-the-grid-state)
+* [Grid State Methods](slug://grid-state#methods)
 
 To enter and exit edit mode, set the following properties of the `GridState` object:
 
@@ -56,9 +56,9 @@ Each property that is not relevant to a desired Grid state, should be set to `nu
 
 ## Example
 
-The sample below shows how to add, edit, cancel and save items in [`Inline`]({%slug components/grid/editing/inline%}) and [`Popup`]({%slug components/grid/editing/popup%}) `EditMode`.
+The sample below shows how to add, edit, cancel and save items in [`Inline`](slug://components/grid/editing/inline) and [`Popup`](slug://components/grid/editing/popup) `EditMode`.
 
-All these operations can also be used for [`Incell`]({%slug components/grid/editing/incell%}). However, blurring the edited cell triggers [`OnUpdate`]({%slug components/grid/editing/overview%}#events), so external UI to manage the Grid doesn't make sense. Some special [`EditorTemplate`]({%slug grid-templates-editor%}) may benefit from programmatic incell cancel or update. The required logic is the same as with inline editing, with the addition of `EditField`.
+All these operations can also be used for [`Incell`](slug://components/grid/editing/incell). However, blurring the edited cell triggers [`OnUpdate`](slug://components/grid/editing/overview#events), so external UI to manage the Grid doesn't make sense. Some special [`EditorTemplate`](slug://grid-templates-editor) may benefit from programmatic incell cancel or update. The required logic is the same as with inline editing, with the addition of `EditField`.
 
 >caption Enter and exit Grid edit mode programmatically
 
@@ -321,5 +321,5 @@ All these operations can also be used for [`Incell`]({%slug components/grid/edit
 
 ## See Also
 
-* [Grid State documentation]({%slug grid-state%})
+* [Grid State documentation](slug://grid-state)
 * [GridState API reference](/blazor-ui/api/Telerik.Blazor.Components.GridState-1)
diff --git a/knowledge-base/grid-adjust-height-with-browser.md b/knowledge-base/grid-adjust-height-with-browser.md
index 190c417797..0935e134a4 100644
--- a/knowledge-base/grid-adjust-height-with-browser.md
+++ b/knowledge-base/grid-adjust-height-with-browser.md
@@ -43,7 +43,7 @@ This KB article answers the following questions:
 
 ## Solution
 
-The Grid will obey its `Height` parameter value in the same way as a regular HTML `<div>`. The component can apply any [valid CSS dimension unit]({%slug common-features/dimensions%}). If the app layout and CSS styles can make a plain `<div>` resize with the browser viewport or the parent element, then the Grid can behave in the same way too.
+The Grid will obey its `Height` parameter value in the same way as a regular HTML `<div>`. The component can apply any [valid CSS dimension unit](slug://common-features/dimensions). If the app layout and CSS styles can make a plain `<div>` resize with the browser viewport or the parent element, then the Grid can behave in the same way too.
 
 The following sections demonstrate different ways to make a Grid resize vertically, depending on the available space. The information and samples are applicable to [other Telerik components for Blazor](#environment).
 
@@ -54,7 +54,7 @@ The following sections demonstrate different ways to make a Grid resize vertical
 * [Use minimum or maximum height](#apply-minimum-or-maximum-height)
 * [Set `PageSize` depending on the Grig height]()
 
-> If the [Grid is using virtual columns]({%slug grid-columns-virtual%}), then its `Height` must be set in pixels and the techniques in this article are not applicable.
+> If the [Grid is using virtual columns](slug://grid-columns-virtual), then its `Height` must be set in pixels and the techniques in this article are not applicable.
 
 ## Use Percent
 
@@ -256,4 +256,4 @@ You can change the Grid `PageSize` at runtime, so that it is consistent with the
 
 ## See Also
 
-* [Using Dimensions in Telerik Blazor Components]({%slug common-features/dimensions%})
+* [Using Dimensions in Telerik Blazor Components](slug://common-features/dimensions)
diff --git a/knowledge-base/grid-align-columns-hierarchy.md b/knowledge-base/grid-align-columns-hierarchy.md
index f4ca6c220d..9b68e08e4f 100644
--- a/knowledge-base/grid-align-columns-hierarchy.md
+++ b/knowledge-base/grid-align-columns-hierarchy.md
@@ -33,12 +33,12 @@ This KB article answers the following questions:
 
 The best reason to align Grid column headers across hierarchy levels is when the Grid displays a self-referencing hierarchy. There are two ways to achieve the desired appearance and aligned columns:
 
-* Use a [TreeList component]({%slug treelist-overview%}). It may be a better option than the Grid, because the TreeList supports a random number of hierarchy levels and there is no need to define and configure each level separately. The TreeList uses the same column and column header for each data item property at any level.
-* Use a Grid with [additional CSS code]({%slug themes-override%}) to align the columns at all hierarchy levels.
+* Use a [TreeList component](slug://treelist-overview). It may be a better option than the Grid, because the TreeList supports a random number of hierarchy levels and there is no need to define and configure each level separately. The TreeList uses the same column and column header for each data item property at any level.
+* Use a Grid with [additional CSS code](slug://themes-override) to align the columns at all hierarchy levels.
 
 The steps below describe how to align columns when using a Grid hierarchy.
 
-1. Set a [custom CSS `Class`]({%slug grid-overview%}#grid-parameters) to the master (parent) Grid, so that the custom styles do not affect other Grid instances.
+1. Set a [custom CSS `Class`](slug://grid-overview#grid-parameters) to the master (parent) Grid, so that the custom styles do not affect other Grid instances.
 1. Use the custom CSS class to:
     1. Remove the padding of the `DetailTemplate` container (`td.k-detail-cell`).
     1. Disable the vertical scrollbar of the Grid data area (`div.k-grid-content`).
@@ -46,7 +46,7 @@ The steps below describe how to align columns when using a Grid hierarchy.
     1. Remove the right border of the detail Grids (`.k-grid`).
 1. Set the same column `Width` to the columns from all hierarchy levels, that should align with one another.
 1. Set widths to all columns, except the first one of each Grid. This will allow the first column to expand and collapse automatically, depending on the hierarchy level and the available space.
-1. If the number of hierarchy levels is greater than two, use [named `context` variables for the Grid `DetailTemplate`]({%slug nest-renderfragment%}).
+1. If the number of hierarchy levels is greater than two, use [named `context` variables for the Grid `DetailTemplate`](slug://nest-renderfragment).
 1. (optional) Remove the header area of the detail Grids. This makes sense only if the detail Grids have no enabled features that rely on column headers, for example, sorting or filtering.
 
 >caption Align the columns in hierarchical grids
@@ -195,6 +195,6 @@ The steps below describe how to align columns when using a Grid hierarchy.
 
 ## See Also
 
-* [Grid Hierarchy]({%slug components/grid/features/hierarchy%})
-* [Using custom CSS with Telerik Blazor components]({%slug themes-override%})
-* [TreeList component documentation]({%slug treelist-overview%})
+* [Grid Hierarchy](slug://components/grid/features/hierarchy)
+* [Using custom CSS with Telerik Blazor components](slug://themes-override)
+* [TreeList component documentation](slug://treelist-overview)
diff --git a/knowledge-base/grid-allow-prevent-row-selection.md b/knowledge-base/grid-allow-prevent-row-selection.md
index c5030b42fb..cf63400581 100644
--- a/knowledge-base/grid-allow-prevent-row-selection.md
+++ b/knowledge-base/grid-allow-prevent-row-selection.md
@@ -28,13 +28,13 @@ This KB article answers the following questions:
 * How to prevent the selection of a certian row in the Grid?
 * How to disable the checkbox column of a disabled row in a Blazor Grid?
 * How to customize the checkbox column of a certain row?
-* How to prevent the selection of Grid items conditionally through the [`SelectedItemsChanged`]({%slug grid-events%}#selecteditemschanged) event?
+* How to prevent the selection of Grid items conditionally through the [`SelectedItemsChanged`](slug://grid-events#selecteditemschanged) event?
 
 ## Solution
 
 The key points in the required implementation are:
 
-* Use the [`OnRowRender`]({%slug grid-events%}#onrowrender) handler to set a custom class to the desired row. 
+* Use the [`OnRowRender`](slug://grid-events#onrowrender) handler to set a custom class to the desired row. 
 * Use the `SelectedItemsChanged` event of the Grid to prevent the selection of items conditionally.
 * Disable the checkboxes by conditionally applying classes to the rows where the checkboxes will be disabled.
 * Add a CSS rule that targets and disables the checkboxes on the rows where you applied custom classes.
@@ -106,4 +106,4 @@ The key points in the required implementation are:
 
 ## See Also
 
-* [Grid Selection]({%slug grid-selection-overview%})
\ No newline at end of file
+* [Grid Selection](slug://grid-selection-overview)
\ No newline at end of file
diff --git a/knowledge-base/grid-autofit-columns.md b/knowledge-base/grid-autofit-columns.md
index 5c500eb566..602986eda9 100644
--- a/knowledge-base/grid-autofit-columns.md
+++ b/knowledge-base/grid-autofit-columns.md
@@ -23,11 +23,11 @@ res_type: kb
 
 ## Description
 
-I would like to autofit the Grid columns on initial page load using the [AutoFitAllColumns]({%slug components/grid/columns/resize%}#autofit-columns) method of the Grid. The goal is for all column widths to match the column content.
+I would like to autofit the Grid columns on initial page load using the [AutoFitAllColumns](slug://components/grid/columns/resize#autofit-columns) method of the Grid. The goal is for all column widths to match the column content.
 
 ## Background
 
-The Grid has [methods to autofit columns programmatically]({%slug components/grid/columns/resize%}#autofit-columns). I would like to achieve that behavior on initial load of the component, but can not find a suitable event to call the methods.
+The Grid has [methods to autofit columns programmatically](slug://components/grid/columns/resize#autofit-columns). I would like to achieve that behavior on initial load of the component, but can not find a suitable event to call the methods.
 
 If I call the autofit methods too early (e.g. on component initialization), I get a `NullReferenceException`.
 
@@ -37,13 +37,13 @@ Autofitting columns on initial load is a current limitation of the built-in auto
 
 While the autofitting feature includes fitting the headers, it also targets the data cells and the footers, so it needs all the rows in the process.
 
-There are two possible implementations to work this around and autofit the Grid columns as the component initializes. They depend on whether the Grid is data-bound with the [`Data` parameter](#data-parameter) or the [`OnRead` event](#onread-event). In both cases, the Grid [`Resizable` parameter]({%slug components/grid/columns/resize%}) must be set to `true`.
+There are two possible implementations to work this around and autofit the Grid columns as the component initializes. They depend on whether the Grid is data-bound with the [`Data` parameter](#data-parameter) or the [`OnRead` event](#onread-event). In both cases, the Grid [`Resizable` parameter](slug://components/grid/columns/resize) must be set to `true`.
 
 ### Data Parameter
 
 To autofit the Grid columns on the initial load of the component:
 
-* Use the Grid [`Class` parameter]({%slug grid-overview%}#grid-parameters) to identify the Grid that you want to autofit.
+* Use the Grid [`Class` parameter](slug://grid-overview#grid-parameters) to identify the Grid that you want to autofit.
 * When the Grid is rendered for the first time, call a JavaScript function in `OnAfterRenderAsync` to observe the Grid.
 * Listen for DOM changes using JavaScript and invoke the `AutoFitAllColumns` method after the table rows in the Grid have rendered.
 
diff --git a/knowledge-base/grid-bind-navigation-property-complex-object.md b/knowledge-base/grid-bind-navigation-property-complex-object.md
index cf26407814..4fea0e4039 100644
--- a/knowledge-base/grid-bind-navigation-property-complex-object.md
+++ b/knowledge-base/grid-bind-navigation-property-complex-object.md
@@ -147,7 +147,7 @@ There are three alternative ways to solve this:
 
 1. Initialize the nested object in its property declaration in the main Grid model class.
 2. Initialize the nested object in the parent object constructor.
-3. Initialize the nested object in the [Grid `OnModelInit` event]({%slug grid-events%}#onmodelinit).
+3. Initialize the nested object in the [Grid `OnModelInit` event](slug://grid-events#onmodelinit).
 
 The example below demonstrates all three options. Pick one, according to your preferences.
 
diff --git a/knowledge-base/grid-binding-to-expando-object.md b/knowledge-base/grid-binding-to-expando-object.md
index 2df8196965..b5ba85b320 100644
--- a/knowledge-base/grid-binding-to-expando-object.md
+++ b/knowledge-base/grid-binding-to-expando-object.md
@@ -36,10 +36,10 @@ How to edit nullable properties in the `ExpandoObject`?
 The key points in the required implementation are:
 
 * Set the Grid `Data` parameter to a `IEnumerable<ExpandoObject>`.
-* Set the [`FieldType`]({%slug components/grid/columns/bound%}#data-binding) parameter of all [bound columns]({%slug components/grid/columns/bound%}).
-* If you need [autogenerated Grid columns]({%slug grid-columns-automatically-generated%}), then [define them in a loop inside the `<GridColumns>` tag]({%slug grid-kb-dynamic-columns-with-static%}), which is a standard Blazor `RenderFragment`.
-    * If Grid editing is enabled and the columns are created from the keys of the first data item, use the [`OnModelInit` event]({%slug grid-events%}#onmodelinit) to populate each newly added item with some default values. Otherwise the columns will disappear because the new data item (`ExpandoObject`) has no properties and is prepended to the `Data` collection. Another option is to create columns from a non-first item. `null` does not qualify as a default value, because it cannot help determine the property type.
-* The Grid clones data items during editing. When editing, you can store the original item in the [Grid `OnEdit` handler]({%slug components/grid/editing/overview%}#events). This will make the retrieval of the original item easier later in `OnUpdate` (example below).
+* Set the [`FieldType`](slug://components/grid/columns/bound#data-binding) parameter of all [bound columns](slug://components/grid/columns/bound).
+* If you need [autogenerated Grid columns](slug://grid-columns-automatically-generated), then [define them in a loop inside the `<GridColumns>` tag](slug://grid-kb-dynamic-columns-with-static), which is a standard Blazor `RenderFragment`.
+    * If Grid editing is enabled and the columns are created from the keys of the first data item, use the [`OnModelInit` event](slug://grid-events#onmodelinit) to populate each newly added item with some default values. Otherwise the columns will disappear because the new data item (`ExpandoObject`) has no properties and is prepended to the `Data` collection. Another option is to create columns from a non-first item. `null` does not qualify as a default value, because it cannot help determine the property type.
+* The Grid clones data items during editing. When editing, you can store the original item in the [Grid `OnEdit` handler](slug://components/grid/editing/overview#events). This will make the retrieval of the original item easier later in `OnUpdate` (example below).
 * Nullable data, `LoadGroupsOnDemand`, and nested model properties require special handling. [Check the notes](#notes) below for additional information.
 
 >caption Grid data operations with ExpandoObject
@@ -189,7 +189,7 @@ The following list contains information about requirements and limitations when
 
 ### Editing
 
-If any non-string property in the `ExpandoObject` is `nullable`, then do not set [`EditorType`]({%slug components/grid/editing/overview%}#customize-the-editor-fields) for the column. Instead, use a [Grid column `EditorTemplate`]({%slug grid-templates-editor%}). The following code snippet is part of the full example below.
+If any non-string property in the `ExpandoObject` is `nullable`, then do not set [`EditorType`](slug://components/grid/editing/overview#customize-the-editor-fields) for the column. Instead, use a [Grid column `EditorTemplate`](slug://grid-templates-editor). The following code snippet is part of the full example below.
 
 <div class="skip-repl"></div>
 
@@ -211,7 +211,7 @@ If any non-string property in the `ExpandoObject` is `nullable`, then do not set
 
 ### Filtering
 
-* Filtering in nullable data requires you to use [`OnRead` data binding]({%slug common-features-data-binding-onread%}). Populate the missing `MemberType` properties in the `CompositeFilterDescriptor`s in the [`OnRead` event argument]({%slug common-features-data-binding-onread%}#event-argument), namely in `args.Request.Filters`. Also see the [related public item](https://feedback.telerik.com/blazor/1499221-incorrect-filter-operators-when-the-fieldtype-is-set-to-a-nullable-numeric-data-type). The following code snippet is part of the full example below.
+* Filtering in nullable data requires you to use [`OnRead` data binding](slug://common-features-data-binding-onread). Populate the missing `MemberType` properties in the `CompositeFilterDescriptor`s in the [`OnRead` event argument](slug://common-features-data-binding-onread#event-argument), namely in `args.Request.Filters`. Also see the [related public item](https://feedback.telerik.com/blazor/1499221-incorrect-filter-operators-when-the-fieldtype-is-set-to-a-nullable-numeric-data-type). The following code snippet is part of the full example below.
 
     <div class="skip-repl"></div>
 
@@ -229,13 +229,13 @@ If any non-string property in the `ExpandoObject` is `nullable`, then do not set
     }
     ````
 
-* [Row filtering]({%slug grid-filter-row%}) in nullable data requires [`FilterCellTemplate`]({%slug grid-templates-filter%}) for numeric and boolean properties. See columns `PropertyInt` and `PropertyBool` in the example below.
+* [Row filtering](slug://grid-filter-row) in nullable data requires [`FilterCellTemplate`](slug://grid-templates-filter) for numeric and boolean properties. See columns `PropertyInt` and `PropertyBool` in the example below.
 
-* [`CheckboxList` filtering]({%slug grid-checklist-filter%}) in non-nullable data requires `OnRead` data binding and the same approach as in the first bullet item above.
+* [`CheckboxList` filtering](slug://grid-checklist-filter) in non-nullable data requires `OnRead` data binding and the same approach as in the first bullet item above.
 
-* The built-in `CheckboxList` filtering doesn't support nullable data. Instead, use the default [filter menu]({%slug grid-filter-menu%}) or [filter row]({%slug grid-filter-row%}). Using a filter menu template with a custom checkbox list is possible.
+* The built-in `CheckboxList` filtering doesn't support nullable data. Instead, use the default [filter menu](slug://grid-filter-menu) or [filter row](slug://grid-filter-row). Using a filter menu template with a custom checkbox list is possible.
 
-* `CheckboxList` filtering in grouped data with `OnRead` event requires a [`FilterMenuTemplate`]({%slug grid-templates-filter%}). You can use a [`TelerikCheckBoxListFilter` component with custom data]({%slug grid-checklist-filter%}#custom-data). The following code snippet is part of the full example below. See column `PropertyBool`.
+* `CheckboxList` filtering in grouped data with `OnRead` event requires a [`FilterMenuTemplate`](slug://grid-templates-filter). You can use a [`TelerikCheckBoxListFilter` component with custom data](slug://grid-checklist-filter#custom-data). The following code snippet is part of the full example below. See column `PropertyBool`.
 
     <div class="skip-repl"></div>
 
@@ -248,7 +248,7 @@ If any non-string property in the `ExpandoObject` is `nullable`, then do not set
 
 ### Grouping
 
-* [Loading groups on demand]({%slug grid-group-lod%}) requires you to bind the Grid with [`OnRead` event]({%slug common-features-data-binding-onread%}). Then, set the `MemberType` of the group-related `FilterDescriptor` in the `OnRead` handler. Otherwise the expanded group will show only one item. Also see the [related public item for built-in support](https://feedback.telerik.com/blazor/1535071-loadgroupsondemand-does-not-let-you-group-with-an-expandoobject-as-data-source). The following code snippet is part of the full example below.
+* [Loading groups on demand](slug://grid-group-lod) requires you to bind the Grid with [`OnRead` event](slug://common-features-data-binding-onread). Then, set the `MemberType` of the group-related `FilterDescriptor` in the `OnRead` handler. Otherwise the expanded group will show only one item. Also see the [related public item for built-in support](https://feedback.telerik.com/blazor/1535071-loadgroupsondemand-does-not-let-you-group-with-an-expandoobject-as-data-source). The following code snippet is part of the full example below.
 
     <div class="skip-repl"></div>
 
@@ -266,7 +266,7 @@ If any non-string property in the `ExpandoObject` is `nullable`, then do not set
 
 ### Nested Properties
 
-You can use [nested Grid model properties]({%slug grid-use-navigation-properties%}) that are `ExpandoObject`s. However, data operations like filtering, sorting, and grouping are not supported for those nested properties. [Disable these features per column]({%slug components/grid/columns/bound%}#data-operations) if they are enabled for the Grid.
+You can use [nested Grid model properties](slug://grid-use-navigation-properties) that are `ExpandoObject`s. However, data operations like filtering, sorting, and grouping are not supported for those nested properties. [Disable these features per column](slug://components/grid/columns/bound#data-operations) if they are enabled for the Grid.
 
 ### Example
 
@@ -707,5 +707,5 @@ The following example demonstrates how the Grid can edit, filter, and group null
 
 ## See Also
 
-* [How to create dynamic Grid columns in a loop]({%slug grid-kb-dynamic-columns-with-static%})
-* [How to bind Grid columns to nested model properties]({%slug grid-use-navigation-properties%})
+* [How to create dynamic Grid columns in a loop](slug://grid-kb-dynamic-columns-with-static)
+* [How to bind Grid columns to nested model properties](slug://grid-use-navigation-properties)
diff --git a/knowledge-base/grid-cascade-dropdowns-for-fields.md b/knowledge-base/grid-cascade-dropdowns-for-fields.md
index a4616b26ad..c8385e9bd3 100644
--- a/knowledge-base/grid-cascade-dropdowns-for-fields.md
+++ b/knowledge-base/grid-cascade-dropdowns-for-fields.md
@@ -29,7 +29,7 @@ There are three approaches you can take:
 
 * For full freedom, implement a custom edit form (here are examples for <a href="https://demos.telerik.com/blazor-ui/grid/editing-custom-form" target="_blank">inline</a>, and <a href="https://github.com/telerik/blazor-ui/tree/master/grid/custom-popup-form" target="_blank">popup</a>)
 
-* Implement the general approach for [cascading dropdowns]({%slug dropdown-kb-cascading%}) in the [editor templates]({%slug grid-templates-editor%}) of those fields. a key thing is to create new data collections, and to use the OnChange event. You may also want to handle the `OnEdit` event of the grid to provide initial data for the second column.
+* Implement the general approach for [cascading dropdowns](slug://dropdown-kb-cascading) in the [editor templates](slug://grid-templates-editor) of those fields. a key thing is to create new data collections, and to use the OnChange event. You may also want to handle the `OnEdit` event of the grid to provide initial data for the second column.
 
 * Use load on demand for the dropdowns themselves (their `OnRead` event) so that when they initialize, they will fire the event, and you can load the data there. The component fires the event when needed and you can use the currently edited item you store in the view-model to provide more information to your service.
 
diff --git a/knowledge-base/grid-center-checkbox-column.md b/knowledge-base/grid-center-checkbox-column.md
index 9474f518ff..e5f6a9dd09 100644
--- a/knowledge-base/grid-center-checkbox-column.md
+++ b/knowledge-base/grid-center-checkbox-column.md
@@ -51,7 +51,7 @@ There are a few alternative ways to center the checkboxes in the GridCheckboxCol
     </style>
     ````
 
-* Use the `OnCellRender` event of the [Grid]({%slug grid-column-events%}) or [TreeList]({%slug treelist-column-events%}) to render a custom CSS class for the checkbox column table cells. Then, apply a `text-align:center` style for this class. You will need [CSS specificity](https://css-tricks.com/specifics-on-css-specificity/), which is higher than **0, 0, 1, 1** (one class and one element).
+* Use the `OnCellRender` event of the [Grid](slug://grid-column-events) or [TreeList](slug://treelist-column-events) to render a custom CSS class for the checkbox column table cells. Then, apply a `text-align:center` style for this class. You will need [CSS specificity](https://css-tricks.com/specifics-on-css-specificity/), which is higher than **0, 0, 1, 1** (one class and one element).
 
     <div class="skip-repl"></div>
     ````RAZOR
diff --git a/knowledge-base/grid-center-column-header-content.md b/knowledge-base/grid-center-column-header-content.md
index ab0aaf93ea..595af7ff3f 100644
--- a/knowledge-base/grid-center-column-header-content.md
+++ b/knowledge-base/grid-center-column-header-content.md
@@ -30,7 +30,7 @@ How to align Grid header cell text to the right?
 
 ## Solution
 
-Use [custom CSS to override the default Grid styles]({%slug themes-override%}). Since [version 3.4.0](https://www.telerik.com/support/whats-new/blazor-ui/release-history/ui-for-blazor-3-4-0), the [Grid columns provide a `HeaderClass` parameter]({%slug components/grid/columns/bound%}) that can help to target specific columns.
+Use [custom CSS to override the default Grid styles](slug://themes-override). Since [version 3.4.0](https://www.telerik.com/support/whats-new/blazor-ui/release-history/ui-for-blazor-3-4-0), the [Grid columns provide a `HeaderClass` parameter](slug://components/grid/columns/bound) that can help to target specific columns.
 
 For older product versions, or to target all columns, use `.k-header` instead of a custom CSS class.
 
@@ -134,10 +134,10 @@ For older product versions, or to target all columns, use `.k-header` instead of
 
 ## Notes
 
-* If you need to wrap the column header content as well, you can try the approach from this knowledge base article - [Wrap and center the Grid Column Header text]({%slug grid-kb-wrap-and-center-column-header-text%}). It shows how to change the default display property of the header cells to `block` and then easily operate with their content to wrap and center it.
+* If you need to wrap the column header content as well, you can try the approach from this knowledge base article - [Wrap and center the Grid Column Header text](slug://grid-kb-wrap-and-center-column-header-text). It shows how to change the default display property of the header cells to `block` and then easily operate with their content to wrap and center it.
 
-* If you want full control over the header text contents and rendering, you can use a [column header template]({%slug grid-templates-column-header%}).
+* If you want full control over the header text contents and rendering, you can use a [column header template](slug://grid-templates-column-header).
 
 ## See Also
 
-* [Wrap and center the Grid Column Header text]({%slug grid-kb-wrap-and-center-column-header-text%})
+* [Wrap and center the Grid Column Header text](slug://grid-kb-wrap-and-center-column-header-text)
diff --git a/knowledge-base/grid-change-border-color.md b/knowledge-base/grid-change-border-color.md
index be8579f09b..34749522c2 100644
--- a/knowledge-base/grid-change-border-color.md
+++ b/knowledge-base/grid-change-border-color.md
@@ -33,7 +33,7 @@ This KB article answers the following questions:
 
 ## Solution
 
-CSS style customizations require knowledge about [CSS specificity]({%slug themes-override%}#css-knowledge) and how to [use the browser's DOM inspector]({%slug themes-override%}#tools).
+CSS style customizations require knowledge about [CSS specificity](slug://themes-override#css-knowledge) and how to [use the browser's DOM inspector](slug://themes-override#tools).
 
 Here are two possible scenarios:
 
@@ -122,8 +122,8 @@ To change the color of all borders in the Grid or TreeList:
 
 To change the border color of a specific Grid or TreeList column:
 
-1. Set the `HeaderClass` parameter of the column. See [Grid Column Appearance]({%slug components/grid/columns/bound%}#appearance) or [TreeList Column Appearance]({%slug treelist-columns-bound%}#appearance).
-1. Subscribe to the `OnCellRender` event of the column. In the event handler, set `args.Class` to a custom CSS class. See [Grid `OnCellRender` event]({%slug grid-column-events%}) or [TreeList `OnCellRender` event]({%slug treelist-column-events%}).
+1. Set the `HeaderClass` parameter of the column. See [Grid Column Appearance](slug://components/grid/columns/bound#appearance) or [TreeList Column Appearance](slug://treelist-columns-bound#appearance).
+1. Subscribe to the `OnCellRender` event of the column. In the event handler, set `args.Class` to a custom CSS class. See [Grid `OnCellRender` event](slug://grid-column-events) or [TreeList `OnCellRender` event](slug://treelist-column-events).
 1. Apply the desired `border-color` style to:
     * The specific header cell and the one after it (`th + th`);
     * The specific data cell and the one after it (`td + td`).
@@ -214,5 +214,5 @@ To change the border color of a specific Grid or TreeList column:
 
 ## See Also
 
-* [Change CSS Theme Styles]({%slug themes-override%})
-* [Change Grid Font Size]({%slug grid-kb-change-font-size%})
+* [Change CSS Theme Styles](slug://themes-override)
+* [Change Grid Font Size](slug://grid-kb-change-font-size)
diff --git a/knowledge-base/grid-change-editable-attribute-update-create.md b/knowledge-base/grid-change-editable-attribute-update-create.md
index b1dd3a8f9c..d528d350ae 100644
--- a/knowledge-base/grid-change-editable-attribute-update-create.md
+++ b/knowledge-base/grid-change-editable-attribute-update-create.md
@@ -27,7 +27,7 @@ Can I dynamically change column attributes during update and create?  Specifical
 ## Solution
 There are two general ways to do this:
 
-* Use a [Grid editor template]({%slug grid-templates-editor%}) and add logic to it that renders an actual editor only when needed (for example, the edited item has no ID, so it is a Create operation for a new item).
+* Use a [Grid editor template](slug://grid-templates-editor) and add logic to it that renders an actual editor only when needed (for example, the edited item has no ID, so it is a Create operation for a new item).
 * Bind the `Editable` property of the column to logic that returns `true|false` as needed.
 
 In the two examples below, the `Name` column uses the `Editable` property, and the `Role` column uses the editor template.
diff --git a/knowledge-base/grid-change-expand-collapse-icons.md b/knowledge-base/grid-change-expand-collapse-icons.md
index 8bd0eae276..ce838871dc 100644
--- a/knowledge-base/grid-change-expand-collapse-icons.md
+++ b/knowledge-base/grid-change-expand-collapse-icons.md
@@ -26,7 +26,7 @@ How to change the expand/collapse icons in a Hierarchical Grid?
 I want to change the built-in plus/minus icons in a Hierarchical Grid. 
 
 ## Solution
-You can change the expand/collapse [icons]({%slug common-features-icons%}) in the Hierarchical Grid by overriding the built-in plus/minus icons with other icons using custom CSS rules. In addition, you can use the Class parameter of the Grid to add custom CSS Class and modify a specific instance of the Grid, instead of all instances on the page. The code block below demonstrates how to achieve the described approach.
+You can change the expand/collapse [icons](slug://common-features-icons) in the Hierarchical Grid by overriding the built-in plus/minus icons with other icons using custom CSS rules. In addition, you can use the Class parameter of the Grid to add custom CSS Class and modify a specific instance of the Grid, instead of all instances on the page. The code block below demonstrates how to achieve the described approach.
 
 ````RAZOR
 @*Change the icons in the Hierarchical Grid*@
@@ -146,4 +146,4 @@ To get the desired icons, you can use your dev tools to inspect the rendered ico
 
 ## See Also
 
-* [Font and SVG Icons]({%slug common-features-icons%})
\ No newline at end of file
+* [Font and SVG Icons](slug://common-features-icons)
\ No newline at end of file
diff --git a/knowledge-base/grid-change-font-size.md b/knowledge-base/grid-change-font-size.md
index f25939dae1..bce4b589a2 100644
--- a/knowledge-base/grid-change-font-size.md
+++ b/knowledge-base/grid-change-font-size.md
@@ -29,7 +29,7 @@ res_type: kb
 ## Solution
 
 1. Set a custom CSS class to the Grid through the `Class` parameter. This configuration allows you to target specific Grid instances.
-2. Use the defined class to [Override the theme styles]({%slug themes-override%}) and set the desired font size to the Grid and its child components.
+2. Use the defined class to [Override the theme styles](slug://themes-override) and set the desired font size to the Grid and its child components.
 
 >caption Change Blazor Grid Font Size
 
@@ -110,6 +110,6 @@ res_type: kb
 
 ## See Also
 
-* [Change Inputs and Buttons Font Size]({%slug inputs-kb-change-font-size%})
-* [Change Grid Border Color]({%slug grid-kb-change-border-color%})
-* [Customize CSS Theme Styles]({%slug themes-override%})
+* [Change Inputs and Buttons Font Size](slug://inputs-kb-change-font-size)
+* [Change Grid Border Color](slug://grid-kb-change-border-color)
+* [Customize CSS Theme Styles](slug://themes-override)
diff --git a/knowledge-base/grid-checkbox-editing.md b/knowledge-base/grid-checkbox-editing.md
index 500ff101e6..cc5ecdb4a9 100644
--- a/knowledge-base/grid-checkbox-editing.md
+++ b/knowledge-base/grid-checkbox-editing.md
@@ -37,10 +37,10 @@ This KB article answers the following questions:
 
 ## Solution
 
-1. Define a [`<GridColumn>` with a `Field`]({%slug components/grid/columns/bound%}) that points to a `bool` property.
-1. Set [`Editable="false"`]({%slug components/grid/columns/bound%}#data-operations) for that column, if the [Grid `EditMode`]({%slug components/grid/editing/overview%}) is `Incell`.
-1. Define a [column cell template]({%slug grid-templates-column%}) (`<Template>`) for the column. Place a [`TelerikCheckBox` component]({%slug checkbox-overview%}) inside.
-1. If the updated CheckBox values require real-time synchronization with a remote data source, then use the [CheckBox `OnChange` or `ValueChanged` event]({%slug checkbox-events%}). In this case, `ValueChanged` will also require a [`ValueExpression`]({%slug common-kb-requires-valueexpression%}).
+1. Define a [`<GridColumn>` with a `Field`](slug://components/grid/columns/bound) that points to a `bool` property.
+1. Set [`Editable="false"`](slug://components/grid/columns/bound#data-operations) for that column, if the [Grid `EditMode`](slug://components/grid/editing/overview) is `Incell`.
+1. Define a [column cell template](slug://grid-templates-column) (`<Template>`) for the column. Place a [`TelerikCheckBox` component](slug://checkbox-overview) inside.
+1. If the updated CheckBox values require real-time synchronization with a remote data source, then use the [CheckBox `OnChange` or `ValueChanged` event](slug://checkbox-events). In this case, `ValueChanged` will also require a [`ValueExpression`](slug://common-kb-requires-valueexpression).
 
 ```CSHTML
 @using Telerik.DataSource.Extensions
@@ -178,8 +178,8 @@ This KB article answers the following questions:
 
 ## Notes
 
-The [built-in Grid editing]({%slug components/grid/editing/overview%}) feature creates a [copy of the original data item]({%slug components/grid/editing/overview%}#notes) while a row is in edit mode. As a result, CheckBox value changes in the non-templated column above are applied to the template columns *after* the `OnUpdate` handler executes.
+The [built-in Grid editing](slug://components/grid/editing/overview) feature creates a [copy of the original data item](slug://components/grid/editing/overview#notes) while a row is in edit mode. As a result, CheckBox value changes in the non-templated column above are applied to the template columns *after* the `OnUpdate` handler executes.
 
 ## See Also
 
-* [Grid Column Cell Template]({%slug grid-templates-column%})
+* [Grid Column Cell Template](slug://grid-templates-column)
diff --git a/knowledge-base/grid-collapse-groups-by-default.md b/knowledge-base/grid-collapse-groups-by-default.md
index 4fe28c2257..b1c54851f8 100644
--- a/knowledge-base/grid-collapse-groups-by-default.md
+++ b/knowledge-base/grid-collapse-groups-by-default.md
@@ -29,15 +29,15 @@ How to collapse all Grid groups by default when the Grid is loaded. The Grid sho
 
 There are two ways to collapse all groups of the Grid both on initialization and after paging:
 
-* [Load groups on demand]({%slug grid-group-lod%}) - in this case, all groups automatically render as collapsed
+* [Load groups on demand](slug://grid-group-lod) - in this case, all groups automatically render as collapsed
 * Collapse groups programmatically
 
 The required steps to collapse groups programmatically are:
 
-1. Use the Grid [`OnStateInit event`]({%slug grid-state%}#onstateinit).
+1. Use the Grid [`OnStateInit event`](slug://grid-state#onstateinit).
 2. Set [group descriptors](/blazor-ui/api/Telerik.DataSource.GroupDescriptor) in the [GridState](/blazor-ui/api/Telerik.Blazor.Components.GridState-1) to group the Grid by default.
 3. Set `CollapsedGroups` in the `GridState`. 
-4. Set a boolean flag in the Grid [`OnStateChanged event`]({%slug grid-state%}#events) when the user is paging.
+4. Set a boolean flag in the Grid [`OnStateChanged event`](slug://grid-state#events) when the user is paging.
 5. Check the boolean flag value in `OnAfterRenderAsync` to know when to persist the groups collapsed state.
 
 
diff --git a/knowledge-base/grid-column-in-custom-component-is-last.md b/knowledge-base/grid-column-in-custom-component-is-last.md
index 47150185ab..88460a5ca7 100644
--- a/knowledge-base/grid-column-in-custom-component-is-last.md
+++ b/knowledge-base/grid-column-in-custom-component-is-last.md
@@ -105,7 +105,7 @@ You can observe and reproduce the same behavior with the example below.
 }
 ````
 
->tip If you want to have conditional columns, you can use the [`Visible`]({%slug grid-columns-visible%}) parameter. The condition can be a ternary operator or a method that returns a bool.
+>tip If you want to have conditional columns, you can use the [`Visible`](slug://grid-columns-visible) parameter. The condition can be a ternary operator or a method that returns a bool.
 
 ## Solution
 
@@ -113,4 +113,4 @@ There are two ways for specifying the position of the columns in the grid:
 
 * Avoid nesting components and put the grid columns directly under the grid tag.
 
-* Use the [Grid State]({%slug grid-state%}), its methods (`GetState`, `SetStateAsync`) and events (`OnStateInit`, `OnStateChanged`) to get the collection of column states and change the `Order` of the instances you want to rearrange.
+* Use the [Grid State](slug://grid-state), its methods (`GetState`, `SetStateAsync`) and events (`OnStateInit`, `OnStateChanged`) to get the collection of column states and change the `Order` of the instances you want to rearrange.
diff --git a/knowledge-base/grid-column-state.md b/knowledge-base/grid-column-state.md
index a1584f889a..7d9201fd8d 100644
--- a/knowledge-base/grid-column-state.md
+++ b/knowledge-base/grid-column-state.md
@@ -28,16 +28,16 @@ res_type: kb
 
 ## Solution
 
-This scenario requires knowledge about the [Grid State]({%slug grid-state%}). Get familiar with the following sections first:
+This scenario requires knowledge about the [Grid State](slug://grid-state). Get familiar with the following sections first:
 
-* [Information in the Grid State]({%slug grid-state%}#information-in-the-grid-state)
-* [Grid `OnStateChanged` Event]({%slug grid-state%}#onstatechanged)
-* [Grid State Methods]({%slug grid-state%}#methods)
+* [Information in the Grid State](slug://grid-state#information-in-the-grid-state)
+* [Grid `OnStateChanged` Event](slug://grid-state#onstatechanged)
+* [Grid State Methods](slug://grid-state#methods)
 
 There are two ways to obtain the Grid column information programmatically:
 
-* Use the [Grid `OnStateChanged` event]({%slug grid-state%}#onstatechanged) and check `args.GridState.ColumnStates`, where `args` is the `OnStateChanged` event argument.
-* Use the [Grid `GetState` method]({%slug grid-state%}#methods) and check the `ColumnStates` property of the returned `GridState` object.
+* Use the [Grid `OnStateChanged` event](slug://grid-state#onstatechanged) and check `args.GridState.ColumnStates`, where `args` is the `OnStateChanged` event argument.
+* Use the [Grid `GetState` method](slug://grid-state#methods) and check the `ColumnStates` property of the returned `GridState` object.
 
 `ColumnStates` is a `ICollection<GridColumnState>`. The `GridColumnState` class has the following properties:
 
@@ -176,4 +176,4 @@ The column order in the `ColumnStates` collection matches the `<GridColumn>` tag
 
 ## See Also
 
-* [Grid State]({%slug grid-state%})
+* [Grid State](slug://grid-state)
diff --git a/knowledge-base/grid-combobox-in-filtermenu-empty.md b/knowledge-base/grid-combobox-in-filtermenu-empty.md
index ee437acc7c..0c38a94fd4 100644
--- a/knowledge-base/grid-combobox-in-filtermenu-empty.md
+++ b/knowledge-base/grid-combobox-in-filtermenu-empty.md
@@ -33,7 +33,7 @@ The behavior is related to the filter menu popup. It is rendered outside the Gri
 
 ## Suggested Workarounds
 * Upgrade to UI for Blazor **3.0** or later. It uses different `OnRead` mechanism for loading asynchronous data and updating the ComboBox. The component dropdown will update even after it has been opened.
-* Load the ComboBox data before the filter menu is opened for the first time. Use Blazor events like `OnInitializedAsync`, or Grid events like [**OnStateInit**]({% slug grid-state %}#events) or [OnRead]({% slug grid-events %}#read-event).
+* Load the ComboBox data before the filter menu is opened for the first time. Use Blazor events like `OnInitializedAsync`, or Grid events like [**OnStateInit**](slug://grid-state #events) or [OnRead](slug://grid-events#read-event).
 * Load the ComboBox data synchronously.
 * Enable Grid filtering with a delay, after the ComboBox data has been loaded.
 
diff --git a/knowledge-base/grid-compact-grid-with-small-elements.md b/knowledge-base/grid-compact-grid-with-small-elements.md
index b255946ad0..fd10f1f1b5 100644
--- a/knowledge-base/grid-compact-grid-with-small-elements.md
+++ b/knowledge-base/grid-compact-grid-with-small-elements.md
@@ -23,14 +23,14 @@ res_type: kb
 
 ## Description
 
-I am using the [Grid sizing feature]({%slug grid-sizing%}) and my Grid is a Compact Grid. I want to reduce the size of all elements in the Grid. How can I:
+I am using the [Grid sizing feature](slug://grid-sizing) and my Grid is a Compact Grid. I want to reduce the size of all elements in the Grid. How can I:
 * Change the size of all icons in the Grid?
 * Set smaller font size to all elements in the Grid?
 
 ## Solution
 
-1. Set the [Grid `Class` parameter]({%slug grid-overview%}#grid-parameters) to a custom CSS class. This allows you to target specific Grid instances.
-1. Use the defined class to [override the theme styles]({%slug themes-override%}) of the desired elements in the Grid.
+1. Set the [Grid `Class` parameter](slug://grid-overview#grid-parameters) to a custom CSS class. This allows you to target specific Grid instances.
+1. Use the defined class to [override the theme styles](slug://themes-override) of the desired elements in the Grid.
 
 >caption Change Blazor Grid Elements Styles
 
@@ -172,5 +172,5 @@ I am using the [Grid sizing feature]({%slug grid-sizing%}) and my Grid is a Comp
 
 ## See Also
 
-* [Compact Grid]({%slug grid-sizing%})
-* [Customize CSS Theme Styles]({%slug themes-override%})
+* [Compact Grid](slug://grid-sizing)
+* [Customize CSS Theme Styles](slug://themes-override)
diff --git a/knowledge-base/grid-conditional-cell-background.md b/knowledge-base/grid-conditional-cell-background.md
index b52b43c42e..5a82da6ffb 100644
--- a/knowledge-base/grid-conditional-cell-background.md
+++ b/knowledge-base/grid-conditional-cell-background.md
@@ -36,13 +36,13 @@ There are several approaches you can take depending on the goals and situation t
 * [Row Template](#row-template) - change the entire contents of the row
 * [CSS Only Approach](#css-only-approach) - override built-in CSS rules with your own without conditions or custom themes
 
->note These approaches, including the [OnCellRender]({%slug treelist-column-events%}) and [OnRowRender]({%slug treelist-events%}) events, are applicable for the TreeList as well.
+>note These approaches, including the [OnCellRender](slug://treelist-column-events) and [OnRowRender](slug://treelist-events) events, are applicable for the TreeList as well.
 
 ### OnCellRender and OnRowRender Events
 
-To customize the formatting of the cells you can use the [OnCellRender]({%slug grid-column-events%}#oncellrender) event, exposed for the Grid Column.
+To customize the formatting of the cells you can use the [OnCellRender](slug://grid-column-events#oncellrender) event, exposed for the Grid Column.
 
-To customize the formatting of the entire row, use the [OnRowRender]({%slug grid-events%}#onrowrender) event for the Grid.
+To customize the formatting of the entire row, use the [OnRowRender](slug://grid-events#onrowrender) event for the Grid.
 
 These events provide you with the data item and cell value, and let you set a custom class to the corresponding element, so you can cascade the needed CSS rules through it.
 
@@ -52,7 +52,7 @@ These events provide you with the data item and cell value, and let you set a cu
 
 ### Cell Template
 
-You can use a particular column's [cell template]({%slug grid-templates-column%}) to render conditional markup inside its cell. In this case you will need some CSS to make your element take up the entire size of the cell so the default padding from the grid does not leave some of the original background visible. 
+You can use a particular column's [cell template](slug://grid-templates-column) to render conditional markup inside its cell. In this case you will need some CSS to make your element take up the entire size of the cell so the default padding from the grid does not leave some of the original background visible. 
 >caption Cell Template and CSS to change the background of particular cells conditionally
 
 ````RAZOR
@@ -116,7 +116,7 @@ You can use a particular column's [cell template]({%slug grid-templates-column%}
 
 ### Row Template
 
-You can fully control the row rendering through a [row template]({%slug grid-templates-row%}) and apply the classes or inline rules you require to individual cells, or to all cells. Review the requirements and limitations of the row templates and if they suit you needs.
+You can fully control the row rendering through a [row template](slug://grid-templates-row) and apply the classes or inline rules you require to individual cells, or to all cells. Review the requirements and limitations of the row templates and if they suit you needs.
 
 >caption Use a row template to style individual cells or the entire row conditionally
 
diff --git a/knowledge-base/grid-conditional-expand-button.md b/knowledge-base/grid-conditional-expand-button.md
index 2e92be03a7..850b0865e6 100644
--- a/knowledge-base/grid-conditional-expand-button.md
+++ b/knowledge-base/grid-conditional-expand-button.md
@@ -29,7 +29,7 @@ I would like the expand to only be visible when it has further data to expand.
 
 ## Solution
 
-Use the [`OnRowRender` event]({%slug grid-events%}#onrowrender) to evaluate the current row item (for example, whether it has child items in a collection or some other flag your application has).
+Use the [`OnRowRender` event](slug://grid-events#onrowrender) to evaluate the current row item (for example, whether it has child items in a collection or some other flag your application has).
 
 Then, if you want to hide the expand icon, set a CSS class to the row that will hide the icon in the expand cell. It is also important to disable the pointer events of the cells with no expand icons, so the user cannot click them to open the empty child Grid even though the plus icon is hidden.
 
diff --git a/knowledge-base/grid-conditional-toolbar-detail-template.md b/knowledge-base/grid-conditional-toolbar-detail-template.md
index 536852839f..e142f2f14c 100644
--- a/knowledge-base/grid-conditional-toolbar-detail-template.md
+++ b/knowledge-base/grid-conditional-toolbar-detail-template.md
@@ -32,7 +32,7 @@ How to define a conditional Grid Detail Template (`DetailTemplate`)? I want to h
 
 ## Solution
 
-The [`GridToolBarTemplate`]({%slug components/grid/features/toolbar%}) and the [`DetailTemplate`]({%slug components/grid/features/hierarchy%}) are standard Blazor `RenderFragment`s. Their default value is `null` and then the toolbar and the hierarchy are not rendered. As soon as the `<GridToolBar>` or `<DetailTemplate>` tag is added, the `RenderFragment` value is no longer `null`, even if the tag itself is empty.
+The [`GridToolBarTemplate`](slug://components/grid/features/toolbar) and the [`DetailTemplate`](slug://components/grid/features/hierarchy) are standard Blazor `RenderFragment`s. Their default value is `null` and then the toolbar and the hierarchy are not rendered. As soon as the `<GridToolBar>` or `<DetailTemplate>` tag is added, the `RenderFragment` value is no longer `null`, even if the tag itself is empty.
 
 There are two ways to display a `RenderFragment` or any template conditionally:
 
diff --git a/knowledge-base/grid-convert-descriptors-to-sql.md b/knowledge-base/grid-convert-descriptors-to-sql.md
index 0a3fe99978..bb66a08437 100644
--- a/knowledge-base/grid-convert-descriptors-to-sql.md
+++ b/knowledge-base/grid-convert-descriptors-to-sql.md
@@ -22,12 +22,12 @@ ticketid: 1666625, 1653361
 
 ## Description
 
-When using the Grid [`OnRead` event]({%slug grid-events%}#read-event) to execute SQL queries, I need to convert the Grid's filter and sort descriptors into SQL query statements. This way I can create SQL clauses for filtering and ordering items directly through SQL.
+When using the Grid [`OnRead` event](slug://grid-events#read-event) to execute SQL queries, I need to convert the Grid's filter and sort descriptors into SQL query statements. This way I can create SQL clauses for filtering and ordering items directly through SQL.
 
 This KB article also answers the following questions:
 - How can I convert Grid filters and sorters to SQL `WHERE` and `ORDER BY` clauses?
 - Is there a way to parse Grid filter and sort descriptors into SQL queries?
-- Can I use [`DataSourceRequest`]({%slug common-features-data-binding-onread%}#event-argument) to generate SQL query statements for filtering and sorting?
+- Can I use [`DataSourceRequest`](slug://common-features-data-binding-onread#event-argument) to generate SQL query statements for filtering and sorting?
 
 ## Solution
 
@@ -189,6 +189,6 @@ Below is a simplified example demonstrating how to parse filter and sort descrip
 
 ## See Also
 
-- [OnRead Event Documentation]({%slug grid-events%}#read-event)
+- [OnRead Event Documentation](slug://grid-events#read-event)
 - [Forum Post on Using DataSourceRequest in SQL Query](https://www.telerik.com/forums/can-datasourcerequest-be-used-in-sql-query-to-add-where-and-order-by-clauses)
-- [Get Information From the DataSourceRequest]({%slug components/grid/manual-operations%}#get-information-from-the-datasourcerequest)
+- [Get Information From the DataSourceRequest](slug://components/grid/manual-operations#get-information-from-the-datasourcerequest)
diff --git a/knowledge-base/grid-create-reusable-columns.md b/knowledge-base/grid-create-reusable-columns.md
index 0d620bceb6..23c9f2374f 100644
--- a/knowledge-base/grid-create-reusable-columns.md
+++ b/knowledge-base/grid-create-reusable-columns.md
@@ -171,5 +171,5 @@ public class Role
 
 ## See Also
 
-- [Grid Columns]({%slug components/grid/columns/bound%})
-- [Grid Templates]({%slug components/grid/features/templates%})
+- [Grid Columns](slug://components/grid/columns/bound)
+- [Grid Templates](slug://components/grid/features/templates)
diff --git a/knowledge-base/grid-csv-export-change-field-delimiter.md b/knowledge-base/grid-csv-export-change-field-delimiter.md
index 40816bc464..3eef68d8ad 100644
--- a/knowledge-base/grid-csv-export-change-field-delimiter.md
+++ b/knowledge-base/grid-csv-export-change-field-delimiter.md
@@ -38,7 +38,7 @@ To change the field delimiter, do the following:
 
 1. Install `Telerik.Documents.Spreadsheet.FormatProviders.Xls` package, so you can use the `CsvFormatProvider`
 
-1. Handle the [OnAfterExport]({%slug grid-export-events%}#onafterexport) event of the Grid. The stream it provides is finalized, so that the resource does not leak. Its binary data, however, is available, so you can copy the stream bytes to a new `MemoryStream` instance.
+1. Handle the [OnAfterExport](slug://grid-export-events#onafterexport) event of the Grid. The stream it provides is finalized, so that the resource does not leak. Its binary data, however, is available, so you can copy the stream bytes to a new `MemoryStream` instance.
 
 1. Create a `CsvFormatProvider` instance and use it to [import the new `MemoryStream` in a `workbook`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/formats-and-conversion/csv/csvformatprovider#import).
 
@@ -140,7 +140,7 @@ To change the field delimiter, do the following:
 
 ## See Also
 
-  * [Format numbers and dates in the exported CSV file from the Grid]({%slug grid-kb-number-formatting-of-the-csv-export%})
-  * [Custom cell formatting of the exported file with RadSpreadProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadprocessing%})
-  * [Configure Document Processing Libraries]({%slug getting-started-vs-integration-dpl%})
+  * [Format numbers and dates in the exported CSV file from the Grid](slug://grid-kb-number-formatting-of-the-csv-export)
+  * [Custom cell formatting of the exported file with RadSpreadProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadprocessing)
+  * [Configure Document Processing Libraries](slug://getting-started-vs-integration-dpl)
 
diff --git a/knowledge-base/grid-custom-cell-formatting-with-radspreadprocessing.md b/knowledge-base/grid-custom-cell-formatting-with-radspreadprocessing.md
index 7131450551..bf7bce20e5 100644
--- a/knowledge-base/grid-custom-cell-formatting-with-radspreadprocessing.md
+++ b/knowledge-base/grid-custom-cell-formatting-with-radspreadprocessing.md
@@ -27,13 +27,13 @@ I want to format the cells of the exported Excel file. For example, set backgrou
 
 ## Solution
 
-Handle the [OnAfterExport]({%slug grid-export-events%}#onafterexport) event of the Grid. It fires before the actual file is provided to the user. The `Stream` field of its event argument contains the output of the export as a `MemoryStream`.
+Handle the [OnAfterExport](slug://grid-export-events#onafterexport) event of the Grid. It fires before the actual file is provided to the user. The `Stream` field of its event argument contains the output of the export as a `MemoryStream`.
 
 You can copy the bytes from this stream and import them in a [`RadSpreadProcessing workbook`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/working-with-workbooks/working-with-workbooks-what-is-workbook) to access and modify the cells.
 
 [`RadSpreadProcessing`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/overview) is a powerful library that allows you to create spreadsheets from scratch, modify existing documents or convert between the most common spreadsheet formats. In this case, we will focus on the file modification.
 
->tip In WebAssembly applications, the customization of the exported Excel files is faster with the [RadSpreadStreamProcessing library]({%slug grid-kb-custom-cell-formatting-with-radspreadstreamprocessing%}) than with RadSpreadProcessing.
+>tip In WebAssembly applications, the customization of the exported Excel files is faster with the [RadSpreadStreamProcessing library](slug://grid-kb-custom-cell-formatting-with-radspreadstreamprocessing) than with RadSpreadProcessing.
 
 The example below targets Excel file export and customization. Same approach can be applied for [CSV files](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/formats-and-conversion/csv/csvformatprovider).
 
@@ -41,7 +41,7 @@ To customize the cell format of the exported file before it reaches the client,
 
 1. Install `Telerik.Documents.Spreadsheet.FormatProviders.Xls` package for the `workbook` import.
 
-2. Handle the [`OnAfterExport`]({%slug grid-export-events%}#onafterexport) event of the Grid. The stream it provides is finalized, so that the resource does not leak. Its binary data, however, is available, so you can copy the stream bytes to a new `MemoryStream` instance.
+2. Handle the [`OnAfterExport`](slug://grid-export-events#onafterexport) event of the Grid. The stream it provides is finalized, so that the resource does not leak. Its binary data, however, is available, so you can copy the stream bytes to a new `MemoryStream` instance.
 
 3. [Import the new `MemoryStream` in a `workbook`](https://docs.telerik.com/devtools/document-processing/knowledge-base/import-export-save-load-workbook#load-workbook-from-file-as-filestream-or-memorystream).
 
@@ -149,6 +149,6 @@ To customize the cell format of the exported file before it reaches the client,
 
 ## See Also
 
-  * [Format numbers and dates in the exported CSV file from the Grid]({%slug grid-kb-number-formatting-of-the-csv-export%})
-  * [Change the default CSV delimiter (comma) during Grid export]({%slug grid-kb-csv-export-change-field-delimiter%})
-  * [Configuring Document Processing Libraries]({%slug getting-started-vs-integration-dpl%})
+  * [Format numbers and dates in the exported CSV file from the Grid](slug://grid-kb-number-formatting-of-the-csv-export)
+  * [Change the default CSV delimiter (comma) during Grid export](slug://grid-kb-csv-export-change-field-delimiter)
+  * [Configuring Document Processing Libraries](slug://getting-started-vs-integration-dpl)
diff --git a/knowledge-base/grid-custom-cell-formatting-with-radspreadstreamprocessing.md b/knowledge-base/grid-custom-cell-formatting-with-radspreadstreamprocessing.md
index fc60d60397..bdba6cbb88 100644
--- a/knowledge-base/grid-custom-cell-formatting-with-radspreadstreamprocessing.md
+++ b/knowledge-base/grid-custom-cell-formatting-with-radspreadstreamprocessing.md
@@ -29,17 +29,17 @@ I want to format the cells of the exported Excel file and customize their appear
 
 ## Solution
 
-Handle the [`OnAfterExport`]({%slug grid-export-events%}#onafterexport) event of the Grid. It fires before the actual file is provided to the user. The `Stream` field of its event argument contains the output of the export as a `MemoryStream`.
+Handle the [`OnAfterExport`](slug://grid-export-events#onafterexport) event of the Grid. It fires before the actual file is provided to the user. The `Stream` field of its event argument contains the output of the export as a `MemoryStream`.
 
 You can copy the bytes from this stream and import it using RadSpreadStreamProcessing to access and modify the cells.
 
-The customization of the exported Excel files is faster with the [RadSpreadStreamProcessing library](https://docs.telerik.com/devtools/document-processing/libraries/radspreadstreamprocessing/overview) than with [RadSpreadProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadprocessing%}).
+The customization of the exported Excel files is faster with the [RadSpreadStreamProcessing library](https://docs.telerik.com/devtools/document-processing/libraries/radspreadstreamprocessing/overview) than with [RadSpreadProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadprocessing).
 
 The example below demonstrates the export and customization of an Excel file. You can apply the same approach to CSV files.
 
 To customize the cell format of the exported file before it reaches the client:
 
-1. Handle the [`OnAfterExport`]({%slug grid-export-events%}#onafterexport) event of the Grid. The stream it provides is finalized so that the resource does not leak. Its binary data, however, is available so you can copy the stream bytes to a new `MemoryStream` instance.
+1. Handle the [`OnAfterExport`](slug://grid-export-events#onafterexport) event of the Grid. The stream it provides is finalized so that the resource does not leak. Its binary data, however, is available so you can copy the stream bytes to a new `MemoryStream` instance.
 
 1. Define the desired cell styles. The example below demonstrates adding cell fill, you can specify different [cell styles](https://docs.telerik.com/devtools/document-processing/libraries/radspreadstreamprocessing/features/cell-styles) based on the result you want to achieve.
 
@@ -250,7 +250,7 @@ To customize the cell format of the exported file before it reaches the client:
 
 ## See Also
 
-* [Custom cell formatting of the exported file with RadSpreadProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadprocessing%})
-* [Format numbers and dates in the exported CSV file from the Grid]({%slug grid-kb-number-formatting-of-the-csv-export%})
-* [Change the default CSV delimiter (comma) during Grid export]({%slug grid-kb-csv-export-change-field-delimiter%})
-* [Configure Document Processing Libraries]({%slug getting-started-vs-integration-dpl%})
\ No newline at end of file
+* [Custom cell formatting of the exported file with RadSpreadProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadprocessing)
+* [Format numbers and dates in the exported CSV file from the Grid](slug://grid-kb-number-formatting-of-the-csv-export)
+* [Change the default CSV delimiter (comma) during Grid export](slug://grid-kb-csv-export-change-field-delimiter)
+* [Configure Document Processing Libraries](slug://getting-started-vs-integration-dpl)
\ No newline at end of file
diff --git a/knowledge-base/grid-custom-filter-menu.md b/knowledge-base/grid-custom-filter-menu.md
index 4c55a90e97..af91ec760d 100644
--- a/knowledge-base/grid-custom-filter-menu.md
+++ b/knowledge-base/grid-custom-filter-menu.md
@@ -21,7 +21,7 @@ ticketid: 1669381
 
 ## Description
 
-When using the TelerikGrid in Blazor applications, it's common to implement a custom `FilterMenu` for enhanced filtering capabilities. However, integrating a Telerik UI for Blazor component that is responsible for the dynamic Grid filtering based on user input does not work as expected. For example, the [AutoComplete]({%slug autocomplete-overview%}) component does not consider the selection from the dropdown list of `StringOperators` within the [`FilterMenuTemplate`]({%slug grid-templates-filter%}#filter-menu-template). 
+When using the TelerikGrid in Blazor applications, it's common to implement a custom `FilterMenu` for enhanced filtering capabilities. However, integrating a Telerik UI for Blazor component that is responsible for the dynamic Grid filtering based on user input does not work as expected. For example, the [AutoComplete](slug://autocomplete-overview) component does not consider the selection from the dropdown list of `StringOperators` within the [`FilterMenuTemplate`](slug://grid-templates-filter#filter-menu-template). 
 
 This knowledge base article also answers the following questions:
 - How to integrate AutoComplete with `StringOperators` in a TelerikGrid `FilterMenuTemplate`?
@@ -203,6 +203,6 @@ To achieve the desired behavior, encapsulate the content of the `FilterMenuTempl
 
 ## See Also
 
-- [DropDownList Overview]({%slug components/dropdownlist/overview%})
-- [Grid FilterMenu Documentation]({%slug grid-filter-menu%})
+- [DropDownList Overview](slug://components/dropdownlist/overview)
+- [Grid FilterMenu Documentation](slug://grid-filter-menu)
 - [Feedback Portal - Expose a Method to Refresh the FilterMenu](https://feedback.telerik.com/blazor/1584289-expose-a-method-to-refresh-the-filtermenu-from-the-code)
diff --git a/knowledge-base/grid-custom-grouping-order.md b/knowledge-base/grid-custom-grouping-order.md
index 3800e5a201..d4bd03382b 100644
--- a/knowledge-base/grid-custom-grouping-order.md
+++ b/knowledge-base/grid-custom-grouping-order.md
@@ -32,9 +32,9 @@ This KB article answers the following questions:
 
 To achieve custom grouping order in the Telerik Grid for Blazor, follow these steps:
 
-1. Bind the Grid with the `OnRead` event to handle data operations manually. Refer to the official documentation for [`OnRead`]({%slug common-features-data-binding-onread%}) and [Grouping with `OnRead`]({%slug components/grid/manual-operations%}#grouping-with-onread)
+1. Bind the Grid with the `OnRead` event to handle data operations manually. Refer to the official documentation for [`OnRead`](slug://common-features-data-binding-onread) and [Grouping with `OnRead`](slug://components/grid/manual-operations#grouping-with-onread)
 
-2. Instead of using the `ToDataSourceResult()` method, group the data with custom code. Each group must be represented by an `AggregateFunctionsGroup` object. To understand the Grid's expectations, inspect the `datasourceResult` variable structure and content with a debugger, as shown in [Grouping with `OnRead`]({%slug components/grid/manual-operations%}#grouping-with-onread).
+2. Instead of using the `ToDataSourceResult()` method, group the data with custom code. Each group must be represented by an `AggregateFunctionsGroup` object. To understand the Grid's expectations, inspect the `datasourceResult` variable structure and content with a debugger, as shown in [Grouping with `OnRead`](slug://components/grid/manual-operations#grouping-with-onread).
 
 3. Implement custom sorting logic for grouped data based on your specific order requirements (e.g., D, A, C, B) within the `OnRead` method.
 
diff --git a/knowledge-base/grid-customize-delete-confirmation-dialog.md b/knowledge-base/grid-customize-delete-confirmation-dialog.md
index 0e0b4f880e..fa35d59f19 100644
--- a/knowledge-base/grid-customize-delete-confirmation-dialog.md
+++ b/knowledge-base/grid-customize-delete-confirmation-dialog.md
@@ -46,7 +46,7 @@ You can use:
 
 ### Localization
 
-You can enable [Localization]({%slug globalization-localization%}) in your application and provide the desired custom text for the corresponding element keys.
+You can enable [Localization](slug://globalization-localization) in your application and provide the desired custom text for the corresponding element keys.
 
 The keys for the elements of the built-in Delete Confirmation Dialog are:
 
@@ -61,10 +61,10 @@ The keys for the elements of the built-in Delete Confirmation Dialog are:
 
 ### Predefined Dialog Component
 
-Use a [Predefined Confirm Dialog]({%slug dialog-predefined%}#confirm) with the desired custom text. Additionally, you may get the details for the current item and add them to the text:
+Use a [Predefined Confirm Dialog](slug://dialog-predefined#confirm) with the desired custom text. Additionally, you may get the details for the current item and add them to the text:
 
 * Use the Grid `Class` parameter to set a `z-index` style, which is lower than the default Dialog `z-index` of 10,000.
-* Handle the [`OnDelete`]({%slug grid-events%}#cud-events) event of the Grid.
+* Handle the [`OnDelete`](slug://grid-events#cud-events) event of the Grid.
 * Display the predefined Dialog in the `OnDelete` handler.
 * Cancel the event or proceed with the `OnDelete` logic depending on the user choice.
 * The same approach is applicable to the `OnCreate` and `OnUpdate` events.
@@ -183,13 +183,13 @@ Use a [Predefined Confirm Dialog]({%slug dialog-predefined%}#confirm) with the d
 
 ### Dialog Component
 
-Using the [Dialog component]({%slug dialog-overview%}) will let you have fully customized Delete Confirmation Dialog. To handle the scenario:
+Using the [Dialog component](slug://dialog-overview) will let you have fully customized Delete Confirmation Dialog. To handle the scenario:
 
 * Declare a Dialog instance and add the desired content and buttons there. Normally, you would need at least two buttons - for confirmation and cancelling the delete operation.
-* Use [custom commands]({%slug components/grid/columns/command%}) instead of the built-in `Save` and `Delete` commands to obtain the data item and show the Dialog component.
+* Use [custom commands](slug://components/grid/columns/command) instead of the built-in `Save` and `Delete` commands to obtain the data item and show the Dialog component.
 * Handle the Dialog button clicks: 
     * Proceed with the item deletion in the Confirm button click handler. 
-    * Hide the Dialog on Cancel. Optionally, [exit Grid edit mode programmatically]({%slug grid-kb-add-edit-state%}).
+    * Hide the Dialog on Cancel. Optionally, [exit Grid edit mode programmatically](slug://grid-kb-add-edit-state).
 * The same approach is applicable to the `OnCreate` and `OnUpdate` events.
 
 ````RAZOR
@@ -335,5 +335,5 @@ Using the [Dialog component]({%slug dialog-overview%}) will let you have fully c
 
 ## See Also
 
-* [Grid Editing]({%slug components/grid/editing/overview%})
-* [Dialog Overview]({%slug dialog-overview%})
+* [Grid Editing](slug://components/grid/editing/overview)
+* [Dialog Overview](slug://dialog-overview)
diff --git a/knowledge-base/grid-customize-dragged-dropped-row.md b/knowledge-base/grid-customize-dragged-dropped-row.md
index 779cd87ea6..619e4cfcef 100644
--- a/knowledge-base/grid-customize-dragged-dropped-row.md
+++ b/knowledge-base/grid-customize-dragged-dropped-row.md
@@ -29,9 +29,9 @@ I am using Grid with Drag and Drop functionality to drag the items from one Grid
 
 Do the following to customize the appearance of the dropped item:
 
-* Use a global variable to store the dropped item. You can get it from the `GridRowDropEventArgs` of the [`OnRowDrop` event]({%slug grid-events%}#onrowdrop)
+* Use a global variable to store the dropped item. You can get it from the `GridRowDropEventArgs` of the [`OnRowDrop` event](slug://grid-events#onrowdrop)
 
-* Handle the [`OnRowRender` event]({%slug grid-events%}#onrowrender) of the Grid to set a custom CSS class to the item that is matching the dropped one (you can compare them by Id, for example).
+* Handle the [`OnRowRender` event](slug://grid-events#onrowrender) of the Grid to set a custom CSS class to the item that is matching the dropped one (you can compare them by Id, for example).
 
 * Additionally, you can set some custom styles for the drag clue container. The element matches this CSS selector: `.k-header.k-drag-clue`.
 
diff --git a/knowledge-base/grid-customize-hierarchy-expand-column-blazor-grid.md b/knowledge-base/grid-customize-hierarchy-expand-column-blazor-grid.md
index ff18e77461..4518fdac36 100644
--- a/knowledge-base/grid-customize-hierarchy-expand-column-blazor-grid.md
+++ b/knowledge-base/grid-customize-hierarchy-expand-column-blazor-grid.md
@@ -31,14 +31,14 @@ This KB article answers the following questions:
 
 ## Solution
 
-By default, the hierarchy expand/collapse column in the Telerik UI for Blazor [Grid]({%slug grid-overview%}) is not declared in the markup like the other data-bound columns. It renders automatically when a `DetailTemplate` is added to the Grid. At the time of writing (UI for Blazor **6.0.2**), this built-in hierarchy expand/collapse column does not support being locked or other common configurations like managing its position, setting its width, or adding a title.
+By default, the hierarchy expand/collapse column in the Telerik UI for Blazor [Grid](slug://grid-overview) is not declared in the markup like the other data-bound columns. It renders automatically when a `DetailTemplate` is added to the Grid. At the time of writing (UI for Blazor **6.0.2**), this built-in hierarchy expand/collapse column does not support being locked or other common configurations like managing its position, setting its width, or adding a title.
 
 >tip Vote for and follow the [feature request for the Grid to support controlling the position of the expand column](https://feedback.telerik.com/blazor/1647135-ability-to-control-the-position-of-the-expand-column-in-a-hierarchical-grid).
 
 To customize the hierarchy expand/collapse column, follow these steps:
 
-1. Hide the default hierarchy expand column using [custom CSS]({%slug themes-override%}).
-2. Add another [column with a template]({%slug grid-templates-column%}) for expanding and collapsing the detail templates through the [Grid state]({%slug components/grid/features/hierarchy%}#expand-rows-from-code).
+1. Hide the default hierarchy expand column using [custom CSS](slug://themes-override).
+2. Add another [column with a template](slug://grid-templates-column) for expanding and collapsing the detail templates through the [Grid state](slug://components/grid/features/hierarchy#expand-rows-from-code).
 3. Do not set `Field` for the column, so the data operations for this column (filtering, sorting, etc.) are disabled.
 4. Toggle the icon in the custom hierarchy expand column based on the item's expanded state.
 5. Configure the custom hierarchy expand column. For example, set its order in the `GridColumns` declaration or enable the `ColumnMenu` to lock the column.
@@ -182,7 +182,7 @@ To customize the hierarchy expand/collapse column, follow these steps:
 
 ## See Also
 
-- [Telerik Blazor Grid - Overview]({%slug grid-overview%})
-- [Telerik Blazor Grid - Column Templates]({%slug grid-templates-column%})
-- [Telerik Blazor Grid - Hierarchy]({%slug components/grid/features/hierarchy%})
-- [Telerik Documentation - Styling and Themes]({%slug themes-override%})
\ No newline at end of file
+- [Telerik Blazor Grid - Overview](slug://grid-overview)
+- [Telerik Blazor Grid - Column Templates](slug://grid-templates-column)
+- [Telerik Blazor Grid - Hierarchy](slug://components/grid/features/hierarchy)
+- [Telerik Documentation - Styling and Themes](slug://themes-override)
\ No newline at end of file
diff --git a/knowledge-base/grid-custommetadata-validation-issue.md b/knowledge-base/grid-custommetadata-validation-issue.md
index d2e3b13b83..37982f94b3 100644
--- a/knowledge-base/grid-custommetadata-validation-issue.md
+++ b/knowledge-base/grid-custommetadata-validation-issue.md
@@ -86,4 +86,4 @@ The Telerik components cannot get an instance of the model in any other way, so
 
 * Create a custom edit form ([inline](https://demos.telerik.com/blazor-ui/grid/editing-custom-form) or [popup](https://github.com/telerik/blazor-ui/tree/master/grid/custom-popup-form)) where you can implement the model generation and validation as required in a way that works for your project.
 
-* If you have the same models and can create an instance that has the desired validation, you can try setting it through the [grid state]({%slug grid-state%}) to initiate insertion or editing for a particular model instance, rather than let the grid create it.
+* If you have the same models and can create an instance that has the desired validation, you can try setting it through the [grid state](slug://grid-state) to initiate insertion or editing for a particular model instance, rather than let the grid create it.
diff --git a/knowledge-base/grid-debounce-operations.md b/knowledge-base/grid-debounce-operations.md
index a13dcedd74..5708b61e96 100644
--- a/knowledge-base/grid-debounce-operations.md
+++ b/knowledge-base/grid-debounce-operations.md
@@ -31,11 +31,11 @@ There are three ideas on the basic approach how to do this:
 
 * Use the [FilterMenu](https://demos.telerik.com/blazor-ui/grid/filter-menu) filtering mode because it fires filtering requests only when the user presses a button.
 
-    * If you want to keep the UI simple (e.g., to simplify the service logic that you want to implement), the following article shows how to hide he extra filters in the filter menu: [Only one filter option in FilterMenu]({%slug grid-kb-only-one-filtermenu-option%})
+    * If you want to keep the UI simple (e.g., to simplify the service logic that you want to implement), the following article shows how to hide he extra filters in the filter menu: [Only one filter option in FilterMenu](slug://grid-kb-only-one-filtermenu-option)
 
     * if you already have an OData service that handles filtering, you can use that with the filter menu: [Get Telerik Grid Data from an OData v4 Service](https://github.com/telerik/blazor-ui/tree/master/grid/odata)
 
-* Implement the desired throttling/debouncing in the [OnRead event]({%slug common-features-data-binding-onread%}). Below is an example of this.
+* Implement the desired throttling/debouncing in the [OnRead event](slug://common-features-data-binding-onread). Below is an example of this.
 
 * Implement your own filtering (a second example is available below).
 
diff --git a/knowledge-base/grid-default-value-for-new-row.md b/knowledge-base/grid-default-value-for-new-row.md
index 74a904a2d3..72d6ba7d33 100644
--- a/knowledge-base/grid-default-value-for-new-row.md
+++ b/knowledge-base/grid-default-value-for-new-row.md
@@ -133,5 +133,5 @@ Click the <strong>Add</strong> button to see the default values for the HireDate
 
 You can use the grid state to put the grid in insert/edit mode without the built-in "Add" command. You can add a button (your own or a GridCommandButton but with a custom command name) to the toolbar, and in its OnClick event you can set the `InsertedItem` of the grid state as desired.
 
-You can find an example of this in the [Initiate Editing or Inserting of an Item]({%slug grid-kb-add-edit-state%}) example.
+You can find an example of this in the [Initiate Editing or Inserting of an Item](slug://grid-kb-add-edit-state) example.
 
diff --git a/knowledge-base/grid-different-group-and-subgroup-header-styles.md b/knowledge-base/grid-different-group-and-subgroup-header-styles.md
index 5fd041a76a..20ba6a8912 100644
--- a/knowledge-base/grid-different-group-and-subgroup-header-styles.md
+++ b/knowledge-base/grid-different-group-and-subgroup-header-styles.md
@@ -27,7 +27,7 @@ By default, the group and subgroup headers are styled in the exact same way and
 
 ## Solution
 
-You can customize the default rendering of the Grid group headers through [Group Header Template]({%slug grid-templates-group-header%}). It allows you to place the desired content in the specific group header.
+You can customize the default rendering of the Grid group headers through [Group Header Template](slug://grid-templates-group-header). It allows you to place the desired content in the specific group header.
 
 For styling customizations such as changing the background, use custom CSS as shown in the example below.
 
diff --git a/knowledge-base/grid-doubleclick-starts-editing.md b/knowledge-base/grid-doubleclick-starts-editing.md
index 83a865671a..c517ca7908 100644
--- a/knowledge-base/grid-doubleclick-starts-editing.md
+++ b/knowledge-base/grid-doubleclick-starts-editing.md
@@ -25,7 +25,7 @@ res_type: kb
 Is there a way to start the edit command with a double click on a specific cell or row?
 
 ## Solution
-The Grid currently supports an [OnRowDoubleClick event]({%slug grid-events%}#onrowdoubleclick) which can be used to programmatically set a row in edit mode through the Grid [state]({%slug grid-state%}). 
+The Grid currently supports an [OnRowDoubleClick event](slug://grid-events#onrowdoubleclick) which can be used to programmatically set a row in edit mode through the Grid [state](slug://grid-state). 
 
 See the following example for reference:
 
diff --git a/knowledge-base/grid-drag-drop-different-models.md b/knowledge-base/grid-drag-drop-different-models.md
index 682ec6c386..152b437aaa 100644
--- a/knowledge-base/grid-drag-drop-different-models.md
+++ b/knowledge-base/grid-drag-drop-different-models.md
@@ -29,7 +29,7 @@ How can I drag and drop rows between two different Grids, which are bound to dif
 
 ## Solution
 
-1. [Bind the two Grids to the same interface]({%slug grid-data-binding%}#binding-to-interface).
+1. [Bind the two Grids to the same interface](slug://grid-data-binding#binding-to-interface).
 1. Use the interface type in all event handlers related to drag-and-drop.
 1. If the two Grid models include unique property names, disable sorting and filtering for the respective columns. Otherwise, the Grids will be unable to build their internal filtering logic and will throw a null reference exception.
 
@@ -171,4 +171,4 @@ How can I drag and drop rows between two different Grids, which are bound to dif
 
 ## See Also
 
-* [Grid Row Drag and Drop]({%slug grid-drag-drop-overview%})
+* [Grid Row Drag and Drop](slug://grid-drag-drop-overview)
diff --git a/knowledge-base/grid-drag-drop-in-different-components.md b/knowledge-base/grid-drag-drop-in-different-components.md
index 083dd85914..f69a57e2c9 100644
--- a/knowledge-base/grid-drag-drop-in-different-components.md
+++ b/knowledge-base/grid-drag-drop-in-different-components.md
@@ -35,7 +35,7 @@ You can approach drag and drop across different parent components in at least tw
 * Use parameters and `EventCallback`s to pass information between the two parent Razor components, which hold the Telerik components. This is a suitable approach if the two parent components are siblings in their parent.
 * Use a state management service in your app, which will execute methods and fire events to the Razor components that hold the Telerik components. This is a suitable approach in all cases, but especially if the two parent components are further away in the app component hierarchy.
 
-The described algorithm and the example below are applicable for the [Grid]({%slug grid-drag-drop-overview%}), [TreeList]({%slug treelist-drag-drop-overview%}), and [TreeView]({%slug treeview-drag-drop-overview%}).
+The described algorithm and the example below are applicable for the [Grid](slug://grid-drag-drop-overview), [TreeList](slug://treelist-drag-drop-overview), and [TreeView](slug://treeview-drag-drop-overview).
 
 ## Example
 
@@ -178,6 +178,6 @@ namespace YourAppName.Data
 
 ## See Also
 
-* [Grid Drag and Drop Documentation]({%slug grid-drag-drop-overview%})
-* [TreeList Drag and Drop Documentation]({%slug treelist-drag-drop-overview%})
-* [TreeView Drag and Drop Documentation]({%slug treeview-drag-drop-overview%})
+* [Grid Drag and Drop Documentation](slug://grid-drag-drop-overview)
+* [TreeList Drag and Drop Documentation](slug://treelist-drag-drop-overview)
+* [TreeView Drag and Drop Documentation](slug://treeview-drag-drop-overview)
diff --git a/knowledge-base/grid-dynamic-column-template.md b/knowledge-base/grid-dynamic-column-template.md
index 9c28f1cf8c..70b6526556 100644
--- a/knowledge-base/grid-dynamic-column-template.md
+++ b/knowledge-base/grid-dynamic-column-template.md
@@ -127,6 +127,6 @@ You can combine this approach with a loop over a column descriptor so you can cr
 
 Generally, casting of the `Template` `context` is required because an `object` is passed to the `RenderFragment`. Currently, there is no option to pass the `typeparam` of a parent component down to its children, and that is why we are using an `object` instead of the `TItem` that you have bound the Grid to: <a href="https://github.com/dotnet/aspnetcore/issues/7268" target="_blank">https://github.com/dotnet/aspnetcore/issues/7268</a>
 
-For example, the [`RowTemplate`]({%slug grid-templates-row%}) of the Grid uses `RenderFragment<TItem>` where no additional casting is needed, but the [cell template]({%slug grid-templates-column%}) is a child component of the row so it can only get an `object`.
+For example, the [`RowTemplate`](slug://grid-templates-row) of the Grid uses `RenderFragment<TItem>` where no additional casting is needed, but the [cell template](slug://grid-templates-column) is a child component of the row so it can only get an `object`.
 
 To summarize, once the framework provides the ability to pass the `typeparam` to child components, there will be no need to cast the `context` to the model and the code will look cleaner. Until then, there is no other way to avoid those lines of casting.
diff --git a/knowledge-base/grid-dynamically-adjusting-column-header-styles.md b/knowledge-base/grid-dynamically-adjusting-column-header-styles.md
index 5aa2512d55..df3f366d7a 100644
--- a/knowledge-base/grid-dynamically-adjusting-column-header-styles.md
+++ b/knowledge-base/grid-dynamically-adjusting-column-header-styles.md
@@ -22,13 +22,13 @@ ticketid: 1670074
 
 ## Description
 
-I am dynamically creating Grid columns in a loop and trying to adjust the column header cell style based on some condition and value from the [column field]({%slug components/grid/columns/bound%}#data-binding). Ideally, I want to implement logic to make this adjustment based on the value in the header cell. I have not been able to achieve this in the `HeaderTemplate` tag or in any of the cell render events handlers. In other templates, I have access to the `@context` field, which would make this easy, but that doesn't seem to work in the `HeaderTemplate`.
+I am dynamically creating Grid columns in a loop and trying to adjust the column header cell style based on some condition and value from the [column field](slug://components/grid/columns/bound#data-binding). Ideally, I want to implement logic to make this adjustment based on the value in the header cell. I have not been able to achieve this in the `HeaderTemplate` tag or in any of the cell render events handlers. In other templates, I have access to the `@context` field, which would make this easy, but that doesn't seem to work in the `HeaderTemplate`.
 
 ## Solution
 
-To style a column header cell when dynamically creating columns in a loop, use the [`HeaderClass` parameter]({%slug components/grid/columns/bound%}#appearance) to set a CSS class under a condition and apply different styles depending on the class. For scenarios with numerous and more complex conditions, you can create a method to determine the appropriate class.
+To style a column header cell when dynamically creating columns in a loop, use the [`HeaderClass` parameter](slug://components/grid/columns/bound#appearance) to set a CSS class under a condition and apply different styles depending on the class. For scenarios with numerous and more complex conditions, you can create a method to determine the appropriate class.
 
-Note that the [`HeaderTemplate`]({%slug grid-templates-column-header%}) does not receive a context argument because it is not related to rows and models, as outlined in the [Templates Overview]({%slug components/grid/features/templates%}) of the Telerik UI for Blazor documentation.
+Note that the [`HeaderTemplate`](slug://grid-templates-column-header) does not receive a context argument because it is not related to rows and models, as outlined in the [Templates Overview](slug://components/grid/features/templates) of the Telerik UI for Blazor documentation.
 
 ### Example
 
@@ -129,6 +129,6 @@ Note that the [`HeaderTemplate`]({%slug grid-templates-column-header%}) does not
 
 ## See Also
 
-- [Grid HeaderClass Parameter]({%slug components/grid/columns/bound%}#appearance)
-- [Grid Column Header Template]({%slug grid-templates-column-header%})
-- [Templates Overview - Telerik UI for Blazor]({%slug components/grid/features/templates%})
+- [Grid HeaderClass Parameter](slug://components/grid/columns/bound#appearance)
+- [Grid Column Header Template](slug://grid-templates-column-header)
+- [Templates Overview - Telerik UI for Blazor](slug://components/grid/features/templates)
diff --git a/knowledge-base/grid-edit-in-hierarchy.md b/knowledge-base/grid-edit-in-hierarchy.md
index 5d0f7f830e..9c58fc3dc5 100644
--- a/knowledge-base/grid-edit-in-hierarchy.md
+++ b/knowledge-base/grid-edit-in-hierarchy.md
@@ -22,15 +22,15 @@ res_type: kb
 
 ## Description
 
-This article shows how to create, update, and delete items in the main (master) and nested (detail) Grids in a [hierarchy]({%slug components/grid/features/hierarchy%}).
+This article shows how to create, update, and delete items in the main (master) and nested (detail) Grids in a [hierarchy](slug://components/grid/features/hierarchy).
 
 
 ## Solution
 
 The Grid CRUD operations are independent of the hierarchy. Each Grid performs editing separately and has its own handlers.
 
-1. [Configure editing for the main Grid]({%slug components/grid/editing/overview%}).
-1. Define a [`DetailTemplate`]({%slug components/grid/features/hierarchy%}) and configure the nested Grid inside it, including editing.
+1. [Configure editing for the main Grid](slug://components/grid/editing/overview).
+1. Define a [`DetailTemplate`](slug://components/grid/features/hierarchy) and configure the nested Grid inside it, including editing.
 1. To persist the expanded state of a `DetailTemplate` while editing its parent item, override the `Equals()` method of the master data item class. This is supported from version **5.1.0**.
 
 The example below shows the separate CUD event handlers and also how to get the parent data item in the nested Grid handlers. The `UpdateOrder`, `CreateOrder`, and `DeleteOrder` handlers receive the `productItem` in order to access the data item from the parent Grid. If you don't need access to the main Grid's data, don't pass the context through a lambda function.
@@ -316,5 +316,5 @@ Grid <code>EditMode</code>:
 
 ## See Also
 
-* [Grid Editing]({%slug components/grid/editing/overview%})
-* [Grid Hierarchy]({%slug components/grid/features/hierarchy%})
+* [Grid Editing](slug://components/grid/editing/overview)
+* [Grid Hierarchy](slug://components/grid/features/hierarchy)
diff --git a/knowledge-base/grid-edit-on-row-double-click.md b/knowledge-base/grid-edit-on-row-double-click.md
index 85002188be..a9dbf497a4 100644
--- a/knowledge-base/grid-edit-on-row-double-click.md
+++ b/knowledge-base/grid-edit-on-row-double-click.md
@@ -27,7 +27,7 @@ I would like to edit a row in the Grid when the user clicks or double-clicks on
 
 ## Solution
 
-The Grid exposes two events that allows you to respond to the user clicking on its rows - [OnRowClick]({%slug grid-events%}#onrowclick) and [OnRowDoubleClick]({%slug grid-events%}#onrowdoubleclick). You can use either one of them together with the [Window]({%slug window-overview%}) to create a custom popup form on a click of a row.
+The Grid exposes two events that allows you to respond to the user clicking on its rows - [OnRowClick](slug://grid-events#onrowclick) and [OnRowDoubleClick](slug://grid-events#onrowdoubleclick). You can use either one of them together with the [Window](slug://window-overview) to create a custom popup form on a click of a row.
 
 >caption Use the OnRowDoubleClick event to put the Grid in Edit mode
 
diff --git a/knowledge-base/grid-edit-selected-item.md b/knowledge-base/grid-edit-selected-item.md
index 466fe2bd74..f21e658ac1 100644
--- a/knowledge-base/grid-edit-selected-item.md
+++ b/knowledge-base/grid-edit-selected-item.md
@@ -27,13 +27,13 @@ I would like to edit the selected item in the Grid when the `GridSelectionMode`
 
 ## Solution
 
-You can use the regular [TelerikButton]({%slug components/button/overview%}) and the [Grid State]({%slug grid-state%}). Below you can see a detailed step by step explanation and a sample implementation.
+You can use the regular [TelerikButton](slug://components/button/overview) and the [Grid State](slug://grid-state). Below you can see a detailed step by step explanation and a sample implementation.
 
 ### Step by Step Explanation
 
 1. Create a new instance of the class you bound the Grid to in order to contain the information for the selected item.
 
-1. Use one-way data binding for the `SelectedItems` parameter and in the handler for the [`SelectedItemsChanged`]({%slug grid-selection-row%}#selecteditemschanged-event) populate the instance of the class created in the previous point.
+1. Use one-way data binding for the `SelectedItems` parameter and in the handler for the [`SelectedItemsChanged`](slug://grid-selection-row#selecteditemschanged-event) populate the instance of the class created in the previous point.
 
 1. Enable the `Edit` and `Delete` buttons when the selected item is not `null` by using the `Enabled` parameter for the `TelerikButton`.
 
diff --git a/knowledge-base/grid-expand-button-tooltip.md b/knowledge-base/grid-expand-button-tooltip.md
index a6143aa792..4cde2a14a0 100644
--- a/knowledge-base/grid-expand-button-tooltip.md
+++ b/knowledge-base/grid-expand-button-tooltip.md
@@ -29,7 +29,7 @@ I want to add a tooltip to the hierarchy expand button for the detail template a
 ## Solution
 You can use JS Interop to add title attributes on the grid elements.
 
-You can call this JS function after the grid re-renders with new data by using its [OnRead event]({%slug components/grid/manual-operations%}).
+You can call this JS function after the grid re-renders with new data by using its [OnRead event](slug://components/grid/manual-operations).
 
 The example below shows one way to do that, and to distinguish a particular grid, and to pass the title attribute value from the C# code so you can, for example, localize it.
 
diff --git a/knowledge-base/grid-expand-collapse-detail-onclick-or-ondoubleclick.md b/knowledge-base/grid-expand-collapse-detail-onclick-or-ondoubleclick.md
index f393108b76..48be2cc489 100644
--- a/knowledge-base/grid-expand-collapse-detail-onclick-or-ondoubleclick.md
+++ b/knowledge-base/grid-expand-collapse-detail-onclick-or-ondoubleclick.md
@@ -27,11 +27,11 @@ I want to expand and collapse the Grid Details on row click or double click inst
 
 ## Solution
 
-Handle the Grid events ([`OnRowClick`]({%slug grid-events%}#onrowclick) or [`OnRowDoubleClick`]({%slug grid-events%}#onrowdoubleclick)) to programmatically expand/collapse the `DetailTemplate` of a master item.
+Handle the Grid events ([`OnRowClick`](slug://grid-events#onrowclick) or [`OnRowDoubleClick`](slug://grid-events#onrowdoubleclick)) to programmatically expand/collapse the `DetailTemplate` of a master item.
 
-In the event handlers, get the [Grid State]({%slug grid-state%}) and modify its `ExpandedItems` field. If the current item is not expanded, add it to the `ExpandedItems` collection. If it is already expanded - remove it from the collection. Set the modified Grid State afterwards. The examples below demonstrate how to achieve that.
+In the event handlers, get the [Grid State](slug://grid-state) and modify its `ExpandedItems` field. If the current item is not expanded, add it to the `ExpandedItems` collection. If it is already expanded - remove it from the collection. Set the modified Grid State afterwards. The examples below demonstrate how to achieve that.
 
->tip If you want to keep only one Detail page expanded, check the [Only one Grid-Detail page expanded at once on row click]({%slug grid-kb-one-expanded-detail-template%}) knowledge base article.
+>tip If you want to keep only one Detail page expanded, check the [Only one Grid-Detail page expanded at once on row click](slug://grid-kb-one-expanded-detail-template) knowledge base article.
 
 >caption Expand/Collapse Detail page OnRowClick
 
diff --git a/knowledge-base/grid-expand-only-current.md b/knowledge-base/grid-expand-only-current.md
index 6a157ccecc..f1de5b9f67 100644
--- a/knowledge-base/grid-expand-only-current.md
+++ b/knowledge-base/grid-expand-only-current.md
@@ -28,9 +28,9 @@ I have a Grid with hierarchy enabled. When I expand one row, I want to programma
 
 ## Solution
 
-1. Handle the [Grid `OnRowExpand` event]({%slug grid-events%}#onrowexpand). It provides argument of type `GridRowExpandEventArgs` with a `Item` field that refers to the currently expanded Grid item.
+1. Handle the [Grid `OnRowExpand` event](slug://grid-events#onrowexpand). It provides argument of type `GridRowExpandEventArgs` with a `Item` field that refers to the currently expanded Grid item.
 1. Set the `ShouldRender` property of the `GridRowExpandEventArgs` argument to `true`.
-1. Use the [Grid State]({%slug grid-state%}) to programmatically set its `ExpandedItems` property. Set `ExpandedItems` to a `List<T>` that should only contain the currently expanded item. This will result in collapsing all previously expanded items.
+1. Use the [Grid State](slug://grid-state) to programmatically set its `ExpandedItems` property. Set `ExpandedItems` to a `List<T>` that should only contain the currently expanded item. This will result in collapsing all previously expanded items.
 
 ````RAZOR
 <TelerikGrid @ref="@GridRef"
diff --git a/knowledge-base/grid-export-image-column-excel.md b/knowledge-base/grid-export-image-column-excel.md
index 2ad65f1aa2..e92c586cfa 100644
--- a/knowledge-base/grid-export-image-column-excel.md
+++ b/knowledge-base/grid-export-image-column-excel.md
@@ -22,18 +22,18 @@ ticketid: 1666986, 1662544, 1645206, 1655440
 
 ## Description
 
-I want to export the Telerik Blazor [Grid]({%slug grid-overview%})'s column that displays images to an Excel file. The images are rendered in a [Grid column template]({%slug grid-templates-column%}). How can I include the image column in the Excel export?
+I want to export the Telerik Blazor [Grid](slug://grid-overview)'s column that displays images to an Excel file. The images are rendered in a [Grid column template](slug://grid-templates-column). How can I include the image column in the Excel export?
 
 ## Solution
 
 To export an image column from the Grid to Excel, follow these steps:
 
-1. Handle the Grid's [`OnAfterExport` event]({%slug grid-export-events%}#onafterexport) to capture the Excel export output as a memory stream.
-2. Use the [SpreadProcessing library](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/overview) to modify the Excel file. Similar to how the exported file is customized here - [Custom cell formatting of the exported file with RadSpreadProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadprocessing%}). The SpreadProcessing library supports [inserting images in the cells](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/features/shapes-and-images).
+1. Handle the Grid's [`OnAfterExport` event](slug://grid-export-events#onafterexport) to capture the Excel export output as a memory stream.
+2. Use the [SpreadProcessing library](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/overview) to modify the Excel file. Similar to how the exported file is customized here - [Custom cell formatting of the exported file with RadSpreadProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadprocessing). The SpreadProcessing library supports [inserting images in the cells](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/features/shapes-and-images).
 
 If you encounter any questions regarding the usage of the Document Processing libraries, [contact the DocumentPorcessing team](https://docs.telerik.com/devtools/document-processing/knowledge-base/submit-support-tickets).
 
 ## See Also
 
-- [Handling Export Events in Grid]({%slug grid-export-events%})
-- [Knowlegde base article about custom cell formatting of the exported file with RadSpreadProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadprocessing%})
+- [Handling Export Events in Grid](slug://grid-export-events)
+- [Knowlegde base article about custom cell formatting of the exported file with RadSpreadProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadprocessing)
diff --git a/knowledge-base/grid-export-selected-rows.md b/knowledge-base/grid-export-selected-rows.md
index 9c957cce37..2793451dbd 100644
--- a/knowledge-base/grid-export-selected-rows.md
+++ b/knowledge-base/grid-export-selected-rows.md
@@ -33,9 +33,9 @@ How to export custom Grid data (for example the Grid selection) to CSV?
 
 ## Solution
 
-1. Configure [Grid selection]({%slug grid-selection-overview%}) via the `SelectionMode` and `SelectedItems` parameters.
-1. Configure [Grid Excel export]({%slug grid-export-excel%}) or [Grid CSV export]({%slug grid-export-csv%}) via command buttons, for example in the [`<GridToolBarTemplate>`]({%slug components/grid/features/toolbar%}).
-1. Subscribe to the [`OnBeforeExport` event]({%slug grid-export-events%}) in `<GridExcelExport>` or `<GridCsvExport>`.
+1. Configure [Grid selection](slug://grid-selection-overview) via the `SelectionMode` and `SelectedItems` parameters.
+1. Configure [Grid Excel export](slug://grid-export-excel) or [Grid CSV export](slug://grid-export-csv) via command buttons, for example in the [`<GridToolBarTemplate>`](slug://components/grid/features/toolbar).
+1. Subscribe to the [`OnBeforeExport` event](slug://grid-export-events) in `<GridExcelExport>` or `<GridCsvExport>`.
 1. In the `OnBeforeExport` handler, set the `Data` property of the event argument object to the Grid `SelectedItems` collection.
 
 >caption Export only the selected Grid rows to Excel or CSV
@@ -114,8 +114,8 @@ How to export custom Grid data (for example the Grid selection) to CSV?
 
 ## See Also
 
-* [Grid Excel Export]({%slug grid-export-excel%})
-* [Grid CSV Export]({%slug grid-export-csv%})
-* [Grid Export Events]({%slug grid-export-events%})
-* [Grid Selection]({%slug grid-selection-overview%})
-* [Grid ToolBar]({%slug components/grid/features/toolbar%})
+* [Grid Excel Export](slug://grid-export-excel)
+* [Grid CSV Export](slug://grid-export-csv)
+* [Grid Export Events](slug://grid-export-events)
+* [Grid Selection](slug://grid-selection-overview)
+* [Grid ToolBar](slug://components/grid/features/toolbar)
diff --git a/knowledge-base/grid-filter-by-selected-items.md b/knowledge-base/grid-filter-by-selected-items.md
index f8fb1b54d0..5f838729f0 100644
--- a/knowledge-base/grid-filter-by-selected-items.md
+++ b/knowledge-base/grid-filter-by-selected-items.md
@@ -36,17 +36,17 @@ To simulate filtering by the selected items:
 
 1. To clear this "filter" and show all items (not only the selected ones), assign the actual data source to the Grid.
 
-1. Consider and choose the desired UI for triggering that custom filtering, for example, a filter button or menu. Use the needed template to declare the custom filter UI in the Grid. Useful options can be the [Toolbar]({%slug components/grid/features/toolbar%}) or the [Checkbox Column Header]({%slug components/grid/columns/checkbox%}#header-template)(in case you are using [CheckBox selection]({%slug grid-selection-row%}#basics)).
+1. Consider and choose the desired UI for triggering that custom filtering, for example, a filter button or menu. Use the needed template to declare the custom filter UI in the Grid. Useful options can be the [Toolbar](slug://components/grid/features/toolbar) or the [Checkbox Column Header](slug://components/grid/columns/checkbox#header-template)(in case you are using [CheckBox selection](slug://grid-selection-row#basics)).
 
-> [Override the `Equals` method]({%slug grid-selection-row%}#equals-comparison) so that the selection is preserved during filtering.
+> [Override the `Equals` method](slug://grid-selection-row#equals-comparison) so that the selection is preserved during filtering.
 
-The data assignment will vary depending on the [data binding type you are using for the Grid]({%slug grid-data-binding%}#basics). See examples below:
+The data assignment will vary depending on the [data binding type you are using for the Grid](slug://grid-data-binding#basics). See examples below:
 * [Data binding through the Data parameter](#data-binding-through-the-data-parameter)
 * [Data binding through the OnRead event](#data-binding-through-the-onread-event)
 
 ### Data binding through the Data parameter
 
-Assign the `SelectedItems` to the [`Data` parameter]({%slug common-features-data-binding-overview%}) of the Grid. [Refresh the Grid]({%slug grid-refresh-data%}) each time you change its data so the changes are visible in the viewport.
+Assign the `SelectedItems` to the [`Data` parameter](slug://common-features-data-binding-overview) of the Grid. [Refresh the Grid](slug://grid-refresh-data) each time you change its data so the changes are visible in the viewport.
 
 >caption Show only selected items in Grid using the Data parameter
 
@@ -146,7 +146,7 @@ Assign the `SelectedItems` to the [`Data` parameter]({%slug common-features-data
 
 ### Data binding through the OnRead event
 
-Bind the Grid [through the `OnRead` event]({%slug common-features-data-binding-onread%}).
+Bind the Grid [through the `OnRead` event](slug://common-features-data-binding-onread).
 
 Toggle a flag when the user initiates the filtering. Then call the `Rebind` method - this will force the Grid to fire its `OnRead` event. 
 
@@ -275,5 +275,5 @@ Depending on the flag value, you can make the request based on the corresponding
 
 ## See Also
 
-* [Data Binding to through the `Data` parameter]({%slug common-features-data-binding-overview%})
-* [Data Binding to through the `OnRead` event]({%slug common-features-data-binding-onread%})
+* [Data Binding to through the `Data` parameter](slug://common-features-data-binding-overview)
+* [Data Binding to through the `OnRead` event](slug://common-features-data-binding-onread)
diff --git a/knowledge-base/grid-filter-column-list.md b/knowledge-base/grid-filter-column-list.md
index 6aba03c7d7..7d32b5f938 100644
--- a/knowledge-base/grid-filter-column-list.md
+++ b/knowledge-base/grid-filter-column-list.md
@@ -44,12 +44,12 @@ The required approach revolves around two milestones:
 
 Here are step-by-step instructions:
 
-1. Define a [`FilterCellTemplate` or a `FilterMenuTemplate`]({%slug grid-templates-filter%}), depending on the Grid `FilterMode`. Add a [MultiSelect]({%slug multiselect-overview%}) or another dropdown component in the template, according to your preferences. It's also possible to use [CheckBoxes]({%slug checkbox-overview%}).
-1. (only for `FilterRow` mode) Handle the [`ValueChanged` or `OnChange` event]({%slug multiselect-events%}) of the component inside the filter template. Pass the `FilterCellTemplateContext` to the handler and call its `FilterAsync()` method to trigger Grid rebind.
-1. (only for `FilterMenu` mode) Use a [`FilterMenuButtonsTemplate`]({%slug grid-templates-filter%}#filter-menu-buttons-template) for the Filter and Clear buttons inside the filter menu. Use [Button `OnClick`]({%slug button-events%}) handlers to call the `FilterAsync()` or `ClearFilterAsync()` methods of the `FilterMenuTemplateContext`. In the latter case, also clear the selected values of the filtering component.
-1. Use the Grid [`OnRead` event]({%slug common-features-data-binding-onread%}) to data bind the component, instead of the `Data` parameter.
+1. Define a [`FilterCellTemplate` or a `FilterMenuTemplate`](slug://grid-templates-filter), depending on the Grid `FilterMode`. Add a [MultiSelect](slug://multiselect-overview) or another dropdown component in the template, according to your preferences. It's also possible to use [CheckBoxes](slug://checkbox-overview).
+1. (only for `FilterRow` mode) Handle the [`ValueChanged` or `OnChange` event](slug://multiselect-events) of the component inside the filter template. Pass the `FilterCellTemplateContext` to the handler and call its `FilterAsync()` method to trigger Grid rebind.
+1. (only for `FilterMenu` mode) Use a [`FilterMenuButtonsTemplate`](slug://grid-templates-filter#filter-menu-buttons-template) for the Filter and Clear buttons inside the filter menu. Use [Button `OnClick`](slug://button-events) handlers to call the `FilterAsync()` or `ClearFilterAsync()` methods of the `FilterMenuTemplateContext`. In the latter case, also clear the selected values of the filtering component.
+1. Use the Grid [`OnRead` event](slug://common-features-data-binding-onread) to data bind the component, instead of the `Data` parameter.
 1. In the `OnRead` handler, implement custom data filtering for the list column, based on the user selection in the filter template. The implementation of this step depends on your preferences and requirements.
-1. Optionally, use [`ToDataSourceResult` or `ToDataSourceResultAsync`]({%slug common-features-data-binding-onread%}#todatasourceresult-method) for the other data operations (sorting, paging, grouping, filtering of the other columns).
+1. Optionally, use [`ToDataSourceResult` or `ToDataSourceResultAsync`](slug://common-features-data-binding-onread#todatasourceresult-method) for the other data operations (sorting, paging, grouping, filtering of the other columns).
 
 The example below includes two Grids - one for each `FilterMode`.
 
@@ -289,5 +289,5 @@ The example below includes two Grids - one for each `FilterMode`.
 
 ## See Also
 
-* [OnRead data binding]({%slug common-features-data-binding-onread%})
-* [Grid filter template]({%slug grid-templates-filter%})
+* [OnRead data binding](slug://common-features-data-binding-onread)
+* [Grid filter template](slug://grid-templates-filter)
diff --git a/knowledge-base/grid-filter-date-only.md b/knowledge-base/grid-filter-date-only.md
index df06b1bd95..5e705f8104 100644
--- a/knowledge-base/grid-filter-date-only.md
+++ b/knowledge-base/grid-filter-date-only.md
@@ -40,14 +40,14 @@ Here are 4 different ways to achieve date-only filtering with `is equal to` filt
 
 ### Handle OnStateChanged
 
-This approach is suitable for [`FilterMenu` filter mode]({%slug grid-filter-menu%}). The Grid will reveal the filtering customization in its filter menu - the filter operators will change and the two DatePickers will show adjacent date values. After the initial `is equal to` filtering, the application business logic should determine how to handle the next user actions.
+This approach is suitable for [`FilterMenu` filter mode](slug://grid-filter-menu). The Grid will reveal the filtering customization in its filter menu - the filter operators will change and the two DatePickers will show adjacent date values. After the initial `is equal to` filtering, the application business logic should determine how to handle the next user actions.
 
-1. Subscribe to the [`OnStateChanged` event]({%slug grid-state%}#events).
+1. Subscribe to the [`OnStateChanged` event](slug://grid-state#events).
 1. Check if [`args.PropertyName`](/blazor-ui/api/Telerik.Blazor.Components.GridStateEventArgs-1) is `"FilterDescriptors"`.
 1. Iterate the filter descriptors in `args.GridState.FilterDescriptors`.
-1. If there is an active filter for the date column, [modify the filter descriptors to filter the Grid rows between two dates]({%slug grid-state%}#setstateasync-examples).
+1. If there is an active filter for the date column, [modify the filter descriptors to filter the Grid rows between two dates](slug://grid-state#setstateasync-examples).
 
-Note the [difference between `FilterDescriptor` and `CompositeFilterDescriptor`]({%slug components/grid/filtering%}#filter-descriptors). This scenario involves both types.
+Note the [difference between `FilterDescriptor` and `CompositeFilterDescriptor`](slug://components/grid/filtering#filter-descriptors). This scenario involves both types.
 
 >caption Filter Grid by date via filter descriptor changes in OnStateChanged
 
@@ -122,10 +122,10 @@ Note the [difference between `FilterDescriptor` and `CompositeFilterDescriptor`]
 
 ### Bind via OnRead
 
-This approach is suitable for [`FilterRow` filter mode]({%slug grid-filter-row%}). The Grid filtering interface will not reveal the filtering customization to the user.
+This approach is suitable for [`FilterRow` filter mode](slug://grid-filter-row). The Grid filtering interface will not reveal the filtering customization to the user.
 
-1. Bind the Grid via its [`OnRead` event]({%slug common-features-data-binding-onread%}).
-1. Check for existing filters in the [`DataSourceRequest` argument]({%slug common-features-data-binding-onread%}#event-argument) (`args.Request.Filters`).
+1. Bind the Grid via its [`OnRead` event](slug://common-features-data-binding-onread).
+1. Check for existing filters in the [`DataSourceRequest` argument](slug://common-features-data-binding-onread#event-argument) (`args.Request.Filters`).
 1. If there is an active filter for the date column, change the `Operator` and `Value` of the existing [`FilterDescriptor`](/blazor-ui/api/Telerik.DataSource.FilterDescriptor). Add one more filter descriptor for the same column (`Member`), so that the date column is filtered between two dates.
 1. Continue the `OnRead` handler execution with the modified `DataSourceRequest` object.
 
@@ -219,8 +219,8 @@ This approach is suitable for [`FilterRow` filter mode]({%slug grid-filter-row%}
 This approach is suitable for both filter menu and filter row modes. It has the following specifics:
 
 * Sorting will ignore the time values, unless there is an extra column, which is bound to the complete `DateTime` value.
-* Time value display requires a [column `Template`]({%slug grid-templates-column%}) or an extra "time" column.
-* Time value editing requires an [`EditorTemplate`]({%slug grid-templates-editor%}).
+* Time value display requires a [column `Template`](slug://grid-templates-column) or an extra "time" column.
+* Time value editing requires an [`EditorTemplate`](slug://grid-templates-editor).
 
 >caption Filter Grid by date via additional model property
 
@@ -289,8 +289,8 @@ This approach is suitable for both filter menu and filter row modes. It has the
 
 ### Use Filter Template
 
-* This approach is suitable for [`FilterMenu` filter mode]({%slug grid-filter-menu%}).
-* The date column requires a [`FilterMenuTemplate`]({%slug grid-templates-filter%}).
+* This approach is suitable for [`FilterMenu` filter mode](slug://grid-filter-menu).
+* The date column requires a [`FilterMenuTemplate`](slug://grid-templates-filter).
 * The filter menu template provides full control over filtering interface and behavior.
 * More coding may be required.
 
@@ -299,6 +299,6 @@ See the [Grid Filter Menu Template Demo](https://demos.telerik.com/blazor-ui/gri
 
 ## See Also
 
-* [Grid State]({%slug grid-state%})
-* [Grid Filtering Overview]({%slug components/grid/filtering%})
-* [Grid Manual Data Operations with OnRead]({%slug components/grid/manual-operations%})
+* [Grid State](slug://grid-state)
+* [Grid Filtering Overview](slug://components/grid/filtering)
+* [Grid Manual Data Operations with OnRead](slug://components/grid/manual-operations)
diff --git a/knowledge-base/grid-filter-edit-enum.md b/knowledge-base/grid-filter-edit-enum.md
index 838177cfb4..2f04ddcf17 100644
--- a/knowledge-base/grid-filter-edit-enum.md
+++ b/knowledge-base/grid-filter-edit-enum.md
@@ -27,7 +27,7 @@ If I'm filtering a column containing enum values I expect a dropdown of availabl
 
 ## Solution
 
-For versions prior to `2.15.0`, you could use a [custom editor template]({%slug grid-templates-editor%}) and put a [dropdown bound to the enum]({%slug dropdown-kb-bind-to-enum%}) in it. Filtering, however, was based on the numerical values of the enum.
+For versions prior to `2.15.0`, you could use a [custom editor template](slug://grid-templates-editor) and put a [dropdown bound to the enum](slug://dropdown-kb-bind-to-enum) in it. Filtering, however, was based on the numerical values of the enum.
 
 As of **2.15.0**, the grid provides enum filtering and editing through dropdowns out-of-the-box without any additional code.
 
diff --git a/knowledge-base/grid-filter-operator-dropdown.md b/knowledge-base/grid-filter-operator-dropdown.md
index 62016e046a..28ef5c807b 100644
--- a/knowledge-base/grid-filter-operator-dropdown.md
+++ b/knowledge-base/grid-filter-operator-dropdown.md
@@ -26,7 +26,7 @@ res_type: kb
 
 This KB article answers the following questions:
 
-* How to implement a filter operator dropdown list in a [Grid filter row template (`FilterCellTemplate`)]({%slug grid-templates-filter%})?
+* How to implement a filter operator dropdown list in a [Grid filter row template (`FilterCellTemplate`)](slug://grid-templates-filter)?
 * How to reuse the filter operator logic and the clear filter button logic across multiple filter cell templates?
 
 
@@ -42,7 +42,7 @@ The sample also shows a few additional optional features:
 * Highlight the Filter Operator DropDownList when the column is filtered. See the `IsFilterActive` parameter of `FilterOperatorList`.
 * Choose the available options in the Filter Operator DropDownList. See the `FilterOperators` parameter of `FilterOperatorList`.
 
-`FilterOperatorList` and `FilterClearButton` are custom Razor components. The implementation is just an example and subject to customization, according to the specific scenario and business requirements. Refer to the [Grid Filtering]({%slug components/grid/filtering%}) and [Grid Filter Templates]({%slug grid-templates-filter%}) documentation for more information about how filtering works.
+`FilterOperatorList` and `FilterClearButton` are custom Razor components. The implementation is just an example and subject to customization, according to the specific scenario and business requirements. Refer to the [Grid Filtering](slug://components/grid/filtering) and [Grid Filter Templates](slug://grid-templates-filter) documentation for more information about how filtering works.
 
 >caption Using Filter Operators and Clear Button in FilterCellTemplate
 
@@ -453,5 +453,5 @@ The sample also shows a few additional optional features:
 
 ## See Also
 
-* [Grid Filtering]({%slug components/grid/filtering%})
-* [Grid Filter Templates]({%slug grid-templates-filter%})
+* [Grid Filtering](slug://components/grid/filtering)
+* [Grid Filter Templates](slug://grid-templates-filter)
diff --git a/knowledge-base/grid-filterrow-bool-customization.md b/knowledge-base/grid-filterrow-bool-customization.md
index 08a0308d5f..b83e71532a 100644
--- a/knowledge-base/grid-filterrow-bool-customization.md
+++ b/knowledge-base/grid-filterrow-bool-customization.md
@@ -30,7 +30,7 @@ This KB article answers the following questions:
 
 ## Solution
 
-1. Define a [Filter Row Template]({%slug grid-templates-filter%}#filter-row-template).
+1. Define a [Filter Row Template](slug://grid-templates-filter#filter-row-template).
 1. Create a `DropDownList` that includes the custom display values.
 1. Create a `Button` that will replicate the `FilterRow` clear button.
 1. Implement a method that manually filters the Grid based on the DropDownList selection.
@@ -150,7 +150,7 @@ This KB article answers the following questions:
 
 ## See Also
 
-* [Grid Filtering]({%slug components/grid/filtering%})
-* [Grid Filter Templates]({%slug grid-templates-filter%})
-* [Grid Filter From Code]({%slug grid-filter-row%}#filter-from-code)
-* [Use Filter Operator Drop-Down in Filter Template]({%slug grid-kb-filter-operator-dropdown%})
\ No newline at end of file
+* [Grid Filtering](slug://components/grid/filtering)
+* [Grid Filter Templates](slug://grid-templates-filter)
+* [Grid Filter From Code](slug://grid-filter-row#filter-from-code)
+* [Use Filter Operator Drop-Down in Filter Template](slug://grid-kb-filter-operator-dropdown)
\ No newline at end of file
diff --git a/knowledge-base/grid-force-refresh.md b/knowledge-base/grid-force-refresh.md
index e4af0d7190..bb7f9e6062 100644
--- a/knowledge-base/grid-force-refresh.md
+++ b/knowledge-base/grid-force-refresh.md
@@ -38,7 +38,7 @@ There are two different cases:
 
 For general cases, to refresh the rendered data in the Grid, [use an `ObservableCollection`](https://demos.telerik.com/blazor-ui/grid/observable-data). To change the entire data collection, `.Clear()` the collection first to notify the grid that this old data is gone, then create a new one with the new data.
 
-If you don't use an `ObservableCollection`, then [create a `new` instance of the collection and set it to the `Data` parameter]({%slug grid-refresh-data%}#new-collection-reference). A `new` instance provides a new reference, which fires the `OnParametersSet` event from the framework. This lets the Grid redraw. If you only add/remove items from the same collection, the reference to the entire data collection stays the same and the Grid is not notified of the change.
+If you don't use an `ObservableCollection`, then [create a `new` instance of the collection and set it to the `Data` parameter](slug://grid-refresh-data#new-collection-reference). A `new` instance provides a new reference, which fires the `OnParametersSet` event from the framework. This lets the Grid redraw. If you only add/remove items from the same collection, the reference to the entire data collection stays the same and the Grid is not notified of the change.
 
 >caption Refresh grid data with automatic data source operations
 
@@ -98,4 +98,4 @@ If you don't use an `ObservableCollection`, then [create a `new` instance of the
 
 ### Manual operations
 
-When using manual operations through the [OnRead event]({%slug common-features-data-binding-onread%}), call the component's [`Rebind()` method]({%slug grid-refresh-data%}#rebind-method). This will force the component to fire its `OnRead` event.
+When using manual operations through the [OnRead event](slug://common-features-data-binding-onread), call the component's [`Rebind()` method](slug://grid-refresh-data#rebind-method). This will force the component to fire its `OnRead` event.
diff --git a/knowledge-base/grid-get-filtered-data.md b/knowledge-base/grid-get-filtered-data.md
index 667baf95c5..e907fac715 100644
--- a/knowledge-base/grid-get-filtered-data.md
+++ b/knowledge-base/grid-get-filtered-data.md
@@ -50,10 +50,10 @@ Things to consider:
 
 ### When Using Data Parameter
 
-1. Obtain the [Grid state]({%slug grid-state%}) in the [Grid `OnStateChanged` event]({%slug grid-state%}#events) or with the [Grid `GetState()` method]({%slug grid-state%}#methods). The exact approach depends on if you want to get the current visible Grid data automatically or on demand.
-1. Create a new [`DataSourceRequest` object](/blazor-ui/api/Telerik.DataSource.DataSourceRequest). Populate its properties with [the respective information from the `GridState` object]({%slug grid-state%}#information-in-the-grid-state). Note that the `Filters` property of the `DataSourceRequest` will have to include filter descriptors from two [`GridState` properties](/blazor-ui/api/Telerik.Blazor.Components.GridState-1) - `FilterDescriptors` and `SearchFilter`.
+1. Obtain the [Grid state](slug://grid-state) in the [Grid `OnStateChanged` event](slug://grid-state#events) or with the [Grid `GetState()` method](slug://grid-state#methods). The exact approach depends on if you want to get the current visible Grid data automatically or on demand.
+1. Create a new [`DataSourceRequest` object](/blazor-ui/api/Telerik.DataSource.DataSourceRequest). Populate its properties with [the respective information from the `GridState` object](slug://grid-state#information-in-the-grid-state). Note that the `Filters` property of the `DataSourceRequest` will have to include filter descriptors from two [`GridState` properties](/blazor-ui/api/Telerik.Blazor.Components.GridState-1) - `FilterDescriptors` and `SearchFilter`.
 1. (optional) If you want to get the currently filtered and sorted data from all Grid pages, do not set the `Page`, `PageSize`, and `Skip` properties of the `DataSourceRequest` object.
-1. Execute the [`ToDataSourceResult()` extension method]({%slug common-features-data-binding-onread%}#todatasourceresult-method) on the Grid `Data` collection. You will need to import the `Telerik.DataSource.Extensions` namespace.
+1. Execute the [`ToDataSourceResult()` extension method](slug://common-features-data-binding-onread#todatasourceresult-method) on the Grid `Data` collection. You will need to import the `Telerik.DataSource.Extensions` namespace.
 1. The currently visible Grid data will be in the `Data` property of the `DataSourceResult` object, which is returned by `ToDataSourceResult()`. The total Grid item count (on all pages) will be in the `Total` property.
 
 The most important part of the example below is in the `RequestCurrentMainGridData()` method.
@@ -202,8 +202,8 @@ or
 
 ### When Using OnRead Event
 
-1. Implement the [Grid `OnRead` event handler]({%slug common-features-data-binding-onread%}) as usual. More Grid-specific examples are available in the [Grid Manual Operations]({%slug components/grid/manual-operations%}) article.
-1. The visible data items on the current Grid page are in [the `args.Data` collection, which is set in the Grid `OnRead` handler]({%slug common-features-data-binding-onread%}#event-argument). `args.Data` is a property of the `GridReadEventArgs` event argument, so it's not accessible outside `OnRead`. That's why you can cache it in a separate variable, together with the total item count (`args.Total`).
+1. Implement the [Grid `OnRead` event handler](slug://common-features-data-binding-onread) as usual. More Grid-specific examples are available in the [Grid Manual Operations](slug://components/grid/manual-operations) article.
+1. The visible data items on the current Grid page are in [the `args.Data` collection, which is set in the Grid `OnRead` handler](slug://common-features-data-binding-onread#event-argument). `args.Data` is a property of the `GridReadEventArgs` event argument, so it's not accessible outside `OnRead`. That's why you can cache it in a separate variable, together with the total item count (`args.Total`).
 
 Optionally, if you want to get the currently filtered and sorted data from all Grid pages:
 
@@ -315,5 +315,5 @@ The most important part of the example below is in the `OnGridRead` handler.
 
 ## See Also
 
-* [Grid State]({%slug grid-state%})
-* [Data Binding with OnRead Event]({%slug common-features-data-binding-onread%})
+* [Grid State](slug://grid-state)
+* [Data Binding with OnRead Event](slug://common-features-data-binding-onread)
diff --git a/knowledge-base/grid-get-index-of-grid-row.md b/knowledge-base/grid-get-index-of-grid-row.md
index 654388665e..615f0914f3 100644
--- a/knowledge-base/grid-get-index-of-grid-row.md
+++ b/knowledge-base/grid-get-index-of-grid-row.md
@@ -26,7 +26,7 @@ I have a Grid and I would like to know the new index of a row when sorting or fi
 
 ## Solution
 
-The Grid does not directly alter the collection of items passed to its `Data` parameter. When performing operations like Sorting or Filtering the collection will not be changed, thus the index of an item will remain unchanged. In order to get the sorted/filtered collection, use the [OnRead event]({%slug components/grid/manual-operations%}) of the Grid.
+The Grid does not directly alter the collection of items passed to its `Data` parameter. When performing operations like Sorting or Filtering the collection will not be changed, thus the index of an item will remain unchanged. In order to get the sorted/filtered collection, use the [OnRead event](slug://components/grid/manual-operations) of the Grid.
 
 * Use the `OnRead` event to cache the Grid data in its current sort state.
 * Use the `SelectedItemsChanged` or `OnRowClick` event to find the item index.
diff --git a/knowledge-base/grid-handle-empty-popup-footer.md b/knowledge-base/grid-handle-empty-popup-footer.md
index 6bd8251fdd..4cd09a7dec 100644
--- a/knowledge-base/grid-handle-empty-popup-footer.md
+++ b/knowledge-base/grid-handle-empty-popup-footer.md
@@ -22,7 +22,7 @@ ticketid: 1665785
 
 ## Description
 
-When I am using the [Popup Form Template]({%slug grid-templates-popup-form%}) in the Grid for Blazor, the [default Update and Cancel buttons are removed]({%slug grid-templates-popup-form%}#specifics). I am not using the [`ButtonsTemplate`]({%slug grid-templates-popup-buttons%}) and the footer remains empty. This takes unnecessary space and affects the UI's aesthetics. 
+When I am using the [Popup Form Template](slug://grid-templates-popup-form) in the Grid for Blazor, the [default Update and Cancel buttons are removed](slug://grid-templates-popup-form#specifics). I am not using the [`ButtonsTemplate`](slug://grid-templates-popup-buttons) and the footer remains empty. This takes unnecessary space and affects the UI's aesthetics. 
 
 The requirement is to either hide this empty footer or utilize it by placing the custom form buttons within. 
 
@@ -43,8 +43,8 @@ There are two approaches to address this requirement:
 
 To display custom buttons in the footer and handle form submission, follow these steps:
 
-1. Declare a [`<FormButtons>`]({%slug form-formitems-buttons%}) tag inside the custom Form and leave it empty, so the Form does not render its default buttons.
-2. Declare custom buttons in the [`<ButtonsTemplate>`]({%slug grid-templates-popup-buttons%}) and handle their `OnClick` events to manage the Form submission.
+1. Declare a [`<FormButtons>`](slug://form-formitems-buttons) tag inside the custom Form and leave it empty, so the Form does not render its default buttons.
+2. Declare custom buttons in the [`<ButtonsTemplate>`](slug://grid-templates-popup-buttons) and handle their `OnClick` events to manage the Form submission.
 
 >caption Displaying custom buttons in the popup footer
 
@@ -456,5 +456,5 @@ This approach relies on using CSS to hide the empty footer. Add your custom clas
 
 ## See Also
 
-- [Grid Popup Editing - Documentation]({%slug components/grid/editing/popup%})
-- [Customizing the Grid's Edit Form]({%slug grid-templates-popup-form%})
+- [Grid Popup Editing - Documentation](slug://components/grid/editing/popup)
+- [Customizing the Grid's Edit Form](slug://grid-templates-popup-form)
diff --git a/knowledge-base/grid-hide-pager-when-no-data.md b/knowledge-base/grid-hide-pager-when-no-data.md
index 244efbee98..147c2add2a 100644
--- a/knowledge-base/grid-hide-pager-when-no-data.md
+++ b/knowledge-base/grid-hide-pager-when-no-data.md
@@ -41,8 +41,8 @@ If there are no items, the Grid pager will show "Page 1 of 0" and "0 - 0 of 0 it
 
 When the Grid has no items, you can hide the pager or some pager elements in two ways:
 
-* Enable and disable [`Pageable`]({%slug components/grid/features/paging%}) conditionally.
-* Apply a CSS `Class` conditionally and use it to [hide parts of the pager or the whole pager]({%slug themes-override%}).
+* Enable and disable [`Pageable`](slug://components/grid/features/paging) conditionally.
+* Apply a CSS `Class` conditionally and use it to [hide parts of the pager or the whole pager](slug://themes-override).
 
 The following example demonstrates both options.
 
@@ -150,6 +150,6 @@ The following example demonstrates both options.
 
 ## See Also
 
-* [Grid Paging]({%slug components/grid/features/paging%})
-* [TreeList Paging]({%slug treelist-paging%})
-* [Customize Telerik Blazor Components with CSS]({%slug themes-override%})
+* [Grid Paging](slug://components/grid/features/paging)
+* [TreeList Paging](slug://treelist-paging)
+* [Customize Telerik Blazor Components with CSS](slug://themes-override)
diff --git a/knowledge-base/grid-horizontal-scrolling-no-column-widths.md b/knowledge-base/grid-horizontal-scrolling-no-column-widths.md
index a78acb35cf..c7a5d3c853 100644
--- a/knowledge-base/grid-horizontal-scrolling-no-column-widths.md
+++ b/knowledge-base/grid-horizontal-scrolling-no-column-widths.md
@@ -37,8 +37,8 @@ How to keep the above column `Width` configuration and:
 
 ## Solution
 
-1. Use the Grid's [`Class` parameter]({%slug grid-overview%}#grid-parameters) to set a custom CSS class.
-1. Set a `min-width` style for the Grid table elements through the custom CSS class. The `min-width` value must be greater than the sum of the all set column [`Width`s]({%slug grid-columns-width%}).
+1. Use the Grid's [`Class` parameter](slug://grid-overview#grid-parameters) to set a custom CSS class.
+1. Set a `min-width` style for the Grid table elements through the custom CSS class. The `min-width` value must be greater than the sum of the all set column [`Width`s](slug://grid-columns-width).
 
 As a result, the width-less N number of columns will receive 1/N of the remaining space. A large-enough `min-width` value will ensure that the width-less columns remain visible and wide enough.
 
@@ -98,4 +98,4 @@ The Grid will show a horizontal scrollbar when its width is less than the table
 
 ## See Also
 
-* [Grid column width behavior]({%slug grid-columns-width%})
+* [Grid column width behavior](slug://grid-columns-width)
diff --git a/knowledge-base/grid-import-excel.md b/knowledge-base/grid-import-excel.md
index 604990a456..84e8795587 100644
--- a/knowledge-base/grid-import-excel.md
+++ b/knowledge-base/grid-import-excel.md
@@ -111,4 +111,4 @@ To import the data of an Excel file in the Grid:
 
 ## See Also
 
-  * [Configuring Document Processing Libraries]({%slug getting-started-vs-integration-dpl%})
+  * [Configuring Document Processing Libraries](slug://getting-started-vs-integration-dpl)
diff --git a/knowledge-base/grid-incell-add-new-row-enter.md b/knowledge-base/grid-incell-add-new-row-enter.md
index cfc9400f8c..7c19987d06 100644
--- a/knowledge-base/grid-incell-add-new-row-enter.md
+++ b/knowledge-base/grid-incell-add-new-row-enter.md
@@ -41,9 +41,9 @@ Here are the required development steps:
 
 1. [Attach a `keyup` handler](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener) for the Grid element (`div.k-grid`). Use a JavaScript code and call it once from `OnAfterRenderAsync`.
 1. Use the [`keyup` event arguments](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent) to track `Enter` and `Tab` key presses inside edit cells (`td.k-grid-edit-cell`) on the last table row in the Grid.
-1. Check if the user is updating the last Grid row in the [`OnUpdate` handler]({%slug components/grid/editing/overview%}#events).
+1. Check if the user is updating the last Grid row in the [`OnUpdate` handler](slug://components/grid/editing/overview#events).
 1. If the previous point is true, then use JSInterop to verify if the user has pressed `Enter` or `Tab`. In this case, add a new data item at the end of the Grid `Data` collection.
-1. If column reordering is enabled, use the [`OnStateChanged` event]({%slug grid-state%}#events) to track which is the last editable column. Use this information when the user is tabbing, before adding a new data item to the Grid.
+1. If column reordering is enabled, use the [`OnStateChanged` event](slug://grid-state#events) to track which is the last editable column. Use this information when the user is tabbing, before adding a new data item to the Grid.
 
 >tip Note that the `keyup` and `OnUpdate` events may fire in random order. The example below uses several JSInterop calls in `OnUpdate` to wait for the `keyup` event handler to execute and obtain its result.
 
@@ -240,4 +240,4 @@ function getLastKey() {
 
 ## See Also
 
-* [Grid in cell editing]({%slug components/grid/editing/incell%})
+* [Grid in cell editing](slug://components/grid/editing/incell)
diff --git a/knowledge-base/grid-incell-dropdown-opening-behavior.md b/knowledge-base/grid-incell-dropdown-opening-behavior.md
index e7f94217dd..da49b04265 100644
--- a/knowledge-base/grid-incell-dropdown-opening-behavior.md
+++ b/knowledge-base/grid-incell-dropdown-opening-behavior.md
@@ -124,11 +124,11 @@ If you quickly click (double click) on the cell containing a DropDownList, the f
 
 The described behavior can be resolved if you optimize the rendering performance of the Grid. There are a couple of ways you can try in order to achieve that:
 
-* [Paging]({%slug components/grid/features/paging%}) - you can enable the `Pageable` property of the Grid and control the number of records that will be displayed per page, so you don't display all records per once and deal with slow performance due to the large data portion that the Grid has to render. Using the pager, you will reduce the time needed for the Grid to re-render.
+* [Paging](slug://components/grid/features/paging) - you can enable the `Pageable` property of the Grid and control the number of records that will be displayed per page, so you don't display all records per once and deal with slow performance due to the large data portion that the Grid has to render. Using the pager, you will reduce the time needed for the Grid to re-render.
 
-* [Virtual Scrolling]({%slug components/grid/virtual-scrolling%}) - it is an alternative to paging. Instead of using a pager, the user scrolls vertically through all records in the data source. The same set of elements is reused to improve the rendering performance.
+* [Virtual Scrolling](slug://components/grid/virtual-scrolling) - it is an alternative to paging. Instead of using a pager, the user scrolls vertically through all records in the data source. The same set of elements is reused to improve the rendering performance.
 
-* [Column virtualization]({%slug grid-columns-virtual%}) - Virtual Scrolling for the columns of the Grid allows the columns and the corresponding data to be rendered only for the currently visible viewport and thus improving the component's performance. The targeted scenario for this feature is for a Grid with big number of columns.
+* [Column virtualization](slug://grid-columns-virtual) - Virtual Scrolling for the columns of the Grid allows the columns and the corresponding data to be rendered only for the currently visible viewport and thus improving the component's performance. The targeted scenario for this feature is for a Grid with big number of columns.
 
 The sample below demonstrates how to achieve the desired behavior by using the `Pageable` property of the Grid to display less records at a time and thus to reduce the time needed for re-rendering the Grid.
 
diff --git a/knowledge-base/grid-inline-edit-form.md b/knowledge-base/grid-inline-edit-form.md
index b0bd7b4453..dc8e19719b 100644
--- a/knowledge-base/grid-inline-edit-form.md
+++ b/knowledge-base/grid-inline-edit-form.md
@@ -37,9 +37,9 @@ This KB answers the following questions:
 
 Add an inline [Blazor Form](https://demos.telerik.com/blazor-ui/form/overview) to your Grid rows by following these steps:
 
-1. Define a [`DetailTemplate`]({%slug components/grid/features/hierarchy%}).
+1. Define a [`DetailTemplate`](slug://components/grid/features/hierarchy).
 1. Hide the hierarchy expand column with CSS.
-1. Use the [`SetStateAsync()` method]({%slug grid-state%}#setstateasync-examples) to [enter and exit Grid edit mode programmatically]({%slug grid-kb-add-edit-state%}).
+1. Use the [`SetStateAsync()` method](slug://grid-state#setstateasync-examples) to [enter and exit Grid edit mode programmatically](slug://grid-kb-add-edit-state).
 
 >tip The Telerik UI for Blazor Form works with a cloned instance of the edited or added item to support cancellation. If you cancel the addition of a new item, you need to delete it from the Grid data collection.   
 
@@ -219,5 +219,5 @@ Add an inline [Blazor Form](https://demos.telerik.com/blazor-ui/form/overview) t
 
 * <a href="https://demos.telerik.com/blazor-ui/grid/overview" target="_blank">Live Demo: Grid Overview</a>
 * <a href="https://demos.telerik.com/blazor-ui/form/overview" target="_blank">Live Demo: Form Overview</a>
-* [Documentation: Grid Overivew]({%slug grid-overview%})
-* [Documentation: Form Overview]({%slug form-overview%})
\ No newline at end of file
+* [Documentation: Grid Overivew](slug://grid-overview)
+* [Documentation: Form Overview](slug://form-overview)
\ No newline at end of file
diff --git a/knowledge-base/grid-json-serializer-null-membertype.md b/knowledge-base/grid-json-serializer-null-membertype.md
index 702d59a865..40f1cf4ae3 100644
--- a/knowledge-base/grid-json-serializer-null-membertype.md
+++ b/knowledge-base/grid-json-serializer-null-membertype.md
@@ -29,7 +29,7 @@ I see errors when I load the Grid state at initialization (`OnStateInit` event h
 
 ## Steps to Reproduce
 
-1. Load (restore) the [Grid state]({%slug grid-state%}) from a serialized Json string in the `OnStateInit` handler.
+1. Load (restore) the [Grid state](slug://grid-state) from a serialized Json string in the `OnStateInit` handler.
 1. The serialized state should contain filter descriptors.
 1. Open a filter menu.
 
@@ -70,10 +70,10 @@ There is a [public issue about filtering error after Grid state restore in OnSta
 All suggested options are demonstrated in the examples below.
 
 * Restore the Grid State later than `OnStateInit`. For example, use `OnAfterRenderAsync` and the Grid `SetStateAsync()` method instead.
-* Manually set the missing `MemberType` property values in the restored [filter descriptors]({%slug components/grid/filtering%}#filter-descriptors) in `OnStateInit`. There is no need to include filter descriptors for all columns in the state object.
-* Restore the Grid State in a `try {} catch() {}` block. The Grid `OnStateInit` event fires two times - [once in the prerender phase and once in the render phase](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/lifecycle?view=aspnetcore-6.0#component-initialization-oninitializedasync). The deserialization problem will occur only if the Grid state is restored in the prerender phase. It is possible to skip state restoration during prerender with a `JSInterop` call. This is not allowed during prerender, so it will trigger an `InvalidOperationException` and `OnStateInit` execution will abort. This approach is used in example [Save and Load Grid State from Browser LocalStorage]({%slug grid-kb-save-load-state-localstorage%})
+* Manually set the missing `MemberType` property values in the restored [filter descriptors](slug://components/grid/filtering#filter-descriptors) in `OnStateInit`. There is no need to include filter descriptors for all columns in the state object.
+* Restore the Grid State in a `try {} catch() {}` block. The Grid `OnStateInit` event fires two times - [once in the prerender phase and once in the render phase](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/lifecycle?view=aspnetcore-6.0#component-initialization-oninitializedasync). The deserialization problem will occur only if the Grid state is restored in the prerender phase. It is possible to skip state restoration during prerender with a `JSInterop` call. This is not allowed during prerender, so it will trigger an `InvalidOperationException` and `OnStateInit` execution will abort. This approach is used in example [Save and Load Grid State from Browser LocalStorage](slug://grid-kb-save-load-state-localstorage)
 
-> There are serializers which support `Type` serialization, for example Newtonsoft Json.NET. They, however, can [cause other undesired side effects]({%slug common-kb-newtonsoft-breaks-datasourcerequest-serialization%}).
+> There are serializers which support `Type` serialization, for example Newtonsoft Json.NET. They, however, can [cause other undesired side effects](slug://common-kb-newtonsoft-breaks-datasourcerequest-serialization).
 
 
 ## Examples
@@ -169,5 +169,5 @@ All suggested options are demonstrated in the examples below.
 
 ## See Also
 
-* [Grid State documentation]({%slug grid-state%})
-* [Filter Descriptors]({%slug components/grid/filtering%}#filter-descriptors)
+* [Grid State documentation](slug://grid-state)
+* [Filter Descriptors](slug://components/grid/filtering#filter-descriptors)
diff --git a/knowledge-base/grid-kb-only-one-filtermenu-option.md b/knowledge-base/grid-kb-only-one-filtermenu-option.md
index 1ddb5cbf21..7fa34406a1 100644
--- a/knowledge-base/grid-kb-only-one-filtermenu-option.md
+++ b/knowledge-base/grid-kb-only-one-filtermenu-option.md
@@ -32,8 +32,8 @@ I want simple filtering options in the Grid filter menu - both for my uses and m
 
 There are two options:
 
-* Use a [custom filter template]({%slug grid-templates-filter%}). It provides full flexibility over the interface and building the filter descriptor.
-* Use custom CSS to [override the theme]({%slug themes-override%}) and hide the elements that provide the and/or secondary conditions. The example below demonstrates this approach. Note that **the required CSS is different for different UI for Blazor versions**:
+* Use a [custom filter template](slug://grid-templates-filter). It provides full flexibility over the interface and building the filter descriptor.
+* Use custom CSS to [override the theme](slug://themes-override) and hide the elements that provide the and/or secondary conditions. The example below demonstrates this approach. Note that **the required CSS is different for different UI for Blazor versions**:
 
 <div class="skip-repl"></div>
 ````CSS
diff --git a/knowledge-base/grid-large-skip-breaks-virtualization.md b/knowledge-base/grid-large-skip-breaks-virtualization.md
index 226278ec7f..44d46bdda4 100644
--- a/knowledge-base/grid-large-skip-breaks-virtualization.md
+++ b/knowledge-base/grid-large-skip-breaks-virtualization.md
@@ -22,7 +22,7 @@ res_type: kb
 
 
 ## Description
-We use [virtualization]({%slug components/grid/virtual-scrolling%}) and set the `Skip` of the grid through its [state]({%slug grid-state%}) (for example, to restore state from the user or to scroll the grid programmatically).
+We use [virtualization](slug://components/grid/virtual-scrolling) and set the `Skip` of the grid through its [state](slug://grid-state) (for example, to restore state from the user or to scroll the grid programmatically).
 
 When the sum of the skip and the page size is bigger then the total count of the items and we try to set the Skip property for the second time, some of the top items are not shown.
 
diff --git a/knowledge-base/grid-line-breaks.md b/knowledge-base/grid-line-breaks.md
index 796ebbca2f..ff3e361986 100644
--- a/knowledge-base/grid-line-breaks.md
+++ b/knowledge-base/grid-line-breaks.md
@@ -68,4 +68,4 @@ This knowledge base article answers the following questions:
 
 ## See Also
 
-* [Grid Column Template]({%slug grid-templates-column%})
\ No newline at end of file
+* [Grid Column Template](slug://grid-templates-column)
\ No newline at end of file
diff --git a/knowledge-base/grid-merge-cells.md b/knowledge-base/grid-merge-cells.md
index aac775a225..cfc7d78a49 100644
--- a/knowledge-base/grid-merge-cells.md
+++ b/knowledge-base/grid-merge-cells.md
@@ -27,7 +27,7 @@ How can I merge cells across rows in the Blazor Data Grid?
 
 ## Solution
 
-To control the table cell and row rendering, you must use the [Row Template]({%slug grid-templates-row%}) of the grid.
+To control the table cell and row rendering, you must use the [Row Template](slug://grid-templates-row) of the grid.
 
 Then, you can set the `rowspan` and `colspan` attributes of the `<td>` elements as necessary to merge them.
 
diff --git a/knowledge-base/grid-multiple-child-grids-per-item.md b/knowledge-base/grid-multiple-child-grids-per-item.md
index 560942bf6d..473d6fae4c 100644
--- a/knowledge-base/grid-multiple-child-grids-per-item.md
+++ b/knowledge-base/grid-multiple-child-grids-per-item.md
@@ -27,7 +27,7 @@ We have a hierarchical Grid where each master item has two child sub-Grids. We w
 
 ## Solution
 
-[Grid hierarchy]({%slug components/grid/features/hierarchy%}) requires a child Grid in a [`DetailTemplate`](/blazor-ui/api/Telerik.Blazor.Components.TelerikGrid-1#Telerik_Blazor_Components_TelerikGrid_1_DetailTemplate). The `DetailTemplate` is essentially a `RenderFragment`, so it can include any content - be that one, two or more Grids, other components or html elements.
+[Grid hierarchy](slug://components/grid/features/hierarchy) requires a child Grid in a [`DetailTemplate`](/blazor-ui/api/Telerik.Blazor.Components.TelerikGrid-1#Telerik_Blazor_Components_TelerikGrid_1_DetailTemplate). The `DetailTemplate` is essentially a `RenderFragment`, so it can include any content - be that one, two or more Grids, other components or html elements.
 
 In order to render two child (detail) Grids at the same time, you just need to declare both of them inside the `DetailTemplate` tag. The example below demonstrates how to achieve this.
 
diff --git a/knowledge-base/grid-multiselect-editor.md b/knowledge-base/grid-multiselect-editor.md
index 8293be12a1..23c6717038 100644
--- a/knowledge-base/grid-multiselect-editor.md
+++ b/knowledge-base/grid-multiselect-editor.md
@@ -30,7 +30,7 @@ I want to use a MultiSelect for a column editor in the Grid to let the user sele
 
 ## Solution
 
-Add the [Multi Select component]({%slug multiselect-overview%}) to the [EditorTemplate]({%slug grid-templates-editor%}) of the desired column.
+Add the [Multi Select component](slug://multiselect-overview) to the [EditorTemplate](slug://grid-templates-editor) of the desired column.
 
 >caption MultiSelect column editor in the grid
 
@@ -194,9 +194,9 @@ Add the [Multi Select component]({%slug multiselect-overview%}) to the [EditorTe
 
 ## Notes
 
-* See the [Grid Bound Column Notes]({%slug components/grid/columns/bound%}#notes) for important information on how the grid can work with models. The key points are:
+* See the [Grid Bound Column Notes](slug://components/grid/columns/bound#notes) for important information on how the grid can work with models. The key points are:
     * A grid column cannot use a collection for its `Field`.
     * The built-in grid operations (such as filtering and sorting) are available only for columns with a defined `Field`.
-* This example uses an approach where a foreign key denotes the actual data, but the MultiSelet editor uses a collection of specific data to present it to users in a meaningful way. You can find more detailed examples of handling that in the  [ForeignKey column]({%slug grids-foreign-key%}) article.
-    * The MultiSelect works with certain value types only, and not with entire models, see more in the [MultiSelect - Data Binding]({%slug multiselect-databind%}) article and in the [MultiSelect - Overview - Parameters]({%slug multiselect-overview%}#parameters) section (see the `TValue` notes).
+* This example uses an approach where a foreign key denotes the actual data, but the MultiSelet editor uses a collection of specific data to present it to users in a meaningful way. You can find more detailed examples of handling that in the  [ForeignKey column](slug://grids-foreign-key) article.
+    * The MultiSelect works with certain value types only, and not with entire models, see more in the [MultiSelect - Data Binding](slug://multiselect-databind) article and in the [MultiSelect - Overview - Parameters](slug://multiselect-overview#parameters) section (see the `TValue` notes).
 
diff --git a/knowledge-base/grid-no-childcontent.md b/knowledge-base/grid-no-childcontent.md
index bb4497616a..00f5e10eae 100644
--- a/knowledge-base/grid-no-childcontent.md
+++ b/knowledge-base/grid-no-childcontent.md
@@ -56,7 +56,7 @@ Having a comment or any other content directly in the grid column tag definition
 ## Solution
 Remove comments entirely.
 
-Remove content directly in the column tags - use the relevant [templates]({%slug components/grid/features/templates%}) to add it.
+Remove content directly in the column tags - use the relevant [templates](slug://components/grid/features/templates) to add it.
 
 If you want to keep certain code so you can put it back in later, move it outside of the grid, or comment out the entire column and add a simple copy of its basic definition (field, size, etc.) without the comments.
 
diff --git a/knowledge-base/grid-number-formatting-of-the-csv-export.md b/knowledge-base/grid-number-formatting-of-the-csv-export.md
index a82b4267bf..3db558dffe 100644
--- a/knowledge-base/grid-number-formatting-of-the-csv-export.md
+++ b/knowledge-base/grid-number-formatting-of-the-csv-export.md
@@ -27,7 +27,7 @@ I want to format numbers and dates in the exported CSV file. For example, set sp
 
 ## Solution
 
-Handle the [OnAfterExport]({%slug grid-export-events%}#onafterexport) event of the Grid. It fires before the actual file is provided to the user. The `Stream` field of its event argument contains the output of the export as a `MemoryStream`.
+Handle the [OnAfterExport](slug://grid-export-events#onafterexport) event of the Grid. It fires before the actual file is provided to the user. The `Stream` field of its event argument contains the output of the export as a `MemoryStream`.
 
 You can copy the bytes from this stream and import them in a [`RadSpreadProcessing workbook`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/working-with-workbooks/working-with-workbooks-what-is-workbook) to access and modify the cells.
 
@@ -37,7 +37,7 @@ To format numeric and date cells of the exported file before it reaches the clie
 
 1. Install `Telerik.Documents.Spreadsheet.FormatProviders.Xls` package for the `workbook` import, so you can then access the data of the exported CSV file and modify its format.
 
-1. Handle the [OnAfterExport]({%slug grid-export-events%}#onafterexport) event of the Grid. The stream it provides is finalized, so that the resource does not leak. Its binary data, however, is available, so you can copy the stream bytes to a new `MemoryStream` instance.
+1. Handle the [OnAfterExport](slug://grid-export-events#onafterexport) event of the Grid. The stream it provides is finalized, so that the resource does not leak. Its binary data, however, is available, so you can copy the stream bytes to a new `MemoryStream` instance.
 
 1. Use a `CsvFormatProvider` instance to [import the new `MemoryStream` in a `workbook`](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/formats-and-conversion/csv/csvformatprovider#import).
 
@@ -153,6 +153,6 @@ To format numeric and date cells of the exported file before it reaches the clie
 
 ## See Also
 
-  * [Change the default CSV delimiter (comma) during Grid export]({%slug grid-kb-csv-export-change-field-delimiter%})
-  * [Custom cell formatting of the exported file with RadSpreadProcessing]({%slug grid-kb-custom-cell-formatting-with-radspreadprocessing%})
-  * [Configure Document Processing Libraries]({%slug getting-started-vs-integration-dpl%})
+  * [Change the default CSV delimiter (comma) during Grid export](slug://grid-kb-csv-export-change-field-delimiter)
+  * [Custom cell formatting of the exported file with RadSpreadProcessing](slug://grid-kb-custom-cell-formatting-with-radspreadprocessing)
+  * [Configure Document Processing Libraries](slug://getting-started-vs-integration-dpl)
diff --git a/knowledge-base/grid-one-expanded-detail-template.md b/knowledge-base/grid-one-expanded-detail-template.md
index a1438bf206..bda1d780b9 100644
--- a/knowledge-base/grid-one-expanded-detail-template.md
+++ b/knowledge-base/grid-one-expanded-detail-template.md
@@ -28,7 +28,7 @@ I would like functionality where you close any detail page that is open if the c
 I also want to expand the detail template on row click, not (only) through the built-in expand button.
 
 ## Solution
-You can use the [grid state]({%slug grid-state%}) to make sure only one item is expanded. You can also use the [OnRead event]({%slug components/grid/manual-operations%}) to have an ordered list of the current page items so you can get the row index easily for use with the state. You can also use the [grid events]({%slug grid-events%}) (`OnRowClick` and `OnRowExpand`) to call the logic that will change the grid state.
+You can use the [grid state](slug://grid-state) to make sure only one item is expanded. You can also use the [OnRead event](slug://components/grid/manual-operations) to have an ordered list of the current page items so you can get the row index easily for use with the state. You can also use the [grid events](slug://grid-events) (`OnRowClick` and `OnRowExpand`) to call the logic that will change the grid state.
 
 ````RAZOR
 @using Telerik.DataSource.Extensions
diff --git a/knowledge-base/grid-pager-top-toolbar-bottom.md b/knowledge-base/grid-pager-top-toolbar-bottom.md
index 2f244ca9ff..bb033c32a9 100644
--- a/knowledge-base/grid-pager-top-toolbar-bottom.md
+++ b/knowledge-base/grid-pager-top-toolbar-bottom.md
@@ -34,7 +34,7 @@ The Grid Toolbar is placed on top of the Grid and Pager at the bottom. You can f
 
 For the time being, this scenario can be handled with a custom approach.
 
-It is possible to integrate a separate [Pager component]({%slug pager-overview%}) in the [Grid Toolbar]({%slug components/grid/features/toolbar%}) - [this demo](https://demos.telerik.com/blazor-ui/pager/integration) demonstrates how it can be achieved. This will suffice if you do not need to use the Toolbar for other content.
+It is possible to integrate a separate [Pager component](slug://pager-overview) in the [Grid Toolbar](slug://components/grid/features/toolbar) - [this demo](https://demos.telerik.com/blazor-ui/pager/integration) demonstrates how it can be achieved. This will suffice if you do not need to use the Toolbar for other content.
 
 If, however, you also want to have a Toolbar for some actions, do the following:
 
@@ -128,10 +128,10 @@ If, however, you also want to have a Toolbar for some actions, do the following:
 
 ## Notes
 
-The downside of the listed approach is that you will not be able to use built-in Grid actions in the custom toolbar container as it is not essentially part of the Grid (for example, [`Add` Command Button]({%slug components/grid/columns/command%}#the-gridcommandbutton-tag), [SearchBox]({%slug grid-searchbox%})).
+The downside of the listed approach is that you will not be able to use built-in Grid actions in the custom toolbar container as it is not essentially part of the Grid (for example, [`Add` Command Button](slug://components/grid/columns/command#the-gridcommandbutton-tag), [SearchBox](slug://grid-searchbox)).
 
 To handle this, you may proceed with a custom approach:
 
-* `Add` Command Button - use a [`TelerikButton`]({%slug components/button/overview%}) instead. Handle its [`OnClick`]({%slug button-events%}#onclick) to programmatically [initiate inserting of an item through the Grid State]({%slug grid-kb-add-edit-state%}).
+* `Add` Command Button - use a [`TelerikButton`](slug://components/button/overview) instead. Handle its [`OnClick`](slug://button-events#onclick) to programmatically [initiate inserting of an item through the Grid State](slug://grid-kb-add-edit-state).
 
-* SearchBox - Use [TelerikTextBox]({%slug components/textbox/overview%}) instead. Handle its [`ValueChanged`]({%slug components/textbox/events%}#valuechanged) or [`OnChange`]({%slug components/textbox/events%}#onchange) event to create [custom filter descriptors]({%slug grid-kb-search-numeric-fields%}).
+* SearchBox - Use [TelerikTextBox](slug://components/textbox/overview) instead. Handle its [`ValueChanged`](slug://components/textbox/events#valuechanged) or [`OnChange`](slug://components/textbox/events#onchange) event to create [custom filter descriptors](slug://grid-kb-search-numeric-fields).
diff --git a/knowledge-base/grid-persist-selection-across-pages.md b/knowledge-base/grid-persist-selection-across-pages.md
index f057d006b7..1b3917c136 100644
--- a/knowledge-base/grid-persist-selection-across-pages.md
+++ b/knowledge-base/grid-persist-selection-across-pages.md
@@ -32,4 +32,4 @@ If your users don't use the `Ctrl` and/or `Shift` buttons to extend the selectio
 
 An example is available in the following project: [https://github.com/telerik/blazor-ui/tree/master/grid/persist-selection](https://github.com/telerik/blazor-ui/tree/master/grid/persist-selection)
 
->tip Since our 2.10.0 release the behavior showcased above is delivered out of the box with the [`SelectAllMode` parameter of the `GridCheckBoxColumn`]({%slug components/grid/columns/checkbox%}).
+>tip Since our 2.10.0 release the behavior showcased above is delivered out of the box with the [`SelectAllMode` parameter of the `GridCheckBoxColumn`](slug://components/grid/columns/checkbox).
diff --git a/knowledge-base/grid-pin-rows.md b/knowledge-base/grid-pin-rows.md
index eaf4ebcf1d..5d10ab8d87 100644
--- a/knowledge-base/grid-pin-rows.md
+++ b/knowledge-base/grid-pin-rows.md
@@ -28,8 +28,8 @@ I would like to pin one or more rows on top of the Grid so that they are always
 
 To achieve the desired behavior you can:
 
-* Use the [`OnRead event`]({%slug components/grid/manual-operations%}) to place the row/rows on top of the data collection for the Grid. 
-* Use the [`OnRowRender event`]({%slug grid-events%}#onrowrender) to add a custom CSS class to the rows you want to pin.
+* Use the [`OnRead event`](slug://components/grid/manual-operations) to place the row/rows on top of the data collection for the Grid. 
+* Use the [`OnRowRender event`](slug://grid-events#onrowrender) to add a custom CSS class to the rows you want to pin.
 * Dynamically calculate the `top` CSS rule with JavaScript.
 * Register the JavaScript file. 
 
diff --git a/knowledge-base/grid-popup-edit-form-columns.md b/knowledge-base/grid-popup-edit-form-columns.md
index 25ae69964a..87257e7ad8 100644
--- a/knowledge-base/grid-popup-edit-form-columns.md
+++ b/knowledge-base/grid-popup-edit-form-columns.md
@@ -27,7 +27,7 @@ How do I display the Grid popup edit form in a multiple-column layout? How do I
 
 ## Solution
 
-Customize the Grid edit from through the [`GridPopupEditFormSettings` tag]({%slug components/grid/editing/popup%}#edit-form-customization).
+Customize the Grid edit from through the [`GridPopupEditFormSettings` tag](slug://components/grid/editing/popup#edit-form-customization).
 
 https://docs.telerik.com/blazor-ui/components/grid/editing/popup#edit-form-customization
 
@@ -49,7 +49,7 @@ In addition to column layout, you can also limit the maximum popup Window height
 }
 ````
 
-> If you place the above CSS rules in the global app stylesheet (usually `site.css`), they will affect **all** TelerikWindows in the app. To avoid this, add the CSS code to the Razor file which holds the Grid. [CSS isolation (scoped styles)]({%slug common-kb-css-isolation%}) will not work, because the Window is rendered as a child of the page `<body>`, i.e. outside the Razor component.
+> If you place the above CSS rules in the global app stylesheet (usually `site.css`), they will affect **all** TelerikWindows in the app. To avoid this, add the CSS code to the Razor file which holds the Grid. [CSS isolation (scoped styles)](slug://common-kb-css-isolation) will not work, because the Window is rendered as a child of the page `<body>`, i.e. outside the Razor component.
 >
 > For full control of the edit form layout and more advanced customizations, you can also use a [custom edit form in a separate TelerikWindow](https://github.com/telerik/blazor-ui/tree/master/grid/custom-popup-form).
 
diff --git a/knowledge-base/grid-popup-edit-form-disable-label-wrapping.md b/knowledge-base/grid-popup-edit-form-disable-label-wrapping.md
index e20b34d286..30732870bc 100644
--- a/knowledge-base/grid-popup-edit-form-disable-label-wrapping.md
+++ b/knowledge-base/grid-popup-edit-form-disable-label-wrapping.md
@@ -52,7 +52,7 @@ There are two ways to ensure that long form labels fit on a single line in the p
     }
     ````
 
-> If you place the above CSS rules in the global app stylesheet (usually `site.css`), they will affect **all** popup forms in the app. To avoid this, keep the CSS code in the Razor file, which defines the edit form. [CSS isolation (scoped styles)]({%slug common-kb-css-isolation%}) will not work, because the Window is rendered as a child of the page `<body>`, i.e. outside the Razor component.
+> If you place the above CSS rules in the global app stylesheet (usually `site.css`), they will affect **all** popup forms in the app. To avoid this, keep the CSS code in the Razor file, which defines the edit form. [CSS isolation (scoped styles)](slug://common-kb-css-isolation) will not work, because the Window is rendered as a child of the page `<body>`, i.e. outside the Razor component.
 >
 > For full control of the edit form layout and more advanced customizations, you can also use a [custom edit form in a separate TelerikWindow](https://github.com/telerik/blazor-ui/tree/master/grid/custom-popup-form).
 
diff --git a/knowledge-base/grid-popup-edit-title.md b/knowledge-base/grid-popup-edit-title.md
index 99a045dcf6..7b63ba6b02 100644
--- a/knowledge-base/grid-popup-edit-title.md
+++ b/knowledge-base/grid-popup-edit-title.md
@@ -33,10 +33,10 @@ How to dynamically set the Grid popup edit Window title?
 
 ## Solution
 
-1. Add a [`<GridPopupEditSettings>` tag]({%slug components/grid/editing/popup%}#popup-customization) inside a `<GridSettings>` tag in the Grid declaration.
+1. Add a [`<GridPopupEditSettings>` tag](slug://components/grid/editing/popup#popup-customization) inside a `<GridSettings>` tag in the Grid declaration.
 1. Set the `Title` parameter of `GridPopupEditSettings` to a string property.
-1. Handle the [Grid `OnEdit` event]({%slug components/grid/editing/overview%}#events) and set the popup title to the desired data item value.
-1. Handle the `OnClick` event of the button that adds new items. Usually this is a [command button in the Grid toolbar]({%slug components/grid/features/toolbar%}). Set the popup title to the desired string label.
+1. Handle the [Grid `OnEdit` event](slug://components/grid/editing/overview#events) and set the popup title to the desired data item value.
+1. Handle the `OnClick` event of the button that adds new items. Usually this is a [command button in the Grid toolbar](slug://components/grid/features/toolbar). Set the popup title to the desired string label.
 
 >caption Dynamic Grid Popup Edit Form Title
 
@@ -120,4 +120,4 @@ How to dynamically set the Grid popup edit Window title?
 
 ## See Also
 
-* [Grid Popup Editing]({%slug components/grid/editing/popup%})
+* [Grid Popup Editing](slug://components/grid/editing/popup)
diff --git a/knowledge-base/grid-pre-select-checkbox-filter.md b/knowledge-base/grid-pre-select-checkbox-filter.md
index e1f3c0e6dc..48b939d570 100644
--- a/knowledge-base/grid-pre-select-checkbox-filter.md
+++ b/knowledge-base/grid-pre-select-checkbox-filter.md
@@ -27,7 +27,7 @@ How can I pre-set a checkbox filter using a filter descriptor? How to set checkb
 ## Solution
 To pre-select checkbox filter in the Grid using a filter descriptor:
 
-1. Use the [OnStateInit]({%slug grid-state%}#events) event of the Grid.
+1. Use the [OnStateInit](slug://grid-state#events) event of the Grid.
 2. Create a new `GridState` instance.
 3. Add a new `CompositeFilterDescriptor` instance to the `FilterDescriptors` collection in the state.
 4. Apply the new state to the current Grid state.
diff --git a/knowledge-base/grid-rebind-timer.md b/knowledge-base/grid-rebind-timer.md
index 785dbd35ad..760214a2e9 100644
--- a/knowledge-base/grid-rebind-timer.md
+++ b/knowledge-base/grid-rebind-timer.md
@@ -41,8 +41,8 @@ How to refresh the component data after a few seconds with a Timer?
 
 1. Use a [`System.Timers.Timer`](https://learn.microsoft.com/en-us/dotnet/api/system.timers.timer).
 1. Define an `Elapsed` event handler.
-1. When [binding via `Data` parameter]({%slug common-features-data-binding-overview%}), the `Elapsed` event handler should [reset the collection reference or call the `Rebind` method]({%slug common-features-data-binding-overview%}#refresh-data) of the component(s).
-1. When [binding via `OnRead` event]({%slug common-features-data-binding-onread%}), the `Elapsed` event handler should [call the `Rebind` method]({%slug common-features-data-binding-onread%}#refresh-data) of the component(s) via [`InvokeAsync`](https://stackoverflow.com/questions/65230621/statehaschanged-vs-invokeasyncstatehaschanged-in-blazor).
+1. When [binding via `Data` parameter](slug://common-features-data-binding-overview), the `Elapsed` event handler should [reset the collection reference or call the `Rebind` method](slug://common-features-data-binding-overview#refresh-data) of the component(s).
+1. When [binding via `OnRead` event](slug://common-features-data-binding-onread), the `Elapsed` event handler should [call the `Rebind` method](slug://common-features-data-binding-onread#refresh-data) of the component(s) via [`InvokeAsync`](https://stackoverflow.com/questions/65230621/statehaschanged-vs-invokeasyncstatehaschanged-in-blazor).
 1. Be aware of [Blazor Tread Safety](https://blazor-university.com/components/multi-threaded-rendering/invokeasync/). 
 
 >caption Rebind Telerik Blazor components with Timer
@@ -224,10 +224,10 @@ The first data item is: @DropDownData.FirstOrDefault()?.Text
 
 We recommend using [`System.Timers.Timer` instead of `System.Threading.Timer` in Blazor](https://stackoverflow.com/questions/19577296/thread-safety-of-system-timers-timer-vs-system-threading-timer).
 
-When the DropDownList is bound via `Data`, its dropdown will not refresh automatically if it is open during the rebind. This is because all our popups are rendered outside the Razor component that defines them. The limitation does not exist with [`OnRead` data binding]({%slug common-features-data-binding-onread%}), because then the UI refresh does not rely on the Blazor component life cycle.
+When the DropDownList is bound via `Data`, its dropdown will not refresh automatically if it is open during the rebind. This is because all our popups are rendered outside the Razor component that defines them. The limitation does not exist with [`OnRead` data binding](slug://common-features-data-binding-onread), because then the UI refresh does not rely on the Blazor component life cycle.
 
 ## See Also
 
-* [Component Data Binding Overview]({%slug common-features-data-binding-overview%})
-* [Data Binding with OnRead event]({%slug common-features-data-binding-onread%})
+* [Component Data Binding Overview](slug://common-features-data-binding-overview)
+* [Data Binding with OnRead event](slug://common-features-data-binding-onread)
 * [Blazor Tread Safety](https://blazor-university.com/components/multi-threaded-rendering/invokeasync/)
diff --git a/knowledge-base/grid-row-numbers.md b/knowledge-base/grid-row-numbers.md
index eed4215c53..e811824272 100644
--- a/knowledge-base/grid-row-numbers.md
+++ b/knowledge-base/grid-row-numbers.md
@@ -27,7 +27,7 @@ Is there a way to add row numbers to the grid?
 I want them to update every time the grid changes, so whenever I filter it or sort it. So basically if it's sorted by date ascending, the rows start at 1 and increase as you travel down the grid.  If you then sort descending, the row numbers will again start at 1 and increase as you travel down the grid.
 
 ## Solution
-Add a property to the row model that will display the row index. Populate the index in the [Grid `OnRead` event]({%slug components/grid/manual-operations%}) by iterating the items collection.
+Add a property to the row model that will display the row index. Populate the index in the [Grid `OnRead` event](slug://components/grid/manual-operations) by iterating the items collection.
 
 You can then use a Grid column to show them. This column should have the various data operations disabled (such as filtering, sorting, grouping, editing) because it does not carry actual information about the data.
 
diff --git a/knowledge-base/grid-row-selection-in-column-template.md b/knowledge-base/grid-row-selection-in-column-template.md
index 06e742ff11..ee329fdbfa 100644
--- a/knowledge-base/grid-row-selection-in-column-template.md
+++ b/knowledge-base/grid-row-selection-in-column-template.md
@@ -28,7 +28,7 @@ This KB article answers the following question:
 
 ## Solution
 
-When you use the [Grid Column Template]({%slug grid-templates-column%}) and want to stop the selection from triggering when the user clicks on the element rendered by the template, add the `@onclick:stopPropagation` directive to the element.
+When you use the [Grid Column Template](slug://grid-templates-column) and want to stop the selection from triggering when the user clicks on the element rendered by the template, add the `@onclick:stopPropagation` directive to the element.
 
 >caption Prevent row selection when the user clicks inside a template
 
@@ -87,4 +87,4 @@ When you use the [Grid Column Template]({%slug grid-templates-column%}) and want
 
 ## See Also
 
-* [Grid Selection]({%slug grid-selection-overview%})
\ No newline at end of file
+* [Grid Selection](slug://grid-selection-overview)
\ No newline at end of file
diff --git a/knowledge-base/grid-row-template-simulate-built-in-functions.md b/knowledge-base/grid-row-template-simulate-built-in-functions.md
index 0f428b32e6..0d7315aa5c 100644
--- a/knowledge-base/grid-row-template-simulate-built-in-functions.md
+++ b/knowledge-base/grid-row-template-simulate-built-in-functions.md
@@ -26,12 +26,12 @@ res_type: kb
 
 This KB article answers the following questions:
 
-* How to [select rows]({%slug grid-selection-row%}) in the Grid when using a [Row Template]({%slug grid-templates-row%})?
-* How to add a [checkbox column]({%slug components/grid/columns/checkbox%}) in the Grid when using a Row Template? I want to be able to select the row through its checkbox, but also to have the functionality to [select all rows]({%slug components/grid/columns/checkbox%}#parameters) from the header of the checkbox column.
+* How to [select rows](slug://grid-selection-row) in the Grid when using a [Row Template](slug://grid-templates-row)?
+* How to add a [checkbox column](slug://components/grid/columns/checkbox) in the Grid when using a Row Template? I want to be able to select the row through its checkbox, but also to have the functionality to [select all rows](slug://components/grid/columns/checkbox#parameters) from the header of the checkbox column.
 * Do the built-in keyboard options to select a range of rows by clicking the `Shift` or `Ctrl` key work when using a Row Template? How to check the checkbox of the row when I select a row by clicking the row?
-* How to add a [command column]({%slug components/grid/columns/command%}) in the Grid when using a Row Template?
+* How to add a [command column](slug://components/grid/columns/command) in the Grid when using a Row Template?
 * When using a Row Template, how to prevent the selection of Grid rows when clicking on command buttons?
-* How to implement Grid column [resizing]({%slug components/grid/columns/resize%}), [auto-fitting]({%slug components/grid/columns/resize%}#autofit-columns), [visibility]({%slug grid-columns-visible%}), [locking]({%slug grid-columns-frozen%}), and [reordering]({%slug components/grid/columns/reorder%}) when using a Row Template?
+* How to implement Grid column [resizing](slug://components/grid/columns/resize), [auto-fitting](slug://components/grid/columns/resize#autofit-columns), [visibility](slug://grid-columns-visible), [locking](slug://grid-columns-frozen), and [reordering](slug://components/grid/columns/reorder) when using a Row Template?
 
 ## Solution
 
@@ -41,9 +41,9 @@ By default, using the Row Template disables most built-in functionalities of the
 
 To implement custom selection functionality:
 
-* In the [`<GridColumns>` collection]({%slug components/grid/columns/bound%}#show-data-in-a-grid) add the [`<GridCheckboxColumn>`]({%slug components/grid/columns/checkbox%}) and use the [`HeaderTemplate`]({%slug components/grid/columns/checkbox%}#header-template) to add a [CheckBox component]({%slug checkbox-overview%}). This CheckBox component handles the [select all rows]({%slug components/grid/columns/checkbox%}#parameters) functionallity.
+* In the [`<GridColumns>` collection](slug://components/grid/columns/bound#show-data-in-a-grid) add the [`<GridCheckboxColumn>`](slug://components/grid/columns/checkbox) and use the [`HeaderTemplate`](slug://components/grid/columns/checkbox#header-template) to add a [CheckBox component](slug://checkbox-overview). This CheckBox component handles the [select all rows](slug://components/grid/columns/checkbox#parameters) functionallity.
 * In the Row Template, add a `<td>` element with a CheckBox component. Add a Boolean property to the Grid model to indicate selection so you can use it for the state of this CheckBox.
-* Handle the Grid's [`SelectedItemsChanged` event]({%slug grid-selection-row%}#selecteditemschanged-event) and the CheckBox's [`OnChange` event]({%slug checkbox-events%}#onchange) to manage the [`SelectedItems` collection]({%slug grid-selection-overview%}#access-selected-rows-or-cells). The `OnChange` event fires after the `SelectedItemsChanged` event. In this case, you need to create a separate collection of selected items to persist the selected items when multiselecting through the checkbox column.
+* Handle the Grid's [`SelectedItemsChanged` event](slug://grid-selection-row#selecteditemschanged-event) and the CheckBox's [`OnChange` event](slug://checkbox-events#onchange) to manage the [`SelectedItems` collection](slug://grid-selection-overview#access-selected-rows-or-cells). The `OnChange` event fires after the `SelectedItemsChanged` event. In this case, you need to create a separate collection of selected items to persist the selected items when multiselecting through the checkbox column.
 
 ### Editing, Sorting, Filtering
 
@@ -53,8 +53,8 @@ The built-in editing, sorting, and filtering will work if the Row Template struc
 
 To implement a custom command column:
 
-* In the `<GridColumns>` collection add the [`<GridCommandColumn>`]({%slug components/grid/columns/command%}) and use the [built-in `Save` and `Cancel` commands]({%slug components/grid/columns/command%}#built-in-commands). 
-* In the Row Template add a `<td>` element with a [Button component]({%slug components/button/overview%}) and handle the Grid items editing and deleting programmatically. Refer to the knowledge base article on how to [enter and exit Grid edit mode programmatically]({%slug grid-kb-add-edit-state%}).
+* In the `<GridColumns>` collection add the [`<GridCommandColumn>`](slug://components/grid/columns/command) and use the [built-in `Save` and `Cancel` commands](slug://components/grid/columns/command#built-in-commands). 
+* In the Row Template add a `<td>` element with a [Button component](slug://components/button/overview) and handle the Grid items editing and deleting programmatically. Refer to the knowledge base article on how to [enter and exit Grid edit mode programmatically](slug://grid-kb-add-edit-state).
 * Set the <a href="https://developer.mozilla.org/en-US/docs/Web/API/Event/stopPropagation" target="_blank">`stopPropagation` method</a> of the <a href="https://www.w3schools.com/jsref/event_onclick.asp" target="_blank">`onclick` event</a> to the `<td>` element to prevent row selection when clicking a command button.
 
 ### Column Resizing, Auto-Fitting, Visibility, Locking, Reordering
@@ -300,12 +300,12 @@ To implement a custom command column:
 
 ## See Also
 
-* [Grid Row Template]({%slug grid-templates-row%})
-* [Grid Row Selection]({%slug grid-selection-row%})
-* [Grid Command Column]({%slug components/grid/columns/command%})
-* [Grid Column Resizing]({%slug components/grid/columns/resize%})
-* [Grid Column Auto-fitting]({%slug components/grid/columns/resize%}#autofit-columns)
-* [Grid Column Visibility]({%slug grid-columns-visible%})
-* [Grid Column Locking]({%slug grid-columns-frozen%})
-* [Grid Column Reordering]({%slug components/grid/columns/reorder%})
-* [Enter And Exit Grid Edit Mode Programmatically]({%slug grid-kb-add-edit-state%})
+* [Grid Row Template](slug://grid-templates-row)
+* [Grid Row Selection](slug://grid-selection-row)
+* [Grid Command Column](slug://components/grid/columns/command)
+* [Grid Column Resizing](slug://components/grid/columns/resize)
+* [Grid Column Auto-fitting](slug://components/grid/columns/resize#autofit-columns)
+* [Grid Column Visibility](slug://grid-columns-visible)
+* [Grid Column Locking](slug://grid-columns-frozen)
+* [Grid Column Reordering](slug://components/grid/columns/reorder)
+* [Enter And Exit Grid Edit Mode Programmatically](slug://grid-kb-add-edit-state)
diff --git a/knowledge-base/grid-rows-text-ellipsis.md b/knowledge-base/grid-rows-text-ellipsis.md
index 88584b202f..e82f0b4cab 100644
--- a/knowledge-base/grid-rows-text-ellipsis.md
+++ b/knowledge-base/grid-rows-text-ellipsis.md
@@ -27,11 +27,11 @@ I am using the TelerikGrid component for Blazor. One of my columns contains a lo
 
 ## Solution
 
-In order to prevent the Grid from wrapping the text in multiple lines you can use CSS and target the `<td>` HTML tags, which contain the data. In order to make that easier you can take advantage of the [OnCellRender event]({%slug grid-column-events%}#oncellrender) that the component exposes.
+In order to prevent the Grid from wrapping the text in multiple lines you can use CSS and target the `<td>` HTML tags, which contain the data. In order to make that easier you can take advantage of the [OnCellRender event](slug://grid-column-events#oncellrender) that the component exposes.
 
->note You can achieve the same behavior if you use the [Template]({%slug grid-templates-column%}) instead of the OnCellRender event. If you choose to go for the `Template` approach you should wrap the `(context as <YourModel>).FieldName` into a HTML element and add the CSS class to the `class` attribute of that element.
+>note You can achieve the same behavior if you use the [Template](slug://grid-templates-column) instead of the OnCellRender event. If you choose to go for the `Template` approach you should wrap the `(context as <YourModel>).FieldName` into a HTML element and add the CSS class to the `class` attribute of that element.
 
-You might still want to allow the user to see the whole content, so you can enable the `Resizable` parameter of the Grid. If, however, the content is too long, the user should resize a lot in order to see the cell content. To cover such scenario, you can display the full content in a separate container. One option would be to use a [Window component]({%slug window-overview%}) and handle some of the Grid events to display it ([`OnRowClick`]({%slug grid-events%}#onrowclick), [`OnRowDoubleClick`]({%slug grid-events%}#onrowdoubleclick)). Another approach is to show a Tooltip on hover of the cell (similar example is available in [Tooltip in Grid]({%slug tooltip-kb-in-grid%}) knowledge base article). The solution below showcases a sample implementation of the first mentioned approach - using a Window component and handling the `OnRowDoubleClick` event.
+You might still want to allow the user to see the whole content, so you can enable the `Resizable` parameter of the Grid. If, however, the content is too long, the user should resize a lot in order to see the cell content. To cover such scenario, you can display the full content in a separate container. One option would be to use a [Window component](slug://window-overview) and handle some of the Grid events to display it ([`OnRowClick`](slug://grid-events#onrowclick), [`OnRowDoubleClick`](slug://grid-events#onrowdoubleclick)). Another approach is to show a Tooltip on hover of the cell (similar example is available in [Tooltip in Grid](slug://tooltip-kb-in-grid) knowledge base article). The solution below showcases a sample implementation of the first mentioned approach - using a Window component and handling the `OnRowDoubleClick` event.
 
 
 ````RAZOR
@@ -152,4 +152,4 @@ Ellipsis for all columns via OnRowRender.
 
 ## See also
 
-* [Knowledge-Base article: Long text in TreeList does not align with the corresponding level]({%slug treelist-longer-text-starts-from-root-level%})
+* [Knowledge-Base article: Long text in TreeList does not align with the corresponding level](slug://treelist-longer-text-starts-from-root-level)
diff --git a/knowledge-base/grid-save-load-state-localstorage.md b/knowledge-base/grid-save-load-state-localstorage.md
index f9d562f3d7..70e5a81f99 100644
--- a/knowledge-base/grid-save-load-state-localstorage.md
+++ b/knowledge-base/grid-save-load-state-localstorage.md
@@ -31,17 +31,17 @@ How to persist and restore the Grid's paging, sorting and filtering state to a f
 
 ## Solution
 
-This scenario requires knowledge about the [Grid State]({%slug grid-state%}), so first, get familiar with:
+This scenario requires knowledge about the [Grid State](slug://grid-state), so first, get familiar with:
 
-* [Information in the Grid State]({%slug grid-state%}#information-in-the-grid-state)
-* [Grid `OnStateChanged` event]({%slug grid-state%}#onstatechanged)
-* [Grid `OnStateInit` event]({%slug grid-state%}#onstateinit)
+* [Information in the Grid State](slug://grid-state#information-in-the-grid-state)
+* [Grid `OnStateChanged` event](slug://grid-state#onstatechanged)
+* [Grid `OnStateInit` event](slug://grid-state#onstateinit)
 
 Then, follow these steps:
 
-1. Subscribe to the [Grid `OnStateChanged` event]({%slug grid-state%}#onstatechanged) to detect user actions that change the Grid state, such as paging, sorting, filtering, editing, grouping, etc.
+1. Subscribe to the [Grid `OnStateChanged` event](slug://grid-state#onstatechanged) to detect user actions that change the Grid state, such as paging, sorting, filtering, editing, grouping, etc.
 1. Use the `OnStateChanged` handler to serialize the new Grid state (`args.GridState`) and save it to the browser's `localStorage`.
-1. Subscribe to the [Grid `OnStateInit` event]({%slug grid-state%}#onstatechanged) to configure the initial state of the Grid programmatically.
+1. Subscribe to the [Grid `OnStateInit` event](slug://grid-state#onstatechanged) to configure the initial state of the Grid programmatically.
 1. Obtain the previously saved Grid state information from `localStorage`, deserialize it and set it to the `args.GridState` property of the `OnStateInit` event argument.
     * Using `localStorage` requires JavaScript. Blazor doesn't allow JSInterop calls during pre-rendering. To avoid runtime exceptions, wrap the JSInterop call in `OnStateInit` in a try-catch block. 
 1. Some aspects of the Grid state depend on data item references, for example selected items, expanded hierarchy items, or edited items. To restore these successfully, override the `Equals` method of the Grid model class. This will allow .NET to [compare data items by a value (ID), rather than by reference](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/built-in-types). Reference comparison will always return `false` (except for strings) after serialization and deserialization.
@@ -307,5 +307,5 @@ builder.Services.AddScoped<LocalStorage>();
 
 ## See Also
 
-* [Grid State]({%slug grid-state%})
-* [Save the Grid state in a WebAssembly app]({%slug grid-kb-save-state-in-webassembly%})
+* [Grid State](slug://grid-state)
+* [Save the Grid state in a WebAssembly app](slug://grid-kb-save-state-in-webassembly)
diff --git a/knowledge-base/grid-save-state-in-webassembly.md b/knowledge-base/grid-save-state-in-webassembly.md
index c538966823..b337aacc47 100644
--- a/knowledge-base/grid-save-state-in-webassembly.md
+++ b/knowledge-base/grid-save-state-in-webassembly.md
@@ -34,5 +34,5 @@ The [sample app in GitHub](https://github.com/telerik/blazor-ui/tree/master/grid
 
 ## See Also
 
-* [Grid State]({%slug grid-state%})
-* [Save and load the Grid state from `localStorage`]({%slug grid-kb-save-load-state-localstorage%})
+* [Grid State](slug://grid-state)
+* [Save and load the Grid state from `localStorage`](slug://grid-kb-save-load-state-localstorage)
diff --git a/knowledge-base/grid-scroll-to-selected-row.md b/knowledge-base/grid-scroll-to-selected-row.md
index 901b255e48..aa7ffac10a 100644
--- a/knowledge-base/grid-scroll-to-selected-row.md
+++ b/knowledge-base/grid-scroll-to-selected-row.md
@@ -23,21 +23,21 @@ res_type: kb
 
 ## Description
 
-I want to programmatically [select a row in the Grid]({%slug grid-selection-row%}) based on specific conditions in my code. Once selected, I’d like the Grid to automatically scroll to that row so it’s visible to the user.
+I want to programmatically [select a row in the Grid](slug://grid-selection-row) based on specific conditions in my code. Once selected, I’d like the Grid to automatically scroll to that row so it’s visible to the user.
 
 ## Solution
 
 The solution to select programatically a row in Grid and scroll to that selected row, depends on the Grid configuration.
 
-### Grid with **[paging feature]({%slug components/grid/features/paging%})**
+### Grid with **[paging feature](slug://components/grid/features/paging)**
 
 1. Ensure the Grid is on the same page as the selected row.
 1. Invoke a JavaScript to make the browser scroll to the selected row into view. The browsers provide the <a href="https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView" target="_blank">`scrollIntoView()` method</a> that does the scrolling. You can find a selected row in the grid markup by its `k-selected` CSS class.
 
-### Grid with **[virtualization feature]({%slug components/grid/virtual-scrolling%})**
+### Grid with **[virtualization feature](slug://components/grid/virtual-scrolling)**
 
-1. Use the [Grid state]({%slug grid-state%}).
-1. Set the [`Skip` parameter]({%slug grid-state%}#information-in-the-grid-state) to the index of the item in the current data collection.
+1. Use the [Grid state](slug://grid-state).
+1. Set the [`Skip` parameter](slug://grid-state#information-in-the-grid-state) to the index of the item in the current data collection.
 
 ## Example
 
@@ -284,6 +284,6 @@ The example below offers comments in the code on some possible improvements.
 ````
 
 ## See Also
-* [Grid Row Selection]({%slug grid-selection-row%})
-* [Grid paging feature]({%slug components/grid/features/paging%})
-* [Grid virtualization feature]({%slug components/grid/virtual-scrolling%})
+* [Grid Row Selection](slug://grid-selection-row)
+* [Grid paging feature](slug://components/grid/features/paging)
+* [Grid virtualization feature](slug://components/grid/virtual-scrolling)
diff --git a/knowledge-base/grid-search-button-click.md b/knowledge-base/grid-search-button-click.md
index 8334d219ef..d9ef902d5f 100644
--- a/knowledge-base/grid-search-button-click.md
+++ b/knowledge-base/grid-search-button-click.md
@@ -29,15 +29,15 @@ I am using the Grid SearchBox, but I don't want it to search for every typed let
 
 ## Solution
 
-1. [Bind the Grid with an OnRead event handler]({%slug components/grid/manual-operations%}).
-1. Replace the [**GridSearchBox**]({%slug grid-searchbox%}) with a [TextBox]({%slug components/textbox/overview%}) and a [Button]({%slug components/button/overview%}) with an [OnClick event handler]({%slug button-events%}).
-1. Optionally, handle the [TextBox `OnChange` event]({%slug components/textbox/events%}) too. This will allow searching on textbox blur and Enter keypress.
+1. [Bind the Grid with an OnRead event handler](slug://components/grid/manual-operations).
+1. Replace the [**GridSearchBox**](slug://grid-searchbox) with a [TextBox](slug://components/textbox/overview) and a [Button](slug://components/button/overview) with an [OnClick event handler](slug://button-events).
+1. Optionally, handle the [TextBox `OnChange` event](slug://components/textbox/events) too. This will allow searching on textbox blur and Enter keypress.
 1. In the click/change handler, build a [`CompositeFilterDescriptor`](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor) with a `LogicalOperator` of `Or`. Populate its `FilterDescriptors` collection with filters for all searchable Grid model fields.
-1. [Add the composite filter descriptor to the Grid State to search programmatically]({%slug grid-state%}#setstateasync-examples).
+1. [Add the composite filter descriptor to the Grid State to search programmatically](slug://grid-state#setstateasync-examples).
 
-Note the [difference between searching and filtering in the Grid state]({%slug grid-state%}#information-in-the-grid-state). Filtering affects the Grid's filtering UI (row or menu), while searching does not.
+Note the [difference between searching and filtering in the Grid state](slug://grid-state#information-in-the-grid-state). Filtering affects the Grid's filtering UI (row or menu), while searching does not.
 
-Also see the [Filter Descriptors documentation]({%slug components/grid/filtering%}#filter-descriptors), which explains the differences between `FilterDescriptor` and `CompositeFilterDescriptor`.
+Also see the [Filter Descriptors documentation](slug://components/grid/filtering#filter-descriptors), which explains the differences between `FilterDescriptor` and `CompositeFilterDescriptor`.
 
 >caption Search Grid Programmatically on Button Click
 
@@ -136,7 +136,7 @@ Also see the [Filter Descriptors documentation]({%slug components/grid/filtering
 
 ## See Also
 
-* [Search the Grid in Numeric and Date Model Fields]({%slug grid-kb-search-numeric-fields%})
-* [Search the Grid in Hidden Fields]({%slug grid-kb-search-in-hidden-fields%})
-* [Search the Grid with a `StartsWith` operator]({%slug grid-kb-search-startswith%})
-* [Format or Bold Search Results in the Grid]({%slug grid-kb-search-highlight-results%})
+* [Search the Grid in Numeric and Date Model Fields](slug://grid-kb-search-numeric-fields)
+* [Search the Grid in Hidden Fields](slug://grid-kb-search-in-hidden-fields)
+* [Search the Grid with a `StartsWith` operator](slug://grid-kb-search-startswith)
+* [Format or Bold Search Results in the Grid](slug://grid-kb-search-highlight-results)
diff --git a/knowledge-base/grid-search-column-menu.md b/knowledge-base/grid-search-column-menu.md
index 5a0f3614a4..ad4be884da 100644
--- a/knowledge-base/grid-search-column-menu.md
+++ b/knowledge-base/grid-search-column-menu.md
@@ -30,13 +30,13 @@ This KB article answers the following questions:
 
 ## Solution
 
-1. Subscribe to the [Grid `OnStateChanged` event]({%slug grid-state%}#onstatechanged).
+1. Subscribe to the [Grid `OnStateChanged` event](slug://grid-state#onstatechanged).
 1. Check if the `PropertyName` event argument is equal to `"ColumnStates"` to verify that the user has modified the column state.
 1. Check for `FilterDescriptor` instances in `args.GridState.SearchFilter.FilterDescriptors` to verify if a search is active.
-1. [Get the visible columns from `args.GridState.ColumnStates`.]({%slug grid-kb-column-state%}) Use only the columns with a `Field` that points to a `string` property.
+1. [Get the visible columns from `args.GridState.ColumnStates`.](slug://grid-kb-column-state) Use only the columns with a `Field` that points to a `string` property.
 1. Compare the `Field` values of the visible string columns with the `Member` values of the search-related filter descriptors.
 1. Add or remove `FilterDescriptors` in `args.GridState.SearchFilter.FilterDescriptors` to align the search configuration with the currently visible columns.
-1. [Update the Grid state with `SetStateAsync()`]({%slug grid-state%}#methods).
+1. [Update the Grid state with `SetStateAsync()`](slug://grid-state#methods).
 
 >caption Change search results when the user hides or shows a column
 
@@ -161,6 +161,6 @@ This KB article answers the following questions:
 
 ## See Also
 
-* [Search in Hidden Grid Columns]({%slug grid-kb-search-in-hidden-fields%})
-* [Grid State]({%slug grid-state%})
-* [Grid SearchBox]({%slug grid-searchbox%})
+* [Search in Hidden Grid Columns](slug://grid-kb-search-in-hidden-fields)
+* [Grid State](slug://grid-state)
+* [Grid SearchBox](slug://grid-searchbox)
diff --git a/knowledge-base/grid-search-highlight-results.md b/knowledge-base/grid-search-highlight-results.md
index e279dc14ed..27e0cb3214 100644
--- a/knowledge-base/grid-search-highlight-results.md
+++ b/knowledge-base/grid-search-highlight-results.md
@@ -25,7 +25,7 @@ res_type: kb
 
 ## Description
 
-I am using the Grid [**SearchBox**]({%slug grid-searchbox%}). How to format the Grid cell values to bold the search keyword? Is there a suitable event to highlight the text, which matches the search string in the cells?
+I am using the Grid [**SearchBox**](slug://grid-searchbox). How to format the Grid cell values to bold the search keyword? Is there a suitable event to highlight the text, which matches the search string in the cells?
 
 How to highlight matching search results in the Grid cells?
 
@@ -34,12 +34,12 @@ How to highlight matching search results in the Grid cells?
 
 The following approach is valid for both the Grid and the TreeList.
 
-1. Define [column templates]({%slug grid-templates-column%}) for all string columns in the Grid.
-1. Inside the column template, obtain the search string from the [Grid state]({%slug grid-state%}):
+1. Define [column templates](slug://grid-templates-column) for all string columns in the Grid.
+1. Inside the column template, obtain the search string from the [Grid state](slug://grid-state):
     * Check the `SearchFilter` property of the [`GridState` object](/blazor-ui/api/Telerik.Blazor.Components.GridState-1).
-    * It will contain a [`CompositeFilterDescriptor` with multiple nested `FilterDescriptor`s inside]({%slug components/grid/filtering%}#filter-descriptors).
+    * It will contain a [`CompositeFilterDescriptor` with multiple nested `FilterDescriptor`s inside](slug://components/grid/filtering#filter-descriptors).
     * The search string will be the `Value` of any nested `FilterDescriptor` object.
-    * The example below uses the [Grid `OnStateChanged` event]({%slug grid-state%}#events) to cache the search string.
+    * The example below uses the [Grid `OnStateChanged` event](slug://grid-state#events) to cache the search string.
 1. Insert HTML tags inside the column template that will format or style the cell content:
     * Use some string manipulation or replacement.
     * Render the cell content with a [`MarkupString`](https://docs.microsoft.com/en-us/dotnet/api/microsoft.aspnetcore.components.markupstring), otherwise the Blazor framework will encode the tags and the user will see them.
@@ -149,7 +149,7 @@ The following approach is valid for both the Grid and the TreeList.
 
 ## See Also
 
-* [Search the Grid in Numeric and Date Model Fields]({%slug grid-kb-search-numeric-fields%})
-* [Search the Grid in Hidden Fields]({%slug grid-kb-search-in-hidden-fields%})
-* [Search the Grid with a `StartsWith` operator]({%slug grid-kb-search-startswith%})
-* [Search the Grid on Button Click]({%slug grid-kb-search-button-click%})
+* [Search the Grid in Numeric and Date Model Fields](slug://grid-kb-search-numeric-fields)
+* [Search the Grid in Hidden Fields](slug://grid-kb-search-in-hidden-fields)
+* [Search the Grid with a `StartsWith` operator](slug://grid-kb-search-startswith)
+* [Search the Grid on Button Click](slug://grid-kb-search-button-click)
diff --git a/knowledge-base/grid-search-in-hidden-fields.md b/knowledge-base/grid-search-in-hidden-fields.md
index a4cec0d7b1..10be628f03 100644
--- a/knowledge-base/grid-search-in-hidden-fields.md
+++ b/knowledge-base/grid-search-in-hidden-fields.md
@@ -28,12 +28,12 @@ I want to customize the Grid Toolbar Searchbox, so it also searches in the hidde
 
 ## Solution
 
-By default, the Grid looks in all string fields in its currently visible columns. You can [customize the SearchBox]({%slug grid-searchbox%}#customize-the-searchbox), so the Grid will search only in certain columns. However, the search will still be based on the **visible** fields provided to the `Fields` parameter of the `GridSearchBox`.
+By default, the Grid looks in all string fields in its currently visible columns. You can [customize the SearchBox](slug://grid-searchbox#customize-the-searchbox), so the Grid will search only in certain columns. However, the search will still be based on the **visible** fields provided to the `Fields` parameter of the `GridSearchBox`.
 
 If you want to search in the hidden fields of the Grid, do the following:
 
-* Bind the Grid with an [`OnRead` event handler]({%slug common-features-data-binding-onread%}).
-* In the `OnRead` handler, [check if there is a filter applied]({%slug components/grid/manual-operations%}#get-information-from-the-datasourcerequest) in `args.Request.Filters`.
+* Bind the Grid with an [`OnRead` event handler](slug://common-features-data-binding-onread).
+* In the `OnRead` handler, [check if there is a filter applied](slug://components/grid/manual-operations#get-information-from-the-datasourcerequest) in `args.Request.Filters`.
 * The applied filters are of type [`CompositeFilterDescriptor`](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor). The composite filter descriptor has a `FilterDescriptors` property, which holds a collection plain [single-field `FilterDescriptor`s](/blazor-ui/api/Telerik.DataSource.FilterDescriptor). Each of the `FilterDescriptor` in the search descriptor targets one of the visible columns.
 * Obtain the search string from the `SearchFilter` property of the Grid state. It holds a `CompositeFilterDescriptor` too.
 * Add one additional `FilterDescriptor` to the search `CompositeFilterDescriptor` for every hidden column.
@@ -130,8 +130,8 @@ If you want to search in the hidden fields of the Grid, do the following:
 
 ## See Also
 
-* [Change Grid Search Results on Column Hide or Show]({%slug grid-kb-search-match-visible-columns%})
-* [Search the Grid in Numeric and Date Model Fields]({%slug grid-kb-search-numeric-fields%})
-* [Search the Grid on Button Click]({%slug grid-kb-search-button-click%})
-* [Search the Grid with a `StartsWith` operator]({%slug grid-kb-search-startswith%})
-* [Format or Bold Search Results in the Grid]({%slug grid-kb-search-highlight-results%})
+* [Change Grid Search Results on Column Hide or Show](slug://grid-kb-search-match-visible-columns)
+* [Search the Grid in Numeric and Date Model Fields](slug://grid-kb-search-numeric-fields)
+* [Search the Grid on Button Click](slug://grid-kb-search-button-click)
+* [Search the Grid with a `StartsWith` operator](slug://grid-kb-search-startswith)
+* [Format or Bold Search Results in the Grid](slug://grid-kb-search-highlight-results)
diff --git a/knowledge-base/grid-search-numeric-fields.md b/knowledge-base/grid-search-numeric-fields.md
index d1b851ee37..f12256f347 100644
--- a/knowledge-base/grid-search-numeric-fields.md
+++ b/knowledge-base/grid-search-numeric-fields.md
@@ -46,8 +46,8 @@ The following sections discuss how to implement the desired behavior, what are t
 
 The solution below requires familiarity with:
 
-* [How to use Grid filter descriptors]({%slug components/grid/filtering%}#filter-descriptors)
-* [How to change the Grid state]({%slug grid-state%})
+* [How to use Grid filter descriptors](slug://components/grid/filtering#filter-descriptors)
+* [How to change the Grid state](slug://grid-state)
 * [How to invoke Razor component events from a child component](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/event-handling?view=aspnetcore-6.0#eventcallback).
 
 
@@ -55,7 +55,7 @@ The solution below requires familiarity with:
 
 Here is an overview of the major steps in the example:
 
-1. Add a search textbox to the [Grid toolbar]({%slug components/grid/features/toolbar%}) or outside the Grid. Do not use the default [`GridSearchBox` component]({%slug grid-searchbox%}), as it searches inside string fields only.
+1. Add a search textbox to the [Grid toolbar](slug://components/grid/features/toolbar) or outside the Grid. Do not use the default [`GridSearchBox` component](slug://grid-searchbox), as it searches inside string fields only.
 1. Handle the `oninput` event of the search textbox. Alternatively, use a search button with an `onclick` handler.
 1. Use the event handler to:
     * Create a new `CompositeFilterDescriptor`.
@@ -334,7 +334,7 @@ Here is an overview of the major steps in the example:
 
 ## See Also
 
-* [Search the Grid on Button Click]({%slug grid-kb-search-button-click%})
-* [Search the Grid in Hidden Fields]({%slug grid-kb-search-in-hidden-fields%})
-* [Search the Grid with a `StartsWith` operator]({%slug grid-kb-search-startswith%})
-* [Format or Bold Search Results in the Grid]({%slug grid-kb-search-highlight-results%})
+* [Search the Grid on Button Click](slug://grid-kb-search-button-click)
+* [Search the Grid in Hidden Fields](slug://grid-kb-search-in-hidden-fields)
+* [Search the Grid with a `StartsWith` operator](slug://grid-kb-search-startswith)
+* [Format or Bold Search Results in the Grid](slug://grid-kb-search-highlight-results)
diff --git a/knowledge-base/grid-search-startswith.md b/knowledge-base/grid-search-startswith.md
index 591b701436..c806661417 100644
--- a/knowledge-base/grid-search-startswith.md
+++ b/knowledge-base/grid-search-startswith.md
@@ -38,7 +38,7 @@ There are two ways to quickly search Grid items with a **`starts with`** filter
 
 ### Use the Grid Filter Row
 
-By default, the [`GridSearchBox` searches in **string** values with a **`contains`** filter]({%slug grid-searchbox%}). The easiest way to search by **`starts with`** filter is to use the [built-in row filter]({%slug grid-filter-row%}) with a configured [default filter operator]({%slug grid-filter-row%}#configuring-the-filter-row).
+By default, the [`GridSearchBox` searches in **string** values with a **`contains`** filter](slug://grid-searchbox). The easiest way to search by **`starts with`** filter is to use the [built-in row filter](slug://grid-filter-row) with a configured [default filter operator](slug://grid-filter-row#configuring-the-filter-row).
 
 >caption Filter Grid columns with a "StartsWith" operator
 
@@ -84,10 +84,10 @@ By default, the [`GridSearchBox` searches in **string** values with a **`contain
 
 ### Use the Grid SearchBox
 
-1. Subscribe to the [Grid OnStateChanged event]({%slug grid-state%}#events).
+1. Subscribe to the [Grid OnStateChanged event](slug://grid-state#events).
 1. In the handler, check if the user has just changed the SearchBox value. `args.PropertyName` will be `"SearchFilter"`.
 1. Obtain the current Grid state with `GetState()`.
-1. See if the Search [`CompositeFilterDescriptor`]({%slug components/grid/filtering%}#filter-descriptors) is populated. This means the SearchBox is not empty.
+1. See if the Search [`CompositeFilterDescriptor`](slug://components/grid/filtering#filter-descriptors) is populated. This means the SearchBox is not empty.
 1. Iterate the search filter descriptors and change the `Operator`.
 1. Reset the Grid state with `SetStateAsync()`.
 
@@ -173,7 +173,7 @@ By default, the [`GridSearchBox` searches in **string** values with a **`contain
 
 ## See Also
 
-* [Search the Grid in Numeric and Date Model Fields]({%slug grid-kb-search-numeric-fields%})
-* [Search the Grid in Hidden Fields]({%slug grid-kb-search-in-hidden-fields%})
-* [Search the Grid on Button Click]({%slug grid-kb-search-button-click%})
-* [Format or Bold Search Results in the Grid]({%slug grid-kb-search-highlight-results%})
+* [Search the Grid in Numeric and Date Model Fields](slug://grid-kb-search-numeric-fields)
+* [Search the Grid in Hidden Fields](slug://grid-kb-search-in-hidden-fields)
+* [Search the Grid on Button Click](slug://grid-kb-search-button-click)
+* [Format or Bold Search Results in the Grid](slug://grid-kb-search-highlight-results)
diff --git a/knowledge-base/grid-select-on-incell-edit.md b/knowledge-base/grid-select-on-incell-edit.md
index 84a7b22c1b..eee89b62a7 100644
--- a/knowledge-base/grid-select-on-incell-edit.md
+++ b/knowledge-base/grid-select-on-incell-edit.md
@@ -21,7 +21,7 @@ res_type: kb
 
 ## Description
 
-When using the [InCell]({%slug components/grid/editing/incell%}) Editing Mode, I want the row that is currently edited to be selected. I want the user to get the current row selected by clicking both in editable and non-editable cells.
+When using the [InCell](slug://components/grid/editing/incell) Editing Mode, I want the row that is currently edited to be selected. I want the user to get the current row selected by clicking both in editable and non-editable cells.
 
  By default, the click action opens a cell for editing and does not select a row to avoid an ambiguous action, and so rows can only be selected with the dedicated grid selection column.
 
@@ -29,7 +29,7 @@ When using the [InCell]({%slug components/grid/editing/incell%}) Editing Mode, I
 
 ## Solution
 
-Use the [Grid events]({%slug grid-events%}#cud-events) to update the `SelectedItems` collection as required:
+Use the [Grid events](slug://grid-events#cud-events) to update the `SelectedItems` collection as required:
 
 * In the handler for the `OnEdit` event add the currently edited item, passed to the method through the object of type `GridCommandEventArgs`, into the `SelectedItems` collection.
 
@@ -37,9 +37,9 @@ Use the [Grid events]({%slug grid-events%}#cud-events) to update the `SelectedIt
 
 * In the handler for the `OnUpdate` event, update the `SelectedItems` collection with the new value of the edited item to ensure data integrity.
 
-* For non-editable cells you can use the [OnRowClick]({%slug grid-events%}#onrowclick) event. 
+* For non-editable cells you can use the [OnRowClick](slug://grid-events#onrowclick) event. 
 
-    * Alternatively, add a [Column Template]({%slug grid-templates-column%}). Use a `<div>` block and add an `onclick` event with a method where the row data is added to the SelectedItems collection as shown in the second example.
+    * Alternatively, add a [Column Template](slug://grid-templates-column). Use a `<div>` block and add an `onclick` event with a method where the row data is added to the SelectedItems collection as shown in the second example.
 
 >caption Examples
 
diff --git a/knowledge-base/grid-select-or-deselect-item-on-row-click.md b/knowledge-base/grid-select-or-deselect-item-on-row-click.md
index 7d771771f6..67e4620675 100644
--- a/knowledge-base/grid-select-or-deselect-item-on-row-click.md
+++ b/knowledge-base/grid-select-or-deselect-item-on-row-click.md
@@ -27,11 +27,11 @@ How can I select and deselect multiple rows by clicking on a row in a Grid with
 
 ## Solution
 
-When Grid selection is enabled, the built-in option for deselecting a row or selecting multiple rows is `Ctrl` + Click (`Cmd` + Click on Macs) - see the [Grid Selection article]({%slug grid-selection-overview%}) for more details. To deselect a row or select multiple rows by row clicking and without holding the `Ctrl` key, use the following approach:
+When Grid selection is enabled, the built-in option for deselecting a row or selecting multiple rows is `Ctrl` + Click (`Cmd` + Click on Macs) - see the [Grid Selection article](slug://grid-selection-overview) for more details. To deselect a row or select multiple rows by row clicking and without holding the `Ctrl` key, use the following approach:
 
 * Cancel the built-in selection. You can achieve that by handling the `SelectedItemsChanged` event and not executing any logic in it.
 
-* Handle the Grid [OnRowClick]({%slug grid-events%}#onrowclick) event to programmatically modify the `SelectedItems` collection.
+* Handle the Grid [OnRowClick](slug://grid-events#onrowclick) event to programmatically modify the `SelectedItems` collection.
 
 The snippet below demonstrates how to achieve the described approach.
 
diff --git a/knowledge-base/grid-show-confirm-cancel-dialog.md b/knowledge-base/grid-show-confirm-cancel-dialog.md
index bbba746520..2c58d73921 100644
--- a/knowledge-base/grid-show-confirm-cancel-dialog.md
+++ b/knowledge-base/grid-show-confirm-cancel-dialog.md
@@ -29,7 +29,7 @@ How to prompt the user to confirm canceling the edit/create before proceeding wi
 
 ## Solution
 
-If the user performs another operation (such as sorting or filtering) while the Grid is in edit mode, then editing will be canceled. Check the last bullet in the [Editing Notes section]({%slug components/grid/editing/overview%}#notes) for more details. The Grid `OnCancel` event will fire and you can handle it to display a Dialog to allow the user to choose whether they want to cancel the editing or not.
+If the user performs another operation (such as sorting or filtering) while the Grid is in edit mode, then editing will be canceled. Check the last bullet in the [Editing Notes section](slug://components/grid/editing/overview#notes) for more details. The Grid `OnCancel` event will fire and you can handle it to display a Dialog to allow the user to choose whether they want to cancel the editing or not.
 
 Telerik UI for Blazor provides predefined and custom Dialogs:
 
@@ -37,13 +37,13 @@ Telerik UI for Blazor provides predefined and custom Dialogs:
 
 * [Dialog Component](#dialog-component) - this solution allows full control over the dialog content. You can add any custom text, HTML elements or other components.
 
-This article lists samples for the Grid component. The suggested solutions, however, are applicable for the [TreeList]({%slug treelist-overview%}), too.
+This article lists samples for the Grid component. The suggested solutions, however, are applicable for the [TreeList](slug://treelist-overview), too.
 
 ### Predefined Confirm Dialog
 
-Use [Predefined Confirm Dialog]({%slug dialog-predefined%}#confirm) with the desired custom text. Additionally, you may get the details for the current item and add them to the text:
+Use [Predefined Confirm Dialog](slug://dialog-predefined#confirm) with the desired custom text. Additionally, you may get the details for the current item and add them to the text:
 
-* Handle the [`OnCancel`]({%slug grid-events%}#cud-events) event of the Grid
+* Handle the [`OnCancel`](slug://grid-events#cud-events) event of the Grid
 * Display the Predefined Dialog in the `OnCancel` handler
 * Prevent the `OnCancel` event to keep the Grid in edit mode. This will cancel the other user action.
 
@@ -121,10 +121,10 @@ Use [Predefined Confirm Dialog]({%slug dialog-predefined%}#confirm) with the des
 
 ### Dialog Component
 
-Using the [Dialog component]({%slug dialog-overview%}) will let you have fully customized confirmation Dialog. To handle the scenario:
+Using the [Dialog component](slug://dialog-overview) will let you have fully customized confirmation Dialog. To handle the scenario:
 
 * Declare a Dialog instance and add the desired content and buttons there. Normally, you would need at least one button - for confirmation of the cancel operation.
-* Handle the [`OnCancel`]({%slug grid-events%}#cud-events) event of the Grid to show the custom Dialog.
+* Handle the [`OnCancel`](slug://grid-events#cud-events) event of the Grid to show the custom Dialog.
 * Wait for the user choice to prevent or proceed with the cancel operation.
 * Hide the Dialog.
 
diff --git a/knowledge-base/grid-sort-descending.md b/knowledge-base/grid-sort-descending.md
index a8feca6abd..eef41e5140 100644
--- a/knowledge-base/grid-sort-descending.md
+++ b/knowledge-base/grid-sort-descending.md
@@ -31,11 +31,11 @@ How to reverse the Grid sorting logic for a column?
 
 ## Solution
 
-This scenario requires knowledge about the [Grid State]({%slug grid-state%}). Get familiar with the following sections first:
+This scenario requires knowledge about the [Grid State](slug://grid-state). Get familiar with the following sections first:
 
-* [Information in the Grid State]({%slug grid-state%}#information-in-the-grid-state)
-* [Grid `OnStateChanged` Event]({%slug grid-state%}#onstatechanged)
-* [Grid State Methods]({%slug grid-state%}#methods)
+* [Information in the Grid State](slug://grid-state#information-in-the-grid-state)
+* [Grid `OnStateChanged` Event](slug://grid-state#onstatechanged)
+* [Grid State Methods](slug://grid-state#methods)
 
 The Grid always tries to maintain the following order of sorting states for each column:
 
@@ -44,11 +44,11 @@ No sorting &gt; Ascending &gt; Descending &gt; No sorting &gt; ...
 Let's assume that the Grid has a `Stock` column which is not sorted, but it should be sorted descending first, if the user clicks on the header. The required algorithm to intercept sorting and change the sort direction is:
 
 1. Set a helper variable that will keep the previous sort state of the `Stock` column. If the column is unsorted by default, then the helper variable can be equal to `null`.
-1. Subscribe to the [Grid `OnStateChanged` Event]({%slug grid-state%}#onstatechanged).
+1. Subscribe to the [Grid `OnStateChanged` Event](slug://grid-state#onstatechanged).
 1. Check if the user has changed the sort state by checking if `args.PropertyName` is `"SortDescriptors"`.
 1. If yes, then iterate `args.GridState.SortDescriptors` and check if the `Stock` column is now sorted, what is the sort direction, and what was the previous sort direction.
 1. Depending on the current situation, either override the `SortDirection` property of the [`SortDescriptor`](/blazor-ui/api/telerik.datasource.sortdescriptor), or add a new `SortDescriptor` to the `args.GridState.SortDescriptors`. The logic will vary, depending on the Grid `SortMode` (`Single` or `Multiple`).
-1. Use the [Grid `SetStateAsync` method]({%slug grid-state%}#methods) to apply the modified Grid state to the component instance.
+1. Use the [Grid `SetStateAsync` method](slug://grid-state#methods) to apply the modified Grid state to the component instance.
 
 >caption Sort a Grid column descending first
 
@@ -192,5 +192,5 @@ The Name and Price columns will sort <strong>ascending</strong> first.
 
 ## See Also
 
-* [Grid State documentation]({%slug grid-state%})
+* [Grid State documentation](slug://grid-state)
 * [GridState API reference](/blazor-ui/api/Telerik.Blazor.Components.GridState-1)
diff --git a/knowledge-base/grid-sort-from-column-menu-only.md b/knowledge-base/grid-sort-from-column-menu-only.md
index e900ba8cb6..360de41ad8 100644
--- a/knowledge-base/grid-sort-from-column-menu-only.md
+++ b/knowledge-base/grid-sort-from-column-menu-only.md
@@ -23,7 +23,7 @@ res_type: kb
 
 ## Description
 
-I use the Grid [ColumnMenu]({%slug grid-column-menu%}) which provides sorting functionality. By default, click in the column header also triggers the sorting (if enabled). I want to allow the user only sort from the ColumnMenu and prevent sorting the column on click in its header.
+I use the Grid [ColumnMenu](slug://grid-column-menu) which provides sorting functionality. By default, click in the column header also triggers the sorting (if enabled). I want to allow the user only sort from the ColumnMenu and prevent sorting the column on click in its header.
 
 How to disable the built-in sorting on column header click?
 
diff --git a/knowledge-base/grid-sort-grouped-column.md b/knowledge-base/grid-sort-grouped-column.md
index 2af1e754af..b23b02288d 100644
--- a/knowledge-base/grid-sort-grouped-column.md
+++ b/knowledge-base/grid-sort-grouped-column.md
@@ -29,7 +29,7 @@ I want to be able to sort the grouped column. How can I achieve this?
 
 At the time of writing (Telerik UI for Blazor version 2.29.0) the ability to sort the grouped column is not supported out of the box. There is a public feature request for it at [Allow sorting the Grouped Column](https://feedback.telerik.com/blazor/1544196-allow-sorting-the-grouped-column).
 
-For the time being, you can use the [Grid State]({%slug grid-state%}) to programmatically sort the grouped column. Based on whether the Grid is grouped or not (you can also get that information from the State), you can render a button in the [Grid Toolbar]({%slug components/grid/features/toolbar%}) allowing the user to sort the groups. The UI for sorting will be a bit different than the built-in feature.
+For the time being, you can use the [Grid State](slug://grid-state) to programmatically sort the grouped column. Based on whether the Grid is grouped or not (you can also get that information from the State), you can render a button in the [Grid Toolbar](slug://components/grid/features/toolbar) allowing the user to sort the groups. The UI for sorting will be a bit different than the built-in feature.
 
 Here is an example of the described approach.
 
diff --git a/knowledge-base/grid-state-filter-nullable-bool.md b/knowledge-base/grid-state-filter-nullable-bool.md
index 42595860a0..a625130f1e 100644
--- a/knowledge-base/grid-state-filter-nullable-bool.md
+++ b/knowledge-base/grid-state-filter-nullable-bool.md
@@ -28,15 +28,15 @@ This KB article explains how to programmatically filter a Grid column bound to a
 
 To filter a Grid column bound to a `bool?` by the `null` values:
 
-1. Get the current [Grid state]({%slug grid-state%}).
-1. Create a `CompositeFilterDescriptor` for the desired column. Add a child [`FilterDescriptor`]({%slug components/grid/filtering%}) with an `Operator` property that is equal to `FilterOperator.IsNull`.
+1. Get the current [Grid state](slug://grid-state).
+1. Create a `CompositeFilterDescriptor` for the desired column. Add a child [`FilterDescriptor`](slug://components/grid/filtering) with an `Operator` property that is equal to `FilterOperator.IsNull`.
 1. Add the new `CompositeFilterDescriptor` to the `FilterDescriptors` property of the Grid state.
 1. Use the Grid `SetStateAsync` method to update the Grid state.
 
 Alternative options are to:
 
-* Customize the Grid filter state in the [Grid `OnStateInit` event]({%slug grid-state%}#onstateinit).
-* [Use a Grid filter template to enable filtering by `null` from the Grid's UI]({%slug grid-kb-filterrow-bool-customization%}).
+* Customize the Grid filter state in the [Grid `OnStateInit` event](slug://grid-state#onstateinit).
+* [Use a Grid filter template to enable filtering by `null` from the Grid's UI](slug://grid-kb-filterrow-bool-customization).
 
 >caption Fitler bool? Grid column by null
 
@@ -121,5 +121,5 @@ Alternative options are to:
 
 ## See Also
 
-* [FilterMenu: Filter From Code]({%slug grid-filter-menu%}#filter-from-code)
-* [Working with the Grid State]({%slug grid-state%})
\ No newline at end of file
+* [FilterMenu: Filter From Code](slug://grid-filter-menu#filter-from-code)
+* [Working with the Grid State](slug://grid-state)
\ No newline at end of file
diff --git a/knowledge-base/grid-static-group.md b/knowledge-base/grid-static-group.md
index 92cf535226..4646c55a70 100644
--- a/knowledge-base/grid-static-group.md
+++ b/knowledge-base/grid-static-group.md
@@ -33,7 +33,7 @@ How to ensure a group is always set for the grid?
 I would like to not show the buttons to remove the grouping options for this grid.
 
 ## Solution
-To ensure certain grid state (like always having the grid grouped by a certain field), you can use the [grid state]({%slug grid-state%}) - through its `OnStateChanged` event, you can know what the user did and [prevent or override that action]({%slug grid-state%}#onstatechanged).
+To ensure certain grid state (like always having the grid grouped by a certain field), you can use the [grid state](slug://grid-state) - through its `OnStateChanged` event, you can know what the user did and [prevent or override that action](slug://grid-state#onstatechanged).
 
 You can hide the group header or [x] buttons on group indicators with CSS rules.
 
diff --git a/knowledge-base/grid-style-filtered-columns.md b/knowledge-base/grid-style-filtered-columns.md
index b0c56794cf..4d5b13836b 100644
--- a/knowledge-base/grid-style-filtered-columns.md
+++ b/knowledge-base/grid-style-filtered-columns.md
@@ -33,7 +33,7 @@ This knowledge base article answers the following questions:
 
 To style filtered columns in a Telerik Grid for Blazor: 
 
-1. Use the [`OnCellRender`]({%slug grid-column-events%}#oncellrender) and [`OnStateChanged`]({%slug grid-state%}#onstatechanged) events.
+1. Use the [`OnCellRender`](slug://grid-column-events#oncellrender) and [`OnStateChanged`](slug://grid-state#onstatechanged) events.
 2. Apply a custom CSS class to the filtered columns when a filter is active. The CSS class will be rendered on each cell from these columns.
 
 >caption Grid with styled filtered column.
@@ -117,4 +117,4 @@ To style filtered columns in a Telerik Grid for Blazor:
 * [Grid Columns](https://docs.telerik.com/blazor-ui/components/grid/columns/bound)
 * [OnCellRender Event](https://docs.telerik.com/blazor-ui/components/grid/columns/events)
 * [OnStateChanged Event](https://docs.telerik.com/blazor-ui/components/grid/state#onstatechanged)
-* [Override the Theme or Apply Custom CSS Styles]({%slug themes-override%})
+* [Override the Theme or Apply Custom CSS Styles](slug://themes-override)
diff --git a/knowledge-base/grid-three-level-hierarchy.md b/knowledge-base/grid-three-level-hierarchy.md
index 05a9412361..d82975e2af 100644
--- a/knowledge-base/grid-three-level-hierarchy.md
+++ b/knowledge-base/grid-three-level-hierarchy.md
@@ -31,7 +31,7 @@ I'm trying to see more than 1 level of hierarchy in my grid but i don't know how
 
 Put nested `<TelerikGrid>` instances in the `DetailTemplate` of their parents. This allows you to have multiple levels of nested grids. The example below shows a three-level hierarchy.
 
->note It is important to use named `context` variables, otherwise such code will not compile. Read more [here]({%slug nest-renderfragment%}).
+>note It is important to use named `context` variables, otherwise such code will not compile. Read more [here](slug://nest-renderfragment).
 
 >caption Three Level Hierarchy in a Grid
 
diff --git a/knowledge-base/grid-transposed.md b/knowledge-base/grid-transposed.md
index d981ae5e6a..bdaf2d62fb 100644
--- a/knowledge-base/grid-transposed.md
+++ b/knowledge-base/grid-transposed.md
@@ -37,9 +37,9 @@ The Telerik Grid for Blazor does not support transposing. A transposed Grid requ
 
 Here are a few possible ways to display transposed data:
 
-* Use the [Telerik Form component for Blazor]({%slug form-overview%}) instead of a Grid. The Form does not provide Grid features, but it can be databound to a model object and supports editing.
+* Use the [Telerik Form component for Blazor](slug://form-overview) instead of a Grid. The Form does not provide Grid features, but it can be databound to a model object and supports editing.
 * Render static HTML markup, which uses the Grid CSS classes. This will produce Grid-like UI, but without any additional built-in features.
-* Combine the previous two options to achieve a Form that looks like a Grid. Use the Grid's HTML markup in a [Form `FormItemsTemplate`]({%slug form-formitems-formitemstemplate%}). Optionally, remove the [built-in Form submit button by using an empty `<FormButtons>` tag]({%slug form-formitems-buttons%}).
+* Combine the previous two options to achieve a Form that looks like a Grid. Use the Grid's HTML markup in a [Form `FormItemsTemplate`](slug://form-formitems-formitemstemplate). Optionally, remove the [built-in Form submit button by using an empty `<FormButtons>` tag](slug://form-formitems-buttons).
 
 Alternatively, shape the data structure, so that it's suitable to display in a regular non-transposed Grid.
 
@@ -268,5 +268,5 @@ The following example demonstrates all options.
 
 ## See Also
 
-* [Grid Overview]({%slug grid-overview%})
-* [Form FormItemsTemplate]({%slug form-formitems-formitemstemplate%})
+* [Grid Overview](slug://grid-overview)
+* [Form FormItemsTemplate](slug://form-formitems-formitemstemplate)
diff --git a/knowledge-base/grid-update-from-0-5-to-1-0.md b/knowledge-base/grid-update-from-0-5-to-1-0.md
index f9985ba028..adced81a07 100644
--- a/knowledge-base/grid-update-from-0-5-to-1-0.md
+++ b/knowledge-base/grid-update-from-0-5-to-1-0.md
@@ -32,6 +32,6 @@ Here is a list of the changes:
 
 You can find more details (and samples) on the current way the grid operates in the following articles:
 
-* [grid editing overview]({%slug components/grid/editing/overview%})
-* [grid command buttons]({%slug components/grid/columns/command%})
-* [grid toolbar]({%slug components/grid/features/toolbar%})
+* [grid editing overview](slug://components/grid/editing/overview)
+* [grid command buttons](slug://components/grid/columns/command)
+* [grid toolbar](slug://components/grid/features/toolbar)
diff --git a/knowledge-base/grid-using-components-in-templates.md b/knowledge-base/grid-using-components-in-templates.md
index 1e0d491257..349638a65d 100644
--- a/knowledge-base/grid-using-components-in-templates.md
+++ b/knowledge-base/grid-using-components-in-templates.md
@@ -33,12 +33,12 @@ The Grid optimizes the UI renders after data operations. If you are using child
 
 This applies to the following Grid elements:
 
-* [CommandColumn]({%slug components/grid/columns/command%})
-* [DetailTemplate]({%slug components/grid/features/hierarchy%})
-* [FooterTemplate]({%slug grid-templates-column-footer%})
-* [GroupFooterTemplate]({%slug grid-templates-column-group-footer%})
-* [RowTemplate]({%slug grid-templates-row%})
-* [Template]({%slug grid-templates-column%})
+* [CommandColumn](slug://components/grid/columns/command)
+* [DetailTemplate](slug://components/grid/features/hierarchy)
+* [FooterTemplate](slug://grid-templates-column-footer)
+* [GroupFooterTemplate](slug://grid-templates-column-group-footer)
+* [RowTemplate](slug://grid-templates-row)
+* [Template](slug://grid-templates-column)
 
 >caption Setting @key to child components inside Grid templates
 
diff --git a/knowledge-base/grid-virtual-scrolling-not-working.md b/knowledge-base/grid-virtual-scrolling-not-working.md
index 9967231d36..5478fab435 100644
--- a/knowledge-base/grid-virtual-scrolling-not-working.md
+++ b/knowledge-base/grid-virtual-scrolling-not-working.md
@@ -21,7 +21,7 @@ res_type: kb
 
 
 ## Description
-I have a Grid with [Virtual Scrolling]({%slug components/grid/virtual-scrolling%}) enabled. When I scroll up or down the rows for the current view port are not rendered as the loading indicator remains visible as shown in the image below.
+I have a Grid with [Virtual Scrolling](slug://components/grid/virtual-scrolling) enabled. When I scroll up or down the rows for the current view port are not rendered as the loading indicator remains visible as shown in the image below.
 
 >caption A depiction of the problem and symptom
 
@@ -95,4 +95,4 @@ There are several common causes for that behavior:
 ## Solution
 Set the `RowHeight` parameter to a fixed value in pixels so that it accommodates the content (depending on the content, padding, margins, font-size and other rules and settings on your app such the Theme and CSS related rules) and matches the monitor and browser settings.
 
-You can read more in the [Notes section of the Virtual Scrolling article]({%slug components/grid/virtual-scrolling%}).
+You can read more in the [Notes section of the Virtual Scrolling article](slug://components/grid/virtual-scrolling).
diff --git a/knowledge-base/grid-virtualization-many-records.md b/knowledge-base/grid-virtualization-many-records.md
index e510d1e73d..32df80c9f9 100644
--- a/knowledge-base/grid-virtualization-many-records.md
+++ b/knowledge-base/grid-virtualization-many-records.md
@@ -126,4 +126,4 @@ Thus, the scrollbar can only get so small, and you can only scroll to a certain
 
 
 ## Solution
-The only possible solution if you have so many records is to use the standard [paging]({%slug components/grid/features/paging%}).
+The only possible solution if you have so many records is to use the standard [paging](slug://components/grid/features/paging).
diff --git a/knowledge-base/grid-which-cell-context-menu.md b/knowledge-base/grid-which-cell-context-menu.md
index ec3b9d52da..01753bdce6 100644
--- a/knowledge-base/grid-which-cell-context-menu.md
+++ b/knowledge-base/grid-which-cell-context-menu.md
@@ -22,13 +22,13 @@ res_type: kb
 
 
 ## Description
-When I right click a cell in a Grid, I want to show context menu. I need to know row, column and ideally cell value.  When using the [grid context menu event]({%slug grid-events%}#onrowcontextmenu), I need to figure out which column was clicked.
+When I right click a cell in a Grid, I want to show context menu. I need to know row, column and ideally cell value.  When using the [grid context menu event](slug://grid-events#onrowcontextmenu), I need to figure out which column was clicked.
 
 ## Solution
 To distinguish a column (cell) from the rest, you need to:
 
-1. Use the [cell template]({%slug grid-templates-column%}) for columns that need special handling.
-2. [Integrate the context menu there]({%slug contextmenu-integration%}) explicitly. 
+1. Use the [cell template](slug://grid-templates-column) for columns that need special handling.
+2. [Integrate the context menu there](slug://contextmenu-integration) explicitly. 
 3. Make sure to stop the event propagation so that the built-in grid event does not trigger.
 4. In the specific event handlers for the context menu event, employ your application logic to use the row, and metadata from the event handlers to built the desired context menu experience.
 
@@ -162,7 +162,7 @@ This example uses a simple boolean flag for brevity, you can extend the logic to
 
 ## Notes
 
-If you need to do this for many columns, you can consider using the [row template]({%slug grid-templates-row%}), and/or extracting the desired logic into its own component so you can repeat it more easily in the grid.
+If you need to do this for many columns, you can consider using the [row template](slug://grid-templates-row), and/or extracting the desired logic into its own component so you can repeat it more easily in the grid.
 
 While it might be a performance hit, an event that could make this easier may become available through <a href="https://feedback.telerik.com/blazor/1507338-oncellcontextmenu-event" target="_blank">this request</a>. You can Follow its status there.
 
diff --git a/knowledge-base/grid-wrap-and-center-column-text.md b/knowledge-base/grid-wrap-and-center-column-text.md
index 350445ddb4..f1e7730149 100644
--- a/knowledge-base/grid-wrap-and-center-column-text.md
+++ b/knowledge-base/grid-wrap-and-center-column-text.md
@@ -27,7 +27,7 @@ How to make the GridColumn title text wrap around and be centered?
 
 ## Solution
 
-Use [custom CSS to override the default Grid styles]({%slug themes-override%}). Since [version 3.4.0](https://www.telerik.com/support/whats-new/blazor-ui/release-history/ui-for-blazor-3-4-0), the [Grid columns provide a `HeaderClass` parameter]({%slug components/grid/columns/bound%}) that can help to target specific columns.
+Use [custom CSS to override the default Grid styles](slug://themes-override). Since [version 3.4.0](https://www.telerik.com/support/whats-new/blazor-ui/release-history/ui-for-blazor-3-4-0), the [Grid columns provide a `HeaderClass` parameter](slug://components/grid/columns/bound) that can help to target specific columns.
 
 The custom CSS should align header text to the center and enable text wrapping.
 
@@ -103,10 +103,10 @@ For older product versions, or to target all columns, use `.k-header` instead of
 
 ## Notes
 
-* If you only need to center or right-align the header text, use the approach from [Center Grid Column Header Content]({%slug grid-kb-center-column-header-content%}). This will keep the preset `display: flex` style of the cells.
+* If you only need to center or right-align the header text, use the approach from [Center Grid Column Header Content](slug://grid-kb-center-column-header-content). This will keep the preset `display: flex` style of the cells.
 
-* If you want full control over the header text contents and rendering, you can use the [column header template]({%slug grid-templates-column-header%}).
+* If you want full control over the header text contents and rendering, you can use the [column header template](slug://grid-templates-column-header).
 
 ## See Also
 
-* [Center or Right-Align Grid Column Headers]({%slug grid-kb-center-column-header-content%})
+* [Center or Right-Align Grid Column Headers](slug://grid-kb-center-column-header-content)
diff --git a/knowledge-base/grids-foreign-key.md b/knowledge-base/grids-foreign-key.md
index 5d790c2fc3..a3b5ee46b6 100644
--- a/knowledge-base/grids-foreign-key.md
+++ b/knowledge-base/grids-foreign-key.md
@@ -44,17 +44,17 @@ How to display, sort and edit data in the Grid from a foreign key table? The ent
 There are a few ways to implement the scenario:
 
 * Flatten the data and move fields from the foreign key table to the current Grid data source. In this way, the Grid model will have all fields you need. This will let the Grid show all values easily and also apply data operations on them based on their types (boolean, DateTime, etc.). Whether this is feasible and performant, and how to do it exactly, depends on the the business logic of the application.
-* [Use nested models]({%slug grid-use-navigation-properties%}), so that you may be able to add entire model references instead of fully flattening the data.
-* Keep the data normalized and use the various [Grid templates]({%slug components/grid/features/templates%}) to show the corresponding values from the foreign key tables. You need to fetch that data in the view-model and provide fast synchronous operations for it. The current article focuses on this approach.
+* [Use nested models](slug://grid-use-navigation-properties), so that you may be able to add entire model references instead of fully flattening the data.
+* Keep the data normalized and use the various [Grid templates](slug://components/grid/features/templates) to show the corresponding values from the foreign key tables. You need to fetch that data in the view-model and provide fast synchronous operations for it. The current article focuses on this approach.
 
 ### Use a foreign key column in the Grid
 
-1. Bind the Grid with an [`OnRead` event]({%slug common-features-data-binding-onread%}), in case you need to execute custom data operations, such as sorting or aggregate calculations. The built-in Grid data operations can work only on properties in the Grid model class.
-1. Use a [Grid column template]({%slug grid-templates-column%}) to display the lookup foreign key value. *Use fast and synchronous logic to retrieve the user-friendly string values for better rendering performance.*
-1. Use a [Grid editor template]({%slug grid-templates-editor%}) to display a suitable editor, for example, a DropDownList with a list of possible values.
-1. Use a [Grid filter template]({%slug grid-templates-filter%}) to allow users to see and select user-friendly string values, and then, construct [filter descriptors]({%slug components/grid/filtering%}#filter-descriptors), which target properties in the Grid model. All filtering criteria for a given Grid column should reside in a single `CompositeFilterDescriptor`. This doesn't apply to [search descriptors]({%slug grid-searchbox%}), which reside in the `SearchFilter` property of the [Grid state]({%slug grid-state%}).
-1. Use a [Grid group header template]({%slug grid-templates-group-header%}) to display user-friendly lookup values when grouping.
-1. The [Grid can calculate aggregates]({%slug grid-aggregates%}) only for properties in the main model. This means the only meaningful and supported aggregate for a foreign key column is `count`. For other aggregates, calculate the values manually and provide them to `args.AggregateResults` in the `OnRead` handler. Or alternatively, render the custom calculated aggregates directly in the [footer template]({%slug grid-templates-column-footer%}) and [group footer template]({%slug grid-templates-column-group-footer%}).
+1. Bind the Grid with an [`OnRead` event](slug://common-features-data-binding-onread), in case you need to execute custom data operations, such as sorting or aggregate calculations. The built-in Grid data operations can work only on properties in the Grid model class.
+1. Use a [Grid column template](slug://grid-templates-column) to display the lookup foreign key value. *Use fast and synchronous logic to retrieve the user-friendly string values for better rendering performance.*
+1. Use a [Grid editor template](slug://grid-templates-editor) to display a suitable editor, for example, a DropDownList with a list of possible values.
+1. Use a [Grid filter template](slug://grid-templates-filter) to allow users to see and select user-friendly string values, and then, construct [filter descriptors](slug://components/grid/filtering#filter-descriptors), which target properties in the Grid model. All filtering criteria for a given Grid column should reside in a single `CompositeFilterDescriptor`. This doesn't apply to [search descriptors](slug://grid-searchbox), which reside in the `SearchFilter` property of the [Grid state](slug://grid-state).
+1. Use a [Grid group header template](slug://grid-templates-group-header) to display user-friendly lookup values when grouping.
+1. The [Grid can calculate aggregates](slug://grid-aggregates) only for properties in the main model. This means the only meaningful and supported aggregate for a foreign key column is `count`. For other aggregates, calculate the values manually and provide them to `args.AggregateResults` in the `OnRead` handler. Or alternatively, render the custom calculated aggregates directly in the [footer template](slug://grid-templates-column-footer) and [group footer template](slug://grid-templates-column-group-footer).
 
 >caption Using Foreign Key column in Grid or TreeList with sorting, filtering, editing, grouping and aggregates
 
diff --git a/knowledge-base/hierarchical-breadcrumb-dropdowns-blazor.md b/knowledge-base/hierarchical-breadcrumb-dropdowns-blazor.md
index 27846eb72b..9b29a20426 100644
--- a/knowledge-base/hierarchical-breadcrumb-dropdowns-blazor.md
+++ b/knowledge-base/hierarchical-breadcrumb-dropdowns-blazor.md
@@ -31,7 +31,7 @@ This KB article answers the following questions:
 
 ## Solution
 
-To embed dropdowns in the Breadcrumb "crumbs", use an [`ItemTemplate`]({%slug breadcrumb-templates%}#itemtemplate). This template allows you to customize the Breadcrumb items, and include other components such as dropdowns.
+To embed dropdowns in the Breadcrumb "crumbs", use an [`ItemTemplate`](slug://breadcrumb-templates#itemtemplate). This template allows you to customize the Breadcrumb items, and include other components such as dropdowns.
 
 ````RAZOR
 @*The dropdown's appearance is customized to blend with the Breadcrumb by adjusting the border color and preventing text decoration changes on hover.*@
diff --git a/knowledge-base/icon-new-names.md b/knowledge-base/icon-new-names.md
index c9343f6d12..f9f7645969 100644
--- a/knowledge-base/icon-new-names.md
+++ b/knowledge-base/icon-new-names.md
@@ -27,11 +27,11 @@ res_type: kb
 
 ## Description
 
-[Telerik UI for Blazor version 4.0 renamed]({%slug changes-in-4-0-0%}) some of the [built-in icons]({%slug common-features-icons%}). Using the old icon names won't work and may produce errors, depending on the exact component configuration.
+[Telerik UI for Blazor version 4.0 renamed](slug://changes-in-4-0-0) some of the [built-in icons](slug://common-features-icons). Using the old icon names won't work and may produce errors, depending on the exact component configuration.
 
 ## Solution
 
->tip While the below listed names will render the proper icons, the recommended approach for declaring icons is to use `FontIcon` or `SvgIcon` followed by PascalCase for the icon name. See details in [Icons List]({%slug common-features-icons%}#icons-list).
+>tip While the below listed names will render the proper icons, the recommended approach for declaring icons is to use `FontIcon` or `SvgIcon` followed by PascalCase for the icon name. See details in [Icons List](slug://common-features-icons#icons-list).
 
 Here is a list of the renamed icons:
 
@@ -1004,4 +1004,4 @@ Here is a list of the renamed icons:
 
 ## See Also
 
-* [Breaking Changes in Telerik UI for Blazor 4.0]({%slug changes-in-4-0-0%})
+* [Breaking Changes in Telerik UI for Blazor 4.0](slug://changes-in-4-0-0)
diff --git a/knowledge-base/in-place-editor.md b/knowledge-base/in-place-editor.md
index 1ea7e70bc7..1beaa2ff46 100644
--- a/knowledge-base/in-place-editor.md
+++ b/knowledge-base/in-place-editor.md
@@ -35,21 +35,21 @@ The sample below uses an algorithm which toggles between read-only UI and an edi
 ### How It Works
 
 * `InPlaceEditor` is a generic component. It supports strings and most value types, including nullable types.
-* Initially, the component renders a clickable [Button]({%slug components/button/overview%}) with [`Clear` `FillMode`]({%slug button-appearance%}) that shows the current `Value`.
+* Initially, the component renders a clickable [Button](slug://components/button/overview) with [`Clear` `FillMode`](slug://button-appearance) that shows the current `Value`.
 * The component detects the type of its `Value` and renders the appropriate Telerik editor:
-    * [CheckBox]({%slug checkbox-overview%}) for `bool`
-    * [DatePicker]({%slug components/datepicker/overview%}) for `DateTime` and `DateOnly`
-    * [NumericTextBox]({%slug components/numerictextbox/overview%}) for `int`, `double`, `decimal`, and the other numeric types
-    * [TextBox]({%slug components/textbox/overview%}) for `string`
-    * [TimePicker]({%slug components/timepicker/overview%}) for `TimeOnly`
+    * [CheckBox](slug://checkbox-overview) for `bool`
+    * [DatePicker](slug://components/datepicker/overview) for `DateTime` and `DateOnly`
+    * [NumericTextBox](slug://components/numerictextbox/overview) for `int`, `double`, `decimal`, and the other numeric types
+    * [TextBox](slug://components/textbox/overview) for `string`
+    * [TimePicker](slug://components/timepicker/overview) for `TimeOnly`
 * If the `Width` parameter is not set, the In-Place Editor approximately matches the width of its editor components to the current `Value` length. The component uses a `monospace` `font-family` to make this easier.
 * The component features a `ReadOnly` mode that controls the editability, for example, depending on user permissions.
 * The `DisplayFormat` parameter affects the `Value` consistently in both read mode and edit mode.
 * The `Placeholder` parameter provides a helper label that will show when the `Value` is `null` or empty.
-* The `ShowIcons` parameter controls the visibility of optional [SVG Icons]({%slug common-features-icons%}#svgicon-component). The icons hint users about the ability to edit the component `Value` or provide clickable **Save** and **Cancel** commands in edit mode. The parameter is of type `InPlaceEditorShowIcons`, which is a custom enum and must be imported in both `InPlaceEditor.razor` and all `.razor` files that use `InPlaceEditor`.
+* The `ShowIcons` parameter controls the visibility of optional [SVG Icons](slug://common-features-icons#svgicon-component). The icons hint users about the ability to edit the component `Value` or provide clickable **Save** and **Cancel** commands in edit mode. The parameter is of type `InPlaceEditorShowIcons`, which is a custom enum and must be imported in both `InPlaceEditor.razor` and all `.razor` files that use `InPlaceEditor`.
 * The `Class` parameter allows you to apply custom styles.
 * The `Title` parameter allows you to show a tooltip hint on read mode.
-* To [see invalid state styling and validation messages in Forms]({%slug inputs-kb-validate-child-component%}), pass the respective `ValueExpression` values to the `InPlaceEditor` component.
+* To [see invalid state styling and validation messages in Forms](slug://inputs-kb-validate-child-component), pass the respective `ValueExpression` values to the `InPlaceEditor` component.
 * `InPlaceEditor.razor.css` is a <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor/components/css-isolation" target="_blank">CSS isolation file</a>. It depends on a `YourAppName.styles.css` file in `App.razor` to load.
 
 ### Example
@@ -745,9 +745,9 @@ namespace YourAppName.Models
 
 ## See Also
 
-* [Button Overview]({%slug components/button/overview%})
-* [CheckBox Overview]({%slug checkbox-overview%})
-* [DatePicker Overview]({%slug components/datepicker/overview%})
-* [NumericTextBox Overview]({%slug components/numerictextbox/overview%})
-* [TextBox Overview]({%slug components/textbox/overview%})
-* [TimePicker Overview]({%slug components/timepicker/overview%})
+* [Button Overview](slug://components/button/overview)
+* [CheckBox Overview](slug://checkbox-overview)
+* [DatePicker Overview](slug://components/datepicker/overview)
+* [NumericTextBox Overview](slug://components/numerictextbox/overview)
+* [TextBox Overview](slug://components/textbox/overview)
+* [TimePicker Overview](slug://components/timepicker/overview)
diff --git a/knowledge-base/inputs-align-text-right.md b/knowledge-base/inputs-align-text-right.md
index a6bfe5df6b..3e66ae5bc5 100644
--- a/knowledge-base/inputs-align-text-right.md
+++ b/knowledge-base/inputs-align-text-right.md
@@ -35,7 +35,7 @@ How to align the text to the right or center in my inputs (such as textbox and n
 
 ## Solution
 
-You can use [standard CSS customizations]({%slug themes-override%}) for inputs in the Telerik UI for Blazor. To make cascading of the styles easier, use the `Class` parameter and pass a custom CSS class. Use the `text-align` rule with a suitable selector.
+You can use [standard CSS customizations](slug://themes-override) for inputs in the Telerik UI for Blazor. To make cascading of the styles easier, use the `Class` parameter and pass a custom CSS class. Use the `text-align` rule with a suitable selector.
 
 The example below shows how to align a numeric textbox and a combo box to the right, and how to align a textbox to the center.
 
diff --git a/knowledge-base/inputs-change-font-size.md b/knowledge-base/inputs-change-font-size.md
index a9ad51dbdb..13b80eabb6 100644
--- a/knowledge-base/inputs-change-font-size.md
+++ b/knowledge-base/inputs-change-font-size.md
@@ -35,7 +35,7 @@ How to change the default css styles for the input controls? I need to alter the
 
 ## Solution
 
-All input components and the Button provide a `Size` parameter that changes the component padding styles. For example, [here is the corresponding article about the ComboBox]({%slug combobox-appearance%}). For more advanced customization, [override the theme styles]({%slug themes-override%}) and set the desired font styles to the components.
+All input components and the Button provide a `Size` parameter that changes the component padding styles. For example, [here is the corresponding article about the ComboBox](slug://combobox-appearance). For more advanced customization, [override the theme styles](slug://themes-override) and set the desired font styles to the components.
 
 >caption Change input font styles and paddings
 
@@ -108,4 +108,4 @@ All input components and the Button provide a `Size` parameter that changes the
 
 ## See Also
 
-* [Change Grid Font Size]({%slug grid-kb-change-font-size%})
+* [Change Grid Font Size](slug://grid-kb-change-font-size)
diff --git a/knowledge-base/inputs-clear-selection-value.md b/knowledge-base/inputs-clear-selection-value.md
index 196dad2b64..0ff0f6192a 100644
--- a/knowledge-base/inputs-clear-selection-value.md
+++ b/knowledge-base/inputs-clear-selection-value.md
@@ -164,4 +164,4 @@ Here are a few examples in their corresponding tabs per component:
 
 ## See Also
 
-* [The basics of value binding and data binding]({%slug get-started-value-vs-data-binding%})
+* [The basics of value binding and data binding](slug://get-started-value-vs-data-binding)
diff --git a/knowledge-base/inputs-floating-label.md b/knowledge-base/inputs-floating-label.md
index 4bd49d583b..b9f6c30275 100644
--- a/knowledge-base/inputs-floating-label.md
+++ b/knowledge-base/inputs-floating-label.md
@@ -41,7 +41,7 @@ I would like to show a floating label for Telerik Inputs. The label should be di
 
 ## Solution
 
->important **UI for Blazor 3.1.0** includes a standalone [FloatingLabel component]({%slug floatinglabel-overview%}). Use that instead.
+>important **UI for Blazor 3.1.0** includes a standalone [FloatingLabel component](slug://floatinglabel-overview). Use that instead.
 
 The following code snippet shows how to add a floating label to TextBox, MaskedTextBox, TextArea, DatePicker, and DropDownList components. The example uses plain HTML elements and CSS styles that are included in the `Telerik UI for Blazor` theme. The styles transform the `<label>` element to a floating label.
 
diff --git a/knowledge-base/inputs-handle-keyboard-events.md b/knowledge-base/inputs-handle-keyboard-events.md
index 257270249d..7c77c140f9 100644
--- a/knowledge-base/inputs-handle-keyboard-events.md
+++ b/knowledge-base/inputs-handle-keyboard-events.md
@@ -43,7 +43,7 @@ The keyboard events bubble up the DOM, so you can attach event handlers for them
 
 If you are looking for an event when the user confirms an action, consider the built-in `OnChange` event which fires when the user presses `Enter` or blurs the input.
 
->important Optionally, you can set the [**`DebounceDelay`**]({%slug components/textbox/overview%}#textbox-parameters) parameter of the textbox to 0. This can prevent textbox value mismatch in the `onkeypress` and [**`ValueChanged`**]({%slug components/textbox/events%}#valuechanged) event handlers. Such mismatch can occur due to the default `DebounceDelay` value.
+>important Optionally, you can set the [**`DebounceDelay`**](slug://components/textbox/overview#textbox-parameters) parameter of the textbox to 0. This can prevent textbox value mismatch in the `onkeypress` and [**`ValueChanged`**](slug://components/textbox/events#valuechanged) event handlers. Such mismatch can occur due to the default `DebounceDelay` value.
 
 >caption Handle keyboard events in Telerik inputs
 
@@ -87,4 +87,4 @@ If you are looking for an event when the user confirms an action, consider the b
 
 ## Notes
 
-The same approach can work for capturing events from the Editor component when it is in its [Div mode]({%slug editor-edit-modes-div%}).
+The same approach can work for capturing events from the Editor component when it is in its [Div mode](slug://editor-edit-modes-div).
diff --git a/knowledge-base/inputs-open-programmatically.md b/knowledge-base/inputs-open-programmatically.md
index 69e12ac419..e5f23070ec 100644
--- a/knowledge-base/inputs-open-programmatically.md
+++ b/knowledge-base/inputs-open-programmatically.md
@@ -238,7 +238,7 @@ TimePicker:
 
 ## Versions Before 3.0
 
-[UI for Blazor versions 2.25 - 2.30 have different HTML rendering for the input components]({%slug changes-in-3-0-0%}). Use this `attachFocusHandler` code instead:
+[UI for Blazor versions 2.25 - 2.30 have different HTML rendering for the input components](slug://changes-in-3-0-0). Use this `attachFocusHandler` code instead:
 
 <div class="skip-repl"></div>
 ````JS
diff --git a/knowledge-base/inputs-validation-child-component.md b/knowledge-base/inputs-validation-child-component.md
index 7cb48bac37..aac63d2d6d 100644
--- a/knowledge-base/inputs-validation-child-component.md
+++ b/knowledge-base/inputs-validation-child-component.md
@@ -184,4 +184,4 @@ public class MyDdlModelString
 
 ## See also
 
-* [Knowledge Base article: How to handle the ValueChanged event and use forms and validation. ]({%slug value-changed-validation-model%})
+* [Knowledge Base article: How to handle the ValueChanged event and use forms and validation. ](slug://value-changed-validation-model)
diff --git a/knowledge-base/jquery-kendo-in-blazor.md b/knowledge-base/jquery-kendo-in-blazor.md
index 47743b9926..55bdf1b957 100644
--- a/knowledge-base/jquery-kendo-in-blazor.md
+++ b/knowledge-base/jquery-kendo-in-blazor.md
@@ -29,19 +29,19 @@ We advise that you consider using only native Blazor components like the UI for
 
 ## Solution
 
-One approach may be to [use Blazor components in an ASP.NET Core 3 application](https://www.telerik.com/blogs/integrating-blazor-components-with-asp-net-core-views). Whether this is feasible depends on your project path and if/how you are migrating from an older project. You can read more details about this in the [Telerik Blazor in ASP.NET Web Application]({%slug telerik-blazor-in-asp-net-app%}) article.
+One approach may be to [use Blazor components in an ASP.NET Core 3 application](https://www.telerik.com/blogs/integrating-blazor-components-with-asp-net-core-views). Whether this is feasible depends on your project path and if/how you are migrating from an older project. You can read more details about this in the [Telerik Blazor in ASP.NET Web Application](slug://telerik-blazor-in-asp-net-app) article.
 
 Should you decide to use jQuery widgets from the Kendo UI suite, here are the things to keep in mind:
 
 * Make sure you are familiar with [using JavaScript in Blazor](https://docs.microsoft.com/en-us/aspnet/core/blazor/javascript-interop?view=aspnetcore-3.0).
 * Manipulate the DOM where jQuery widgets will be as little as possible through Blazor to reduce the chance that an update from the framework will break the widgets.
 * Reference the Kendo UI scripts as usual. More details are available in the Kendo documentation, for example, the [Getting Started](https://docs.telerik.com/kendo-ui/intro/first-steps) article.
-* Use only the [themes from the Telerik UI for Blazor suite]({%slug themes-overview%}). They are the same [SASS-based themes from Kendo](https://docs.telerik.com/kendo-ui/styles-and-layout/sass-themes). You must not include more than one Kendo theme in the project as this can result in incorrect appearance in all widgets.
+* Use only the [themes from the Telerik UI for Blazor suite](slug://themes-overview). They are the same [SASS-based themes from Kendo](https://docs.telerik.com/kendo-ui/styles-and-layout/sass-themes). You must not include more than one Kendo theme in the project as this can result in incorrect appearance in all widgets.
     * Try using versions of Kendo UI and UI for Blazor that are close together, so that there are as little differences in their theming as possible. The latest versions are advisable.
 * Be familiar with the DOM changes the Kendo widgets make and how to [dispose them](https://docs.telerik.com/kendo-ui/intro/widget-basics/destroy). You may need to clean up the DOM yourself if Blazor does not clean everything.
 
 >tip A sample project that showcases these is available here: [jQuery Kendo Widgets in Blazor](https://github.com/telerik/blazor-ui/tree/master/common/kendo-in-blazor).
 
-The project references a commercial version of UI for Blazor. If you only have a trial license, replace the reference to the NuGet package and to the JS Interop file [accordingly]({%slug getting-started/what-you-need%}).
+The project references a commercial version of UI for Blazor. If you only have a trial license, replace the reference to the NuGet package and to the JS Interop file [accordingly](slug://getting-started/what-you-need).
 
 >note Such an integration is not supported by Telerik.
diff --git a/knowledge-base/keynotfoundexception-inputelementvalue.md b/knowledge-base/keynotfoundexception-inputelementvalue.md
index d523f761e7..83ba0ad2c9 100644
--- a/knowledge-base/keynotfoundexception-inputelementvalue.md
+++ b/knowledge-base/keynotfoundexception-inputelementvalue.md
@@ -38,19 +38,19 @@ When I set the focus on a DatePicker or DateInput and tab to switch to another c
 
 ## Possible Cause
 
-This error indicates that the app is using an old or wrong version of the `telerik-blazor.js` file, for example, after a [component version upgrade]({%slug upgrade-tutorial%}).
+This error indicates that the app is using an old or wrong version of the `telerik-blazor.js` file, for example, after a [component version upgrade](slug://upgrade-tutorial).
 
 
 ## Solution
 
 To resolve the error:
 
-* (if using [CDN]({%slug common-features-cdn%})) Update the `telerik-blazor.js` file URL to the correct version.
-* (if using static assets) Clear the browser cache and [add a cache buster for the Telerik CSS and JavaScript files]({%slug common-kb-browser-cache-buster%}).
+* (if using [CDN](slug://common-features-cdn)) Update the `telerik-blazor.js` file URL to the correct version.
+* (if using static assets) Clear the browser cache and [add a cache buster for the Telerik CSS and JavaScript files](slug://common-kb-browser-cache-buster).
 * (if using a local JS file) Replace the `telerik-blazor.js` file with the new version.
 
 
 ## See Also
 
-* [Telerik UI for Blazor version upgrade steps]({%slug upgrade-tutorial%})
-* [JavaScript error troubleshooting]({%slug troubleshooting-js-errors%})
+* [Telerik UI for Blazor version upgrade steps](slug://upgrade-tutorial)
+* [JavaScript error troubleshooting](slug://troubleshooting-js-errors)
diff --git a/knowledge-base/listbox-checkbox-selection.md b/knowledge-base/listbox-checkbox-selection.md
index ae1c8f64af..2d055329f4 100644
--- a/knowledge-base/listbox-checkbox-selection.md
+++ b/knowledge-base/listbox-checkbox-selection.md
@@ -33,8 +33,8 @@ This KB article answers the following questions:
 
 ## Solution
 
-1. Define a [ListBox item template]({%slug listbox-templates%}#item-template).
-1. In the `<ItemTemplate>`, add a [CheckBox component]({%slug checkbox-overview%}) with a [`Value` parameter]({%slug checkbox-overview%}#checkbox-parameters) and a [`ValueChanged` event handler]({%slug checkbox-events%}#valuechanged).
+1. Define a [ListBox item template](slug://listbox-templates#item-template).
+1. In the `<ItemTemplate>`, add a [CheckBox component](slug://checkbox-overview) with a [`Value` parameter](slug://checkbox-overview#checkbox-parameters) and a [`ValueChanged` event handler](slug://checkbox-events#valuechanged).
 1. The CheckBox `Value` must be `true` if the current item (`ItemTemplate` `context`) is a member of the ListBox `SelectedItems` collection.
 1. The CheckBox `ValueChanged` handler must add or remove the current ListBox item from the `SelectedItems` collection.
 1. Wrap the CheckBox component in a `<span @onclick:stopPropagation>`, so that the checkbox clicks do not interfere with the built-in ListBox selection feature.
@@ -148,5 +148,5 @@ ListBox <code>SelectionMode</code>:
 
 ## See Also
 
-* [ListBox Templates]({%slug listbox-templates%})
-* [ListBox Selection]({%slug listbox-selection%})
+* [ListBox Templates](slug://listbox-templates)
+* [ListBox Selection](slug://listbox-selection)
diff --git a/knowledge-base/listbox-filtering.md b/knowledge-base/listbox-filtering.md
index 7c1815c522..d342f597ff 100644
--- a/knowledge-base/listbox-filtering.md
+++ b/knowledge-base/listbox-filtering.md
@@ -37,14 +37,14 @@ This KB article answers the following questions:
 ## Solution
 
 1. Implement a user interface that includes:
-    * A [`TextBox`]({%slug components/textbox/overview%}) for the search string;
+    * A [`TextBox`](slug://components/textbox/overview) for the search string;
     * (optional) A selection component (DropDownButton, DropDownList, ContextMenu, SplitButton) for the filter operator;
-    * (optional) A [Button]({%slug components/button/overview%}) to clear the TextBox `Value`.
-    * (optional) A Button to start the filtering. Alternatively, use the [`ValueChanged` or `OnChange` event of the TextBox]({%slug components/textbox/events%}).
+    * (optional) A [Button](slug://components/button/overview) to clear the TextBox `Value`.
+    * (optional) A Button to start the filtering. Alternatively, use the [`ValueChanged` or `OnChange` event of the TextBox](slug://components/textbox/events).
 1. Create a [`DataSourceRequest` object](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) and populate its `Filters` property with a single [`FilterDescriptor`](/blazor-ui/api/Telerik.DataSource.FilterDescriptor).
     * If you need more complex filtering logic, use one or more [`CompositeFilterDescriptor`](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor).
-1. Execute the [`ToDataSourceResult()` extension method]({%slug common-features-data-binding-onread%}#todatasourceresult-method) on the ListBox data. You will need to import the [`Telerik.DataSource.Extensions` namespace](/blazor-ui/api/Telerik.DataSource.Extensions).
-1. (optional) Show a [Loader]({%slug loader-overview%}) or a [LoaderContainer]({%slug loadercontainer-overview%}) during the filtering process.
+1. Execute the [`ToDataSourceResult()` extension method](slug://common-features-data-binding-onread#todatasourceresult-method) on the ListBox data. You will need to import the [`Telerik.DataSource.Extensions` namespace](/blazor-ui/api/Telerik.DataSource.Extensions).
+1. (optional) Show a [Loader](slug://loader-overview) or a [LoaderContainer](slug://loadercontainer-overview) during the filtering process.
 
 >tip If the filtering operator is fixed (for example, `Contains`), you can replace steps 2 and 3 with a standard LINQ expression:
 >
@@ -228,6 +228,6 @@ This KB article answers the following questions:
 
 ## See Also
 
-* [`ToDataSourceResult` Method]({%slug common-features-data-binding-onread%}#todatasourceresult-method)
+* [`ToDataSourceResult` Method](slug://common-features-data-binding-onread#todatasourceresult-method)
 * [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest)
-* [ListBox Overview]({%slug listbox-overview%})
+* [ListBox Overview](slug://listbox-overview)
diff --git a/knowledge-base/listbox-scroll-to-selected-item.md b/knowledge-base/listbox-scroll-to-selected-item.md
index 0560e06a84..824b88770c 100644
--- a/knowledge-base/listbox-scroll-to-selected-item.md
+++ b/knowledge-base/listbox-scroll-to-selected-item.md
@@ -133,4 +133,4 @@ This knowledge base article answers the following questions:
 
 ## See Also
 
-* [ListBox Selection]({%slug listbox-selection%})
+* [ListBox Selection](slug://listbox-selection)
diff --git a/knowledge-base/listview-hide-horizontal-scrollbar.md b/knowledge-base/listview-hide-horizontal-scrollbar.md
index 3b317b811d..3c2c02f2dd 100644
--- a/knowledge-base/listview-hide-horizontal-scrollbar.md
+++ b/knowledge-base/listview-hide-horizontal-scrollbar.md
@@ -77,4 +77,4 @@ To hide the horizontal scrollbar in a TelerikListView, apply custom CSS to set t
 
 ## See Also
 
-- [ListView Overview]({%slug listview-overview%})
+- [ListView Overview](slug://listview-overview)
diff --git a/knowledge-base/listview-popup-editing.md b/knowledge-base/listview-popup-editing.md
index 13c77c4856..19818ebe9a 100644
--- a/knowledge-base/listview-popup-editing.md
+++ b/knowledge-base/listview-popup-editing.md
@@ -32,12 +32,12 @@ How to use popup editing for the ListView component, similar to the Grid?
 The steps below assume that the ListView data items are of type `TItem`.
 
 1. Define an additional variable of type `TItem` in the Razor component. This variable will hold the copy of the ListView item, which is in edit or create mode. In the example below, this is `ProductInEditMode`.
-1. Define a [Telerik Window]({%slug window-overview%}) that will contain the popup edit form. Bind the Window's `Visible` parameter to some variable. Configure the Window's dimensions, modality, actions, etc.
-1. Define a [Telerik Form]({%slug form-overview%}) inside the Window's `<WindowContent>`. Set the Form's `Model` parameter to the variable of type `TItem` from step 1. You can also use an `EditContext` instead of a `Model`.
-1. Add an edit Button to the [ListView `<Template>`]({%slug listview-templates%}). Use a lambda expression to pass the ListView template `context` as an argument to the [Button's `OnClick` handler]({%slug button-events%}). Assign the `context` property values to the variable from step 1.
-1. Add a Button to the [ListView `<HeaderTemplate>`]({%slug listview-templates%}) or anywhere outside the ListView. This Button's `OnClick` handler will create a new instance of `TItem` and assign it to the variable from step 1.
+1. Define a [Telerik Window](slug://window-overview) that will contain the popup edit form. Bind the Window's `Visible` parameter to some variable. Configure the Window's dimensions, modality, actions, etc.
+1. Define a [Telerik Form](slug://form-overview) inside the Window's `<WindowContent>`. Set the Form's `Model` parameter to the variable of type `TItem` from step 1. You can also use an `EditContext` instead of a `Model`.
+1. Add an edit Button to the [ListView `<Template>`](slug://listview-templates). Use a lambda expression to pass the ListView template `context` as an argument to the [Button's `OnClick` handler](slug://button-events). Assign the `context` property values to the variable from step 1.
+1. Add a Button to the [ListView `<HeaderTemplate>`](slug://listview-templates) or anywhere outside the ListView. This Button's `OnClick` handler will create a new instance of `TItem` and assign it to the variable from step 1.
 1. Set the Window's `Visible` parameter to `true` on add/edit Button click.
-1. Use the [Form's `OnValidSubmit` or `OnSubmit` event]({%slug form-events%}) to save the ListView item to the database, [`Rebind()`]({%slug common-features-data-binding-overview%}#refresh-data) the ListView, and hide the Window.
+1. Use the [Form's `OnValidSubmit` or `OnSubmit` event](slug://form-events) to save the ListView item to the database, [`Rebind()`](slug://common-features-data-binding-overview#refresh-data) the ListView, and hide the Window.
 
 >caption ListView Popup Editing
 
@@ -206,6 +206,6 @@ The steps below assume that the ListView data items are of type `TItem`.
 
 ## See Also
 
-* [ListView Editing]({%slug listview-editing%})
-* [Form Overview]({%slug form-overview%})
-* [Window Overview]({%slug window-overview%})
+* [ListView Editing](slug://listview-editing)
+* [Form Overview](slug://form-overview)
+* [Window Overview](slug://window-overview)
diff --git a/knowledge-base/listview-searchbox.md b/knowledge-base/listview-searchbox.md
index ecfbc7e14b..bac303bfe0 100644
--- a/knowledge-base/listview-searchbox.md
+++ b/knowledge-base/listview-searchbox.md
@@ -29,7 +29,7 @@ How to implement a ListView search box, similar to the [SearchBox in the Blazor
 
 It is possible to search and filter the ListView programmatically. The example below is a modified version of the [ListView filtering demo](https://demos.telerik.com/blazor-ui/listview/filtering).
 
-* Notice the usage of a [`CompositeFilterDescriptor`](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor), instead of a [`FilterDescriptor`](/blazor-ui/api/Telerik.DataSource.FilterDescriptor). This is because we are searching in multiple fields with an `OR` logical operator. The [Grid Filtering documentation]({%slug components/grid/filtering%}#filter-descriptors) explains the difference between the two descriptor types.
+* Notice the usage of a [`CompositeFilterDescriptor`](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor), instead of a [`FilterDescriptor`](/blazor-ui/api/Telerik.DataSource.FilterDescriptor). This is because we are searching in multiple fields with an `OR` logical operator. The [Grid Filtering documentation](slug://components/grid/filtering#filter-descriptors) explains the difference between the two descriptor types.
 * Populate the `FilterDescriptors` collection of the `CompositeFilterDescriptor` object with one `FilterDescriptor` for each field that you want to search in.
 
 >caption ListView Search Textbox
diff --git a/knowledge-base/loader-inside-button.md b/knowledge-base/loader-inside-button.md
index 1451039007..d75be7b91a 100644
--- a/knowledge-base/loader-inside-button.md
+++ b/knowledge-base/loader-inside-button.md
@@ -32,9 +32,9 @@ How to add a loading animation inside a Button? The loader indicator show displa
 
 ## Solution
 
-1. Nest a [Telerik Loader]({%slug loader-overview%}) inside a [Telerik Button]({%slug components/button/overview%}).
+1. Nest a [Telerik Loader](slug://loader-overview) inside a [Telerik Button](slug://components/button/overview).
 1. Set the `Visible` parameter of the Loader to `false`.
-1. Handle the [`OnClick` event]({%slug button-events%}#onclick) of the Button.
+1. Handle the [`OnClick` event](slug://button-events#onclick) of the Button.
 1. Toggle the Loader's `Visible` parameter to `true` in the Button's `OnClick` handler, while the application is working in the background.
 
 >caption Blazor Loader inside a Button
@@ -61,5 +61,5 @@ How to add a loading animation inside a Button? The loader indicator show displa
 
 ## See Also
 
-* [Blazor Loader]({%slug loader-overview%})
-* [Blazor Button]({%slug components/button/overview%})
+* [Blazor Loader](slug://loader-overview)
+* [Blazor Button](slug://components/button/overview)
diff --git a/knowledge-base/loading-sign-client-app.md b/knowledge-base/loading-sign-client-app.md
index d4cca085ed..be371ef97f 100644
--- a/knowledge-base/loading-sign-client-app.md
+++ b/knowledge-base/loading-sign-client-app.md
@@ -32,4 +32,4 @@ While the client-side Blazor app is loading and spinning up, you may want to sho
 
 ## Solution
 
-Use the [Loader]({%slug loader-overview%}) or [LoaderContainer]({%slug loadercontainer-overview%}) component.
+Use the [Loader](slug://loader-overview) or [LoaderContainer](slug://loadercontainer-overview) component.
diff --git a/knowledge-base/map-custom-image.md b/knowledge-base/map-custom-image.md
index 6830c1c02f..357b4e2f05 100644
--- a/knowledge-base/map-custom-image.md
+++ b/knowledge-base/map-custom-image.md
@@ -88,10 +88,10 @@ This method is ideal when using the Map in a static context without the need for
 
 ### Pannable and Zoomable Map
 
-If you want to support panning and zooming the custom image in the Map, you will need to mimic the default Map behavior targeting the [Tile layer]({%slug components/map/layers/tile%}). For that purpose, divide your image into small separate pieces that build up the whole map image and serve them to the Map component as tiles compliant to the WGS 84 coordinate system.
+If you want to support panning and zooming the custom image in the Map, you will need to mimic the default Map behavior targeting the [Tile layer](slug://components/map/layers/tile). For that purpose, divide your image into small separate pieces that build up the whole map image and serve them to the Map component as tiles compliant to the WGS 84 coordinate system.
 
 ## See Also
 
-* [Map Overview]({%slug components/map/overview%})
-* [Markers in Map for Blazor]({%slug components/map/layers/marker%})
-* [Tile Layer in Map for Blazor]({%slug components/map/layers/tile%})
+* [Map Overview](slug://components/map/overview)
+* [Markers in Map for Blazor](slug://components/map/layers/marker)
+* [Tile Layer in Map for Blazor](slug://components/map/layers/tile)
diff --git a/knowledge-base/menu-custom-styling.md b/knowledge-base/menu-custom-styling.md
index a24e7b0d0f..409547f197 100644
--- a/knowledge-base/menu-custom-styling.md
+++ b/knowledge-base/menu-custom-styling.md
@@ -115,5 +115,5 @@ To customize the appearance of the Menu items:
 
 ## See Also
 
-- [Telerik Blazor Menu - Overview]({%slug components/menu/overview%})
-- [Telerik Blazor Styling and Themes - Override Theme Styles]({%slug themes-override%})
\ No newline at end of file
+- [Telerik Blazor Menu - Overview](slug://components/menu/overview)
+- [Telerik Blazor Styling and Themes - Override Theme Styles](slug://themes-override)
\ No newline at end of file
diff --git a/knowledge-base/multicolumncombobox-grid.md b/knowledge-base/multicolumncombobox-grid.md
index d58410f298..eec45e7c99 100644
--- a/knowledge-base/multicolumncombobox-grid.md
+++ b/knowledge-base/multicolumncombobox-grid.md
@@ -34,36 +34,36 @@ This KB answers the following questions:
 
 ## Solution
 
-The steps and example below describe how to create a custom component that looks and works similarly to a [Telerik MultiColumnComboBox for Blazor]({%slug multicolumncombobox-overview%}), but uses an actual [Grid component]({%slug grid-overview%}) inside a [Popup component]({%slug popup-overview%}).
+The steps and example below describe how to create a custom component that looks and works similarly to a [Telerik MultiColumnComboBox for Blazor](slug://multicolumncombobox-overview), but uses an actual [Grid component](slug://grid-overview) inside a [Popup component](slug://popup-overview).
 
 ## Prerequisites
 
 The solution below requires familiarity with:
 
-* [Telerik Grid for Blazor]({%slug grid-overview%}), especially the [Grid state]({%slug grid-state%}) and [Grid selection]({%slug grid-selection-overview%}).
-* [Telerik Popup for Blazor]({%slug popup-overview%});
-* [Telerik TextBox for Blazor]({%slug components/textbox/overview%});
+* [Telerik Grid for Blazor](slug://grid-overview), especially the [Grid state](slug://grid-state) and [Grid selection](slug://grid-selection-overview).
+* [Telerik Popup for Blazor](slug://popup-overview);
+* [Telerik TextBox for Blazor](slug://components/textbox/overview);
 * Implementing [Blazor component parameters that support two-way binding](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/data-binding?view=aspnetcore-8.0#binding-with-component-parameters).
 * Implementing [Blazor components with `ChildContent` that is a `RenderFragment`](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-8.0#child-content-render-fragments).
 
 ## Steps
 
-1. Implement UI that looks like a closed Telerik ComboBox. For example, use a [TextBox]({%slug components/textbox/overview%}) and a [`TextBoxSuffixTemplate`]({%slug common-features/input-adornments%}) with an [icon Button]({%slug button-icons%}) inside.
-1. Add a [Popup]({%slug popup-overview%}) and set its `AnchorSelector` to be a selector that depends on a custom `Class` of the TextBox.
-1. Add a [Grid]({%slug grid-overview%}) inside the Popup. Enable the features that you need.
-1. Use [Grid row selection]({%slug grid-selection-row%}) and the Grid `SelectedItemsChanged` event to set the TextBox `Value` and the overall value of the custom MultiColumnComboBox component.
+1. Implement UI that looks like a closed Telerik ComboBox. For example, use a [TextBox](slug://components/textbox/overview) and a [`TextBoxSuffixTemplate`](slug://common-features/input-adornments) with an [icon Button](slug://button-icons) inside.
+1. Add a [Popup](slug://popup-overview) and set its `AnchorSelector` to be a selector that depends on a custom `Class` of the TextBox.
+1. Add a [Grid](slug://grid-overview) inside the Popup. Enable the features that you need.
+1. Use [Grid row selection](slug://grid-selection-row) and the Grid `SelectedItemsChanged` event to set the TextBox `Value` and the overall value of the custom MultiColumnComboBox component.
 1. (optional) Extract the whole implementation to a separate generic Razor component and implement parameters such as `Value` and `Data`.
 
 ## How it Works
 
 * The example demonstrates a generic and reusable Razor component called `ComboBoxGrid`.
-* The component has several parameters, which work similarly to the corresponding [MultiColumnComboBox parameters]({%slug multicolumncombobox-overview%}#multicolumncombobox-parameters):
+* The component has several parameters, which work similarly to the corresponding [MultiColumnComboBox parameters](slug://multicolumncombobox-overview#multicolumncombobox-parameters):
     * `Data`
     * `Value`
     * `TextField`
     * `ValueField`
     * `Width`
-* Typing in the component's textbox opens the dropdown and filters the Grid, similar to a [SearchBox]({%slug grid-searchbox%}#search-from-code).
+* Typing in the component's textbox opens the dropdown and filters the Grid, similar to a [SearchBox](slug://grid-searchbox#search-from-code).
 * Blurring the textbox or hitting Enter will select the first matching item in the Grid.
 * Selecting a Grid item applies a new `ComboBoxGrid` value and closes the dropdown.
 * Closing and reopening the dropdown preserves the Grid state.
@@ -569,7 +569,7 @@ The solution below requires familiarity with:
 
 ## See Also
 
-* [Grid State]({%slug grid-state%})
-* [Grid Selection]({%slug grid-selection-overview%})
-* [Popup Overview]({%slug popup-overview%})
-* [TextBox Events]({%slug components/textbox/events%})
+* [Grid State](slug://grid-state)
+* [Grid Selection](slug://grid-selection-overview)
+* [Popup Overview](slug://popup-overview)
+* [TextBox Events](slug://components/textbox/events)
diff --git a/knowledge-base/multiselect-checkbox-in-dropdown.md b/knowledge-base/multiselect-checkbox-in-dropdown.md
index 96cdd84dcd..4ac0124954 100644
--- a/knowledge-base/multiselect-checkbox-in-dropdown.md
+++ b/knowledge-base/multiselect-checkbox-in-dropdown.md
@@ -35,7 +35,7 @@ We have the MultiSelect component for this in Blazor: https://demos.telerik.com/
 
 The AutoClose feature allows the MultiSelect to stay open while the user selects the input.
 
-The MultiSelect offers a highlighted state for the selected items already, yet if you want to add checkboxes, you can do that through the [`ItemTemplate`]({%slug multiselect-templates%}#item-template) and you can get their `checked` attribute by comparing the current item against the selected items.
+The MultiSelect offers a highlighted state for the selected items already, yet if you want to add checkboxes, you can do that through the [`ItemTemplate`](slug://multiselect-templates#item-template) and you can get their `checked` attribute by comparing the current item against the selected items.
 
 >caption Add checkboxes in the multiselect
 
diff --git a/knowledge-base/multiselect-limit-selection.md b/knowledge-base/multiselect-limit-selection.md
index e4affc0149..bc4fe163f3 100644
--- a/knowledge-base/multiselect-limit-selection.md
+++ b/knowledge-base/multiselect-limit-selection.md
@@ -22,14 +22,14 @@ ticketid: 1670731
 
 ## Description
 
-When using the [MultiSelect]({%slug multiselect-overview%}) component, it might be necessary to limit the number of items a user can select. For example, restricting selection to a maximum of three items. This KB article also answers the following questions:
+When using the [MultiSelect](slug://multiselect-overview) component, it might be necessary to limit the number of items a user can select. For example, restricting selection to a maximum of three items. This KB article also answers the following questions:
 - How to set a selection limit on MultiSelect in Blazor?
 - How to prevent additional selections in MultiSelect after reaching a defined limit?
 - How to notify users they've reached the maximum number of selectable items in MultiSelect?
 
 ## Solution
 
-To restrict the number of selectable items in a MultiSelect component, use one-way binding with the `Value` parameter and the [`ValueChanged`]({%slug multiselect-events%}#valuechanged) event. This approach allows you to manually update the selected items collection and enforce a maximum selection limit.
+To restrict the number of selectable items in a MultiSelect component, use one-way binding with the `Value` parameter and the [`ValueChanged`](slug://multiselect-events#valuechanged) event. This approach allows you to manually update the selected items collection and enforce a maximum selection limit.
 
 Below is a demonstration of how to implement a selection limit. This example restricts the user to a maximum of three selections and informs them when they have reached this limit.
 
@@ -72,5 +72,5 @@ Below is a demonstration of how to implement a selection limit. This example res
 
 ## See Also
 
-- [MultiSelect Overview]({%slug multiselect-overview%})
-- [MultiSelect Events]({%slug multiselect-events%})
+- [MultiSelect Overview](slug://multiselect-overview)
+- [MultiSelect Events](slug://multiselect-events)
diff --git a/knowledge-base/multiselect-selected-items-order.md b/knowledge-base/multiselect-selected-items-order.md
index fe3ce90a5a..84bf8cefb7 100644
--- a/knowledge-base/multiselect-selected-items-order.md
+++ b/knowledge-base/multiselect-selected-items-order.md
@@ -40,7 +40,7 @@ The MultiSelect creates a collection of its selected items internally, based on
 
 Sort the MultiSelect `Data`, according to the selected items' order in `Value`. For example, move the selected items to the beginning of the `Data` collection.
 
-Optionally, use the [MultiSelect `OnChange` or `ValueChanged` events]({%slug multiselect-events%}) to reorder the MultiSelect `Data` every time when users select or deselect items. [`Rebind()`]({%slug common-features-data-binding-overview%}#refresh-data) the MultiSelect afterwards to re-render the dropdown.
+Optionally, use the [MultiSelect `OnChange` or `ValueChanged` events](slug://multiselect-events) to reorder the MultiSelect `Data` every time when users select or deselect items. [`Rebind()`](slug://common-features-data-binding-overview#refresh-data) the MultiSelect afterwards to re-render the dropdown.
 
 >caption Reorder MultiSelect Data to match the selected items order in Value
 
@@ -124,5 +124,5 @@ Optionally, use the [MultiSelect `OnChange` or `ValueChanged` events]({%slug mul
 
 ## See Also
 
-* [Data binding a MultiSelect]({%slug multiselect-databind%})
-* [Pre-select MultiSelect items]({%slug multiselect-pre-select-items%})
+* [Data binding a MultiSelect](slug://multiselect-databind)
+* [Pre-select MultiSelect items](slug://multiselect-pre-select-items)
diff --git a/knowledge-base/nest-render-fragment.md b/knowledge-base/nest-render-fragment.md
index afcd36f733..a2b3092b78 100644
--- a/knowledge-base/nest-render-fragment.md
+++ b/knowledge-base/nest-render-fragment.md
@@ -49,7 +49,7 @@ You may also see the following error:
 
 ## Possible Cause
 
-When nesting components, you will usually do that under tags of type `RenderFragment`. For example, the [`DetailTemplate`]({%slug grid-three-level-hierarchy%}) or the [`GridCommandColumn`]({%slug components/grid/columns/command%}#context) are such examples. Blazor provides an internal variable called [`context`](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/templated-components) for the delegate of the `RenderFragment`. However, if there are nested `RenderFragment`s, this will create multiple `context` variables with the same name in the same programming context. This conflict triggers the exception.
+When nesting components, you will usually do that under tags of type `RenderFragment`. For example, the [`DetailTemplate`](slug://grid-three-level-hierarchy) or the [`GridCommandColumn`](slug://components/grid/columns/command#context) are such examples. Blazor provides an internal variable called [`context`](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/templated-components) for the delegate of the `RenderFragment`. However, if there are nested `RenderFragment`s, this will create multiple `context` variables with the same name in the same programming context. This conflict triggers the exception.
 
 
 ## Solution
diff --git a/knowledge-base/notification-custom-model-data.md b/knowledge-base/notification-custom-model-data.md
index b2bb981638..a2fe70fdd2 100644
--- a/knowledge-base/notification-custom-model-data.md
+++ b/knowledge-base/notification-custom-model-data.md
@@ -28,9 +28,9 @@ I need to get a custom field with different value to each notification (i.e. the
 
 1. Implement a `class` that inherits from [`Telerik.Blazor.Components.NotificationModel`](/blazor-ui/api/Telerik.Blazor.Components.NotificationModel). For example, `MyExtendedNotificationModel`.
 1. Add the required properties to the new class.
-1. Pass a `MyExtendedNotificationModel` instance to the Notification [`Show` method]({%slug notification-open-close-hide%}). This will allow you to set the custom properties.
-1. In the [Notification `<Template>`]({%slug notification-templates%}), cast the `context` to `MyExtendedNotificationModel`. This will allow you to access and consume the additional data.
-1. If you use [both overloads of `Show()`]({%slug notification-open-close-hide%}#open), make sure to check if the cast is successful, otherwise you may get a `NullReferenceException`.
+1. Pass a `MyExtendedNotificationModel` instance to the Notification [`Show` method](slug://notification-open-close-hide). This will allow you to set the custom properties.
+1. In the [Notification `<Template>`](slug://notification-templates), cast the `context` to `MyExtendedNotificationModel`. This will allow you to access and consume the additional data.
+1. If you use [both overloads of `Show()`](slug://notification-open-close-hide#open), make sure to check if the cast is successful, otherwise you may get a `NullReferenceException`.
 
 ````RAZOR
 <TelerikNotification @ref="@NotificationReference">
diff --git a/knowledge-base/notification-keep-on-hover.md b/knowledge-base/notification-keep-on-hover.md
index 236829271c..90d2511084 100644
--- a/knowledge-base/notification-keep-on-hover.md
+++ b/knowledge-base/notification-keep-on-hover.md
@@ -34,10 +34,10 @@ This KB article answers the following questions:
 
 ## Solution
 
-1. [`Show()` notifications]({%slug notification-open-close-hide%}) that don't close automatically. To achieve this, set `CloseAfter` to `0` in the `NotificationModel`.
+1. [`Show()` notifications](slug://notification-open-close-hide) that don't close automatically. To achieve this, set `CloseAfter` to `0` in the `NotificationModel`.
 1. Define a collection that will store the currently open `NotificationModel` instances and the `DateTime` values that determine when they will be hidden.
-1. Implement a `System.Timers.Timer` that will [`Hide()` notifications]({%slug notification-open-close-hide%}) according to the times from the previous step.
-1. Define a [Notification `Template`]({%slug notification-templates%}).
+1. Implement a `System.Timers.Timer` that will [`Hide()` notifications](slug://notification-open-close-hide) according to the times from the previous step.
+1. Define a [Notification `Template`](slug://notification-templates).
 1. Wrap the template content in a `<div>` with [`@onmouseenter` and `@onmouseleave` directives](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/event-handling). The event handlers must enable or disable the hiding of that specific notification instance by the `Timer`.
 
 >caption Keep notifications visible on hover
@@ -203,5 +203,5 @@ This KB article answers the following questions:
 
 ## See Also
 
-* [Notification Template]({%slug notification-templates%})
-* [Show and Hide Notifications Programmatically]({%slug notification-open-close-hide%})
+* [Notification Template](slug://notification-templates)
+* [Show and Hide Notifications Programmatically](slug://notification-open-close-hide)
diff --git a/knowledge-base/notification-single-app-instance.md b/knowledge-base/notification-single-app-instance.md
index f415c2fd91..530d48db89 100644
--- a/knowledge-base/notification-single-app-instance.md
+++ b/knowledge-base/notification-single-app-instance.md
@@ -36,13 +36,13 @@ There are two possible ways to implement a reusable Notification component insta
 
 The Notification component in both scenarios must be defined:
 
-1. As a descendant (or child) of the [`<TelerikRootComponent>`]({%slug rootcomponent-overview%}).
+1. As a descendant (or child) of the [`<TelerikRootComponent>`](slug://rootcomponent-overview).
 1. In a `.razor` file with enabled interactive render mode. The `MainLayout` is interactive only if the Blazor app has **Global** interactivity location.
 
 ### Pass the Notification in a Cascading Value
 
-1. [Define a Telerik Notification component]({%slug notification-overview%}#creating-blazor-notification) in `MainLayout.razor`.
-1. [Set the Notification `@ref` attribute]({%slug notification-overview%}#notifications-reference-and-methods). Use an `internal` or `public` accessor.
+1. [Define a Telerik Notification component](slug://notification-overview#creating-blazor-notification) in `MainLayout.razor`.
+1. [Set the Notification `@ref` attribute](slug://notification-overview#notifications-reference-and-methods). Use an `internal` or `public` accessor.
 1. Wrap the `@Body` in `MainLayout` in a `<CascadingValue>` that passes the `MainLayout` instance itself. This avoids potential issues with missing Notification instance in child components on initial app load. Set `IsFixed="true"` to the `CascadingValue` to avoid unnecessary renders.
 1. Consume the `MainLayout` instance in child Razor components as a `[CascadingParameter]` and access the Notification instance methods through the `MainLayout` instance.
 
@@ -102,8 +102,8 @@ The Notification component in both scenarios must be defined:
 
 1. Implement a service that holds a Notification component instance as a property and executes component methods.
 1. Register the service in `Program.cs`.
-1. [Define a Telerik Notification component]({%slug notification-overview%}#creating-blazor-notification) in `MainLayout.razor`.
-1. Inject the service in `MainLayout.razor` and [set the Notification `@ref` attribute]({%slug notification-overview%}#notifications-reference-and-methods) to a property of the service.
+1. [Define a Telerik Notification component](slug://notification-overview#creating-blazor-notification) in `MainLayout.razor`.
+1. Inject the service in `MainLayout.razor` and [set the Notification `@ref` attribute](slug://notification-overview#notifications-reference-and-methods) to a property of the service.
 1. Inject and use the service in other Razor components.
 
 >caption Reuse a Notification in a service
@@ -199,4 +199,4 @@ builder.Services.AddSingleton<NotificationService>();
 
 ## See Also
 
-* [Notification Overview]({%slug notification-overview%})
+* [Notification Overview](slug://notification-overview)
diff --git a/knowledge-base/numeric-textbox-kb-zero-decimals.md b/knowledge-base/numeric-textbox-kb-zero-decimals.md
index 0c6a1a3aba..89988cb9d8 100644
--- a/knowledge-base/numeric-textbox-kb-zero-decimals.md
+++ b/knowledge-base/numeric-textbox-kb-zero-decimals.md
@@ -21,7 +21,7 @@ ticketid: 1661907
 
 ## Description
 
-When using the [NumericTextBox]({%slug components/numerictextbox/overview%}) with a currency format, setting the `Decimals` parameter to 0 does not prevent decimal places from being displayed. This occurs because the `Format="C"` parameter, which specifies currency formatting, overrides the `Decimals` parameter by adding two decimal places by default, according to the local currency settings (e.g., £).
+When using the [NumericTextBox](slug://components/numerictextbox/overview) with a currency format, setting the `Decimals` parameter to 0 does not prevent decimal places from being displayed. This occurs because the `Format="C"` parameter, which specifies currency formatting, overrides the `Decimals` parameter by adding two decimal places by default, according to the local currency settings (e.g., £).
 
 This KB article also answers the following questions:
 - How to display currency values without decimals in a NumericTextBox?
@@ -46,5 +46,5 @@ It is crucial to understand that the `Decimals` parameter only affects the allow
 
 ## See Also
 
-- [NumericTextBox Parameters]({%slug components/numerictextbox/overview%}#numeric-textbox-parameters)
+- [NumericTextBox Parameters](slug://components/numerictextbox/overview#numeric-textbox-parameters)
 - [Standard Numeric Format Strings - Currency Format Specifier (C)](https://learn.microsoft.com/en-us/dotnet/standard/base-types/standard-numeric-format-strings#currency-format-specifier-c)
diff --git a/knowledge-base/numerictextbox-disable-arrows.md b/knowledge-base/numerictextbox-disable-arrows.md
index 0e9fff313d..8894c44ab0 100644
--- a/knowledge-base/numerictextbox-disable-arrows.md
+++ b/knowledge-base/numerictextbox-disable-arrows.md
@@ -65,4 +65,4 @@ The example below demonstrates how to conditionally render CSS styles to disable
 ## See Also
 
 * [NumericTextBox Overview](https://docs.telerik.com/blazor-ui/components/numerictextbox/overview)
-* [Override the Theme or Apply Custom CSS Styles]({%slug themes-override%})
+* [Override the Theme or Apply Custom CSS Styles](slug://themes-override)
diff --git a/knowledge-base/numerictextbox-percentage-range.md b/knowledge-base/numerictextbox-percentage-range.md
index 6f531dfe85..e5b150213b 100644
--- a/knowledge-base/numerictextbox-percentage-range.md
+++ b/knowledge-base/numerictextbox-percentage-range.md
@@ -51,7 +51,7 @@ Determining whether the actual intent of the user is to input `20` as `20%` or `
 
 ## Solution
 
-Set the [NumericTextBox `Format` parameter]({%slug components/numerictextbox/overview%}#numeric-textbox-parameters) to a [custom format string with a '%' literal](https://learn.microsoft.com/en-us/dotnet/standard/base-types/custom-numeric-format-strings#character-literals):
+Set the [NumericTextBox `Format` parameter](slug://components/numerictextbox/overview#numeric-textbox-parameters) to a [custom format string with a '%' literal](https://learn.microsoft.com/en-us/dotnet/standard/base-types/custom-numeric-format-strings#character-literals):
 
 >caption NumericTextBox custom format and '%' literal
 
@@ -69,7 +69,7 @@ Set the [NumericTextBox `Format` parameter]({%slug components/numerictextbox/ove
 
 ## Notes
 
-You can achieve similar behavior with a [MaskedTextbox component]({%slug maskedtextbox-overview%}). Prepare a proper mask and parse the string to a double for later logic. The example below also shows how to use a culture-aware decimal separator:
+You can achieve similar behavior with a [MaskedTextbox component](slug://maskedtextbox-overview). Prepare a proper mask and parse the string to a double for later logic. The example below also shows how to use a culture-aware decimal separator:
 
 >caption Using the MaskedTextBox component for percent values
 
@@ -117,5 +117,5 @@ You can achieve similar behavior with a [MaskedTextbox component]({%slug maskedt
 
 ## See Also
 
-* [NumericTextBox overview]({%slug components/numerictextbox/overview%})
-* [MaskedTextbox overview]({%slug maskedtextbox-overview%})
+* [NumericTextBox overview](slug://components/numerictextbox/overview)
+* [MaskedTextbox overview](slug://maskedtextbox-overview)
diff --git a/knowledge-base/pager-dropdown-width.md b/knowledge-base/pager-dropdown-width.md
index 2a41ba8e78..e9386975c8 100644
--- a/knowledge-base/pager-dropdown-width.md
+++ b/knowledge-base/pager-dropdown-width.md
@@ -33,7 +33,7 @@ How to change the pager dropdown list width and make it wider? The page size num
 
 ## Solution
 
-Use [custom CSS to override the default width]({%slug themes-override%}) in the Telerik Blazor theme.
+Use [custom CSS to override the default width](slug://themes-override) in the Telerik Blazor theme.
 
 1. Set a custom `Class` to the component (Pager, Grid or ListView).
 1. Target the `.k-pager-sizes .k-dropdownlist` elements inside the component(s) with this custom `Class`.
diff --git a/knowledge-base/pickers-readonly-hidden-input.md b/knowledge-base/pickers-readonly-hidden-input.md
index ff9e1017c3..0a6180cba1 100644
--- a/knowledge-base/pickers-readonly-hidden-input.md
+++ b/knowledge-base/pickers-readonly-hidden-input.md
@@ -121,6 +121,6 @@ function makeDateInputsReadOnly() {
 
 ## See Also
 
-* [DatePicker Overview]({%slug components/datepicker/overview%})
-* [TimePicker Overview]({%slug components/timepicker/overview%})
-* [DateTimePicker Overview]({%slug components/datetimepicker/overview%})
+* [DatePicker Overview](slug://components/datepicker/overview)
+* [TimePicker Overview](slug://components/timepicker/overview)
+* [DateTimePicker Overview](slug://components/datetimepicker/overview)
diff --git a/knowledge-base/progressbar-add-multiple-labels.md b/knowledge-base/progressbar-add-multiple-labels.md
index 9cacad4706..d442dcf840 100644
--- a/knowledge-base/progressbar-add-multiple-labels.md
+++ b/knowledge-base/progressbar-add-multiple-labels.md
@@ -32,7 +32,7 @@ This KB article also answers the following questions:
 
 ## Solution
 
-To display two or more labels in a [ProgressBar]({%slug progressbar-overview%}) for Blazor, use the [Label Template]({%slug progressbar-label%}#template):
+To display two or more labels in a [ProgressBar](slug://progressbar-overview) for Blazor, use the [Label Template](slug://progressbar-label#template):
 1. Declare the `Template` inside the `ProgressBarLabel` label tag.
 1. Add your desired labels in separate HTML containers.
 1. Use CSS to position them based on your preferences.
@@ -73,4 +73,4 @@ The code snippet below creates a ProgressBar with a custom label that includes t
 
 ## See Also
 
-* [ProgressBar Label Documentation]({%slug progressbar-label%})
+* [ProgressBar Label Documentation](slug://progressbar-label)
diff --git a/knowledge-base/qrcode-barcode-chart-export-to-image.md b/knowledge-base/qrcode-barcode-chart-export-to-image.md
index 105066838a..0b7cf102b0 100644
--- a/knowledge-base/qrcode-barcode-chart-export-to-image.md
+++ b/knowledge-base/qrcode-barcode-chart-export-to-image.md
@@ -46,7 +46,7 @@ When using the `SVG` rendering mode:
 1. [Draw the image](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/drawImage) into the `canvas` element.
 1. Use the [`toDataURL`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL) method of the `canvas` HTML element to obtain a Base64 data URI for the image.
 
-> When using a Blazor app with **Server** render mode, make sure to [increase the SignalR max message size]({%slug common-kb-increase-signalr-max-message-size%}), otherwise the Base64 data URI may not reach the .NET runtime.
+> When using a Blazor app with **Server** render mode, make sure to [increase the SignalR max message size](slug://common-kb-increase-signalr-max-message-size), otherwise the Base64 data URI may not reach the .NET runtime.
 
 >caption Export QRCode, BarCode, or Chart to Image
 
@@ -258,6 +258,6 @@ When using the `SVG` rendering mode:
 
 ## See Also
 
-* [Barcode Overview]({%slug barcode-overview%})
-* [Chart Overview]({%slug components/chart/overview%})
-* [QRCore Overview]({%slug qrcode-overview%})
+* [Barcode Overview](slug://barcode-overview)
+* [Chart Overview](slug://components/chart/overview)
+* [QRCore Overview](slug://qrcode-overview)
diff --git a/knowledge-base/radiogroup-inline-style.md b/knowledge-base/radiogroup-inline-style.md
index 12dfcff16d..4a97cc4af3 100644
--- a/knowledge-base/radiogroup-inline-style.md
+++ b/knowledge-base/radiogroup-inline-style.md
@@ -29,7 +29,7 @@ How can I add a RadioGroup component on the same line as other elements? By defa
 
 The RadioGroup renders an `<ul>` element which is block-level by default and falls on a new line. Here is how to override the styling and make the RadioGroup remain on the same line:
 
-1. Set a [CSS Class]({%slug radiogroup-overview%}#radiogroup-parameters) to the RadioGroup.
+1. Set a [CSS Class](slug://radiogroup-overview#radiogroup-parameters) to the RadioGroup.
 1. Override the `display: flex` style of the `<ul class="k-radio-list">` element to `inline-flex`.
 1. Optionally, apply a `vertical-align` style to line up the component with the other elements next to it.
 
diff --git a/knowledge-base/radiogroup-like-buttongroup.md b/knowledge-base/radiogroup-like-buttongroup.md
index 1e37820280..e4e11c694e 100644
--- a/knowledge-base/radiogroup-like-buttongroup.md
+++ b/knowledge-base/radiogroup-like-buttongroup.md
@@ -29,9 +29,9 @@ How to implement RadioGroup behavior, but style the label and radio input pairs
 
 Use custom CSS to make the radio inputs invisible and style their labels to look like buttons.
 
-The RadioGroup will look similar to a [ButtonGroup with single selection]({%slug buttongroup-selection%}#single-selection). The major difference is that the RadioGroup has a single value of type `<T>`, while each button in the ButtonGroup is bound to a separate `boolean` value for its selected state.
+The RadioGroup will look similar to a [ButtonGroup with single selection](slug://buttongroup-selection#single-selection). The major difference is that the RadioGroup has a single value of type `<T>`, while each button in the ButtonGroup is bound to a separate `boolean` value for its selected state.
 
->tip The following example is for versions 6.0 and above, which feature an [updated HTML rendering for the RadioGroup]({%slug rendering-changes-in-6-0-0%}#radiogroup). If you are using an older version, use the [alternative CSS code from the section below](#solution-up-to-version-5-1-1).
+>tip The following example is for versions 6.0 and above, which feature an [updated HTML rendering for the RadioGroup](slug://rendering-changes-in-6-0-0#radiogroup). If you are using an older version, use the [alternative CSS code from the section below](#solution-up-to-version-5-1-1).
 
 >caption Style the RadioGroup like a ButtonGroup
 
@@ -221,4 +221,4 @@ The following CSS code targets different RadioGroup HTML markup up to version 5.
 
 ## See Also
 
-* [How to override CSS theme styles]({%slug themes-override%})
+* [How to override CSS theme styles](slug://themes-override)
diff --git a/knowledge-base/requires-valueexpression.md b/knowledge-base/requires-valueexpression.md
index 7b0dda12b0..87755e5636 100644
--- a/knowledge-base/requires-valueexpression.md
+++ b/knowledge-base/requires-valueexpression.md
@@ -42,7 +42,7 @@ This error comes from the framework and applies to generic inputs as well, not o
 
 There are three common ways to resolve such an error:
 
-* Use two-way binding - the `@bind-Value` syntax if you can. If you wrap our components inside a custom one for your application you need to implement both two-way data binding and `ValueExpression`, read this article for more information: [Validate a Telerik component as child control and apply invalid border ]({%slug inputs-kb-validate-child-component%}). If you need to handle the `ValueChanged` even to implement logic, see this article: [How to handle the ValueChanged event and use forms and validation]({%slug value-changed-validation-model%}). It shows how to use the `ValueExpression` parameter and also hints at using the Telerik-specific `OnChange` event that does not prevent two-way binding.
+* Use two-way binding - the `@bind-Value` syntax if you can. If you wrap our components inside a custom one for your application you need to implement both two-way data binding and `ValueExpression`, read this article for more information: [Validate a Telerik component as child control and apply invalid border ](slug://inputs-kb-validate-child-component). If you need to handle the `ValueChanged` even to implement logic, see this article: [How to handle the ValueChanged event and use forms and validation](slug://value-changed-validation-model). It shows how to use the `ValueExpression` parameter and also hints at using the Telerik-specific `OnChange` event that does not prevent two-way binding.
 * Provide a `ValueExpression` to the component. This is a lambda function that tells the framework what field in the model to update. It is required by the framework when you cannot use `@bind-Value`, but the component is inside a form. The article in the previous point shows an example.
     * You may want to always provide a `ValueExpression` when expecting to reuse input components inside wrapped in a component. This makes them more likely to work when placed inside an `EditForm` from a parent component.
 
diff --git a/knowledge-base/root-component-null-reference.md b/knowledge-base/root-component-null-reference.md
index 15b2474876..48bf380f7f 100644
--- a/knowledge-base/root-component-null-reference.md
+++ b/knowledge-base/root-component-null-reference.md
@@ -45,7 +45,7 @@ Object reference not set to an instance of an object.
 
 ## Possible Cause
 
-The origin of this behavior is a missing [`<TelerikRootComponent>`]({%slug rootcomponent-overview%}) from the `MainLayout.razor` file in the project. 
+The origin of this behavior is a missing [`<TelerikRootComponent>`](slug://rootcomponent-overview) from the `MainLayout.razor` file in the project. 
 
 You can reproduce this with the following snippet:
 
@@ -72,7 +72,7 @@ You can reproduce this with the following snippet:
 
 ## Solution
 
-Wrap the entire content of the `MainLayout.razor` file inside the `<TelerikRootComponent>`. Read more on the assets and configuration steps you need in the [What You Need]({%slug getting-started/what-you-need%}) article.
+Wrap the entire content of the `MainLayout.razor` file inside the `<TelerikRootComponent>`. Read more on the assets and configuration steps you need in the [What You Need](slug://getting-started/what-you-need) article.
 
 >caption Wrapping the content of the MainLayout file inside the TelerikRootComponent
 
diff --git a/knowledge-base/scheduler-conditionally-disable-drag-for-some-appointments.md b/knowledge-base/scheduler-conditionally-disable-drag-for-some-appointments.md
index b0e7fa610c..c0f8fde20f 100644
--- a/knowledge-base/scheduler-conditionally-disable-drag-for-some-appointments.md
+++ b/knowledge-base/scheduler-conditionally-disable-drag-for-some-appointments.md
@@ -33,9 +33,9 @@ This KB article answers the following questions:
 
 To conditionally disable dragging an appointment based on your desired condition, follow these steps:
 
-1. Handle the [`OnItemRender` event]({%slug scheduler-events%}#itemrender) to add a custom CSS class to the non-draggable appointments.
+1. Handle the [`OnItemRender` event](slug://scheduler-events#itemrender) to add a custom CSS class to the non-draggable appointments.
 2. Use this custom CSS class as a selector to stop the [pointer-events](https://www.w3schools.com/cssref/css3_pr_pointer-events.php) of the targeted appointments.
-3. Extend the [`OnUpdate` handler]({%slug scheduler-appointments-edit%}#basics) logic to ensure the appointment will not be dropped to another slot. Steps 1 and 2 will prevent dragging, but the user can enable the pointer events from the DOM inspector. Add a check in your `OnUpdate` handler to ensure that if the user drags the appointment, it will not be updated and dropped to a different slot.
+3. Extend the [`OnUpdate` handler](slug://scheduler-appointments-edit#basics) logic to ensure the appointment will not be dropped to another slot. Steps 1 and 2 will prevent dragging, but the user can enable the pointer events from the DOM inspector. Add a check in your `OnUpdate` handler to ensure that if the user drags the appointment, it will not be updated and dropped to a different slot.
 
 > This solution also prevents the user from deleting the non-draggable appointments. See [Notes section](#notes) if you want to allow the deleting.
 
diff --git a/knowledge-base/scheduler-context-menu-on-appointments-and-empty-slots.md b/knowledge-base/scheduler-context-menu-on-appointments-and-empty-slots.md
index 7ba4cd7c82..d6c1f27704 100644
--- a/knowledge-base/scheduler-context-menu-on-appointments-and-empty-slots.md
+++ b/knowledge-base/scheduler-context-menu-on-appointments-and-empty-slots.md
@@ -28,7 +28,7 @@ previous_url: /knowledge-base/scheduler-appointment-context-menu
 
 This KB article answers the following questions:
 
-* How to add a [Context menu]({%slug contextmenu-overview%}) to the appointments to provide shortcuts to custom features?
+* How to add a [Context menu](slug://contextmenu-overview) to the appointments to provide shortcuts to custom features?
 * How to add a Context menu that can be opened anywhere on the scheduler board, not just on appointments?
 * Is there any way to get the timeslot of where the Context menu is open?
 * How do I add a new appointment at a specific timeslot through the Context menu?
@@ -37,12 +37,12 @@ This KB article answers the following questions:
 
 To implement a Context menu on appointments and on empty slots in the Scheduler, follow these steps:
 
-1. Use the Scheduler templates to [integrate the Context menu]({%slug contextmenu-integration%}):
-    * Use the [Appointment Templates]({%slug scheduler-templates-appointment%}) to enable the Context menu to appear on appointments. 
-    * Use the [Slot Templates]({%slug scheduler-templates-slot%}) to enable the Context menu to appear on cells without appointments. 
+1. Use the Scheduler templates to [integrate the Context menu](slug://contextmenu-integration):
+    * Use the [Appointment Templates](slug://scheduler-templates-appointment) to enable the Context menu to appear on appointments. 
+    * Use the [Slot Templates](slug://scheduler-templates-slot) to enable the Context menu to appear on cells without appointments. 
 1. Pass the context of the template in the `@oncontextmenu` event.
 1. Use the timeslot or appointment information obtained from the context of the template.
-1. Add the desired [Context menu]({%slug contextmenu-overview%}) and create its items, commands and actions as needed.
+1. Add the desired [Context menu](slug://contextmenu-overview) and create its items, commands and actions as needed.
 
 >caption Different Context menu commands depending on the IsImportant appointment model property
 ````RAZOR
@@ -370,8 +370,8 @@ To implement a Context menu on appointments and on empty slots in the Scheduler,
 ````
 
 ## See Also
-* [Scheduler Overview]({%slug scheduler-overview%})
-* [Scheduler Appointment Templates]({%slug scheduler-templates-appointment%})
-* [Scheduler Slot Templates]({%slug scheduler-templates-slot%})
-* [Context menu Overview]({%slug contextmenu-overview%})
-* [Context menu Integration]({%slug contextmenu-integration%})
\ No newline at end of file
+* [Scheduler Overview](slug://scheduler-overview)
+* [Scheduler Appointment Templates](slug://scheduler-templates-appointment)
+* [Scheduler Slot Templates](slug://scheduler-templates-slot)
+* [Context menu Overview](slug://contextmenu-overview)
+* [Context menu Integration](slug://contextmenu-integration)
\ No newline at end of file
diff --git a/knowledge-base/scheduler-display-allday.md b/knowledge-base/scheduler-display-allday.md
index a469c9cfc4..a6a22ac43f 100644
--- a/knowledge-base/scheduler-display-allday.md
+++ b/knowledge-base/scheduler-display-allday.md
@@ -25,7 +25,7 @@ res_type: kb
 This KB article answers the following questions:
 
 * How to display only all-day events in the Scheduler?
-* How to show only all-day appointments in a [Timeline View]({%slug scheduler-views-timeline%}) of the Scheduler?
+* How to show only all-day appointments in a [Timeline View](slug://scheduler-views-timeline) of the Scheduler?
 * How to create a multiday scheduler view that only displays the all-day events?
 
 ## Solution
diff --git a/knowledge-base/scheduler-hide-month-cells-in-month-view.md b/knowledge-base/scheduler-hide-month-cells-in-month-view.md
index 34eabbad21..206e029e15 100644
--- a/knowledge-base/scheduler-hide-month-cells-in-month-view.md
+++ b/knowledge-base/scheduler-hide-month-cells-in-month-view.md
@@ -243,5 +243,5 @@ To hide the dates from other months in the month view of the Scheduler component
 ````
 
 ## See Also
-* [Scheduler Slot Templates]({%slug scheduler-templates-slot%})
+* [Scheduler Slot Templates](slug://scheduler-templates-slot)
 
diff --git a/knowledge-base/scheduler-ics-data.md b/knowledge-base/scheduler-ics-data.md
index 51282b6b06..275ac459ec 100644
--- a/knowledge-base/scheduler-ics-data.md
+++ b/knowledge-base/scheduler-ics-data.md
@@ -27,8 +27,8 @@ Is there a way to use the scheduler with ics data?
 
 ## Solution
 
-You can write up a simple converter that parses the string that is the ICS format to the [models for the Scheduler]({%slug scheduler-appointments-databinding%}) that the Blazor app uses already. You can find an example at [https://github.com/telerik/blazor-ui/tree/master/scheduler/ICS-data-convertion](https://github.com/telerik/blazor-ui/tree/master/scheduler/ICS-data-convertion)
+You can write up a simple converter that parses the string that is the ICS format to the [models for the Scheduler](slug://scheduler-appointments-databinding) that the Blazor app uses already. You can find an example at [https://github.com/telerik/blazor-ui/tree/master/scheduler/ICS-data-convertion](https://github.com/telerik/blazor-ui/tree/master/scheduler/ICS-data-convertion)
 
 ## Notes
 
-You can easily integrate the Scheduler component with other appointment management applications such as Google or Apple calendar by utilizing a third-party library that provides the conversion between their data models and services and the models for the scheduler in your blazor app. The Telerik Scheduler provides you with [CRUD events]({%slug scheduler-appointments-edit%}) that give you the user actions so you can call upon such services with any desired code and full flexibility.
+You can easily integrate the Scheduler component with other appointment management applications such as Google or Apple calendar by utilizing a third-party library that provides the conversion between their data models and services and the models for the scheduler in your blazor app. The Telerik Scheduler provides you with [CRUD events](slug://scheduler-appointments-edit) that give you the user actions so you can call upon such services with any desired code and full flexibility.
diff --git a/knowledge-base/scheduler-many-colors-for-appointments.md b/knowledge-base/scheduler-many-colors-for-appointments.md
index 5c24c69bf7..f15cbc58ad 100644
--- a/knowledge-base/scheduler-many-colors-for-appointments.md
+++ b/knowledge-base/scheduler-many-colors-for-appointments.md
@@ -23,12 +23,12 @@ res_type: kb
 
 ## Description
 
-I want to set different background colors to the appointments dynamically. I can add custom CSS classes through the [OnItemRender]({%slug scheduler-events%}#itemrender) event. However, this isn't a practical use case for us, as we will be applying many different styles, which can change depending on who is using the application, so we don't want to have that many classes for each case. Is there any other way to achieve the desired result? We already have the colors in the database.
+I want to set different background colors to the appointments dynamically. I can add custom CSS classes through the [OnItemRender](slug://scheduler-events#itemrender) event. However, this isn't a practical use case for us, as we will be applying many different styles, which can change depending on who is using the application, so we don't want to have that many classes for each case. Is there any other way to achieve the desired result? We already have the colors in the database.
 
 ## Solution
 
 * Add background-color and color properties to the appointment model.
-* Use [Appointment Templates]({%slug scheduler-templates-appointment%}) to render the desired colors and styles for each appointment. Retrieve the style values from the template `context`.
+* Use [Appointment Templates](slug://scheduler-templates-appointment) to render the desired colors and styles for each appointment. Retrieve the style values from the template `context`.
 * Wrap the appointment template content in a container that will hold the custom styles.
 * (optional) Remove the default `padding` of the `.k-event` elements.
 
diff --git a/knowledge-base/scheduler-readonly-slots.md b/knowledge-base/scheduler-readonly-slots.md
index ae5dd2e2e2..fad2a3fdcf 100644
--- a/knowledge-base/scheduler-readonly-slots.md
+++ b/knowledge-base/scheduler-readonly-slots.md
@@ -27,7 +27,7 @@ I want to define readonly time slots in the Scheduler. The user should not be ab
 
 ## Solution
 
-You can implement custom validation method to check if an appointment is valid and handle the [Scheduler CRUD events]({%slug scheduler-appointments-edit%}) to update the data only if the appointment meets the desired criteria.
+You can implement custom validation method to check if an appointment is valid and handle the [Scheduler CRUD events](slug://scheduler-appointments-edit) to update the data only if the appointment meets the desired criteria.
 
 Additionally, you can include some custom CSS styles to visually mark the corresponding slots as readonly (for example, set a different background color).
 
diff --git a/knowledge-base/signature-relative-width-height.md b/knowledge-base/signature-relative-width-height.md
index 8634a59c84..c6465c89d7 100644
--- a/knowledge-base/signature-relative-width-height.md
+++ b/knowledge-base/signature-relative-width-height.md
@@ -151,5 +151,5 @@ A possible workaround is to change the component `Width` and `Height` at runtime
 
 ## See Also
 
-* [Signature Overview]({%slug signature-overview%})
+* [Signature Overview](slug://signature-overview)
 * [Resize Signature without hiding it](https://feedback.telerik.com/blazor/1588545)
diff --git a/knowledge-base/splitbutton-dynamic-primary-change-onclick.md b/knowledge-base/splitbutton-dynamic-primary-change-onclick.md
index 06fe82f806..54349f3437 100644
--- a/knowledge-base/splitbutton-dynamic-primary-change-onclick.md
+++ b/knowledge-base/splitbutton-dynamic-primary-change-onclick.md
@@ -101,5 +101,5 @@ This KB article answers the following questions:
 
 ## See Also
 
-* [SplitButton Events]({%slug splitbutton-events%})
-* [SplitButton Icons]({%slug splitbutton-icons%})
+* [SplitButton Events](slug://splitbutton-events)
+* [SplitButton Icons](slug://splitbutton-icons)
diff --git a/knowledge-base/splitter-save-and-load-state.md b/knowledge-base/splitter-save-and-load-state.md
index cbdc1c34da..6ff2d629db 100644
--- a/knowledge-base/splitter-save-and-load-state.md
+++ b/knowledge-base/splitter-save-and-load-state.md
@@ -34,9 +34,9 @@ Implement this scenario in two steps:
 
 Handle the Splitter events to save its state in the LocalStorage when the user changes the component layout:
 
-* [OnCollapse]({%slug splitter-events%}#oncollapse)
-* [OnExpand]({%slug splitter-events%}#onexpand)
-* [OnResize]({%slug splitter-events%}#onresize)
+* [OnCollapse](slug://splitter-events#oncollapse)
+* [OnExpand](slug://splitter-events#onexpand)
+* [OnResize](slug://splitter-events#onresize)
 
 ### Load the Splitter state
 
diff --git a/knowledge-base/spreadsheet-bind-to-json-ienumerable-list-collection.md b/knowledge-base/spreadsheet-bind-to-json-ienumerable-list-collection.md
index 7bf4421a85..c3153c70d8 100644
--- a/knowledge-base/spreadsheet-bind-to-json-ienumerable-list-collection.md
+++ b/knowledge-base/spreadsheet-bind-to-json-ienumerable-list-collection.md
@@ -24,11 +24,11 @@ res_type: kb
 
 ## Description
 
-The [Telerik Spreadsheet component for Blazor]({%slug spreadsheet-overview%}) can display data from a byte array (`byte[]`). This KB demonstrates how to bind the Spreadsheet to object data, for example, `IEnumerable`, `List` or any other collection, including deserialized `JSON`.
+The [Telerik Spreadsheet component for Blazor](slug://spreadsheet-overview) can display data from a byte array (`byte[]`). This KB demonstrates how to bind the Spreadsheet to object data, for example, `IEnumerable`, `List` or any other collection, including deserialized `JSON`.
 
 ## Solution
 
-The approach requires [Telerik Document Processing]({%slug dpl-in-blazor%}) to create an [Excel file in memory](https://docs.telerik.com/devtools/document-processing/knowledge-base/generate-excel-files-from-ienumerable-collections) and convert it to a byte array which is compatible with the Spreadsheet component.
+The approach requires [Telerik Document Processing](slug://dpl-in-blazor) to create an [Excel file in memory](https://docs.telerik.com/devtools/document-processing/knowledge-base/generate-excel-files-from-ienumerable-collections) and convert it to a byte array which is compatible with the Spreadsheet component.
 
 1. Install the required [Telerik Document Processing NuGet packages](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/getting-started):
     * `Telerik.Documents.Spreadsheet`
@@ -180,4 +180,4 @@ The approach requires [Telerik Document Processing]({%slug dpl-in-blazor%}) to c
 ## See Also
 
 * [Create Excel Documents with SpreadProcessing](https://docs.telerik.com/devtools/document-processing/knowledge-base/generate-excel-files-from-ienumerable-collections)
-* [Spreadsheet Overview]({%slug spreadsheet-overview%})
+* [Spreadsheet Overview](slug://spreadsheet-overview)
diff --git a/knowledge-base/spreadsheet-get-cell-values.md b/knowledge-base/spreadsheet-get-cell-values.md
index 0eccd1ea69..225e78ce07 100644
--- a/knowledge-base/spreadsheet-get-cell-values.md
+++ b/knowledge-base/spreadsheet-get-cell-values.md
@@ -33,8 +33,8 @@ This KB article answers the following questions:
 1. Install the required [Telerik Document Processing NuGet packages](https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/getting-started):
     * `Telerik.Documents.Spreadsheet`
     * `Telerik.Documents.Spreadsheet.FormatProviders.OpenXml`
-1. Set the [`@ref` attribute of the Spreadsheet]({%slug spreadsheet-overview%}#spreadsheet-reference-and-methods), so that you can call component methods.
-1. Use the [`ExportToExcelAsync()` Spreadsheet method]({%slug spreadsheet-overview%}#spreadsheet-reference-and-methods) to get the Excel file as a `byte[]`.
+1. Set the [`@ref` attribute of the Spreadsheet](slug://spreadsheet-overview#spreadsheet-reference-and-methods), so that you can call component methods.
+1. Use the [`ExportToExcelAsync()` Spreadsheet method](slug://spreadsheet-overview#spreadsheet-reference-and-methods) to get the Excel file as a `byte[]`.
 1. Create a `MemoryStream` that contains the Excel file byte array.
 
     The steps below use the [Telerik RadSpreadProcessing API](https://docs.telerik.com/devtools/document-processing/api/) and are outside the scope of Telerik UI for Blazor.
@@ -206,5 +206,5 @@ This KB article answers the following questions:
 
 ## See Also
 
-* [Spreadsheet Overview]({%slug spreadsheet-overview%})
-* [Spreadsheet Tools]({%slug spreadsheet-tools%})
+* [Spreadsheet Overview](slug://spreadsheet-overview)
+* [Spreadsheet Tools](slug://spreadsheet-tools)
diff --git a/knowledge-base/switch-change-background-color.md b/knowledge-base/switch-change-background-color.md
index 59c83b1567..8511008d47 100644
--- a/knowledge-base/switch-change-background-color.md
+++ b/knowledge-base/switch-change-background-color.md
@@ -33,7 +33,7 @@ What CSS class to change the Switch background color when it has focus?
 
 ## Solution
 
-Add custom CSS rules to the app, which [override the default styles]({%slug themes-override%}) and apply custom background color for on, off, focused and hover state.
+Add custom CSS rules to the app, which [override the default styles](slug://themes-override) and apply custom background color for on, off, focused and hover state.
 
 The example below uses a `Class` parameter to render a custom CSS class to one of the Switches. To target all Switch instances on the page or in the app, remove the `.my-switch` class from the component declaration and the CSS code.
 
@@ -92,4 +92,4 @@ The example below uses a `Class` parameter to render a custom CSS class to one o
 
 ## See Also
 
-* [Override and customize the Blazor theme CSS]({%slug themes-override%})
+* [Override and customize the Blazor theme CSS](slug://themes-override)
diff --git a/knowledge-base/tabstrip-activate-by-index.md b/knowledge-base/tabstrip-activate-by-index.md
index 1c5a7d6462..1e2a527432 100644
--- a/knowledge-base/tabstrip-activate-by-index.md
+++ b/knowledge-base/tabstrip-activate-by-index.md
@@ -26,5 +26,5 @@ I have a TabStrip that renders tabs dynamically based on a list. Is there a way
 
 ## Solution
 
-As of version 2.0.0, tabs are selected by index out of the box through the `ActiveTabIndex` parameter. See the examples in the [Tab Strip documentation]({%slug components/tabstrip/overview%}).
+As of version 2.0.0, tabs are selected by index out of the box through the `ActiveTabIndex` parameter. See the examples in the [Tab Strip documentation](slug://components/tabstrip/overview).
 
diff --git a/knowledge-base/tabstrip-customize-selected-tab-border-blazor.md b/knowledge-base/tabstrip-customize-selected-tab-border-blazor.md
index e492061cea..27d6c5b299 100644
--- a/knowledge-base/tabstrip-customize-selected-tab-border-blazor.md
+++ b/knowledge-base/tabstrip-customize-selected-tab-border-blazor.md
@@ -97,4 +97,4 @@ else
 
 * [Telerik TabStrip Overview](https://docs.telerik.com/blazor-ui/components/tabstrip/overview)
 * [Telerik TabStrip Tabs Configuration](https://docs.telerik.com/blazor-ui/components/tabstrip/tabs-configuration)
-* [Override the Theme or Apply Custom CSS Styles]({%slug themes-override%})
\ No newline at end of file
+* [Override the Theme or Apply Custom CSS Styles](slug://themes-override)
\ No newline at end of file
diff --git a/knowledge-base/tabstrip-load-all-tabs-initially.md b/knowledge-base/tabstrip-load-all-tabs-initially.md
index 5052a10875..d74eb5aaf4 100644
--- a/knowledge-base/tabstrip-load-all-tabs-initially.md
+++ b/knowledge-base/tabstrip-load-all-tabs-initially.md
@@ -30,13 +30,13 @@ This KB answers the following questions:
 
 ## Solution
 
-Even when [`PersistTabContent="true"`]({%slug tabstrip-persist-content%}), the TabStrip initializes and renders each tab container for the first time only after the user clicks on the respective tab to activate it. This improves the app performance.
+Even when [`PersistTabContent="true"`](slug://tabstrip-persist-content), the TabStrip initializes and renders each tab container for the first time only after the user clicks on the respective tab to activate it. This improves the app performance.
 
 In scenarios where all TabStrip tabs must render initially and be in the DOM at all times, use the following approach:
 
 1. Move the tab content outside the TabStrip. Use one HTML `<div>` to hold the contents of each tab. The `<TabStripTab>` tags cannot remain completely empty, so add some dummy content such as `&nbsp;`.
 1. Hide the TabStrip tab container elements (`<div class="k-tabstrip-content">`) with a `display:none` CSS style.
-1. Toggle the `display` styles of the HTML `<div>`s in the [TabStrip `ActiveTabIndexChanged` event]({%slug tabstrip-events%}#activetabindexchanged).
+1. Toggle the `display` styles of the HTML `<div>`s in the [TabStrip `ActiveTabIndexChanged` event](slug://tabstrip-events#activetabindexchanged).
 
 >caption Render all TabStrip tabs initially
 
@@ -83,5 +83,5 @@ In scenarios where all TabStrip tabs must render initially and be in the DOM at
 
 ## See Also
 
-* [Persist TabStrip Tab Content]({%slug tabstrip-persist-content%})
-* [TabStrip Events]({%slug tabstrip-events%})
+* [Persist TabStrip Tab Content](slug://tabstrip-persist-content)
+* [TabStrip Events](slug://tabstrip-events)
diff --git a/knowledge-base/tabstrip-remove-tab.md b/knowledge-base/tabstrip-remove-tab.md
index 2b44111168..1e9394dcb4 100644
--- a/knowledge-base/tabstrip-remove-tab.md
+++ b/knowledge-base/tabstrip-remove-tab.md
@@ -26,15 +26,15 @@ I want a close button on my tabs so the use can remove (close) them. When that h
 
 ## Solution
 
-1. Use the [HeaderTemplate]({%slug tabstrip-header-template%}) of the tabs to add the desired close button
+1. Use the [HeaderTemplate](slug://tabstrip-header-template) of the tabs to add the desired close button
 
 1. Have conditional logic to display only the tab you want (for example, loop over a collection of tab descriptor classes, see an example in <a href="https://github.com/telerik/blazor-ui/tree/master/tabstrip/DynamicTabs" target="_blank">this sample project</a>).
 
 1. Stop the propagation of the `@onclick` event on the custom button. 
 
-1. Handle the [`ActiveTabIndexChanged` event]({%slug tabstrip-events%}) explicitly to update the selected tab index
+1. Handle the [`ActiveTabIndexChanged` event](slug://tabstrip-events) explicitly to update the selected tab index
 
-1. In the Close button click handler use the [`Visible` parameter]({%slug tabstrip-tabs-configuration%}#visible) to hide the tab.
+1. In the Close button click handler use the [`Visible` parameter](slug://tabstrip-tabs-configuration#visible) to hide the tab.
 
 >caption Close button on a tab
 
diff --git a/knowledge-base/textarea-autosize-max-height.md b/knowledge-base/textarea-autosize-max-height.md
index 8819f3e51c..1c29cc6eaa 100644
--- a/knowledge-base/textarea-autosize-max-height.md
+++ b/knowledge-base/textarea-autosize-max-height.md
@@ -33,7 +33,7 @@ This KB article answers the following questions:
 
 ## Solution
 
-1. Set a [`Class` to the TextArea]({%slug textarea-overview%}#textarea-parameters).
+1. Set a [`Class` to the TextArea](slug://textarea-overview#textarea-parameters).
 1. Apply a `max-height` style and `overflow-y: auto !important;` to the `textarea` children of the CSS class from the previous step.
 
 >caption AutoSize TextArea up to a maximum height
@@ -60,5 +60,5 @@ This KB article answers the following questions:
 
 ## See Also
 
-* [TextArea Overview]({%slug textarea-overview%})
-* [TextArea Appearance]({%slug TextArea-appearance%})
+* [TextArea Overview](slug://textarea-overview)
+* [TextArea Appearance](slug://TextArea-appearance)
diff --git a/knowledge-base/textarea-maxlength-and-character-counter.md b/knowledge-base/textarea-maxlength-and-character-counter.md
index 91d2de9713..58d00bfff3 100644
--- a/knowledge-base/textarea-maxlength-and-character-counter.md
+++ b/knowledge-base/textarea-maxlength-and-character-counter.md
@@ -91,7 +91,7 @@ When the TextArea is inside a Form, you can use the built-in Form validation and
 
 With this setup, the user will be able to type more than the allowed characters, but in this case they will get a validation error. An error message will be automatically displayed for this field, if you have provided such in the `MaxLength` attribute.
 
-If you are declaring the TextArea inside a [`FormItem Template`]({%slug form-formitems-template%}), such a validation message will not be displayed out of the box. In this case, add a [ValidationMessage component]({%slug validation-tools-message%}).
+If you are declaring the TextArea inside a [`FormItem Template`](slug://form-formitems-template), such a validation message will not be displayed out of the box. In this case, add a [ValidationMessage component](slug://validation-tools-message).
 
 To inform the user about the remaining characters, render the TextArea value length and the `MaxLength` value—this will serve as a character counter. Add the desired CSS rules or classes to style the counter as needed.
 
diff --git a/knowledge-base/textbox-add-icon.md b/knowledge-base/textbox-add-icon.md
index 3234abc8bc..7b547e8343 100644
--- a/knowledge-base/textbox-add-icon.md
+++ b/knowledge-base/textbox-add-icon.md
@@ -93,7 +93,7 @@ TextBoxes (`<input>` elements) can only hold plain text. It is possible to rende
 
 ### Version 2.30 and Older
 
-[UI for Blazor 3.0 changed the HTML rendering of input components]({%slug changes-in-3-0-0%}#rendering-and-themes). For older versions use the code below.
+[UI for Blazor 3.0 changed the HTML rendering of input components](slug://changes-in-3-0-0#rendering-and-themes). For older versions use the code below.
 
 ![add icon to the textbox - result](images/textbox-icon-example.png)
 
diff --git a/knowledge-base/textbox-chrome-autofill-label.md b/knowledge-base/textbox-chrome-autofill-label.md
index 9ef13a736e..df03c907a0 100644
--- a/knowledge-base/textbox-chrome-autofill-label.md
+++ b/knowledge-base/textbox-chrome-autofill-label.md
@@ -80,6 +80,6 @@ General suggestions on the Internet are to handle events like `mouseover` or `mo
 
 ## See Also
 
-* [Chrome autofills the Form and the floating label overlaps the values]({%slug form-chrome-autofill%})
+* [Chrome autofills the Form and the floating label overlaps the values](slug://form-chrome-autofill)
 
-* [Empty TextBox value on Chrome autofill]({%slug textbox-kb-empty-value-on-autofill%})
\ No newline at end of file
+* [Empty TextBox value on Chrome autofill](slug://textbox-kb-empty-value-on-autofill)
\ No newline at end of file
diff --git a/knowledge-base/textbox-empty-value-on-autofill.md b/knowledge-base/textbox-empty-value-on-autofill.md
index ccb343f692..9c19dee1ec 100644
--- a/knowledge-base/textbox-empty-value-on-autofill.md
+++ b/knowledge-base/textbox-empty-value-on-autofill.md
@@ -69,13 +69,13 @@ The issue occurs after an upgrade to version 2.30.
 
 ## Possible Cause
 
-UI for Blazor 2.30 adds a [`DebounceDelay` parameter for the TextBox]({%slug components/textbox/overview%}#textbox-parameters). It specifies the time in milliseconds between the last typed symbol and the actual value update. DebounceDelay has a default value of 150ms and depends on the `oninput` event to count this time.
+UI for Blazor 2.30 adds a [`DebounceDelay` parameter for the TextBox](slug://components/textbox/overview#textbox-parameters). It specifies the time in milliseconds between the last typed symbol and the actual value update. DebounceDelay has a default value of 150ms and depends on the `oninput` event to count this time.
 
 However, when the browser (Chrome, for example) autofills form field values, the `oninput` event is not fired until some interaction with the page occurs. This means that the browser does not notify the fields that their values have changed.
 
 Thus, when clicking Login for the first time (interacting with the page), the `oninput` fires but the default DebounceDelay of 150ms postpones the TextBox value update.
 
-Other components that also have DebounceDelay property and might be affected are [TextArea]({%slug textarea-overview%}#textarea-parameters) and [MaskedTextBox]({%slug maskedtextbox-overview%}#maskedtextbox-parameters).
+Other components that also have DebounceDelay property and might be affected are [TextArea](slug://textarea-overview#textarea-parameters) and [MaskedTextBox](slug://maskedtextbox-overview#maskedtextbox-parameters).
 
 ## Suggested Workarounds
 
@@ -120,6 +120,6 @@ The example below demonstrates the first approach - removing the default Debounc
 
 ## See Also
 
-* [Chrome autofills the Form and the floating label overlaps the values]({%slug form-chrome-autofill%})
+* [Chrome autofills the Form and the floating label overlaps the values](slug://form-chrome-autofill)
 
-* [Label not moved from input on browser autofill in Chrome]({%slug textbox-chrome-autofill-label%})
\ No newline at end of file
+* [Label not moved from input on browser autofill in Chrome](slug://textbox-chrome-autofill-label)
\ No newline at end of file
diff --git a/knowledge-base/textbox-eye-reveal-password.md b/knowledge-base/textbox-eye-reveal-password.md
index 7b4497ccf5..2d5c64fc6d 100644
--- a/knowledge-base/textbox-eye-reveal-password.md
+++ b/knowledge-base/textbox-eye-reveal-password.md
@@ -31,10 +31,10 @@ This KB answers the following questions:
 
 ## Solution
 
-1. Add a [Button]({%slug components/button/overview%}) or a [ToggleButton]({%slug togglebutton-overview%}) with the desired [icon]({%slug button-icons%}) next to the TextBox or inside the [TextBox `SuffixTemplate`]({%slug common-features/input-adornments%}).
-1. Use the [Button's `OnClick` event handler]({%slug button-events%}) to toggle the [TextBox `Password` parameter]({%slug components/textbox/overview%}#textbox-parameters) value.
-1. (optional) Instead of Button `OnClick`, use `@onmousedown` and `@onmouseup` Blazor events on a generic HTML element to toggle the TextBox `Password` parameter. This approach allows using events with Telerik components that do not expose them, for example, a [Telerik SVG icon or a font icon]({%slug common-features-icons%}).
-1. To use the TextBox with a reveal button inside a [Telerik Form, use a `FormItem` `Template`]({%slug form-formitems-template%}).
+1. Add a [Button](slug://components/button/overview) or a [ToggleButton](slug://togglebutton-overview) with the desired [icon](slug://button-icons) next to the TextBox or inside the [TextBox `SuffixTemplate`](slug://common-features/input-adornments).
+1. Use the [Button's `OnClick` event handler](slug://button-events) to toggle the [TextBox `Password` parameter](slug://components/textbox/overview#textbox-parameters) value.
+1. (optional) Instead of Button `OnClick`, use `@onmousedown` and `@onmouseup` Blazor events on a generic HTML element to toggle the TextBox `Password` parameter. This approach allows using events with Telerik components that do not expose them, for example, a [Telerik SVG icon or a font icon](slug://common-features-icons).
+1. To use the TextBox with a reveal button inside a [Telerik Form, use a `FormItem` `Template`](slug://form-formitems-template).
 
 >caption Add an eye icon to reveal a password
 
@@ -79,5 +79,5 @@ This KB answers the following questions:
 
 ## See Also
 
-* [Input Adornments]({%slug common-features/input-adornments%})
-* [Form Item Templates]({%slug form-formitems-template%})
\ No newline at end of file
+* [Input Adornments](slug://common-features/input-adornments)
+* [Form Item Templates](slug://form-formitems-template)
\ No newline at end of file
diff --git a/knowledge-base/textbox-select-in-focus.md b/knowledge-base/textbox-select-in-focus.md
index 9d60020aed..66a57ec631 100644
--- a/knowledge-base/textbox-select-in-focus.md
+++ b/knowledge-base/textbox-select-in-focus.md
@@ -43,7 +43,7 @@ At the time of writing, Blazor does not have native API for handling focus and s
 </script>
 ````
 
-1. Call that function in the desired event like `@focusin`. See how to get such events [here]({%slug inputs-kb-handle-keyboard-events%}).
+1. Call that function in the desired event like `@focusin`. See how to get such events [here](slug://inputs-kb-handle-keyboard-events).
 
 
 ````RAZOR.skip-repl
diff --git a/knowledge-base/textbox-validate-on-change.md b/knowledge-base/textbox-validate-on-change.md
index b750fb141f..3bbb7e6884 100644
--- a/knowledge-base/textbox-validate-on-change.md
+++ b/knowledge-base/textbox-validate-on-change.md
@@ -31,7 +31,7 @@ Is there a way to disable this behavior?
 
 We believe that firing the validation immediately makes the user experience more fluid and lets the user know about form issues quickly, which reduces frustration. Thus, we fire validation with the `ValueChanged` event.
 
->tip Telerik UI for Blazor 2.30 adds a `ValidateOn` parameter to input components. It defines the event that triggers validation (`OnChange` or `OnInput`). Read more at [Validation Modes for Simple Inputs]({%slug common-features/input-validation%}#validation-modes-for-simple-inputs).
+>tip Telerik UI for Blazor 2.30 adds a `ValidateOn` parameter to input components. It defines the event that triggers validation (`OnChange` or `OnInput`). Read more at [Validation Modes for Simple Inputs](slug://common-features/input-validation#validation-modes-for-simple-inputs).
 
 ### Differences with standard inputs
 
diff --git a/knowledge-base/tilelayout-nested-instances.md b/knowledge-base/tilelayout-nested-instances.md
index e6b1a1b5f0..4b5ec11de6 100644
--- a/knowledge-base/tilelayout-nested-instances.md
+++ b/knowledge-base/tilelayout-nested-instances.md
@@ -160,6 +160,6 @@ To manage nested TileLyouts with resizing and reordering:
 ````
 
 ## See Also
-- [TileLayout Overview]({%slug tilelayout-overview%})
-- [TileLayout Reorderable Documentation]({%slug tilelayout-reorder%})
-- [TileLayout Resizable Documentation]({%slug tilelayout-resize%})
+- [TileLayout Overview](slug://tilelayout-overview)
+- [TileLayout Reorderable Documentation](slug://tilelayout-reorder)
+- [TileLayout Resizable Documentation](slug://tilelayout-resize)
diff --git a/knowledge-base/tilelayout-responsive.md b/knowledge-base/tilelayout-responsive.md
index ddebb3426a..2cf0fc1350 100644
--- a/knowledge-base/tilelayout-responsive.md
+++ b/knowledge-base/tilelayout-responsive.md
@@ -30,7 +30,7 @@ Generally, the `Width` and `Height` parameters of the component can take values
 
 This works well for the initial rendering and the component will be "responsive" immediately according to your layout, regardless of the display (desktop, tablet, phone).
 
-When the layout changes dynamically at runtime, you can use the [TelerikMediaQuery]({%slug mediaquery-overview%}) component to respond to changes of the browser window size. This would allow you to change one or more of the parameters of the component like `Columns`, `ColumnWidth`, and `RowHeight`.
+When the layout changes dynamically at runtime, you can use the [TelerikMediaQuery](slug://mediaquery-overview) component to respond to changes of the browser window size. This would allow you to change one or more of the parameters of the component like `Columns`, `ColumnWidth`, and `RowHeight`.
 
 ````RAZOR
 @* Resize the browser to width to less than 767px to change the layout of the component.  *@
diff --git a/knowledge-base/tooltip-callout-position.md b/knowledge-base/tooltip-callout-position.md
index b05f6b44cd..edba7f95b5 100644
--- a/knowledge-base/tooltip-callout-position.md
+++ b/knowledge-base/tooltip-callout-position.md
@@ -31,7 +31,7 @@ This Knowledge Base article answers the following questions:
 ## Solution
 
 1. Set a custom CSS class to the Tooltip through the `Class` parameter. This configuration allows you to target specific Tooltip instances.
-2. Use the defined class to [override the theme styles]({%slug themes-override%}).
+2. Use the defined class to [override the theme styles](slug://themes-override).
 3. Customize the callout (small arrow) position by using this CSS combinator `.your-class .k-callout`, to suit your specific requirements.
 3. Set a value for the `TargetSelector` parameter of the Tooltip.
 
@@ -79,5 +79,5 @@ This Knowledge Base article answers the following questions:
 ````
 
 ## See Also
-* [Tooltip Overview]({%slug tooltip-overview%})
-* [Tooltip Position]({%slug tooltip-position%})
\ No newline at end of file
+* [Tooltip Overview](slug://tooltip-overview)
+* [Tooltip Position](slug://tooltip-position)
\ No newline at end of file
diff --git a/knowledge-base/tooltip-custom-styles-background-color.md b/knowledge-base/tooltip-custom-styles-background-color.md
index 8dfaef0e34..bf09e6ac1b 100644
--- a/knowledge-base/tooltip-custom-styles-background-color.md
+++ b/knowledge-base/tooltip-custom-styles-background-color.md
@@ -27,7 +27,7 @@ How to customize the Blazor ToolTip styling? I want to set different text color
 
 ## Solution
 
-1. Review the [fundamentals of custom styling and CSS overrides]({%slug themes-override%}).
+1. Review the [fundamentals of custom styling and CSS overrides](slug://themes-override).
 1. Set a `Class` to the TelerikToolTip component.
 1. Each tooltip is a `div.k-tooltip`. Note that the custom CSS class renders on the tooltip's **container**, not the `.k-tooltip` element itself. So use a [descendant CSS combinator](https://developer.mozilla.org/en-US/docs/Web/CSS/Descendant_combinator).
 1. If using a custom **background** color for `.k-tooltip`, then use the same **text** color for `.k-tooltip .k-callout`.
diff --git a/knowledge-base/tooltip-in-grid.md b/knowledge-base/tooltip-in-grid.md
index c9dbd1a804..0f970075d3 100644
--- a/knowledge-base/tooltip-in-grid.md
+++ b/knowledge-base/tooltip-in-grid.md
@@ -32,9 +32,9 @@ This KB article answers the following question:
 
 ## Solution
 
-1. Use a [Grid column (cell) template]({%slug grid-templates-column%}) to wrap the cell content in a `<span>` or `<div>` with some CSS class.
-1. Use the `TargetSelector` of the [`Telerik UI for Blazor Tooltip`]({%slug tooltip-overview%}) to attach it to the `<span>`.
-1. Use the [Tooltip's Template]({%slug tooltip-template%}) and its context to load Data on demand.
+1. Use a [Grid column (cell) template](slug://grid-templates-column) to wrap the cell content in a `<span>` or `<div>` with some CSS class.
+1. Use the `TargetSelector` of the [`Telerik UI for Blazor Tooltip`](slug://tooltip-overview) to attach it to the `<span>`.
+1. Use the [Tooltip's Template](slug://tooltip-template) and its context to load Data on demand.
 
 >caption Using a Tooltip in the Grid
 
diff --git a/knowledge-base/tooltip-position-rotated-div.md b/knowledge-base/tooltip-position-rotated-div.md
index 480298229c..11860257e7 100644
--- a/knowledge-base/tooltip-position-rotated-div.md
+++ b/knowledge-base/tooltip-position-rotated-div.md
@@ -25,7 +25,7 @@ ticketid: 1657431
 
 ## Description
 
-When rotating `<div>` elements that have an associated [Tooltip]({%slug tooltip-overview%}) to display additional information, the Tooltip might not align correctly with the target element. The goal is to adjust the Tooltip's position so it aligns appropriately with the center of the rotated `<div>`, and optionally, remove the Tooltip's callout pointer for a cleaner appearance.
+When rotating `<div>` elements that have an associated [Tooltip](slug://tooltip-overview) to display additional information, the Tooltip might not align correctly with the target element. The goal is to adjust the Tooltip's position so it aligns appropriately with the center of the rotated `<div>`, and optionally, remove the Tooltip's callout pointer for a cleaner appearance.
 
 This KB article also answers the following questions:
 - How to correctly position a Tooltip on a rotated `<div>` in Blazor?
@@ -133,6 +133,6 @@ Calculate the necessary offset for the Tooltip and apply it as a margin style. A
 
 ## See Also
 
-- [Telerik Blazor Tooltip - Overview]({%slug tooltip-overview%})
-- [Hide the Tooltip Callout or Change Its Position]({%slug tooltip-kb-callout-position%})
-- [Custom ToolTip Styles and Colors]({%slug tooltip-kb-custom-styles%})
+- [Telerik Blazor Tooltip - Overview](slug://tooltip-overview)
+- [Hide the Tooltip Callout or Change Its Position](slug://tooltip-kb-callout-position)
+- [Custom ToolTip Styles and Colors](slug://tooltip-kb-custom-styles)
diff --git a/knowledge-base/tooltip-show-on-disabled-element.md b/knowledge-base/tooltip-show-on-disabled-element.md
index 559f634ab7..619df0d60c 100644
--- a/knowledge-base/tooltip-show-on-disabled-element.md
+++ b/knowledge-base/tooltip-show-on-disabled-element.md
@@ -54,5 +54,5 @@ Here's an example demonstrating how to implement this solution:
 
 ## See Also
 
-- [Tooltip Component Overview]({%slug tooltip-overview%})
-- [Button Component Overview]({%slug components/button/overview%})
+- [Tooltip Component Overview](slug://tooltip-overview)
+- [Button Component Overview](slug://components/button/overview)
diff --git a/knowledge-base/treelist-enable-checkbox-selection-only-edit-mode.md b/knowledge-base/treelist-enable-checkbox-selection-only-edit-mode.md
index 79a5bdfa45..4450656a0b 100644
--- a/knowledge-base/treelist-enable-checkbox-selection-only-edit-mode.md
+++ b/knowledge-base/treelist-enable-checkbox-selection-only-edit-mode.md
@@ -39,10 +39,10 @@ This article suggests two options to disable the TreeList Checkbox selection in
 
 ### Solution 1: Toggle the visibility of the CheckboxColumn
 
-1. Enable the [`CheckBoxOnlySelection` parameter]({%slug treelist-columns-checkbox%}#parameters) of the `TreeListCheckboxColumn` to prevent users from selecting rows with a click outside of edit mode.
-2. Bind the [`Visible` parameter]({%slug treelist-columns-checkbox%}#parameters) of the `TreeListCheckboxColumn` to a variable. This allows toggling its visibility based on whether the TreeList is in edit mode.
+1. Enable the [`CheckBoxOnlySelection` parameter](slug://treelist-columns-checkbox#parameters) of the `TreeListCheckboxColumn` to prevent users from selecting rows with a click outside of edit mode.
+2. Bind the [`Visible` parameter](slug://treelist-columns-checkbox#parameters) of the `TreeListCheckboxColumn` to a variable. This allows toggling its visibility based on whether the TreeList is in edit mode.
 3. Handle the CUD (Create, Update, Delete) events to manage the visibility of the `TreeListCheckboxColumn`.
-    - For [`Inline`]({%slug treelist-editing-inline%}) and [`Popup`]({%slug treelist-editing-popup%}) edit modes, this approach works directly. In the [`Incell` edit mode the events flow is a bit different]({%slug treelist-editing-incell%}), so you may need to adjust the logic.
+    - For [`Inline`](slug://treelist-editing-inline) and [`Popup`](slug://treelist-editing-popup) edit modes, this approach works directly. In the [`Incell` edit mode the events flow is a bit different](slug://treelist-editing-incell), so you may need to adjust the logic.
 
 Below is an example implementation that toggles the visibility of the Checkbox Column:
 
@@ -364,6 +364,6 @@ Alternatively, if you prefer not to toggle the `CheckboxColumn` visibility but j
 
 ## See Also
 
-- [TreeList Overview]({%slug treelist-overview%})
-- [TreeList Editing]({%slug treelist-editing-overview%})
-- [TreeList Selection]({%slug treelist-selection-overview%})
+- [TreeList Overview](slug://treelist-overview)
+- [TreeList Editing](slug://treelist-editing-overview)
+- [TreeList Selection](slug://treelist-selection-overview)
diff --git a/knowledge-base/treelist-expand-nodes-programmatically.md b/knowledge-base/treelist-expand-nodes-programmatically.md
index b24f61a696..1c60dc93ed 100644
--- a/knowledge-base/treelist-expand-nodes-programmatically.md
+++ b/knowledge-base/treelist-expand-nodes-programmatically.md
@@ -181,5 +181,5 @@ Below is an example demonstrating how to use the TreeList State to expand or col
 
 ## See Also
 
-- [TreeList State Documentation]({%slug treelist-state%})
-- [TreeList Overview]({%slug treelist-overview%})
+- [TreeList State Documentation](slug://treelist-state)
+- [TreeList Overview](slug://treelist-overview)
diff --git a/knowledge-base/treelist-get-parent-item-on-insert.md b/knowledge-base/treelist-get-parent-item-on-insert.md
index a82701ac4a..ec7eadb5a6 100644
--- a/knowledge-base/treelist-get-parent-item-on-insert.md
+++ b/knowledge-base/treelist-get-parent-item-on-insert.md
@@ -31,7 +31,7 @@ When inserting a child item in the TreeList I would like to be able to get the i
 
 ## Solution
 
-The approaches to handle this would depend of the type of data the component is bound to - [Flat]({%slug treelist-data-binding-flat-data%}) or [Hierarchical]({%slug treelist-data-binding-hierarchical-data%}). The examples below showcase how to handle both scenarios:
+The approaches to handle this would depend of the type of data the component is bound to - [Flat](slug://treelist-data-binding-flat-data) or [Hierarchical](slug://treelist-data-binding-hierarchical-data). The examples below showcase how to handle both scenarios:
 
 * [Get the Parent Item When Inserting a Child to the TreeList When Bound To Flat Data](#get-the-parent-item-when-inserting-a-child-to-the-treelist-when-bound-to-flat-data)
 
@@ -41,9 +41,9 @@ The approaches to handle this would depend of the type of data the component is
 
 #### Step by step Explanations
 
-1. Create a [custom command]({%slug treelist-columns-command%}) to initiate inserting in the `TreeListCommandColumn`.
+1. Create a [custom command](slug://treelist-columns-command) to initiate inserting in the `TreeListCommandColumn`.
 1. Pass the `TreeListCommandEventsArgs` object to the `OnClick` handler.
-1. Use the [TreeList state]({%slug treelist-state%}) and its `InsertedItem` field to populate the desired information from the current item that you have in the event arguments.
+1. Use the [TreeList state](slug://treelist-state) and its `InsertedItem` field to populate the desired information from the current item that you have in the event arguments.
 
 
 ````RAZOR
@@ -174,9 +174,9 @@ The approaches to handle this would depend of the type of data the component is
 
 #### Step by step Explanations
 
-1. Create a [custom command]({%slug treelist-columns-command%}) to initiate inserting in the `TreeListCommandColumn`.
+1. Create a [custom command](slug://treelist-columns-command) to initiate inserting in the `TreeListCommandColumn`.
 1. Pass the `TreeListCommandEventsArgs` object to the `OnClick` handler.
-1. Set the `ParentItem` field of the [TreeList state]({%slug treelist-state%}) to the item received from the `TreeListCommandEventsArgs`.
+1. Set the `ParentItem` field of the [TreeList state](slug://treelist-state) to the item received from the `TreeListCommandEventsArgs`.
 1. Use the TreeList state and its `InsertedItem` field to populate the desired information from the current item that you have in the event arguments..
 
 
diff --git a/knowledge-base/treelist-longer-text-starts-from-root-level.md b/knowledge-base/treelist-longer-text-starts-from-root-level.md
index c565eb50d2..dc8baedf0e 100644
--- a/knowledge-base/treelist-longer-text-starts-from-root-level.md
+++ b/knowledge-base/treelist-longer-text-starts-from-root-level.md
@@ -34,7 +34,7 @@ The following example showcases a CSS way to change the described behavior.
 To align all lines of text to the same level do the following:
 
 1. Use the `Class` parameter to set a CSS class to the TreeList and cascade so you affect only its elements, not all instances on the page/app.
-1. Create a CSS class setting a default height for the cell and add it to the row through the [`OnCellRender` event]({%slug treelist-column-events%}#oncellrender).
+1. Create a CSS class setting a default height for the cell and add it to the row through the [`OnCellRender` event](slug://treelist-column-events#oncellrender).
 1. The treelist component implements child hierarchy levels padding through hidden spans with classes `k-icon` and `k-i-none`. Use those classes along with the TreeList class to cascade the spans and expand their `height` to `100%` and `float` to `left` so that they take up the height of the cell and text remains only to their right.
 
 ![treelist-long-text-aligned](images/treelist-long-text-aligned.png)
diff --git a/knowledge-base/treeview-change-expand-collapse-icons.md b/knowledge-base/treeview-change-expand-collapse-icons.md
index 814c1a032b..3a239bac2d 100644
--- a/knowledge-base/treeview-change-expand-collapse-icons.md
+++ b/knowledge-base/treeview-change-expand-collapse-icons.md
@@ -21,7 +21,7 @@ ticketid: 1656109
 </table>
 
 ## Description
-I want to customize the icons used for expanding and collapsing items in the [TreeView for Blazor]({%slug treeview-overview%}). 
+I want to customize the icons used for expanding and collapsing items in the [TreeView for Blazor](slug://treeview-overview). 
 
 This knowledge base article answers the following questions:
 - How can I use custom icons for the TreeView expand and collapse functionality?
@@ -29,7 +29,7 @@ This knowledge base article answers the following questions:
 
 ## Solution
 
-You can change the expand/collapse icons in the TreeView by overriding the built-in icons with other icons using [custom CSS rules]({%slug themes-override%}). In addition, you can use the `Class` parameter of the TreeView to add a custom CSS Class and modify a specific instance of the TreeView, instead of all instances on the page.
+You can change the expand/collapse icons in the TreeView by overriding the built-in icons with other icons using [custom CSS rules](slug://themes-override). In addition, you can use the `Class` parameter of the TreeView to add a custom CSS Class and modify a specific instance of the TreeView, instead of all instances on the page.
 
 >caption Change the expand/collapse icons in TreeView
 
@@ -131,5 +131,5 @@ You can change the expand/collapse icons in the TreeView by overriding the built
 }
 ````
 ## See Also
-- [TreeView Overview]({%slug treeview-overview%}) 
+- [TreeView Overview](slug://treeview-overview) 
 - [Telerik Icons List](https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/)
diff --git a/knowledge-base/treeview-disabled-readonly.md b/knowledge-base/treeview-disabled-readonly.md
index 8f965266c6..d80008d544 100644
--- a/knowledge-base/treeview-disabled-readonly.md
+++ b/knowledge-base/treeview-disabled-readonly.md
@@ -43,15 +43,15 @@ How to make the TreeView read-only?
 
 2\. Handle these TreeView events:
 
-* [`ExpandedItemsChanged`]({%slug treeview-events%}#expandeditemschanged)
-* [`CheckedItemsChanged`]({%slug treeview-events%}#checkeditemschanged)
-* [`SelectedItemsChanged`]({%slug treeview-events%}#selecteditemschanged)
+* [`ExpandedItemsChanged`](slug://treeview-events#expandeditemschanged)
+* [`CheckedItemsChanged`](slug://treeview-events#checkeditemschanged)
+* [`SelectedItemsChanged`](slug://treeview-events#selecteditemschanged)
 
-Normally, the event handlers should update the expanded, checked and selected items, as the [documentation examples]({%slug treeview-events%}) show. In this case, if the TreeView is "disabled", the event handlers will not update the TreeView parameter values. In this way, the TreeView state and nodes will remain the same.
+Normally, the event handlers should update the expanded, checked and selected items, as the [documentation examples](slug://treeview-events) show. In this case, if the TreeView is "disabled", the event handlers will not update the TreeView parameter values. In this way, the TreeView state and nodes will remain the same.
 
 3\. Disable [`pointer-events`](https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events) with a CSS rule. This will prevent client-side collapse animations in the TreeView, which may be visible to users, even though the TreeView will ignore the collapse action.
 
-4\. Optionally, apply `opacity` CSS style to make the TreeView **look** disabled. If you need item-specific visual customizations, use the [`OnItemRender` event]({%slug treeview-events%}#onitemrender).
+4\. Optionally, apply `opacity` CSS style to make the TreeView **look** disabled. If you need item-specific visual customizations, use the [`OnItemRender` event](slug://treeview-events#onitemrender).
 
 >caption Disable and enable TreeView to prevent user actions
 
@@ -174,7 +174,7 @@ Normally, the event handlers should update the expanded, checked and selected it
 
 ## See Also
 
-* [TreeView Events]({%slug treeview-events%})
-* [TreeView CheckBoxes]({%slug treeview-checkboxes-overview%})
-* [TreeView Expanded Items]({%slug treeview-expand-items%})
-* [TreeView Selection]({%slug treeview-selection-overview%})
+* [TreeView Events](slug://treeview-events)
+* [TreeView CheckBoxes](slug://treeview-checkboxes-overview)
+* [TreeView Expanded Items](slug://treeview-expand-items)
+* [TreeView Selection](slug://treeview-selection-overview)
diff --git a/knowledge-base/treeview-drag-to-custom-target.md b/knowledge-base/treeview-drag-to-custom-target.md
index 94cf25cab4..0275914609 100644
--- a/knowledge-base/treeview-drag-to-custom-target.md
+++ b/knowledge-base/treeview-drag-to-custom-target.md
@@ -29,7 +29,7 @@ I have a TreeView that allows dragging and reordering items inside the component
 
 To allow dragging outside the TreeView and dropping on a custom target, follow these steps:
 
-1. Handle the [`OnDragStart`]({%slug treeview-events%}#drag-events) event of the TreeView to get the item that the user started dragging.
+1. Handle the [`OnDragStart`](slug://treeview-events#drag-events) event of the TreeView to get the item that the user started dragging.
 1. Handle the [`@onpointerup`](https://developer.mozilla.org/en-US/docs/Web/API/Element/pointerup_event) event of your custom target to add the TreeView inside as needed. Based on product specifics, the TreeView internally does not use draggable events, it uses pointer events to handle the dragging. Therefore, `@ondrop` of your custom target will not fire when dragging a TreeView item in it as the component expects a subsequent pointer event. Use the `@onpointerup` instead of `@ondrop`.
 1. Change the icon in the drag clue when the user drags over the custom target to indicate it is an allowed target. Once the [Drag Clue Template](https://feedback.telerik.com/blazor/1501043-drag-clue-template) is available, you may use it to change the rendering as needed. At the time of writing, changing the icon is only possible with CSS. For that purpose:
    1. Handle [`@onpointerenter`](https://developer.mozilla.org/en-US/docs/Web/API/Element/pointerenter_event) and [`@onpointerout`](https://developer.mozilla.org/en-US/docs/Web/API/Element/pointerout_event) events of the custom target to detect when the user drags the item over it.
diff --git a/knowledge-base/treeview-drag-to-empty.md b/knowledge-base/treeview-drag-to-empty.md
index e241c0af6c..a433d50665 100644
--- a/knowledge-base/treeview-drag-to-empty.md
+++ b/knowledge-base/treeview-drag-to-empty.md
@@ -37,4 +37,4 @@ When there is no data in the TreeView, you can't drop items into it because it d
 ## Solution
 Ensure you always have at least one dummy node with text like "(empty)" or "(drag here)" so there is a drop target.
 
-When [processing the data in the `OnDrop` event]({%slug treeview-drag-drop-overview%}), consider checking if this is the target (only) item and if so - removing it from the data source you will build, so that newly added data will have its proper structure and that placeholder item will now be gone.
+When [processing the data in the `OnDrop` event](slug://treeview-drag-drop-overview), consider checking if this is the target (only) item and if so - removing it from the data source you will build, so that newly added data will have its proper structure and that placeholder item will now be gone.
diff --git a/knowledge-base/treeview-expand-collapse-on-item-click.md b/knowledge-base/treeview-expand-collapse-on-item-click.md
index 886e4be60b..4826237071 100644
--- a/knowledge-base/treeview-expand-collapse-on-item-click.md
+++ b/knowledge-base/treeview-expand-collapse-on-item-click.md
@@ -33,11 +33,11 @@ By design, the parent TreeView items are expanded or collapsed on click of the e
 
 To expand a TreeView item when you click on it:
 
-* Handle the [TreeView `OnItemClick` event]({%slug treeview-events%}#onitemclick).
+* Handle the [TreeView `OnItemClick` event](slug://treeview-events#onitemclick).
 * Verify if the clicked item is a parent, so it can be expanded:
-	* For [flat data]({%slug components/treeview/data-binding/flat-data%}) check if `HasChildren` field equals `true`.
-	* For [hierarchical data]({%slug components/treeview/data-binding/hierarchical-data%}) check if the `Items` field (or your custom field name) contains any child items.
-* Check if the clicked item exists in the [`ExpandedItems`]({%slug treeview-expand-items%})  collection:	
+	* For [flat data](slug://components/treeview/data-binding/flat-data) check if `HasChildren` field equals `true`.
+	* For [hierarchical data](slug://components/treeview/data-binding/hierarchical-data) check if the `Items` field (or your custom field name) contains any child items.
+* Check if the clicked item exists in the [`ExpandedItems`](slug://treeview-expand-items)  collection:	
 	* If the clicked item is not part of the collection, you may add it to programmatically expand it.
 	* If the clicked item is already part of the collection, this means the item is currently expanded. You may programmatically collapse it by removing it from the `ExpandedItems`.
 
diff --git a/knowledge-base/treeview-filtering.md b/knowledge-base/treeview-filtering.md
index 485a44e08e..f336ea4816 100644
--- a/knowledge-base/treeview-filtering.md
+++ b/knowledge-base/treeview-filtering.md
@@ -36,20 +36,20 @@ This KB article answers the following questions:
 
 ## Solution
 
-There are different ways to implement TreeView filtering, depending on the used [TreeView data binding]({%slug components/treeview/data-binding/overview%}).
+There are different ways to implement TreeView filtering, depending on the used [TreeView data binding](slug://components/treeview/data-binding/overview).
 
-The suggested approach below relies on [flat TreeView data]({%slug components/treeview/data-binding/flat-data%}). See this [TreeView demo for a hierarchy data filtering example](https://demos.telerik.com/blazor-ui/treeview/manual-filtering).
+The suggested approach below relies on [flat TreeView data](slug://components/treeview/data-binding/flat-data). See this [TreeView demo for a hierarchy data filtering example](https://demos.telerik.com/blazor-ui/treeview/manual-filtering).
 
-In both scenarios, there should be no [loading of TreeView items on demand]({%slug components/treeview/data-binding/load-on-demand%}), otherwise the filtering will not provide all possible results.
+In both scenarios, there should be no [loading of TreeView items on demand](slug://components/treeview/data-binding/load-on-demand), otherwise the filtering will not provide all possible results.
 
-1. Add a [TextBox]({%slug components/textbox/overview%}) for the filter string.
-1. (optional) Add a [DropDownList]({%slug components/dropdownlist/overview%}) or another suitable component for the [filter operator](/blazor-ui/api/Telerik.DataSource.FilterOperator).
-1. Use a [Button `OnClick` event]({%slug button-events%}) or the [TextBox `ValueChanged` event]({%slug components/textbox/events%}) to trigger the TreeView item search process.
+1. Add a [TextBox](slug://components/textbox/overview) for the filter string.
+1. (optional) Add a [DropDownList](slug://components/dropdownlist/overview) or another suitable component for the [filter operator](/blazor-ui/api/Telerik.DataSource.FilterOperator).
+1. Use a [Button `OnClick` event](slug://button-events) or the [TextBox `ValueChanged` event](slug://components/textbox/events) to trigger the TreeView item search process.
 1. Create a [`DataSourceRequest` object](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) and populate its `Filters` property with a single [`FilterDescriptor`](/blazor-ui/api/Telerik.DataSource.FilterDescriptor).
     * If you need more complex filtering logic, use one or more [`CompositeFilterDescriptor`](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor)s.
-1. Execute the [`ToDataSourceResult()` extension method]({%slug common-features-data-binding-onread%}#todatasourceresult-method) on the TreeView `Data`. You will need to import the [`Telerik.DataSource.Extensions` namespace](/blazor-ui/api/Telerik.DataSource.Extensions).
+1. Execute the [`ToDataSourceResult()` extension method](slug://common-features-data-binding-onread#todatasourceresult-method) on the TreeView `Data`. You will need to import the [`Telerik.DataSource.Extensions` namespace](/blazor-ui/api/Telerik.DataSource.Extensions).
 1. (optional) Add any missing parent items to the filtered items collection.
-1. (optional) Use a [TreeView `ItemTemplate`]({%slug components/treeview/templates%}) to highlight the search string inside the displayed TreeView items.
+1. (optional) Use a [TreeView `ItemTemplate`](slug://components/treeview/templates) to highlight the search string inside the displayed TreeView items.
 
 >tip If the filtering operator is fixed (for example, `Contains`), you can replace steps 4 and 5 with a standard LINQ expression:
 >
@@ -289,6 +289,6 @@ In both scenarios, there should be no [loading of TreeView items on demand]({%sl
 ## See Also
 
 * [TreeView Filtering with Hierarchy Data](https://demos.telerik.com/blazor-ui/treeview/manual-filtering)
-* [ToDataSourceResult Method]({%slug common-features-data-binding-onread%}#todatasourceresult-method)
+* [ToDataSourceResult Method](slug://common-features-data-binding-onread#todatasourceresult-method)
 * [DataSourceRequest API Reference](/blazor-ui/api/Telerik.DataSource.DataSourceRequest)
-* [TreeView Item Template]({%slug components/treeview/templates%})
+* [TreeView Item Template](slug://components/treeview/templates)
diff --git a/knowledge-base/treeview-rename-node.md b/knowledge-base/treeview-rename-node.md
index b9d151a834..c6653d9b60 100644
--- a/knowledge-base/treeview-rename-node.md
+++ b/knowledge-base/treeview-rename-node.md
@@ -208,4 +208,4 @@ Use the `ItemTemplate` to determine the node text's rendering and customize the
 
 ## See Also
 
-* [TreeView Item Template]({%slug components/treeview/templates%})
\ No newline at end of file
+* [TreeView Item Template](slug://components/treeview/templates)
\ No newline at end of file
diff --git a/knowledge-base/treeview-scroll-to-item.md b/knowledge-base/treeview-scroll-to-item.md
index 6c57dceadf..e7699842d9 100644
--- a/knowledge-base/treeview-scroll-to-item.md
+++ b/knowledge-base/treeview-scroll-to-item.md
@@ -38,9 +38,9 @@ Use the [`scrollIntoView` JavaScript method](https://developer.mozilla.org/en-US
 The whole process involves these steps:
 
 1. Get the TreeView item from the data.
-1. [Load additional items on demand]({%slug components/treeview/data-binding/load-on-demand%}), if necessary.
-1. Expand parent(s) via [`ExpandedItems`]({%slug components/treeview/data-binding/overview%}), if necessary. Older **UI for Blazor** versions (up to 2.30) require a [different implementation with an `Expanded` property of the TreeView items]({%slug changes-in-3-0-0%}).
-1. [Select the item]({%slug treeview-selection-overview%}) or implement some way to find it in the DOM.
+1. [Load additional items on demand](slug://components/treeview/data-binding/load-on-demand), if necessary.
+1. Expand parent(s) via [`ExpandedItems`](slug://components/treeview/data-binding/overview), if necessary. Older **UI for Blazor** versions (up to 2.30) require a [different implementation with an `Expanded` property of the TreeView items](slug://changes-in-3-0-0).
+1. [Select the item](slug://treeview-selection-overview) or implement some way to find it in the DOM.
 1. Set a boolean flag and use it in `OnAfterRenderAsync` to execute the JavaScript.
 1. Execute the JavaScript code with [some timeout](https://developer.mozilla.org/en-US/docs/Web/API/setTimeout) to ensure that the new HTML markup has been rendered by the browser. The timeout value will depend on the server-client latency and number of newly rendered items.
 1. (Optional) Focus the TreeView item element (`<li class="k-treeview-item">`) to continue the keyboard navigation from that item.
diff --git a/knowledge-base/treeview-validate-drop-target.md b/knowledge-base/treeview-validate-drop-target.md
index 97365b5f1a..a515c5505c 100644
--- a/knowledge-base/treeview-validate-drop-target.md
+++ b/knowledge-base/treeview-validate-drop-target.md
@@ -30,10 +30,10 @@ How to validate the drop target, so I don't allow the user to drop the file if t
 
 To validate the drop target and prevent the user from dropping on an invalid target, follow these steps:
 
-1. Handle the [`OnDrag`]({%slug treeview-events%}#drag-events) event of the TreeView to validate the target based on your requirements. In the example below, we are checking it the user tries to drop an item from the **Documents** folder into the **Pictures** folder - the **Pictures** folder is not a valid target in this case.
+1. Handle the [`OnDrag`](slug://treeview-events#drag-events) event of the TreeView to validate the target based on your requirements. In the example below, we are checking it the user tries to drop an item from the **Documents** folder into the **Pictures** folder - the **Pictures** folder is not a valid target in this case.
 1. Raise a flag if the target is not valid.
 1. Change the icon in the drag clue to indicate the target is not valid. Once the [Drag Clue Template](https://feedback.telerik.com/blazor/1501043-drag-clue-template) is available, you may use it to change the rendering as needed. At the time of writing, changing the icon is only possible with CSS as per the example below.
-1. Include a conditional logic in your [`OnDrop`]({%slug treeview-events%}#drag-events) handler to not perform any action if the target is invalid.
+1. Include a conditional logic in your [`OnDrop`](slug://treeview-events#drag-events) handler to not perform any action if the target is invalid.
 1. Use CSS to hide the build-in drop hint for the invalid target.
 
 
diff --git a/knowledge-base/typescript-exports-error.md b/knowledge-base/typescript-exports-error.md
index ccaaec255a..68cf019478 100644
--- a/knowledge-base/typescript-exports-error.md
+++ b/knowledge-base/typescript-exports-error.md
@@ -138,5 +138,5 @@ function test() {
 
 ## Notes
 
-There can be other reasons for getting errors related to the Telerik JS Interop files, and you can read more about them in the [JavaScript Errors]({%slug troubleshooting-js-errors%}) article.
+There can be other reasons for getting errors related to the Telerik JS Interop files, and you can read more about them in the [JavaScript Errors](slug://troubleshooting-js-errors) article.
 
diff --git a/knowledge-base/upload-azure-blob-storage.md b/knowledge-base/upload-azure-blob-storage.md
index 1736b474e6..4bad02ebad 100644
--- a/knowledge-base/upload-azure-blob-storage.md
+++ b/knowledge-base/upload-azure-blob-storage.md
@@ -31,11 +31,11 @@ Can I upload files directly to Azure Blob Storage?
 
 ## Solution
 
-Both the [FileSelect]({%slug fileselect-overview%}) and [Upload]({%slug upload-overview%}) components can help with uploading files to Azure Blob Storage. There are some [differences between how the two components work]({%slug upload-overview%}#upload-vs-fileselect), which will determine the exact usage.
+Both the [FileSelect](slug://fileselect-overview) and [Upload](slug://upload-overview) components can help with uploading files to Azure Blob Storage. There are some [differences between how the two components work](slug://upload-overview#upload-vs-fileselect), which will determine the exact usage.
 
 ### Using FileSelect
 
-The `TelerikFileSelect` provides the selected files to the .NET runtime as a `System.IO.Stream`. Use the [`OnSelect` event]({%slug fileselect-events%}#onselect) to obtain the file and send it to the Azure blob service.
+The `TelerikFileSelect` provides the selected files to the .NET runtime as a `System.IO.Stream`. Use the [`OnSelect` event](slug://fileselect-events#onselect) to obtain the file and send it to the Azure blob service.
 
 ### Using Upload
 
@@ -43,7 +43,7 @@ The `TelerikUpload` needs an HTTP endpoint, which will receive the uploaded file
 
 The Azure Blob Service does not expose such HTTP endpoint. Do the following:
 
-1. [Implement a `Save` controller action method]({%slug upload-overview%}#implement-controller-methods) in the Blazor app.
+1. [Implement a `Save` controller action method](slug://upload-overview#implement-controller-methods) in the Blazor app.
 1. Set the action method URL as a `SaveUrl` in the Upload.
 1. Send the uploaded file to the blob service after you obtain it in the `Save` action method.
 
diff --git a/knowledge-base/upload-files-in-grid.md b/knowledge-base/upload-files-in-grid.md
index 49e04fadbc..5e92a2ae45 100644
--- a/knowledge-base/upload-files-in-grid.md
+++ b/knowledge-base/upload-files-in-grid.md
@@ -39,16 +39,16 @@ How to upload photos and files as an attachment in a Blazor Grid?
 
 Here are the required steps to implement file uploading inside the Telerik Blazor Grid.
 
-1. The Upload occupies more space than a simple textbox. Use [Grid popup editing]({%slug components/grid/editing/popup%}) with a [wider popup edit form]({%slug components/grid/editing/popup%}#customization).
-1. [Configure an Upload component]({%slug upload-overview%}#creating-blazor-upload) inside a [Grid column `<EditorTemplate>`]({%slug grid-templates-editor%}).
-1. Handle the [`OnUpload` event of the Upload]({%slug upload-events%}#onupload) to send custom information to the Upload controller, for example, information about the Grid data item.
-1. [Implement the Upload controller methods]({%slug upload-overview%}#implement-controller-methods), which receive and delete the uploaded files. File deletion is optional.
-1. Handle the [`OnSuccess` event of the Upload]({%slug upload-events%}#onsuccess) to confirm successful uploads or file deletions, and update the Grid data item, which is the `<EditorTemplate>` `context`.
+1. The Upload occupies more space than a simple textbox. Use [Grid popup editing](slug://components/grid/editing/popup) with a [wider popup edit form](slug://components/grid/editing/popup#customization).
+1. [Configure an Upload component](slug://upload-overview#creating-blazor-upload) inside a [Grid column `<EditorTemplate>`](slug://grid-templates-editor).
+1. Handle the [`OnUpload` event of the Upload](slug://upload-events#onupload) to send custom information to the Upload controller, for example, information about the Grid data item.
+1. [Implement the Upload controller methods](slug://upload-overview#implement-controller-methods), which receive and delete the uploaded files. File deletion is optional.
+1. Handle the [`OnSuccess` event of the Upload](slug://upload-events#onsuccess) to confirm successful uploads or file deletions, and update the Grid data item, which is the `<EditorTemplate>` `context`.
 1. The name of the saved file on the server can depend on the Razor UI or on the controller.
     * If the file name depends on the UI, send it to the controller via the `OnUpload` event arguments (`args.RequestData`).
     * If the file name depends on the controller, receive it in the `OnSuccess` event arguments via `args.Request.ResponseText`.
-1. Handle the [Grid `OnUpdate`, `OnCreate` and `OnDelete` events]({%slug components/grid/editing/overview%}#events) to commit changes to the Grid data source. Optionally, delete the respective saved files in `OnDelete`. The example below uses `OnAdd` to provide the `Id` of the new Grid data item, which also affects the uploaded file's name.
-1. Display the uploaded files as images or download links in a [Grid column `<Template>`]({%slug grid-templates-column%}).
+1. Handle the [Grid `OnUpdate`, `OnCreate` and `OnDelete` events](slug://components/grid/editing/overview#events) to commit changes to the Grid data source. Optionally, delete the respective saved files in `OnDelete`. The example below uses `OnAdd` to provide the `Id` of the new Grid data item, which also affects the uploaded file's name.
+1. Display the uploaded files as images or download links in a [Grid column `<Template>`](slug://grid-templates-column).
 
 
 ## Example
@@ -337,15 +337,15 @@ app.Run();
 
 ## Notes
 
-* If necessary, [adjust the application settings to allow larger file uploads]({%slug upload-overview%}#large-file-uploads).
+* If necessary, [adjust the application settings to allow larger file uploads](slug://upload-overview#large-file-uploads).
 * The Upload component itself can't delete files, which have been uploaded in previous edit sessions. Use separate UI for that inside the column `<Template>` or the `<EditorTemplate>`. In both cases, call the controller method directly via `HttpClient.PostAsync()`. The Upload `OnSuccess` event will not fire in this case.
 * It is also possible to use the Upload component in a [custom edit form outside the Grid](https://demos.telerik.com/blazor-ui/grid/editing-custom-form).
-* Instead of an Upload, you can also implement a similar scenario with a [FileSelect component]({%slug fileselect-overview%}#fileselect-vs-upload). In that case, the file contents will be available directly in the Razor component, which holds the Grid.
+* Instead of an Upload, you can also implement a similar scenario with a [FileSelect component](slug://fileselect-overview#fileselect-vs-upload). In that case, the file contents will be available directly in the Razor component, which holds the Grid.
 
 
 ## See Also
 
-* [Upload Controller]({%slug upload-overview%}#implement-controller-methods)
-* [Upload Events]({%slug upload-events%})
-* [Grid Editing]({%slug components/grid/editing/overview%})
-* [Grid Editor Template]({%slug grid-templates-editor%})
+* [Upload Controller](slug://upload-overview#implement-controller-methods)
+* [Upload Events](slug://upload-events)
+* [Grid Editing](slug://components/grid/editing/overview)
+* [Grid Editor Template](slug://grid-templates-editor)
diff --git a/knowledge-base/upload-openselectfilesdialog-safari.md b/knowledge-base/upload-openselectfilesdialog-safari.md
index 2d43ae6852..acc8436bc8 100644
--- a/knowledge-base/upload-openselectfilesdialog-safari.md
+++ b/knowledge-base/upload-openselectfilesdialog-safari.md
@@ -119,5 +119,5 @@ The only possible way to open a FileSelect or Upload dialog programmatically is
 
 ## See Also
 
-* [FileSelect Component]({%slug fileselect-overview%})
-* [Upload Component]({%slug upload-overview%})
+* [FileSelect Component](slug://fileselect-overview)
+* [Upload Component](slug://upload-overview)
diff --git a/knowledge-base/upload-preview-image.md b/knowledge-base/upload-preview-image.md
index 0eb70ed729..fa62f3b318 100644
--- a/knowledge-base/upload-preview-image.md
+++ b/knowledge-base/upload-preview-image.md
@@ -33,17 +33,17 @@ This KB article answers the following questions:
 
 ## Solution
 
-Users can preview images that are uploaded through the [Upload component]({%slug upload-overview%}) or selected through the [FileSelect component]({%slug fileselect-overview%}).
+Users can preview images that are uploaded through the [Upload component](slug://upload-overview) or selected through the [FileSelect component](slug://fileselect-overview).
 
-In Blazor, [previewing images is easier when using the FileSelect](#using-the-fileselect), but based on your requirements you might [choose the Upload over the FileSelect]({%slug upload-overview%}#upload-vs-fileselect) or vice versa.
+In Blazor, [previewing images is easier when using the FileSelect](#using-the-fileselect), but based on your requirements you might [choose the Upload over the FileSelect](slug://upload-overview#upload-vs-fileselect) or vice versa.
 
 ### Using the Upload
 
-1. Set the [`Accept`, `AllowedExtensions`, and `MaxFileSize`]({%slug upload-overview%}#upload-parameters) parameters of the Upload.
-1. [Ensure the Blazor app can handle large uploaded files]({%slug upload-overview%}#large-file-uploads) with a size that matches or exceeds `MaxFileSize`.
-1. [Implement a controller action method to receive the uploaded files]({%slug upload-overview%}#implement-controller-methods). Also see the [example on the Upload Events page]({%slug upload-events%}#example).
+1. Set the [`Accept`, `AllowedExtensions`, and `MaxFileSize`](slug://upload-overview#upload-parameters) parameters of the Upload.
+1. [Ensure the Blazor app can handle large uploaded files](slug://upload-overview#large-file-uploads) with a size that matches or exceeds `MaxFileSize`.
+1. [Implement a controller action method to receive the uploaded files](slug://upload-overview#implement-controller-methods). Also see the [example on the Upload Events page](slug://upload-events#example).
 1. Read the uploaded image(s) in the controller and return an image URL or [Base64 data URI](https://en.wikipedia.org/wiki/Data_URI_scheme) for the `<img>` tag(s) to render. You can choose to provide the original image to the UI or a smaller version for greater efficiency.
-1. Subscribe to the [Upload `OnSuccess` event]({%slug upload-events%}#onsuccess) to detect completed file uploads and obtain the `<img>` tag's `src` value. You can also use `OnSuccess` to detect file removals in the Upload component and remove the respective `<img>` tags.
+1. Subscribe to the [Upload `OnSuccess` event](slug://upload-events#onsuccess) to detect completed file uploads and obtain the `<img>` tag's `src` value. You can also use `OnSuccess` to detect file removals in the Upload component and remove the respective `<img>` tags.
 
 You cannot preview the image in the Upload `OnSelect` event, because this event handler has no access to the file contents.
 
@@ -209,11 +209,11 @@ namespace TelerikBlazorUpload.Controllers
 
 ### Using the FileSelect
 
-1. Set the [`Accept`, `AllowedExtensions`, and `MaxFileSize`]({%slug fileselect-overview%}#fileselect-parameters) parameters of the FileSelect.
-1. [Increase the SignalR message size]({%slug common-kb-increase-signalr-max-message-size%}) to match or exceed `MaxFileSize`.
-1. Subscribe to the [FileSelect `OnSelect` event]({%slug fileselect-events%}#onselect).
+1. Set the [`Accept`, `AllowedExtensions`, and `MaxFileSize`](slug://fileselect-overview#fileselect-parameters) parameters of the FileSelect.
+1. [Increase the SignalR message size](slug://common-kb-increase-signalr-max-message-size) to match or exceed `MaxFileSize`.
+1. Subscribe to the [FileSelect `OnSelect` event](slug://fileselect-events#onselect).
 1. Read the selected image(s) and create a [Base64 data URI](https://en.wikipedia.org/wiki/Data_URI_scheme) for the `<img>` tag(s) to render.
-1. (optional) Subscribe to the [FileSelect `OnRemove` event]({%slug fileselect-events%}#onremove) to remove the image preview.
+1. (optional) Subscribe to the [FileSelect `OnRemove` event](slug://fileselect-events#onremove) to remove the image preview.
 
 >caption Preview selected images when using the FileSelect component
 
@@ -299,7 +299,7 @@ namespace TelerikBlazorUpload.Controllers
 
 ## See Also
 
-* [Upload Overview]({%slug upload-overview%})
-* [Handle Upload Events]({%slug upload-events%})
-* [FileSelect Overview]({%slug fileselect-overview%})
-* [Handle FileSelect Events]({%slug fileselect-events%})
+* [Upload Overview](slug://upload-overview)
+* [Handle Upload Events](slug://upload-events)
+* [FileSelect Overview](slug://fileselect-overview)
+* [Handle FileSelect Events](slug://fileselect-events)
diff --git a/knowledge-base/upload-track-selected-uploaded-files.md b/knowledge-base/upload-track-selected-uploaded-files.md
index 27633827ab..d5670e6959 100644
--- a/knowledge-base/upload-track-selected-uploaded-files.md
+++ b/knowledge-base/upload-track-selected-uploaded-files.md
@@ -35,18 +35,18 @@ This KB article answers the following questions:
 
 The event arguments of all Upload events provide:
 
-* The [number of files]({%slug upload-events%}#event-arguments) in each user action;
-* Which files are [valid in terms of size and extension]({%slug upload-events%}#uploadfileinfo).
+* The [number of files](slug://upload-events#event-arguments) in each user action;
+* Which files are [valid in terms of size and extension](slug://upload-events#uploadfileinfo).
 
 To count the total number of selected, valid and uploaded files in multiple user actions and events, define additional variables in the Razor component. Then, increment and decrement the variables in the Upload events.
 
-1. Use the [Upload `OnSelect` event]({%slug upload-events%}#onselect) to detect selection of one or multiple files.
-    * If [`Multiple="true"`]({%slug upload-overview%}#upload-parameters), then set [`IsCancelled` in the event argument]({%slug upload-events%}#event-arguments) to `true` when the number of selected files exceeds the maximum limit.
+1. Use the [Upload `OnSelect` event](slug://upload-events#onselect) to detect selection of one or multiple files.
+    * If [`Multiple="true"`](slug://upload-overview#upload-parameters), then set [`IsCancelled` in the event argument](slug://upload-events#event-arguments) to `true` when the number of selected files exceeds the maximum limit.
     * If `Multiple="false"`, the Upload component will replace the current file in the list with the newly selected one.
-1. Use the [Upload `OnCancel` event]({%slug upload-events%}#oncancel) to detect when the user aborts an ongoing file upload.
-1. Use the [Upload `OnSuccess` event]({%slug upload-events%}#onsuccess) to detect a successful file upload or deletion on the server. Note that removal of uploaded files also fires `OnSuccess`.
-1. Use the [Upload `OnRemove` event]({%slug upload-events%}#onremove) to detect when the user deletes an uploaded file, or removes a file that hasn't been uploaded yet. Note that removal of uploaded files also fires `OnRemove`.
-1. Use the [Upload `OnClear` event]({%slug upload-events%}#onclear) to detect when the user removes all items from the file list.
+1. Use the [Upload `OnCancel` event](slug://upload-events#oncancel) to detect when the user aborts an ongoing file upload.
+1. Use the [Upload `OnSuccess` event](slug://upload-events#onsuccess) to detect a successful file upload or deletion on the server. Note that removal of uploaded files also fires `OnSuccess`.
+1. Use the [Upload `OnRemove` event](slug://upload-events#onremove) to detect when the user deletes an uploaded file, or removes a file that hasn't been uploaded yet. Note that removal of uploaded files also fires `OnRemove`.
+1. Use the [Upload `OnClear` event](slug://upload-events#onclear) to detect when the user removes all items from the file list.
 
 >caption Track and count the number of all selected and uploaded files
 
@@ -204,4 +204,4 @@ To count the total number of selected, valid and uploaded files in multiple user
 
 ## See Also
 
-* [Upload Events]({%slug upload-events%})
+* [Upload Events](slug://upload-events)
diff --git a/knowledge-base/upload-validateantiforgerytoken.md b/knowledge-base/upload-validateantiforgerytoken.md
index b79f7396e4..c6dbb898bd 100644
--- a/knowledge-base/upload-validateantiforgerytoken.md
+++ b/knowledge-base/upload-validateantiforgerytoken.md
@@ -41,14 +41,14 @@ Here are the suggested steps to configure .NET Core Blazor antiforgery validatio
     * (optional) Add `builder.Services.AddAntiforgery()` with custom `HeaderName` or `FormFieldName`.
     * Verify that `app.UseAntiforgery();` is present.
     * Add `app.MapDefaultControllerRoute();` to configure routing.
-1. [Implement the `Save` and `Remove` controller methods]({%slug upload-overview%}#implement-controller-methods).
+1. [Implement the `Save` and `Remove` controller methods](slug://upload-overview#implement-controller-methods).
 1. Decorate the controller class or specific action methods with `[ValidateAntiForgeryToken]`
 1. Configure the Razor component, which contains the Telerik Blazor Upload:
     * Inject `AntiforgeryStateProvider` to use its `GetAntiforgeryToken()` method.
     * Inject `IAntiforgery` to use its `GetAndStoreTokens(httpContext)` method.
     * Inject `IHttpContextAccessor` to use its `HttpContext` property in the `GetAndStoreTokens()` method.
     * Execute `GetAndStoreTokens()` and/or `GetAntiforgeryToken()` in `OnInitialized` to obtain the required antiforgery information.
-    * Add the required antiforgery information in the Upload component's [`OnUpload` and `OnRemove` event handlers]({%slug upload-events%}).
+    * Add the required antiforgery information in the Upload component's [`OnUpload` and `OnRemove` event handlers](slug://upload-events).
 
 The code snippets below assume that the application name is `BlazorAppName`.
 
@@ -224,6 +224,6 @@ namespace BlazorAppName.Controllers
 
 ## See Also
 
-* [Upload Overview]({%slug upload-overview%})
-* [Upload Events]({%slug upload-events%})
-* [Upload Troubleshooting]({%slug upload-troubleshooting%})
+* [Upload Overview](slug://upload-overview)
+* [Upload Events](slug://upload-events)
+* [Upload Troubleshooting](slug://upload-troubleshooting)
diff --git a/knowledge-base/validation-custom-dataannotations-validator.md b/knowledge-base/validation-custom-dataannotations-validator.md
index 901b3384b9..8d109de083 100644
--- a/knowledge-base/validation-custom-dataannotations-validator.md
+++ b/knowledge-base/validation-custom-dataannotations-validator.md
@@ -213,7 +213,7 @@ This KB answers the following questions:
 
 ## See Also
 
-* [Conditional Form Validation Options]({%slug form-kb-conditional-validation%})
-* [Form Validation]({%slug form-validation%})
-* [Grid Validation]({%slug grid-editing-validation%})
-* [Validation Tools Overview]({%slug validation-tools-overview%})
+* [Conditional Form Validation Options](slug://form-kb-conditional-validation)
+* [Form Validation](slug://form-validation)
+* [Grid Validation](slug://grid-editing-validation)
+* [Validation Tools Overview](slug://validation-tools-overview)
diff --git a/knowledge-base/value-changed-validation-model.md b/knowledge-base/value-changed-validation-model.md
index 200be13a7d..50effa285e 100644
--- a/knowledge-base/value-changed-validation-model.md
+++ b/knowledge-base/value-changed-validation-model.md
@@ -35,7 +35,7 @@ res_type: kb
 
 ### Problem
 
-Handling the `ValueChanged` event exposed from inputs interferes with two-way binding through `@bind-Value` and thus, with [validation]({%slug common-features/input-validation%}).
+Handling the `ValueChanged` event exposed from inputs interferes with two-way binding through `@bind-Value` and thus, with [validation](slug://common-features/input-validation).
 
 You cannot use both `@bind-Value` and `ValueChanged`, you will get a compilation error similar to
 
@@ -97,4 +97,4 @@ from model: @person.theTbValue
 
 ## See also
 
-* [Knowledge Base article: Validate a Telerik component as child control and apply invalid border ]({%slug inputs-kb-validate-child-component%})
+* [Knowledge Base article: Validate a Telerik component as child control and apply invalid border ](slug://inputs-kb-validate-child-component)
diff --git a/knowledge-base/window-align-to-right.md b/knowledge-base/window-align-to-right.md
index 6a602fc14b..33ce67980f 100644
--- a/knowledge-base/window-align-to-right.md
+++ b/knowledge-base/window-align-to-right.md
@@ -30,7 +30,7 @@ A popup's position is usually controlled through the `Top` and `Left` parameters
 
 ## Solution
 
-Option 1:  Put an [AnimationContainer]({%slug components/animationcontainer/overview%}) in an element that's positioned as desired - the AnimationContainer renders at its place of declaration and can easily have 100% width of its parent.
+Option 1:  Put an [AnimationContainer](slug://components/animationcontainer/overview) in an element that's positioned as desired - the AnimationContainer renders at its place of declaration and can easily have 100% width of its parent.
 
 Option 2: Override the built-in CSS rules of the window and to put it at the right border of the page through your own class:
 
diff --git a/knowledge-base/window-cascading-parameter-null.md b/knowledge-base/window-cascading-parameter-null.md
index 295f2156c8..aa63484e2a 100644
--- a/knowledge-base/window-cascading-parameter-null.md
+++ b/knowledge-base/window-cascading-parameter-null.md
@@ -121,5 +121,5 @@ else
 
 ## See Also
 
-* [Window does not update parent]({%slug window-does-not-update-parent%})
-* [Window in EditForm Context]({%slug window-in-form-edit-context%})
+* [Window does not update parent](slug://window-does-not-update-parent)
+* [Window in EditForm Context](slug://window-in-form-edit-context)
diff --git a/knowledge-base/window-center-horizontally-fixed-top.md b/knowledge-base/window-center-horizontally-fixed-top.md
index 9639a8293a..a5e938689e 100644
--- a/knowledge-base/window-center-horizontally-fixed-top.md
+++ b/knowledge-base/window-center-horizontally-fixed-top.md
@@ -30,7 +30,7 @@ This knowledge base article answers the following questions:
 ## Solution
 
 To center a Telerik Window horizontally while maintaining a fixed distance from the top, follow these steps:
-1. Apply a [custom CSS class]({%slug themes-override%}) to the Window. 
+1. Apply a [custom CSS class](slug://themes-override) to the Window. 
 1. Use this CSS class to set the initial top value, manage the horizontal centering and override the default vertical transformation. 
 
 >caption Telerik Blazor Window Centered Horizontally with Fixed Top Value
@@ -65,4 +65,4 @@ To center a Telerik Window horizontally while maintaining a fixed distance from
 ````
 
 ## See Also
-- [Telerik Window for Blazor - Overview]({%slug window-overview%})
+- [Telerik Window for Blazor - Overview](slug://window-overview)
diff --git a/knowledge-base/window-custom-css-styling.md b/knowledge-base/window-custom-css-styling.md
index e8d957a1fe..ef9d64790d 100644
--- a/knowledge-base/window-custom-css-styling.md
+++ b/knowledge-base/window-custom-css-styling.md
@@ -29,7 +29,7 @@ How to set custom CSS styles to the Window?
 
 The Window `Class` parameter lets you define a CSS class that will be rendered on the popup element. You can cascade through it in order to change the appearance of both the content, and the built-in elements of the Window.
 
-Use CSS selectors with higher specificity to customize the looks of the Window. See [how to override the Telerik Blazor theme]({%slug themes-override%}) for more tips.
+Use CSS selectors with higher specificity to customize the looks of the Window. See [how to override the Telerik Blazor theme](slug://themes-override) for more tips.
 
 >caption Use a Class to change the appearance and style of the Window
 
diff --git a/knowledge-base/window-does-not-update-parent.md b/knowledge-base/window-does-not-update-parent.md
index f94ec685b0..eb1c0e9eb0 100644
--- a/knowledge-base/window-does-not-update-parent.md
+++ b/knowledge-base/window-does-not-update-parent.md
@@ -27,7 +27,7 @@ If you have a form and a component that hosts a Telerik Window, you may want to
 ## Possible Cause
 The issue arises from the way UI re-rendering works. When the Window is in a separate component, UI updates only happen in that render tree, and not on the main component. 
 
-The Window renders in the [`TelerikRootComponent`]({%slug rootcomponent-overview%}) to ensure proper positioning, and does not render in the place of declaration. Thus, its parent is not what you see as a markup structure.
+The Window renders in the [`TelerikRootComponent`](slug://rootcomponent-overview) to ensure proper positioning, and does not render in the place of declaration. Thus, its parent is not what you see as a markup structure.
 
 ## Solution
 You need to invoke StateHasChanged() on the parent component in order to have the UI update. This is easily done by exposing an EventCallback from the component that hosts the Window, and handling that event in the parent component.
@@ -143,4 +143,4 @@ Fore more details, examples, and a more complex scenario, see this thread: [http
 
 ## See Also
 
-[Window Inside EditContext]({%slug window-in-form-edit-context%})
+[Window Inside EditContext](slug://window-in-form-edit-context)
diff --git a/knowledge-base/window-expand-on-drag.md b/knowledge-base/window-expand-on-drag.md
index 9be76ed3af..3cbd7e694d 100644
--- a/knowledge-base/window-expand-on-drag.md
+++ b/knowledge-base/window-expand-on-drag.md
@@ -42,7 +42,7 @@ The Grid table has a `table-layout:fixed` style. If the Grid has no width, the f
 
 ## Solution
 
-Set the **Width** attribute of the Window or the Grid. To maintain [responsive behavior, set a Window width in relative units - `vw` or `%`]({%slug window-kb-responsive%}).
+Set the **Width** attribute of the Window or the Grid. To maintain [responsive behavior, set a Window width in relative units - `vw` or `%`](slug://window-kb-responsive).
 
 >caption Prevent Window expansion on drag with a relative Width
 
diff --git a/knowledge-base/window-focus-button-textbox-on-open.md b/knowledge-base/window-focus-button-textbox-on-open.md
index fd75d756c7..b854b18271 100644
--- a/knowledge-base/window-focus-button-textbox-on-open.md
+++ b/knowledge-base/window-focus-button-textbox-on-open.md
@@ -34,13 +34,13 @@ This KB article answers the following questions:
 
 ## Solution
 
-To focus any element or component in the [Telerik UI Window for Blazor]({%slug dialog-overview%}), follow the steps below. They are also applicable for the [Dialog component]({%slug dialog-overview%}).
+To focus any element or component in the [Telerik UI Window for Blazor](slug://dialog-overview), follow the steps below. They are also applicable for the [Dialog component](slug://dialog-overview).
 
-1. To focus a Telerik UI for Blazor component, [set the `@ref` attribute to obtain the component's reference]({%slug components/textbox/overview%}#textbox-reference-and-methods).
+1. To focus a Telerik UI for Blazor component, [set the `@ref` attribute to obtain the component's reference](slug://components/textbox/overview#textbox-reference-and-methods).
 1. Raise a `bool` flag when showing the Window.
 1. Check the boolean flag's value in `OnAfterRenderAsync()`.
 1. Use a small `Task.Delay()` to wait for the Window to display and gain focus. Without a delay, the focusable component will either not exist yet, or the Window will steal the focus.
-1. Focus the desired button, textbox, or input component. If it's a Telerik UI for Blazor component, use the [`FocusAsync()` method]({%slug inputs-kb-focus%}).
+1. Focus the desired button, textbox, or input component. If it's a Telerik UI for Blazor component, use the [`FocusAsync()` method](slug://inputs-kb-focus).
 
 >caption Focus a component on Dialog or Window open
 
@@ -134,6 +134,6 @@ To focus any element or component in the [Telerik UI Window for Blazor]({%slug d
 
 ## See Also
 
-* [Dialog Overview]({%slug dialog-overview%})
-* [Window Overview]({%slug window-overview%})
-* [Focus Telerik Input Components]({%slug inputs-kb-focus%})
+* [Dialog Overview](slug://dialog-overview)
+* [Window Overview](slug://window-overview)
+* [Focus Telerik Input Components](slug://inputs-kb-focus)
diff --git a/knowledge-base/window-in-form-edit-context.md b/knowledge-base/window-in-form-edit-context.md
index 7112be28af..3cef4de179 100644
--- a/knowledge-base/window-in-form-edit-context.md
+++ b/knowledge-base/window-in-form-edit-context.md
@@ -147,4 +147,4 @@ If the model has validation attached, updating the `EditContext` does not update
 
 ## See Also
 
-[Changing data in a component with a window does not change the parent]({%slug window-does-not-update-parent%})
+[Changing data in a component with a window does not change the parent](slug://window-does-not-update-parent)
diff --git a/knowledge-base/window-keep-content-when-closed.md b/knowledge-base/window-keep-content-when-closed.md
index 8bb6d46152..052f90a731 100644
--- a/knowledge-base/window-keep-content-when-closed.md
+++ b/knowledge-base/window-keep-content-when-closed.md
@@ -31,16 +31,16 @@ When the `Visible` parameter is set to `false`, the Window content is disposed f
 
 To achieve the desired result, toggle the visibility of the Window with CSS:
 
-1. Create a [custom **Close** action]({%slug components/window/actions%}#custom-actions).
-1. Handle the [`OnClick`]({%slug button-events%}#onclick) event of the action button to apply the needed CSS.
+1. Create a [custom **Close** action](slug://components/window/actions#custom-actions).
+1. Handle the [`OnClick`](slug://button-events#onclick) event of the action button to apply the needed CSS.
 
-The further steps will vary depending on whether or not the [Window is modal]({%slug components/window/modal%}). Only the second approach applies to the [Dialog]({%slug dialog-overview%}) as it is always modal by design.
+The further steps will vary depending on whether or not the [Window is modal](slug://components/window/modal). Only the second approach applies to the [Dialog](slug://dialog-overview) as it is always modal by design.
 
 For more details on the suggested approaches, refer to the following examples in the section:
 * [Customizing the closing action of non-modal Windows](#custom-close-for-non-modal-windows)
 * [Customizing the closing action of modal Windows and Dialogs](#custom-close-for-modal-windows-and-dialogs)
 
-> The suggested implementations are based on hiding the Window and preserving its content in the DOM. As a result, the component is never treated as really closed and user actions such as [pressing the `Esc` key](https://demos.telerik.com/blazor-ui/window/keyboard-navigation) or [clicking the overlay of a modal Window]({%slug components/window/modal%}) will not close the Window as no **Close** command is actually defined. If needed, you have to implement the required behavior in a custom manner.
+> The suggested implementations are based on hiding the Window and preserving its content in the DOM. As a result, the component is never treated as really closed and user actions such as [pressing the `Esc` key](https://demos.telerik.com/blazor-ui/window/keyboard-navigation) or [clicking the overlay of a modal Window](slug://components/window/modal) will not close the Window as no **Close** command is actually defined. If needed, you have to implement the required behavior in a custom manner.
 
 ### Custom Close for Non-Modal Windows
 
@@ -128,7 +128,7 @@ To customize the closing of a non-modal Window:
 
 ### Custom Close for Modal Windows and Dialogs
 
-The [modal Window]({%slug components/window/modal%}) and [Dialog]({%slug dialog-overview%}) components have a different rendering. They are wrapped in a `<div class="k-dialog-wrapper">` which contains both the component and the overlay. To allow the user to interact with the page while the Window or Dialog is hidden, you also need to hide the overlay.
+The [modal Window](slug://components/window/modal) and [Dialog](slug://dialog-overview) components have a different rendering. They are wrapped in a `<div class="k-dialog-wrapper">` which contains both the component and the overlay. To allow the user to interact with the page while the Window or Dialog is hidden, you also need to hide the overlay.
 
 To customize the closing of a modal Window or Dialog:
 
diff --git a/knowledge-base/window-modal-minimize-popup.md b/knowledge-base/window-modal-minimize-popup.md
index b9e3b99f03..d50ca83f7b 100644
--- a/knowledge-base/window-modal-minimize-popup.md
+++ b/knowledge-base/window-modal-minimize-popup.md
@@ -29,7 +29,7 @@ To implement a responsible popup that can be minimized to the bottom of the page
 
 1. Set the `Top` and `Left` parameters to control the position of the modal.
 2. Use boolean flags to show and hide the popup.
-3. Use the [MediaQuery]({%slug mediaquery-overview%}) component to make the modal window responsive.
+3. Use the [MediaQuery](slug://mediaquery-overview) component to make the modal window responsive.
 
 >caption The result from the code snippet below on a big screen.
 
diff --git a/knowledge-base/window-responsive.md b/knowledge-base/window-responsive.md
index 47fb383f26..2d8d77ba4e 100644
--- a/knowledge-base/window-responsive.md
+++ b/knowledge-base/window-responsive.md
@@ -117,4 +117,4 @@ If you want to use the CSS media queries, you have to create a separate CSS file
 
 ## See also:
 
- * [Documentation Window for Blazor | Size]({%slug components/window/size%})
+ * [Documentation Window for Blazor | Size](slug://components/window/size)
diff --git a/knowledge-base/wizard-confirm-step-change.md b/knowledge-base/wizard-confirm-step-change.md
index a7bda21aac..5598a1333e 100644
--- a/knowledge-base/wizard-confirm-step-change.md
+++ b/knowledge-base/wizard-confirm-step-change.md
@@ -25,7 +25,7 @@ res_type: kb
 When a user wants to move to the next step, I need to confirm the move and show them a popup warning for some situations. If they choose to "continue", take them to the next step as normal, otherwise back to the current step.
 
 ## Solution
-Use the [`OnChange` event]({%slug wizard-events%}#onchange) of the originating step to show a [confirm Dialog]({%slug dialog-predefined%}#confirm). Cancel the event if the user does not confirm. It is also possible to use a Window component, but a confirmation Dialog is likely more suitable.
+Use the [`OnChange` event](slug://wizard-events#onchange) of the originating step to show a [confirm Dialog](slug://dialog-predefined#confirm). Cancel the event if the user does not confirm. It is also possible to use a Window component, but a confirmation Dialog is likely more suitable.
 
 This example shows confirmation when moving away from step 1. You can extend it for other steps. You can also add a lambda expression in the handler on each step to provide more data to the method - for example, to form a more meaningful message for the step or to distinguish steps more easily.
 
diff --git a/knowledge-base/wizard-skip-step.md b/knowledge-base/wizard-skip-step.md
index cec40696cb..39abcd0915 100644
--- a/knowledge-base/wizard-skip-step.md
+++ b/knowledge-base/wizard-skip-step.md
@@ -25,11 +25,11 @@ res_type: kb
 
 How to skip one or more Wizard steps, based on the results of another step?
 
-The [Wizard flow is set to linear]({%slug wizard-structure-stepper%}#linear-flow), so I can't disable steps, but I need to skip an unneeded step programmatically, based on a custom condition in a previous step.
+The [Wizard flow is set to linear](slug://wizard-structure-stepper#linear-flow), so I can't disable steps, but I need to skip an unneeded step programmatically, based on a custom condition in a previous step.
 
 ## Solution
 
-1. Subscribe to the [`OnChange`]({%slug wizard-events%}#onchange) event of the originating step.
+1. Subscribe to the [`OnChange`](slug://wizard-events#onchange) event of the originating step.
 1. Check `args.TargetIndex` to find out if the user is navigating in the desired direction.
 1. Set `args.IsCancelled` to `true` to cancel navigation to the next step.
 1. Set the Wizard `Value` to the desired step.
diff --git a/knowledge-base/wizard-wrap-step-label-text.md b/knowledge-base/wizard-wrap-step-label-text.md
index 37e8599c11..4ea4f81aae 100644
--- a/knowledge-base/wizard-wrap-step-label-text.md
+++ b/knowledge-base/wizard-wrap-step-label-text.md
@@ -68,4 +68,4 @@ To wrap the Wizard step labels and display the full text, apply custom CSS style
 ## See Also
 
 - [Wizard Overview](https://docs.telerik.com/blazor-ui/components/wizard/overview)
-- [Override the Theme or Apply Custom CSS Styles]({%slug themes-override%})
+- [Override the Theme or Apply Custom CSS Styles](slug://themes-override)
diff --git a/security/overview.md b/security/overview.md
index 6a8d412147..e1af6fd91d 100644
--- a/security/overview.md
+++ b/security/overview.md
@@ -78,7 +78,7 @@ We leverage leading commercial tools to automatically monitor and update third-p
 
 Content Security Policy (CSP) is a critical security measure that helps detect and mitigate the risks of content injection vulnerabilities, such as cross-site scripting (XSS) and data injection attacks. Telerik UI for Blazor components are designed to be CSP-compliant, ensuring secure integration into customer projects.
 
-For more detailed information on CSP compliance, refer to the [Telerik UI for Blazor Content Security Policy]({%slug troubleshooting-csp%}) article.
+For more detailed information on CSP compliance, refer to the [Telerik UI for Blazor Content Security Policy](slug://troubleshooting-csp) article.
 
 This resource provides guidelines on how to configure your Blazor application to comply with CSP requirements when using the Telerik UI for Blazor components.
 
@@ -90,8 +90,8 @@ We closely monitor the [OWASP Top 10](https://owasp.org/www-project-top-ten/) li
 
 The following resources outline best practices and recommendations for securing the corresponding component and mitigating potential risks:
 
-* [Editor - Security Guidelines]({%slug editor-overview%}#security)
-* [Upload - Security Guidelines]({%slug upload-overview%}#security)
+* [Editor - Security Guidelines](slug://editor-overview#security)
+* [Upload - Security Guidelines](slug://upload-overview#security)
 
-For more detailed answers to common security-related questions, please refer to our [Security FAQ page]({%slug security-faq%}).      
+For more detailed answers to common security-related questions, please refer to our [Security FAQ page](slug://security-faq).      
  
\ No newline at end of file
diff --git a/src-a11y/configs/aiprompt.aria.yml b/src-a11y/configs/aiprompt.aria.yml
index 5ae4b78577..d2e020b623 100644
--- a/src-a11y/configs/aiprompt.aria.yml
+++ b/src-a11y/configs/aiprompt.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor AIPrompt Demos](https://demos.telerik.com/blazor-ui/aiprompt/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/autocomplete.aria.yml b/src-a11y/configs/autocomplete.aria.yml
index 5623372183..0dd6e1e581 100644
--- a/src-a11y/configs/autocomplete.aria.yml
+++ b/src-a11y/configs/autocomplete.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/breadcrumb.aria.yml b/src-a11y/configs/breadcrumb.aria.yml
index 7ed43fec45..75a25d608d 100644
--- a/src-a11y/configs/breadcrumb.aria.yml
+++ b/src-a11y/configs/breadcrumb.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/button.aria.yml b/src-a11y/configs/button.aria.yml
index d9a7827ff0..b2b4362665 100644
--- a/src-a11y/configs/button.aria.yml
+++ b/src-a11y/configs/button.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/buttongroup.aria.yml b/src-a11y/configs/buttongroup.aria.yml
index afc8fe9f9f..4c098a8e5a 100644
--- a/src-a11y/configs/buttongroup.aria.yml
+++ b/src-a11y/configs/buttongroup.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/calendar.aria.yml b/src-a11y/configs/calendar.aria.yml
index 7d722a111d..a6a0b05943 100644
--- a/src-a11y/configs/calendar.aria.yml
+++ b/src-a11y/configs/calendar.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/card.aria.yml b/src-a11y/configs/card.aria.yml
index 318900f1c2..8268a22469 100644
--- a/src-a11y/configs/card.aria.yml
+++ b/src-a11y/configs/card.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor Card Demos](https://demos.telerik.com/blazor-ui/card/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/carousel.aria.yml b/src-a11y/configs/carousel.aria.yml
index d3080a71b6..7deaead74d 100644
--- a/src-a11y/configs/carousel.aria.yml
+++ b/src-a11y/configs/carousel.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/chart.aria.yml b/src-a11y/configs/chart.aria.yml
index 7a2715ef08..134b4d6f21 100644
--- a/src-a11y/configs/chart.aria.yml
+++ b/src-a11y/configs/chart.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/checkbox.aria.yml b/src-a11y/configs/checkbox.aria.yml
index d3ac6d9cf9..d9ddd9e067 100644
--- a/src-a11y/configs/checkbox.aria.yml
+++ b/src-a11y/configs/checkbox.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor CheckBox Demos](https://demos.telerik.com/blazor-ui/checkbox/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/chip.aria.yml b/src-a11y/configs/chip.aria.yml
index e64f92a97d..b68efad1de 100644
--- a/src-a11y/configs/chip.aria.yml
+++ b/src-a11y/configs/chip.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/chiplist.aria.yml b/src-a11y/configs/chiplist.aria.yml
index f0e28baad0..589bb940c0 100644
--- a/src-a11y/configs/chiplist.aria.yml
+++ b/src-a11y/configs/chiplist.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/chunkprogressbar.aria.yml b/src-a11y/configs/chunkprogressbar.aria.yml
index 78c367607d..a1f8d93138 100644
--- a/src-a11y/configs/chunkprogressbar.aria.yml
+++ b/src-a11y/configs/chunkprogressbar.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor ChunkProgressBar Demos](https://demos.telerik.com/blazor-ui/chunkprogressbar/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/colorgradient.aria.yml b/src-a11y/configs/colorgradient.aria.yml
index 6461b735a7..31b6b4da48 100644
--- a/src-a11y/configs/colorgradient.aria.yml
+++ b/src-a11y/configs/colorgradient.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/colorpalette.aria.yml b/src-a11y/configs/colorpalette.aria.yml
index ea7ce5c20a..bdc3a1580c 100644
--- a/src-a11y/configs/colorpalette.aria.yml
+++ b/src-a11y/configs/colorpalette.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/colorpicker.aria.yml b/src-a11y/configs/colorpicker.aria.yml
index d0d2758d0b..77fecf75aa 100644
--- a/src-a11y/configs/colorpicker.aria.yml
+++ b/src-a11y/configs/colorpicker.aria.yml
@@ -15,4 +15,4 @@ after:  |
     ## See Also
 
     * [Blazor ColorPicker Demos](https://demos.telerik.com/blazor-ui/colorpicker/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/combobox.aria.yml b/src-a11y/configs/combobox.aria.yml
index 333745dc45..283f49e73d 100644
--- a/src-a11y/configs/combobox.aria.yml
+++ b/src-a11y/configs/combobox.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/contextmenu.aria.yml b/src-a11y/configs/contextmenu.aria.yml
index 497c6a5c8a..31919144a3 100644
--- a/src-a11y/configs/contextmenu.aria.yml
+++ b/src-a11y/configs/contextmenu.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/dateinput.aria.yml b/src-a11y/configs/dateinput.aria.yml
index 2efac6f90d..7b8559bbc2 100644
--- a/src-a11y/configs/dateinput.aria.yml
+++ b/src-a11y/configs/dateinput.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/datepicker.aria.yml b/src-a11y/configs/datepicker.aria.yml
index 51fcea6e75..34236c4ddf 100644
--- a/src-a11y/configs/datepicker.aria.yml
+++ b/src-a11y/configs/datepicker.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/daterangepicker.aria.yml b/src-a11y/configs/daterangepicker.aria.yml
index 272ff573fd..8904a70044 100644
--- a/src-a11y/configs/daterangepicker.aria.yml
+++ b/src-a11y/configs/daterangepicker.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/datetimepicker.aria.yml b/src-a11y/configs/datetimepicker.aria.yml
index 3fb0b1067d..3c5dcb7103 100644
--- a/src-a11y/configs/datetimepicker.aria.yml
+++ b/src-a11y/configs/datetimepicker.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/dialog.aria.yml b/src-a11y/configs/dialog.aria.yml
index 57a475c905..343cd76075 100644
--- a/src-a11y/configs/dialog.aria.yml
+++ b/src-a11y/configs/dialog.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor Dialog Demos](https://demos.telerik.com/blazor-ui/dialog/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/drawer.aria.yml b/src-a11y/configs/drawer.aria.yml
index e8cd9101f0..3cf6aa3f53 100644
--- a/src-a11y/configs/drawer.aria.yml
+++ b/src-a11y/configs/drawer.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/dropdownbutton.aria.yml b/src-a11y/configs/dropdownbutton.aria.yml
index 83ad69dc7d..d95cf3b70f 100644
--- a/src-a11y/configs/dropdownbutton.aria.yml
+++ b/src-a11y/configs/dropdownbutton.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/dropdownlist.aria.yml b/src-a11y/configs/dropdownlist.aria.yml
index 487cf8a1a6..c122633dfd 100644
--- a/src-a11y/configs/dropdownlist.aria.yml
+++ b/src-a11y/configs/dropdownlist.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/editor.aria.yml b/src-a11y/configs/editor.aria.yml
index 1453335596..40e9e224db 100644
--- a/src-a11y/configs/editor.aria.yml
+++ b/src-a11y/configs/editor.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/filemanager.aria.yml b/src-a11y/configs/filemanager.aria.yml
index 1bce630b6c..b5f4839206 100644
--- a/src-a11y/configs/filemanager.aria.yml
+++ b/src-a11y/configs/filemanager.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor FileManager Demos](https://demos.telerik.com/blazor-ui/filemanager/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/filter.aria.yml b/src-a11y/configs/filter.aria.yml
index d91d7689bf..4055e197db 100644
--- a/src-a11y/configs/filter.aria.yml
+++ b/src-a11y/configs/filter.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/flatcolorpicker.aria.yml b/src-a11y/configs/flatcolorpicker.aria.yml
index 97990e9c2a..7b0395c22b 100644
--- a/src-a11y/configs/flatcolorpicker.aria.yml
+++ b/src-a11y/configs/flatcolorpicker.aria.yml
@@ -15,4 +15,4 @@ after:  |
     ## See Also
 
     * [Blazor FlatColorPicker Demos](https://demos.telerik.com/blazor-ui/flatcolorpicker/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/form.aria.yml b/src-a11y/configs/form.aria.yml
index 1754025fe7..3afc23c216 100644
--- a/src-a11y/configs/form.aria.yml
+++ b/src-a11y/configs/form.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor Form Demos](https://demos.telerik.com/blazor-ui/form/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/gantt.aria.yml b/src-a11y/configs/gantt.aria.yml
index b19ff9ca61..aecad86248 100644
--- a/src-a11y/configs/gantt.aria.yml
+++ b/src-a11y/configs/gantt.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor Gantt Demos](https://demos.telerik.com/blazor-ui/gantt/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/grid.aria.yml b/src-a11y/configs/grid.aria.yml
index 0df4cca6e2..fbfc8780d9 100644
--- a/src-a11y/configs/grid.aria.yml
+++ b/src-a11y/configs/grid.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/listbox.aria.yml b/src-a11y/configs/listbox.aria.yml
index e950df8d20..fc4ae88cbe 100644
--- a/src-a11y/configs/listbox.aria.yml
+++ b/src-a11y/configs/listbox.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/listview.aria.yml b/src-a11y/configs/listview.aria.yml
index a31eab010b..4f571e4a9d 100644
--- a/src-a11y/configs/listview.aria.yml
+++ b/src-a11y/configs/listview.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor ListView Demos](https://demos.telerik.com/blazor-ui/listview/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/maskedtextbox.aria.yml b/src-a11y/configs/maskedtextbox.aria.yml
index 6ce97263f9..7ba5c1a6e9 100644
--- a/src-a11y/configs/maskedtextbox.aria.yml
+++ b/src-a11y/configs/maskedtextbox.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor MaskedTextbox Demos](https://demos.telerik.com/blazor-ui/maskedtextbox/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/menu.aria.yml b/src-a11y/configs/menu.aria.yml
index 3b84ea9f77..41c99009d1 100644
--- a/src-a11y/configs/menu.aria.yml
+++ b/src-a11y/configs/menu.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/multicolumncombobox.aria.yml b/src-a11y/configs/multicolumncombobox.aria.yml
index 83afcc5db6..337365717c 100644
--- a/src-a11y/configs/multicolumncombobox.aria.yml
+++ b/src-a11y/configs/multicolumncombobox.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/multiselect.aria.yml b/src-a11y/configs/multiselect.aria.yml
index 3fd8797889..a3783546f3 100644
--- a/src-a11y/configs/multiselect.aria.yml
+++ b/src-a11y/configs/multiselect.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/notification.aria.yml b/src-a11y/configs/notification.aria.yml
index 1148442281..cf0e241381 100644
--- a/src-a11y/configs/notification.aria.yml
+++ b/src-a11y/configs/notification.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor Notification Demos](https://demos.telerik.com/blazor-ui/notification/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/numerictextbox.aria.yml b/src-a11y/configs/numerictextbox.aria.yml
index 1a79c61590..bb658a2c99 100644
--- a/src-a11y/configs/numerictextbox.aria.yml
+++ b/src-a11y/configs/numerictextbox.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/pager.aria.yml b/src-a11y/configs/pager.aria.yml
index 1c3b6443a4..27449e2ad6 100644
--- a/src-a11y/configs/pager.aria.yml
+++ b/src-a11y/configs/pager.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/panelbar.aria.yml b/src-a11y/configs/panelbar.aria.yml
index 05559e725c..fafef048cc 100644
--- a/src-a11y/configs/panelbar.aria.yml
+++ b/src-a11y/configs/panelbar.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/pdfviewer.aria.yml b/src-a11y/configs/pdfviewer.aria.yml
index b3d3937cef..464541114b 100644
--- a/src-a11y/configs/pdfviewer.aria.yml
+++ b/src-a11y/configs/pdfviewer.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor PDFViewer Demos](https://demos.telerik.com/blazor-ui/pdfviewer/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/pivotgrid.aria.yml b/src-a11y/configs/pivotgrid.aria.yml
index aa585d8105..25ac97c004 100644
--- a/src-a11y/configs/pivotgrid.aria.yml
+++ b/src-a11y/configs/pivotgrid.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor PivotGrid Demos](https://demos.telerik.com/blazor-ui/pivotgrid/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/popover.aria.yml b/src-a11y/configs/popover.aria.yml
index 9c38430d22..4f8e9bf055 100644
--- a/src-a11y/configs/popover.aria.yml
+++ b/src-a11y/configs/popover.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor Popover Demos](https://demos.telerik.com/blazor-ui/popover/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/progressbar.aria.yml b/src-a11y/configs/progressbar.aria.yml
index bde60d14a6..b311e15d58 100644
--- a/src-a11y/configs/progressbar.aria.yml
+++ b/src-a11y/configs/progressbar.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor ProgressBar Demos](https://demos.telerik.com/blazor-ui/progressbar/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/radiogroup.aria.yml b/src-a11y/configs/radiogroup.aria.yml
index efa35513b3..33f0b0964c 100644
--- a/src-a11y/configs/radiogroup.aria.yml
+++ b/src-a11y/configs/radiogroup.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/rangeslider.aria.yml b/src-a11y/configs/rangeslider.aria.yml
index 59a7733084..5847c1694d 100644
--- a/src-a11y/configs/rangeslider.aria.yml
+++ b/src-a11y/configs/rangeslider.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/rating.aria.yml b/src-a11y/configs/rating.aria.yml
index f3fb28a282..a00e85b493 100644
--- a/src-a11y/configs/rating.aria.yml
+++ b/src-a11y/configs/rating.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/sankey.aria.yml b/src-a11y/configs/sankey.aria.yml
index ddfdc0a019..7681520410 100644
--- a/src-a11y/configs/sankey.aria.yml
+++ b/src-a11y/configs/sankey.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor Sankey Demos](https://demos.telerik.com/blazor-ui/sankey/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/scheduler.aria.yml b/src-a11y/configs/scheduler.aria.yml
index cb3e1a1289..f3ef9db3ec 100644
--- a/src-a11y/configs/scheduler.aria.yml
+++ b/src-a11y/configs/scheduler.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/signature.aria.yml b/src-a11y/configs/signature.aria.yml
index fa9e9aa53a..3fd6ff40a9 100644
--- a/src-a11y/configs/signature.aria.yml
+++ b/src-a11y/configs/signature.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor Signature Demos](https://demos.telerik.com/blazor-ui/signature/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/skeleton.aria.yml b/src-a11y/configs/skeleton.aria.yml
index 35b17539ef..9f8d2b5889 100644
--- a/src-a11y/configs/skeleton.aria.yml
+++ b/src-a11y/configs/skeleton.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor Skeleton Demos](https://demos.telerik.com/blazor-ui/skeleton/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/slider.aria.yml b/src-a11y/configs/slider.aria.yml
index aceac5c1da..5b2967fd87 100644
--- a/src-a11y/configs/slider.aria.yml
+++ b/src-a11y/configs/slider.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/splitbutton.aria.yml b/src-a11y/configs/splitbutton.aria.yml
index ccabbc68bd..543088dc41 100644
--- a/src-a11y/configs/splitbutton.aria.yml
+++ b/src-a11y/configs/splitbutton.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/splitter.aria.yml b/src-a11y/configs/splitter.aria.yml
index 7e5fa3a684..1e75dcbfea 100644
--- a/src-a11y/configs/splitter.aria.yml
+++ b/src-a11y/configs/splitter.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/spreadsheet.aria.yml b/src-a11y/configs/spreadsheet.aria.yml
index cde845f890..3b52a979fc 100644
--- a/src-a11y/configs/spreadsheet.aria.yml
+++ b/src-a11y/configs/spreadsheet.aria.yml
@@ -12,4 +12,4 @@ after:  |
     ## See Also
 
     * [Blazor Spreadsheet Demos](https://demos.telerik.com/blazor-ui/spreadsheet/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/stepper.aria.yml b/src-a11y/configs/stepper.aria.yml
index fa6253d51f..80b5f4194b 100644
--- a/src-a11y/configs/stepper.aria.yml
+++ b/src-a11y/configs/stepper.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/switch.aria.yml b/src-a11y/configs/switch.aria.yml
index fb30e3e54f..0f7f3d7e40 100644
--- a/src-a11y/configs/switch.aria.yml
+++ b/src-a11y/configs/switch.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/tabstrip.aria.yml b/src-a11y/configs/tabstrip.aria.yml
index 844ffb7bb4..e4f22b5a97 100644
--- a/src-a11y/configs/tabstrip.aria.yml
+++ b/src-a11y/configs/tabstrip.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/textarea.aria.yml b/src-a11y/configs/textarea.aria.yml
index 9e714f1061..4928276faa 100644
--- a/src-a11y/configs/textarea.aria.yml
+++ b/src-a11y/configs/textarea.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor TextArea Demos](https://demos.telerik.com/blazor-ui/textarea/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/textbox.aria.yml b/src-a11y/configs/textbox.aria.yml
index 4709e60654..dcf08d10a4 100644
--- a/src-a11y/configs/textbox.aria.yml
+++ b/src-a11y/configs/textbox.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor TextBox Demos](https://demos.telerik.com/blazor-ui/textbox/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/tilelayout.aria.yml b/src-a11y/configs/tilelayout.aria.yml
index 2b23f0ccad..411477ddb3 100644
--- a/src-a11y/configs/tilelayout.aria.yml
+++ b/src-a11y/configs/tilelayout.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor TileLayout Demos](https://demos.telerik.com/blazor-ui/tilelayout/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/timepicker.aria.yml b/src-a11y/configs/timepicker.aria.yml
index 1f1cc073f4..e613cc5c55 100644
--- a/src-a11y/configs/timepicker.aria.yml
+++ b/src-a11y/configs/timepicker.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/togglebutton.aria.yml b/src-a11y/configs/togglebutton.aria.yml
index 0179451033..81689927c4 100644
--- a/src-a11y/configs/togglebutton.aria.yml
+++ b/src-a11y/configs/togglebutton.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/toolbar.aria.yml b/src-a11y/configs/toolbar.aria.yml
index d6cd968578..b83d8b5757 100644
--- a/src-a11y/configs/toolbar.aria.yml
+++ b/src-a11y/configs/toolbar.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/tooltip.aria.yml b/src-a11y/configs/tooltip.aria.yml
index 7c9c78032c..1d5ddf69f3 100644
--- a/src-a11y/configs/tooltip.aria.yml
+++ b/src-a11y/configs/tooltip.aria.yml
@@ -7,9 +7,9 @@ position: 50
 after:  |
     ## Keyboard Navigation
 
-    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview]({%slug accessibility-overview%}#keyboard-navigation) article.
+    For details on how the keyboard navigation works in Telerik UI for Blazor, refer to the [Accessibility Overview](slug://accessibility-overview#keyboard-navigation) article.
 
     ## See Also
 
     * [Blazor Tooltip Demos](https://demos.telerik.com/blazor-ui/tooltip/overview)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/treelist.aria.yml b/src-a11y/configs/treelist.aria.yml
index f589768e00..7ee45abbb6 100644
--- a/src-a11y/configs/treelist.aria.yml
+++ b/src-a11y/configs/treelist.aria.yml
@@ -11,5 +11,5 @@ after:  |
 
     ## See Also
 
-    * [Blazor TreeList Accessibility Example]({%slug treelist-accessibility-overview%}#blazor-treelist-accessibility-example)
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Blazor TreeList Accessibility Example](slug://treelist-accessibility-overview#blazor-treelist-accessibility-example)
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/treeview.aria.yml b/src-a11y/configs/treeview.aria.yml
index 85a0c88c37..4e682d58cf 100644
--- a/src-a11y/configs/treeview.aria.yml
+++ b/src-a11y/configs/treeview.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/upload.aria.yml b/src-a11y/configs/upload.aria.yml
index bb36e61b03..4162a5cc83 100644
--- a/src-a11y/configs/upload.aria.yml
+++ b/src-a11y/configs/upload.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/window.aria.yml b/src-a11y/configs/window.aria.yml
index 3286d68a43..50f06ab8d8 100644
--- a/src-a11y/configs/window.aria.yml
+++ b/src-a11y/configs/window.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/src-a11y/configs/wizard.aria.yml b/src-a11y/configs/wizard.aria.yml
index f4b73ae437..877d5254a8 100644
--- a/src-a11y/configs/wizard.aria.yml
+++ b/src-a11y/configs/wizard.aria.yml
@@ -11,4 +11,4 @@ after:  |
 
     ## See Also
 
-    * [Accessibility in Telerik UI for Blazor]({%slug accessibility-overview%})
+    * [Accessibility in Telerik UI for Blazor](slug://accessibility-overview)
diff --git a/styling-and-themes/custom-theme.md b/styling-and-themes/custom-theme.md
index 8d7b44d01f..31dc15aa2e 100644
--- a/styling-and-themes/custom-theme.md
+++ b/styling-and-themes/custom-theme.md
@@ -77,7 +77,7 @@ The example below shows how to customize some of the theme variables.
 
 ## Overriding Theme Styles
 
-You can [override theme styles with custom CSS]({%slug themes-override%}), no matter if the app is using a built-in or custom theme. This approach makes sense only for a relatively small number of customizations. Beyond that, choose some of the other alternatives on this page.
+You can [override theme styles with custom CSS](slug://themes-override), no matter if the app is using a built-in or custom theme. This approach makes sense only for a relatively small number of customizations. Beyond that, choose some of the other alternatives on this page.
 
 Upgrading may require changes to the additional custom CSS code, but only if there are breaking changes in the HTML output and styling.
 
@@ -91,10 +91,10 @@ Each <a href="https://www.telerik.com/design-system/docs/themes/kendo-themes/def
 
 ## Loading Custom Themes
 
-Custom themes are used in a [similar way as the built-in themes]({%slug getting-started/what-you-need%}#css-theme). The notable differences are:
+Custom themes are used in a [similar way as the built-in themes](slug://getting-started/what-you-need#css-theme). The notable differences are:
 
 * The custom theme must reside in the `wwwroot` folder of the Blazor app or on a CDN provider.
-* You must recreate custom themes every time you [update the Telerik UI for Blazor version]({%slug upgrade-tutorial%}).
+* You must recreate custom themes every time you [update the Telerik UI for Blazor version](slug://upgrade-tutorial).
 
 Make sure that the Blazor app is loading only one Telerik theme at a time. If you are replacing a built-in theme with a custom theme, you must remove the `<link>` element of the built-in theme.
 
diff --git a/styling-and-themes/override-theme-styles.md b/styling-and-themes/override-theme-styles.md
index 4d79c5146d..fe566b9e61 100644
--- a/styling-and-themes/override-theme-styles.md
+++ b/styling-and-themes/override-theme-styles.md
@@ -11,9 +11,9 @@ previous_url: /styling-and-themes/good-styling-practices
 
 # Override Theme Styles
 
-Sometimes you may need to make a small change to the appearance of a component, while still using the same [built-in]({%slug themes-overview%}) or [custom]({%slug themes-customize%}) theme.
+Sometimes you may need to make a small change to the appearance of a component, while still using the same [built-in](slug://themes-overview) or [custom](slug://themes-customize) theme.
 
-This article provides high-level guidance about the knowledge and tools required to override existing CSS styles without changing the theme's CSS file. In scenarios with a larger number of customizations, it may be [more practical to use a different approach, for example, a custom theme]({%slug common-kb-theme-customization-options%}).
+This article provides high-level guidance about the knowledge and tools required to override existing CSS styles without changing the theme's CSS file. In scenarios with a larger number of customizations, it may be [more practical to use a different approach, for example, a custom theme](slug://common-kb-theme-customization-options).
 
 ## CSS Knowledge
 
@@ -35,7 +35,7 @@ To see what CSS styles are applied on an HTML element, use the browser's develop
 
 [CSS isolation](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/css-isolation) is a .NET feature, which scopes styles to a specific Razor component.
 
-* There are two cases when CSS isolation may not work with UI for Blazor components. We explain the reasons and suggest workarounds in [this knowledge base article]({%slug common-kb-css-isolation%}). The two cases are:
+* There are two cases when CSS isolation may not work with UI for Blazor components. We explain the reasons and suggest workarounds in [this knowledge base article](slug://common-kb-css-isolation). The two cases are:
    * Using isolated styles with a component `Class`.
    * Using isolated styles for popups (Window, Dialog).
 
@@ -44,7 +44,7 @@ To see what CSS styles are applied on an HTML element, use the browser's develop
 When implementing CSS overrides, it's usually best to set custom CSS classes through the exposed component parameters and event arguments. This brings the following benefits:
 
 * There is less need to be familiar with the components' HTML rendering and built-in CSS styles, although this knowledge is recommended and cannot be fully avoided.
-* The custom CSS code in the application is more future-proof if a [rendering change]({%slug versions-with-rendering-changes%}) occurs.
+* The custom CSS code in the application is more future-proof if a [rendering change](slug://versions-with-rendering-changes) occurs.
 * The custom CSS classes may follow a naming convention of the app, instead of the naming convention of the Telerik themes.
 
 The example below demonstrates using custom CSS classes with the Grid and the ComboBox.
@@ -128,4 +128,4 @@ The example below demonstrates using custom CSS classes with the Grid and the Co
 
 ## See Also
 
-* [How to customize the look of Telerik Blazor components]({%slug common-kb-theme-customization-options%})
+* [How to customize the look of Telerik Blazor components](slug://common-kb-theme-customization-options)
diff --git a/styling-and-themes/overview.md b/styling-and-themes/overview.md
index b010f8441b..9834ce2a2c 100644
--- a/styling-and-themes/overview.md
+++ b/styling-and-themes/overview.md
@@ -32,7 +32,7 @@ A *theme swatch* is a color variation of a theme. All <a href="https://www.teler
 
 When the Telerik UI for Blazor documentation talks about a given theme name, for example *Default*, this implies the *Main* swatch of this theme. In addition, the word "theme" as a general term can imply any swatch of any theme.
 
-The CSS file of any swatch is self-sufficient and contains all required styles for the Telerik Blazor components, except the optional [font icon styles]({%slug common-features-icons%}#font-icon-stylesheet). You can [switch the theme runtime]({%slug common-kb-change-theme-runtime%}), but the Blazor app should always load only one theme at a time.
+The CSS file of any swatch is self-sufficient and contains all required styles for the Telerik Blazor components, except the optional [font icon styles](slug://common-features-icons#font-icon-stylesheet). You can [switch the theme runtime](slug://common-kb-change-theme-runtime), but the Blazor app should always load only one theme at a time.
 
 ### Integration with the Telerik Components
 
@@ -54,17 +54,17 @@ You can explore and compare the built-in theme swatches on the [live Telerik UI
 
 ## Using a Theme
 
-To register a theme, you must reference its stylesheet in the `<head>` of the web page. The exact project file that contains the `<head>` tag depends on the .NET version and the Blazor application type. See our [Getting Started guides]({%slug blazor-overview%}#getting-started) for more information.
+To register a theme, you must reference its stylesheet in the `<head>` of the web page. The exact project file that contains the `<head>` tag depends on the .NET version and the Blazor application type. See our [Getting Started guides](slug://blazor-overview#getting-started) for more information.
 
 There are three ways to load a Telerik theme, in terms of physical CSS file location. Note that each option provides access to a different number of theme swatches.
 
-* [Load a CSS theme as a static asset from the `Telerik.UI.for.Blazor` NuGet package](#loading-themes-from-the-nuget-package). This is the easiest option and it doesn't require maintenance during [Telerik UI for Blazor version upgrades]({%slug upgrade-tutorial%}). However, you can use only the *Main* swatch of each theme and the *Ocean Blue* swatch of the *Default* theme.
+* [Load a CSS theme as a static asset from the `Telerik.UI.for.Blazor` NuGet package](#loading-themes-from-the-nuget-package). This is the easiest option and it doesn't require maintenance during [Telerik UI for Blazor version upgrades](slug://upgrade-tutorial). However, you can use only the *Main* swatch of each theme and the *Ocean Blue* swatch of the *Default* theme.
 * Load a CSS theme from a remote URL, for example, CDN. The dedicated <a href="https://www.telerik.com/design-system/docs/themes/kendo-themes/default/" target="_blank">documentation of each theme provides a list of swatches and their URLs</a>.
 * Load a CSS theme as a local file in the `wwwroot` folder in the Blazor app. This option is relevant to the following cases:
-    * When using [custom themes]({%slug themes-customize%}).
-    * When [creating]({%slug getting-started-vs-integration-new-project%}) or [converting]({%slug getting-started-vs-integration-convert-project%}) Telerik Blazor apps with the [Telerik UI for Blazor Visual Studio extension]({%slug getting-started-vs-integration-overview%}).
-    * When using themes from the Telerik UI for Blazor [MSI installer]({%slug installation/msi%}) or [ZIP archive]({%slug installation/zip%}). The CSS files are in the `swatches` folder.
-    * When using [LibMan]({%slug common-kb-telerik-themes-libman%}) or <a href="https://www.telerik.com/design-system/docs/themes/get-started/installation/" target="_blank">npm</a> to obtain a specific Telerik theme version. In this case, you can use all built-in theme swatches.
+    * When using [custom themes](slug://themes-customize).
+    * When [creating](slug://getting-started-vs-integration-new-project) or [converting](slug://getting-started-vs-integration-convert-project) Telerik Blazor apps with the [Telerik UI for Blazor Visual Studio extension](slug://getting-started-vs-integration-overview).
+    * When using themes from the Telerik UI for Blazor [MSI installer](slug://installation/msi) or [ZIP archive](slug://installation/zip). The CSS files are in the `swatches` folder.
+    * When using [LibMan](slug://common-kb-telerik-themes-libman) or <a href="https://www.telerik.com/design-system/docs/themes/get-started/installation/" target="_blank">npm</a> to obtain a specific Telerik theme version. In this case, you can use all built-in theme swatches.
 
 > The Blazor app must load only one Telerik theme file at a time. Upgrade the theme with every Telerik UI for Blazor version upgrade, unless you are loading the theme as a static NuGet asset.
 
@@ -73,7 +73,7 @@ There are three ways to load a Telerik theme, in terms of physical CSS file loca
 The easiest way to load a Telerik theme in a Blazor app is to reference a static asset from the NuGet package. The .NET SDK will copy the CSS file to the output folder during build automatically. Static assets provide the following benefits:
 
 * The application relies on available local resources, instead of third parties and remote URLs.
-* The theme URL does not change across component versions, which makes product updates easier. [Add a cache buster to avoid possible browser caching issues]({%slug common-kb-browser-cache-buster%}).
+* The theme URL does not change across component versions, which makes product updates easier. [Add a cache buster to avoid possible browser caching issues](slug://common-kb-browser-cache-buster).
 
 The `Telerik.UI.for.Blazor` NuGet package includes only the *Main* swatch of each theme and the *Ocean Blue* swatch of the *Default* theme. The code snippet below shows all available CSS files in the NuGet package and their correct URLs. To use another swatch, see the section [Using a Theme](#using-a-theme) above.
 
@@ -104,17 +104,17 @@ The `Telerik.UI.for.Blazor` NuGet package includes only the *Main* swatch of eac
 
 The Telerik themes are decoupled from the Telerik Blazor components, which leads to the following usage requirements:
 
-* When using a CSS theme as local file in `wwwroot`, [replace the file every time you change the Telerik UI for Blazor version]({%slug upgrade-tutorial%}). This includes apps [created with the Telerik Blazor Visual Studio extension without CDN support]({%slug getting-started-vs-integration-new-project%}#step-3-select-theme).
+* When using a CSS theme as local file in `wwwroot`, [replace the file every time you change the Telerik UI for Blazor version](slug://upgrade-tutorial). This includes apps [created with the Telerik Blazor Visual Studio extension without CDN support](slug://getting-started-vs-integration-new-project#step-3-select-theme).
 * When loading <a href="https://www.telerik.com/design-system/docs/themes/kendo-themes/default/swatches/" target="_blank">theme swatches</a> from a CDN, make sure that the theme version is compatible with the Telerik UI for Blazor version. Our [release notes](https://www.telerik.com/support/whats-new/blazor-ui/release-history) provide theme compatibility information for each components version. You can also use a <a href="https://www.telerik.com/design-system/docs/themes/get-started/changelog/" target="_blank">newer minor theme version</a>, which doesn't contain breaking changes. In other words, the latest major theme version may be still incompatible with the latest version of Telerik UI for Blazor.
 
 
 ## Next Steps
 
-* [Modify a built-in theme or create a custom theme]({%slug themes-customize%})
+* [Modify a built-in theme or create a custom theme](slug://themes-customize)
 * [Explore the Telerik and Kendo UI Kits for Figma](https://www.telerik.com/design-system/docs/resources/figma-ui-kits/)
 
 ## See Also
 
-* [Change the Theme at Runtime]({%slug common-kb-change-theme-runtime%})
+* [Change the Theme at Runtime](slug://common-kb-change-theme-runtime)
 * <a href="https://www.telerik.com/design-system/docs/themes/kendo-themes/default/swatches/#ocean-blue-accessibility-swatch" target="_blank">Default Ocean Blue Accessibility Swatch</a>
 * [Live UI for Blazor Demos](https://demos.telerik.com/blazor-ui)
diff --git a/styling-and-themes/themebuilder.md b/styling-and-themes/themebuilder.md
index 759f485bf4..b9f456ce60 100644
--- a/styling-and-themes/themebuilder.md
+++ b/styling-and-themes/themebuilder.md
@@ -10,7 +10,7 @@ position: 20
 
 # Progress ThemeBuilder
 
-[ThemeBuilder](https://themebuilderapp.telerik.com) is a SaaS tool that enables you to create custom themes and instantly preview how they affect the appearance of the components. The tool generates a [CSS file that you can use in your Blazor app]({%slug themes-customize%}#loading-custom-themes) instead of a built-in theme.
+[ThemeBuilder](https://themebuilderapp.telerik.com) is a SaaS tool that enables you to create custom themes and instantly preview how they affect the appearance of the components. The tool generates a [CSS file that you can use in your Blazor app](slug://themes-customize#loading-custom-themes) instead of a built-in theme.
 
 ## Key Procedures
 
diff --git a/system-requirements.md b/system-requirements.md
index a191b58f58..ccecb7b2b4 100644
--- a/system-requirements.md
+++ b/system-requirements.md
@@ -80,4 +80,4 @@ Use the following browsers to access web applications with Telerik UI for Blazor
 
 ## See Also
 
-* [Old Versions Support Policy]({%slug old_versions_support_policy%})
+* [Old Versions Support Policy](slug://old_versions_support_policy)
diff --git a/testing/unit-testing-with-bunit.md b/testing/unit-testing-with-bunit.md
index 976775c8a3..ede1347936 100644
--- a/testing/unit-testing-with-bunit.md
+++ b/testing/unit-testing-with-bunit.md
@@ -103,7 +103,7 @@ Considering the above-listed JS limitation, you may experience some issues when
 | --- | --- |
 | Issue | In test environment, `OnRead` is not raised after invoking `Rebind`. |
 | Cause | When `Rebind` is called, the Grid shows a loader. This loader is invoked with JS Interop, so the test fails silently. |
-| Workaround | Disable the [built-in loader]({%slug grid-loading%}). |
+| Workaround | Disable the [built-in loader](slug://grid-loading). |
 
 ## Resources
 
diff --git a/troubleshooting/csp.md b/troubleshooting/csp.md
index 5f2e1bc162..f99ff12eb3 100644
--- a/troubleshooting/csp.md
+++ b/troubleshooting/csp.md
@@ -27,17 +27,17 @@ In general, a strict CSP can disable web app features, such as:
 Telerik UI for Blazor components need the following exceptions to strict CSP. Some of them depend on the product version or product usage.
 
 * Allow inline styles (`'unsafe-inline'`) to use component parameters such as `Width`, `Height`, `RowHeight`, `ItemHeight`, `Top`, `Left`, etc. In addition, some components rely on inline styles for their rich functionality and UX.
-* Allow data URIs (`data:`) for images that are embedded in the [CSS themes]({%slug themes-overview%}). These images are used for styled checkboxes and radio buttons, Slider ticks, and others.
-* (optional) Allow `https://blazor.cdn.telerik.com` as a source when using [the Telerik CDN]({%slug common-features-cdn%}) for styles or scripts.
+* Allow data URIs (`data:`) for images that are embedded in the [CSS themes](slug://themes-overview). These images are used for styled checkboxes and radio buttons, Slider ticks, and others.
+* (optional) Allow `https://blazor.cdn.telerik.com` as a source when using [the Telerik CDN](slug://common-features-cdn) for styles or scripts.
 * (optional) Allow `https://unpkg.com` as a source when using it as a <a href="https://www.telerik.com/design-system/docs/themes/get-started/introduction/#available-themes" target="_blank">CDN for styles</a>.
 
 ### Legacy Settings
 
 The following items concern older product versions:
 
-* *(for versions 6.x)* Allow script evaluation (`'unsafe-eval'`), which is required by the [Spreadsheet]({%slug spreadsheet-overview%}) for cell validation and formula compilation. If you don't use the Spreadsheet component in your Blazor app, you can [build a CSP compliant `telerik-blazor.js` file without the Spreadsheet]({%slug common-kb-remove-components-from-telerik-blazor-js%}).
-* *(up to version 4.6.0)* Allow `data:` URIs for `font-src` to use [font icons]({%slug common-features-icons%}). Later versions use a separate file for the `WebComponentsIcons` icon font. This font file is referenced by the [font icon stylesheet]({%slug common-features-icons%}#font-icon-stylesheet).
-* *(up to version 4.4.0)* Allow `unsafe-eval` to use [Chart label templates]({%slug components/chart/label-template-format%}) and [Map templates]({%slug components/map/overview%}#content-security-policy). These templates used to rely on `eval()`. Starting with version 4.5.0, the Chart and Map templates support a different template mechanism, which doesn't require `unsafe-eval`.
+* *(for versions 6.x)* Allow script evaluation (`'unsafe-eval'`), which is required by the [Spreadsheet](slug://spreadsheet-overview) for cell validation and formula compilation. If you don't use the Spreadsheet component in your Blazor app, you can [build a CSP compliant `telerik-blazor.js` file without the Spreadsheet](slug://common-kb-remove-components-from-telerik-blazor-js).
+* *(up to version 4.6.0)* Allow `data:` URIs for `font-src` to use [font icons](slug://common-features-icons). Later versions use a separate file for the `WebComponentsIcons` icon font. This font file is referenced by the [font icon stylesheet](slug://common-features-icons#font-icon-stylesheet).
+* *(up to version 4.4.0)* Allow `unsafe-eval` to use [Chart label templates](slug://components/chart/label-template-format) and [Map templates](slug://components/map/overview#content-security-policy). These templates used to rely on `eval()`. Starting with version 4.5.0, the Chart and Map templates support a different template mechanism, which doesn't require `unsafe-eval`.
 
 ## Examples
 
diff --git a/troubleshooting/general-issues.md b/troubleshooting/general-issues.md
index deeaf4762c..5ffdac9fc9 100644
--- a/troubleshooting/general-issues.md
+++ b/troubleshooting/general-issues.md
@@ -12,25 +12,25 @@ position: 1
 
 This page provides solutions for common issues you may encounter while working with Telerik UI for Blazor components.
 
-* [TelerikRootComponent is missing]({%slug common-kb-component-requires-telerikrootcomponent%})
+* [TelerikRootComponent is missing](slug://common-kb-component-requires-telerikrootcomponent)
 * [Popups do not work](#popups-do-not-work)
 * [Wrong popup position](#wrong-popup-position)
 * [Unable to find package Telerik.Documents.SpreadsheetStreaming](#unable-to-find-package-telerik-documents-spreadsheetstreaming)
 * [Cannot provide a value for property 'Localizer'](#cannot-provide-a-value-for-property-localizer)
 * [Slow Performance](#slow-performance)
 * [Failed to find a valid digest in the 'integrity' attribute for resource ... with computed SHA-256 integrity ...](#failed-to-find-a-valid-digest-in-the-integrity-attribute-for-resource-with-computed-sha-256-integrity)
-* [JavaScript errors]({%slug troubleshooting-js-errors%})
-* [Issues after deployment]({%slug deployment-troubleshooting%})
-* [Content Security Policy]({%slug troubleshooting-csp%})
-* [NuGet feed troubleshooting]({%slug troubleshooting-nuget%})
-* [Upload troubleshooting]({%slug upload-troubleshooting%})
+* [JavaScript errors](slug://troubleshooting-js-errors)
+* [Issues after deployment](slug://deployment-troubleshooting)
+* [Content Security Policy](slug://troubleshooting-csp)
+* [NuGet feed troubleshooting](slug://troubleshooting-nuget)
+* [Upload troubleshooting](slug://upload-troubleshooting)
 
 
 ## Popups Do Not Work
 
 There are three common reasons for this
-* Missing [`<TelerikRootComponent>`]({%slug getting-started/what-you-need%}#telerikrootcomponent) from the app.
-* [Missing `telerik-blazor.js` file]({%slug troubleshooting-js-errors%}#telerikblazor-was-undefined)
+* Missing [`<TelerikRootComponent>`](slug://getting-started/what-you-need#telerikrootcomponent) from the app.
+* [Missing `telerik-blazor.js` file](slug://troubleshooting-js-errors#telerikblazor-was-undefined)
 * Special positioning on the `<app>` element or any other parent of the `TelerikRootComponent`.
 
 The `<app>` element is the topmost component that a developer can access in Blazor. This means that we cannot place our popups higher than that in the DOM. Thus, their position and visibility depend on the position of the `<app>` element matching the position of the `<body>` element.
@@ -56,7 +56,7 @@ app {
 
 The position of popups (Window, various dropdowns such as DropDownList, ComboBox, DatePicker) can be wrong or offset.
 
-The most common reason for such a problem is that the [`<TelerikRootComponent>`]({%slug rootcomponent-overview%}) does not match the `<body>` and the browser viewport - this is required because that component is the topmost element our components can access in order to render popups/dropdowns.
+The most common reason for such a problem is that the [`<TelerikRootComponent>`](slug://rootcomponent-overview) does not match the `<body>` and the browser viewport - this is required because that component is the topmost element our components can access in order to render popups/dropdowns.
 
 There are several common cases when such a mismatch occurs:
 
@@ -87,9 +87,9 @@ The most common reasons and solutions for seeing this error (being unable to res
 
 * An offline package source is being used that does not contain it. Make sure that you add the packages from both the `packages` and `dpl` folders to such a custom local feed.
 
-* There is an issue with connecting to our online feed. For example, a firewall, network downtime or wrong credentials are used. Check the [Troubleshooting NuGet Feed Issues]({%slug installation/nuget%}#troubleshooting) section of the documentation to see how to handle that.
+* There is an issue with connecting to our online feed. For example, a firewall, network downtime or wrong credentials are used. Check the [Troubleshooting NuGet Feed Issues](slug://installation/nuget#troubleshooting) section of the documentation to see how to handle that.
 
-* There is a mismatch between the versions available for restore and the referenced versions, while the Visual Studio "treat warnings as errors" setting is turned on. This can happen if one version is referenced, but another is available (for example, only certain versions are available in a custom local feed for the [Document Processing]({%slug dpl-in-blazor%}) packages, but the main package references an older version). In such cases, the tooling would usually resolve the newest version, but it will show a warning and VS can treat it as an error and not let you build. The solution is to check the version that is referenced by `Telerik.UI.for.Blazor` and ensure you can access that. Cleaning the solution, manually restoring the packages and re-building can also help.
+* There is a mismatch between the versions available for restore and the referenced versions, while the Visual Studio "treat warnings as errors" setting is turned on. This can happen if one version is referenced, but another is available (for example, only certain versions are available in a custom local feed for the [Document Processing](slug://dpl-in-blazor) packages, but the main package references an older version). In such cases, the tooling would usually resolve the newest version, but it will show a warning and VS can treat it as an error and not let you build. The solution is to check the version that is referenced by `Telerik.UI.for.Blazor` and ensure you can access that. Cleaning the solution, manually restoring the packages and re-building can also help.
  
 
 
@@ -101,9 +101,9 @@ If you get an error similar to this one:
 
 There can be two common causes for the problem:
 
-* The [Telerik services are not registered]({%slug getting-started/what-you-need%}#service) in the app, a line similar to `builder.Services.AddTelerikBlazor();` is missing.
+* The [Telerik services are not registered](slug://getting-started/what-you-need#service) in the app, a line similar to `builder.Services.AddTelerikBlazor();` is missing.
 
-* The application uses localization, or there is a code snippet that does (e.g., a grid with custom buttons that are localized, copied over from another place), but the current app does not provide the necessary project-specific service. You can read more about implementing one in the [Localization]({%slug globalization-localization%}) article.
+* The application uses localization, or there is a code snippet that does (e.g., a grid with custom buttons that are localized, copied over from another place), but the current app does not provide the necessary project-specific service. You can read more about implementing one in the [Localization](slug://globalization-localization) article.
 
 
 ## Slow Performance
@@ -119,9 +119,9 @@ When building a Blazor app, especially on the WebAssembly flavor, it is likely t
 
 There are also certain measures a web app should take to improve its performance in general. For example:
 
-* Enable [Paging]({%slug components/grid/features/paging%}) or [Virtual Scrolling]({%slug components/grid/virtual-scrolling%}) in the grid, and use a reasonable page size (for example, 10 to 20 or 40, as more than 20 items can rarely fit on a screen anyway). Also, if you have many columns, enable [Column Virtualization]({%slug grid-columns-virtual%}).
+* Enable [Paging](slug://components/grid/features/paging) or [Virtual Scrolling](slug://components/grid/virtual-scrolling) in the grid, and use a reasonable page size (for example, 10 to 20 or 40, as more than 20 items can rarely fit on a screen anyway). Also, if you have many columns, enable [Column Virtualization](slug://grid-columns-virtual).
 
-* Avoid loading all the data at once, only load and render relevant chunks. For example, use the [OnRead event of the Grid]({%slug components/grid/manual-operations%}) for the grid to perform all operations, and use [custom filtering in the ComboBox through its own OnRead event]({%slug components/combobox/events%}#onread). This also applies to creating lists of a lot of components in your own `foreach` loops - consider implementing your own virtual scrolling or use the [Telerik Pager]({%slug pager-overview%}) to help you separate them into smaller sets.
+* Avoid loading all the data at once, only load and render relevant chunks. For example, use the [OnRead event of the Grid](slug://components/grid/manual-operations) for the grid to perform all operations, and use [custom filtering in the ComboBox through its own OnRead event](slug://components/combobox/events#onread). This also applies to creating lists of a lot of components in your own `foreach` loops - consider implementing your own virtual scrolling or use the [Telerik Pager](slug://pager-overview) to help you separate them into smaller sets.
 
 * When using a series of your own components on the page, consider overriding their `ShouldRender` methods so they render only when needed. For example, an `EventCallback` whose handler is an `async Task` will render its own component, its parent and siblings twice, and you can reduce that to once.
 
@@ -131,10 +131,10 @@ There are also certain measures a web app should take to improve its performance
 
 ## Failed to find a valid digest in the 'integrity' attribute for resource ... with computed SHA-256 integrity ...
 
-The error is a general Blazor WebAssembly issue, which can result from the build process, publishing process, or browser cache. Our [knowledge base article about the `Failed to find a valid digest in the 'integrity' attribute` exception]({%slug common-kb-failed-to-find%}) contains discussions and documentation with possible solutions.
+The error is a general Blazor WebAssembly issue, which can result from the build process, publishing process, or browser cache. Our [knowledge base article about the `Failed to find a valid digest in the 'integrity' attribute` exception](slug://common-kb-failed-to-find) contains discussions and documentation with possible solutions.
 
 
 ## See Also
 
-* [JavaScript Errors Troubleshooting]({%slug troubleshooting-js-errors%})
-* [Content Security Policy]({%slug troubleshooting-csp%})
+* [JavaScript Errors Troubleshooting](slug://troubleshooting-js-errors)
+* [Content Security Policy](slug://troubleshooting-csp)
diff --git a/troubleshooting/js-errors.md b/troubleshooting/js-errors.md
index 5693ed9c35..aa5d7969fb 100644
--- a/troubleshooting/js-errors.md
+++ b/troubleshooting/js-errors.md
@@ -39,24 +39,24 @@ If you get such errors, the reason may be:
 
 You can check if this is the case by inspecting the Network tab of your browser console to see if `telerik-blazor.js` is served successfully. Some common causes for the missing JS Interop file are:
 
-* The application is missing references to the needed [assets]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files).
+* The application is missing references to the needed [assets](slug://getting-started/what-you-need#css-theme-and-javascript-files).
 
 * Network setup blocks access to the cloud, and thus, to our CDN. If this is the case, you have two options:
     * Discuss the case with your network administrators to have our CDN allowed.
-    * Use [static assets]({%slug getting-started/what-you-need%}#css-theme-and-javascript-files) from the app folder to avoid going to the cloud.
+    * Use [static assets](slug://getting-started/what-you-need#css-theme-and-javascript-files) from the app folder to avoid going to the cloud.
 
-* The application was upgraded from a trial to a commercial license, but the path to the file was not. See the [Upgrade from Trial to Commercial]({%slug upgrade-tutorial%}#upgrade-from-trial-to-commercial) section for details.
+* The application was upgraded from a trial to a commercial license, but the path to the file was not. See the [Upgrade from Trial to Commercial](slug://upgrade-tutorial#upgrade-from-trial-to-commercial) section for details.
 
 * Static assets are not enabled on the server project, or the hosting environment does not work well with them. You need to ensure that the static assets are available after the build and on the deployment server - they are in the local NuGet cache, under a path similar to `C:\Users\<theUser>\.nuget\packages\telerik.ui.for.blazor\<theVersion>\staticwebassets`. It is also possible that the hosting server does not support static assets or has issues with them and you may need to confirm this with the hosting provider or by testing with a simple package having a static asset to see whether it gets returned.
     * [Clearing the NuGet cache](https://docs.microsoft.com/en-us/nuget/consume-packages/managing-the-global-packages-and-cache-folders#clearing-local-folders), then running a `Clean` and `Rebuild` on the solution may fix the problem in case something went wrong with fetching the NuGet package. In case `Clean` does not clean up the `bin` and `obj` folders, you can also delete them manually before `Rebuild`.
 
-* A problem occurs during the deployment. See the [Deployment Troubleshooting]({%slug deployment-troubleshooting%}) article for more details.
+* A problem occurs during the deployment. See the [Deployment Troubleshooting](slug://deployment-troubleshooting) article for more details.
 
 ### Defer Attribute
 
 Sometimes, the JS Interop file is referenced correctly and returns successfully, but occasionally you get the error. This indicates a timing issue (for example, low machine performance or slow network) that causes the script to load and be parsed too late, after it is needed.
 
-One solution is to remove the `defer` attribute of the `<script>` tag that registers `telerik-blazor.js`. On the other hand, `defer` improves the performance of your app by loading the script asynchronously. That's why a better option is to [keep the `defer` attribute and start the client-side Blazor framework manually]({%slug getting-started/what-you-need%}#javascript-file).
+One solution is to remove the `defer` attribute of the `<script>` tag that registers `telerik-blazor.js`. On the other hand, `defer` improves the performance of your app by loading the script asynchronously. That's why a better option is to [keep the `defer` attribute and start the client-side Blazor framework manually](slug://getting-started/what-you-need#javascript-file).
 
 ### HTML Tags Order
 
@@ -75,7 +75,7 @@ You can get the error when the application is navigating from an interactive pag
 
 ### TypeScript
 
-By default, TypeScript results in compiled code that needs the `exports` object, and that is not available in Blazor by default, so it throws an error. A common workaround for that (defining an empty `exports` object) causes errors from the Telerik JS Interop files. You can read more about the errors and the solutions in the [TypeScript Exports error breaks Telerik Blazor]({%slug common-kb-typescript-exports%}) Knowledge Base article.
+By default, TypeScript results in compiled code that needs the `exports` object, and that is not available in Blazor by default, so it throws an error. A common workaround for that (defining an empty `exports` object) causes errors from the Telerik JS Interop files. You can read more about the errors and the solutions in the [TypeScript Exports error breaks Telerik Blazor](slug://common-kb-typescript-exports) Knowledge Base article.
 
 ## init[Component] was undefined
 
@@ -89,9 +89,9 @@ The error message may mention a component or feature initialization method, for
 
 Such an error means that the `telerik-blazor.js` script file version does not match the NuGet package version. As a result, the script does not include all components, features or correct method names.
 
-If you use our CDN to load the script file, make sure the file URL matches the package version. If you load the script as a local file from the `wwwroot` folder, then replace the file. See the [Upgrade Process]({%slug upgrade-tutorial%}#upgrade-process) article for details.
+If you use our CDN to load the script file, make sure the file URL matches the package version. If you load the script as a local file from the `wwwroot` folder, then replace the file. See the [Upgrade Process](slug://upgrade-tutorial#upgrade-process) article for details.
 
-Another common reason is browser caching, if the file comes from the static NuGet assets or a local folder. Clear the browser cache or "hard refresh" the page to fix that. Consider a [cache buster for the Telerik CSS and JavaScript files]({%slug common-kb-browser-cache-buster%}).
+Another common reason is browser caching, if the file comes from the static NuGet assets or a local folder. Clear the browser cache or "hard refresh" the page to fix that. Consider a [cache buster for the Telerik CSS and JavaScript files](slug://common-kb-browser-cache-buster).
 
 ## Cannot read properties of null (reading 'addEventListener')
 
@@ -99,7 +99,7 @@ The error message may also mention `removeEventListener` instead of `addEventLis
 
 There are two known reasons for this JavaScript error.
 
-One is related to *UI for Blazor update in WebAssembly (WASM) projects*. See the article [`TypeError: Cannot read properties of null (reading 'addEventListener')`]({%slug common-kb-cannot-read-properties-of-null-reading-addeventlistener%}).
+One is related to *UI for Blazor update in WebAssembly (WASM) projects*. See the article [`TypeError: Cannot read properties of null (reading 'addEventListener')`](slug://common-kb-cannot-read-properties-of-null-reading-addeventlistener).
 
 Another possible cause is a *race condition* during fast multiple recreations of components, or fast navigation. If this happens, our JavaScript code may try to access a DOM element that no longer exists. The solution is to avoid fast duplicate UI refresh, for example:
 
@@ -115,7 +115,7 @@ This section applies to JavaScript errors similar to `Unexpected token` or `Inva
 * `?.` ([optional chaining](https://en.wikipedia.org/wiki/ECMAScript_version_history#ES2020))
 
 Such errors indicate an outdated browser version, WebView, or emulator, which doesn't support recent ECMAScript standards.
-[Microsoft Blazor supports only current browsers](https://learn.microsoft.com/en-us/aspnet/core/blazor/supported-platforms). The [browser support policy for Telerik UI for Blazor]({%slug system-requirements%}) is the same.
+[Microsoft Blazor supports only current browsers](https://learn.microsoft.com/en-us/aspnet/core/blazor/supported-platforms). The [browser support policy for Telerik UI for Blazor](slug://system-requirements) is the same.
 
 A syntax error will cause the browser to discard the whole `telerik-blazor.js` file, which will also lead to error `Could not find 'TelerikBlazor.initMediaQuery' ('TelerikBlazor' was undefined)`.
 
@@ -123,16 +123,16 @@ A syntax error will cause the browser to discard the whole `telerik-blazor.js` f
 
 The full exception message is `System.Collections.Generic.KeyNotFoundException: The given key 'inputElementValue' was not present in the dictionary.`
 
-This error indicates that [the app is using an old or wrong version of the `telerik-blazor.js` file]({%slug common-kb-keynotfoundexception-inputelementvalue%}), for example, after a component version upgrade.
+This error indicates that [the app is using an old or wrong version of the `telerik-blazor.js` file](slug://common-kb-keynotfoundexception-inputelementvalue), for example, after a component version upgrade.
 
 ## Object doesn't support property or method 'assign'
 
-Under IE, you may get errors similar to `Object doesn't support property or method 'assign'` or errors that relate other modern JS features that are not supported under IE. The reason is that we use modern code that may not work under IE - it is not one of the [browsers we support]({%slug system-requirements%}#browser-support), and WebAssembly does not work on it anyway, so modern Blazor apps won't run on IE regardless.
+Under IE, you may get errors similar to `Object doesn't support property or method 'assign'` or errors that relate other modern JS features that are not supported under IE. The reason is that we use modern code that may not work under IE - it is not one of the [browsers we support](slug://system-requirements#browser-support), and WebAssembly does not work on it anyway, so modern Blazor apps won't run on IE regardless.
 
 ## Maximum call stack size exceeded
 
-The error indicates that a [.NET 8 app is using a `telerik-blazor.js` file that is for version `4.5.0` or earlier]({%slug common-kb-maximum-call-stack-exceeded%}). If the Telerik UI for Blazor package version is up-to-date, a possible cause for the error is browser cache and you may need to [add a cache buster for the Telerik CSS and JavaScript files]({%slug common-kb-browser-cache-buster%}).
+The error indicates that a [.NET 8 app is using a `telerik-blazor.js` file that is for version `4.5.0` or earlier](slug://common-kb-maximum-call-stack-exceeded). If the Telerik UI for Blazor package version is up-to-date, a possible cause for the error is browser cache and you may need to [add a cache buster for the Telerik CSS and JavaScript files](slug://common-kb-browser-cache-buster).
 
 ## See Also
 
-* [Prevent browser caching during version upgrades]({%slug common-kb-browser-cache-buster%})
+* [Prevent browser caching during version upgrades](slug://common-kb-browser-cache-buster)
diff --git a/troubleshooting/nuget-feed.md b/troubleshooting/nuget-feed.md
index 5f5bbbc39e..cc0ad22199 100644
--- a/troubleshooting/nuget-feed.md
+++ b/troubleshooting/nuget-feed.md
@@ -10,7 +10,7 @@ position: 7
 
 # Telerik NuGet Feed Troubleshooting
 
-This article summarizes the issues that may occur when you work with the Telerik UI for Blazor library and the online [Telerik NuGet feed]({%slug installation/nuget%}), and their solutions.
+This article summarizes the issues that may occur when you work with the Telerik UI for Blazor library and the online [Telerik NuGet feed](slug://installation/nuget), and their solutions.
 
 Regardless of the cause for the issue, it is recommended that you start from the section on the commonly occurring issues.
 
@@ -67,14 +67,14 @@ If you suspect that your saved credentials are wrong, use the following steps to
 * No provided credentials
 * Incorrect password
 * [Correct password with unescaped special characters](#special-characters-in-the-password)
-* Using an invalidated (removed) [Telerik NuGet API key]({%slug installation/nuget%}#use-nuget-api-key), which no longer exists in <a href="https://www.telerik.com/account/downloads/nuget-keys" target="_blank">your Telerik account</a>.
+* Using an invalidated (removed) [Telerik NuGet API key](slug://installation/nuget#use-nuget-api-key), which no longer exists in <a href="https://www.telerik.com/account/downloads/nuget-keys" target="_blank">your Telerik account</a>.
 * Using a valid Telerik NuGet API key with the wrong username. It must be `api-key`.
 
 An easy way to verify your credentials is to [access the Telerik NuGet server directly in the web browser](#tips-for-handling-common-nuget-issues). Then, depending on your setup, check or update your credentials in:
 
 * The applicable `NuGet.Config` file. There may be <a href="https://learn.microsoft.com/en-us/nuget/consume-packages/configuring-nuget-behavior" target="_blank">multiple such files on the device</a>.
 * [Windows Credential Manager](#removing-saved-credentials)
-* In a [CI/CD workflow]({%slug deployment-nuget%}#using-net-cli-commands), which [obtains the credentials from a secret]({%slug deployment-nuget%}#storing-nuget-keys).
+* In a [CI/CD workflow](slug://deployment-nuget#using-net-cli-commands), which [obtains the credentials from a secret](slug://deployment-nuget#storing-nuget-keys).
 
 ### Special Characters in the Password
 
@@ -100,14 +100,14 @@ If the error occurs for the `Telerik.UI.for.Blazor` package, it may look like th
 
 `error NU1101: Unable to find package Telerik.UI.for.Blazor. No packages exist with this id in source(s): nuget.org`
 
-Such an error implies that the [Telerik NuGet source]({%slug installation/nuget%}) is not added or enabled. The possible causes are:
+Such an error implies that the [Telerik NuGet source](slug://installation/nuget) is not added or enabled. The possible causes are:
 
 * Missing Telerik NuGet source configuration in the `NuGet.Config` file.
 * The correct `NuGet.Config` file is not used, because it is missing or misplaced.
 
-If the error occurs in a Docker scenario, the solution is to copy the `NuGet.Config` file (or configure the NuGet source) explicitly during the Docker image build. You can also [reference the `NuGet.Config` file path explicitly in the `dotnet restore` command](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-restore#options). For more information, see the [Docker section]({%slug deployment-ci-cd-build-pc%}#docker) in the deployment documentation and the [private NuGet feeds in Docker](https://www.telerik.com/forums/can-the-telerik-blazor-and-asp-net-tools-be-used-in-a-docker-container) forum thread.
+If the error occurs in a Docker scenario, the solution is to copy the `NuGet.Config` file (or configure the NuGet source) explicitly during the Docker image build. You can also [reference the `NuGet.Config` file path explicitly in the `dotnet restore` command](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-restore#options). For more information, see the [Docker section](slug://deployment-ci-cd-build-pc#docker) in the deployment documentation and the [private NuGet feeds in Docker](https://www.telerik.com/forums/can-the-telerik-blazor-and-asp-net-tools-be-used-in-a-docker-container) forum thread.
 
-If the error occurs for the [`Telerik.FontIcons` and `Telerik.SvgIcons` icon packages]({%slug common-features-icons%}), the NuGet client is not using `nuget.org` as a NuGet source. The possible causes are:
+If the error occurs for the [`Telerik.FontIcons` and `Telerik.SvgIcons` icon packages](slug://common-features-icons), the NuGet client is not using `nuget.org` as a NuGet source. The possible causes are:
 
 * The `nuget.org` source is disabled.
 * There is [`packageSourceMapping`](https://learn.microsoft.com/en-us/nuget/consume-packages/package-source-mapping), which forces the NuGet client to search for the icon packages in the `nuget.telerik.com` source. However, the icon packages are published on `nuget.org`.
@@ -138,19 +138,19 @@ Incorrect package source mapping can result in errors similar to:
 
 `NU1100 Unable to resolve 'Telerik... (>= ...)' for 'net...'. PackageSourceMapping is enabled, the following source(s) were not considered: ...`
 
-The solution is to check the **Package Source Mapping** settings in Visual Studio, or [review all applicable `NuGet.Config` files](https://learn.microsoft.com/en-us/nuget/consume-packages/configuring-nuget-behavior#config-file-locations-and-uses) on the machine. Then, [adjust the package source mapping configuration]({%slug installation/nuget%}#package-source-mapping).
+The solution is to check the **Package Source Mapping** settings in Visual Studio, or [review all applicable `NuGet.Config` files](https://learn.microsoft.com/en-us/nuget/consume-packages/configuring-nuget-behavior#config-file-locations-and-uses) on the machine. Then, [adjust the package source mapping configuration](slug://installation/nuget#package-source-mapping).
 
 ## Failed to Retrieve Information from Remote Source
 
-An attempt to use the [obsolete Telerik NuGet v2 feed]({%slug installation/nuget%}#obsolete-telerik-nuget-url) after November 2024 will result in an error:
+An attempt to use the [obsolete Telerik NuGet v2 feed](slug://installation/nuget#obsolete-telerik-nuget-url) after November 2024 will result in an error:
 
 `Failed to retrieve information about 'Telerik.UI.for.Blazor' from remote source 'https://nuget.telerik.com/nuget/FindPackagesById()?id='Telerik.UI.for.Blazor'&semVerLevel=2.0.0'.`
 
-The solution is to [use the Telerik NuGet v3 feed]({%slug installation/nuget%}).
+The solution is to [use the Telerik NuGet v3 feed](slug://installation/nuget).
 
 Another possible reason for the same error is an incorrect NuGet feed URL.
 
 ## See Also
 
-* [Setting Up the Online Private Telerik NuGet Feed]({%slug installation/nuget%})
-* [CI, CD, Build Server]({%slug deployment-ci-cd-build-pc%})
+* [Setting Up the Online Private Telerik NuGet Feed](slug://installation/nuget)
+* [CI, CD, Build Server](slug://deployment-ci-cd-build-pc)
diff --git a/upgrade/breaking-changes/2-0-0.md b/upgrade/breaking-changes/2-0-0.md
index afa72d5800..a34561f711 100644
--- a/upgrade/breaking-changes/2-0-0.md
+++ b/upgrade/breaking-changes/2-0-0.md
@@ -68,7 +68,7 @@ This is a list of the components that had methods removed and the new approach o
 
 ### Calendar
 
-* The `Navigate()` method is no longer available in favor of two-way binding for the `View` and `Date` parameters. An example is available in the [Navigate]({%slug components/calendar/navigation%}#programmatic-navigation) article.
+* The `Navigate()` method is no longer available in favor of two-way binding for the `View` and `Date` parameters. An example is available in the [Navigate](slug://components/calendar/navigation#programmatic-navigation) article.
 * The `View` and `Date` parameters should be used with two-way binding, especially when you handle `ValueChanged`. Otherwise, state changes (like selection) may revert them to the values set in the markup and move the user unexpectedly.
 
 ### DatePicker
diff --git a/upgrade/breaking-changes/3-0-0.md b/upgrade/breaking-changes/3-0-0.md
index bf915af693..1aebfebf36 100644
--- a/upgrade/breaking-changes/3-0-0.md
+++ b/upgrade/breaking-changes/3-0-0.md
@@ -21,10 +21,10 @@ Note the following changes when using manual data operations:
 - Do not set the `Data` attribute. Instead, set `args.Data` (`IEnumerable`) in the `OnRead` handler.
 - There is no need to cast the items returned by `ToDataSourceResult()` when setting `args.Data`.
 - Do not set `TotalCount`. This attribute is now removed in favor of the `args.Total` event argument (`int`) in the `OnRead` handler.
-- Aggregates over all the data are now supported via `args.AggregateResults` (`IEnumerable<AggregateResult>`). The `AggregateResults` event argument is exposed only for components that support aggregates. [If the Grid is bound to `DataTable`, a workaround is still necessary]({%slug grid-kb-aggregates-and-datatable%}).
-- If you have cached the `DataSourceRequest` object in order to set `Data` later, the new approach is to [reset the Grid state, so that `OnRead` is called again]({%slug grid-refresh-data%}#call-onread).
+- Aggregates over all the data are now supported via `args.AggregateResults` (`IEnumerable<AggregateResult>`). The `AggregateResults` event argument is exposed only for components that support aggregates. [If the Grid is bound to `DataTable`, a workaround is still necessary](slug://grid-kb-aggregates-and-datatable).
+- If you have cached the `DataSourceRequest` object in order to set `Data` later, the new approach is to [reset the Grid state, so that `OnRead` is called again](slug://grid-refresh-data#call-onread).
 - Binding to `ObservableData` via `OnRead` is no longer supported.
-- UI for Blazor **3.0.1** introduced a `Rebind` method that triggers `OnRead` for on-demand data updates. Here is a [rebind example for the Grid]({%slug grid-refresh-data%}#rebind-method) and a similar one [for the ComboBox]({%slug combobox-refresh-data%}#rebind-method).
+- UI for Blazor **3.0.1** introduced a `Rebind` method that triggers `OnRead` for on-demand data updates. Here is a [rebind example for the Grid](slug://grid-refresh-data#rebind-method) and a similar one [for the ComboBox](slug://combobox-refresh-data#rebind-method).
 
 >caption OnRead Usage in UI for Blazor up to version 2.30 and after version 3.0
 
@@ -159,15 +159,15 @@ protected void OnGridRead(GridReadEventArgs args)
 ### Other Common Changes
 
 - [`ToODataString` extension method](/blazor-ui/api/Telerik.Blazor.Extensions.DataSourceExtensions) is moved to the [`Telerik.Blazor.Extensions` namespace](/blazor-ui/api/Telerik.Blazor.Extensions). The `Telerik.Blazor.ExtensionMethods` namespace is removed in favor of `Telerik.Blazor.Extensions`.
-- [`Telerik.Blazor.IconName` class]({%slug common-kb-migration-from-iconname%}) ([obsolete since version 2.0]({%slug changes-in-2-0-0%})) is removed. Use the icon names from the [Built-in Icons documentation]({%slug common-features-icons%}#icons-list).
+- [`Telerik.Blazor.IconName` class](slug://common-kb-migration-from-iconname) ([obsolete since version 2.0](slug://changes-in-2-0-0)) is removed. Use the icon names from the [Built-in Icons documentation](slug://common-features-icons#icons-list).
 
 ## Component Changes
 
 ### Grid
 
 - Changed `GridEditMode` enum default value from `Inline` to `None`. Grid editing should be explicitly enabled for the `Add` and `Edit` command buttons to work.
-- Changed the popup edit form orientation to vertical. This is now consistent will the default [`TelerikForm` `Orientation`]({%slug form-orientation%}) and the popup edit forms in all components. [UI for Blazor 3.1](https://www.telerik.com/support/whats-new/blazor-ui/roadmap) will provide popup configuration settings.
-- Use `IFilterDescriptor` to work with the [Grid state]({%slug grid-state%}), instead of `FilterDescriptorBase`.
+- Changed the popup edit form orientation to vertical. This is now consistent will the default [`TelerikForm` `Orientation`](slug://form-orientation) and the popup edit forms in all components. [UI for Blazor 3.1](https://www.telerik.com/support/whats-new/blazor-ui/roadmap) will provide popup configuration settings.
+- Use `IFilterDescriptor` to work with the [Grid state](slug://grid-state), instead of `FilterDescriptorBase`.
 - Removed method `ExportToExcel()` (`MemoryStream`) in favor of `ExportToExcelAsync()` (`Task<MemoryStream> `).
 - Removed method `ExportToCsv()` (`MemoryStream`) in favor of `ExportToCsvAsync()` (`Task<MemoryStream> `).
 
@@ -221,7 +221,7 @@ async Task ExportToCsv()
 </tbody>
 </table>
 
-- Removed `ExpandedRows` (`ICollection<int>`) in favor of `ExpandedItems` (`ICollection<TItem>`) in the [GridState](/blazor-ui/api/Telerik.Blazor.Components.GridState-1). `ExpandedItems` expects items, instead of item indexes. Also, the `PropertyName` argument in the [`OnStateChanged` event]({%slug grid-state%}#events) changes from `"ExpandedRows"` to `"ExpandedItems"` in hierarchy scenarios.
+- Removed `ExpandedRows` (`ICollection<int>`) in favor of `ExpandedItems` (`ICollection<TItem>`) in the [GridState](/blazor-ui/api/Telerik.Blazor.Components.GridState-1). `ExpandedItems` expects items, instead of item indexes. Also, the `PropertyName` argument in the [`OnStateChanged` event](slug://grid-state#events) changes from `"ExpandedRows"` to `"ExpandedItems"` in hierarchy scenarios.
 
 >caption Expand Grid rows in UI for Blazor up to version 2.30 and after version 3.0
 
@@ -268,7 +268,7 @@ async Task OnGridStateInit(GridStateEventArgs<GridModel> args)
 
 ### Other Components
 
-- **Button** - removed `Primary` parameter in favor of [`ThemeColor`]({%slug components/button/overview%}) of type `string`. There is a new static class `Telerik.Blazor.ThemeConstants.Button.ThemeColor` with a predefined set of theme colors. To get the old primary Button styling, set `ThemeColor="@ThemeConstants.Button.ThemeColor.Primary"`.
+- **Button** - removed `Primary` parameter in favor of [`ThemeColor`](slug://components/button/overview) of type `string`. There is a new static class `Telerik.Blazor.ThemeConstants.Button.ThemeColor` with a predefined set of theme colors. To get the old primary Button styling, set `ThemeColor="@ThemeConstants.Button.ThemeColor.Primary"`.
 
 >caption Primary Button style in UI for Blazor up to version 2.30 and after version 3.0
 
@@ -302,10 +302,10 @@ async Task OnGridStateInit(GridStateEventArgs<GridModel> args)
     </tbody>
 </table>
 
-- **DateInput** – removed `ParsingErrorMessage` (obsolete since version 2.8) in favor of `DateInput_ParsingErrorMessage` [localization string]({%slug globalization-localization%}).
+- **DateInput** – removed `ParsingErrorMessage` (obsolete since version 2.8) in favor of `DateInput_ParsingErrorMessage` [localization string](slug://globalization-localization).
 
-- **Loader**, **LoaderContainer** - changed [`Size` parameter]({%slug loader-appearance%}#size) type from `LoaderSize` enum to `string` (example below). The default value of `Size` is `ThemeConstants.Loader.Size.Medium`. There is a new static class `Telerik.Blazor.ThemeConstants.Loader.Size` with a predefined set of size properties.
-- **Notification**, **Loader**, **LoaderContainer** - changed [`ThemeColor` parameter]({%slug loader-appearance%}#themecolor) type from `ThemeColors` enum to `string`. The default value of `ThemeColor` is `ThemeConstants.Loader.ThemeColor.Primary`. There is a new static class `Telerik.Blazor.ThemeConstants.Loader.ThemeColor` with a predefined set of properties.
+- **Loader**, **LoaderContainer** - changed [`Size` parameter](slug://loader-appearance#size) type from `LoaderSize` enum to `string` (example below). The default value of `Size` is `ThemeConstants.Loader.Size.Medium`. There is a new static class `Telerik.Blazor.ThemeConstants.Loader.Size` with a predefined set of size properties.
+- **Notification**, **Loader**, **LoaderContainer** - changed [`ThemeColor` parameter](slug://loader-appearance#themecolor) type from `ThemeColors` enum to `string`. The default value of `ThemeColor` is `ThemeConstants.Loader.ThemeColor.Primary`. There is a new static class `Telerik.Blazor.ThemeConstants.Loader.ThemeColor` with a predefined set of properties.
 
 >caption Loader and LoaderContainer in UI for Blazor up to version 2.30 and after version 3.0
 
@@ -352,7 +352,7 @@ async Task OnGridStateInit(GridStateEventArgs<GridModel> args)
     </tbody>
 </table>
 
-- **TextBox**, **MaskedTextBox**, **TextArea** - `Label` parameter is removed. UI for Blazor **3.1.0** features a standalone [FloatingLabel component]({%slug floatinglabel-overview%}). For UI for Blazor **3.0.0** and **3.0.1**, check the following [KB that shows how to add a label]({%slug inputs-kb-floating-label %}).
+- **TextBox**, **MaskedTextBox**, **TextArea** - `Label` parameter is removed. UI for Blazor **3.1.0** features a standalone [FloatingLabel component](slug://floatinglabel-overview). For UI for Blazor **3.0.0** and **3.0.1**, check the following [KB that shows how to add a label](slug://inputs-kb-floating-label ).
 
 >caption TextBox Label in UI for Blazor up to version 2.30 and after version 3.0
 
@@ -469,7 +469,7 @@ async Task OnGridStateInit(GridStateEventArgs<GridModel> args)
 </table>
 
 - **TreeList** - changed `TreeListEditMode` enum default value from `Inline` to `None`. TreeList editing should be explicitly enabled for the `Add` and `Edit` command buttons to work.
-- **TreeList** - changed the popup edit form orientation to vertical. This is now consistent will the default [`TelerikForm` `Orientation`]({%slug form-orientation%}) and the popup edit forms of all components. [UI for Blazor 3.1](https://www.telerik.com/support/whats-new/blazor-ui/roadmap) will provide popup configuration settings.
+- **TreeList** - changed the popup edit form orientation to vertical. This is now consistent will the default [`TelerikForm` `Orientation`](slug://form-orientation) and the popup edit forms of all components. [UI for Blazor 3.1](https://www.telerik.com/support/whats-new/blazor-ui/roadmap) will provide popup configuration settings.
 
 - **TreeView** - removed `ExpandedField` parameter in favor of `ExpandedItems` (`IEnumerable<object>`). The expanded state of TreeView items will no longer depend on a model property. `ExpandedItems` supports two-way binding.
 
@@ -548,14 +548,14 @@ public class TreeItem
 
 We are making our API naming more consistent.
 
-- **Drawer** - `Content` RenderFragment is renamed to [`DrawerContent`]({%slug drawer-overview%})
-- **Drawer** - `IsSeparatorField` parameter (obsolete since version 2.27) is removed in favor of [`SeparatorField`]({%slug drawer-data-binding%})
+- **Drawer** - `Content` RenderFragment is renamed to [`DrawerContent`](slug://drawer-overview)
+- **Drawer** - `IsSeparatorField` parameter (obsolete since version 2.27) is removed in favor of [`SeparatorField`](slug://drawer-data-binding)
 - **Editor** - `UpdateInterval` parameter is renamed to `DebounceDelay`
 - **Stepper** - `IsCanceled` property in `StepperStepChangeEventArgs` (obsolete since version 2.26) is removed in favor of `IsCancelled`
 
 ## Rendering and Themes
 
->important The [HTML rendering and CSS classes have been updated for multiple components](https://www.telerik.com/blogs/improvements-coming-telerik-kendo-ui-themes-2022), including Buttons, Textbox components, Dropdown components, Date/Time Pickers, Checkbox, Switch. [Recreate any custom themes]({%slug themes-customize%}). 
+>important The [HTML rendering and CSS classes have been updated for multiple components](https://www.telerik.com/blogs/improvements-coming-telerik-kendo-ui-themes-2022), including Buttons, Textbox components, Dropdown components, Date/Time Pickers, Checkbox, Switch. [Recreate any custom themes](slug://themes-customize). 
 
 ### CSS Classes for State
 
diff --git a/upgrade/breaking-changes/4-0-0.md b/upgrade/breaking-changes/4-0-0.md
index 87de2828a3..126f5c2a5e 100644
--- a/upgrade/breaking-changes/4-0-0.md
+++ b/upgrade/breaking-changes/4-0-0.md
@@ -14,17 +14,17 @@ This section applies to changes to multiple components.
 
 ## Icons
 
-Some [built-in icons]({%slug common-features-icons%}#icons-list) have been renamed. See the full list of changes in article [New Icon Names in Telerik UI for Blazor 4.0]({%slug icon-kb-new-names%}).
+Some [built-in icons](slug://common-features-icons#icons-list) have been renamed. See the full list of changes in article [New Icon Names in Telerik UI for Blazor 4.0](slug://icon-kb-new-names).
 
 ### Icon
 
-The `Icon` parameter type changes from `string` to `object` to facilitate the addition of [Telerik Font and Svg Icons]({%slug common-features-icons%}).
+The `Icon` parameter type changes from `string` to `object` to facilitate the addition of [Telerik Font and Svg Icons](slug://common-features-icons).
 
-To use built-in Telerik icons, [register the new icon namespaces]({%slug common-features-icons%}#how-icons-work) - `Telerik.FontIcons` and/or `Telerik.SvgIcons`.
+To use built-in Telerik icons, [register the new icon namespaces](slug://common-features-icons#how-icons-work) - `Telerik.FontIcons` and/or `Telerik.SvgIcons`.
 
 To define custom icon classes inline, use `Icon="@( "my-icon-class" )"`.
 
-To use Telerik font icons with UI for Blazor 4.6.0 and above, [register `font-icons.css`]({%slug common-features-icons%}#font-icon-stylesheet).
+To use Telerik font icons with UI for Blazor 4.6.0 and above, [register `font-icons.css`](slug://common-features-icons#font-icon-stylesheet).
 
 <table>
     <thead><tr>
@@ -66,19 +66,19 @@ Removed the `ImageUrl` parameter, use the [Icon](#icon) parameter instead.
 
 List of affected components:
 
-* [Breadcrumb]({%slug breadcrumb-overview%})
-* [Button]({%slug components/button/overview%})
-* [ButtonGroup]({%slug buttongroup-overview%})
-* [ColorPicker]({%slug colorpicker-overview%})
-* [ContextMenu]({%slug contextmenu-overview%})
-* [Drawer]({%slug drawer-overview%})
-* [Menu]({%slug components/menu/overview%})
-* [PanelBar]({%slug panelbar-overview%})
-* [SplitButton]({%slug splitbutton-overview%})
-* [Stepper]({%slug stepper-overview%})
-* [ToggleButton]({%slug togglebutton-overview%})
-* [TreeView]({%slug treeview-overview%})
-* [Wizard]({%slug wizard-overview%})
+* [Breadcrumb](slug://breadcrumb-overview)
+* [Button](slug://components/button/overview)
+* [ButtonGroup](slug://buttongroup-overview)
+* [ColorPicker](slug://colorpicker-overview)
+* [ContextMenu](slug://contextmenu-overview)
+* [Drawer](slug://drawer-overview)
+* [Menu](slug://components/menu/overview)
+* [PanelBar](slug://panelbar-overview)
+* [SplitButton](slug://splitbutton-overview)
+* [Stepper](slug://stepper-overview)
+* [ToggleButton](slug://togglebutton-overview)
+* [TreeView](slug://treeview-overview)
+* [Wizard](slug://wizard-overview)
 
 ### IconClass
 
@@ -86,19 +86,19 @@ Removed the `IconClass` parameter, use the [Icon](#icon) parameter instead.
 
 List of affected components:
 
-* [Breadcrumb]({%slug breadcrumb-overview%})
-* [Button]({%slug components/button/overview%})
-* [ButtonGroup]({%slug buttongroup-overview%})
-* [ColorPicker]({%slug colorpicker-overview%})
-* [ContextMenu]({%slug contextmenu-overview%})
-* [Drawer]({%slug drawer-overview%})
-* [Menu]({%slug components/menu/overview%})
-* [PanelBar]({%slug panelbar-overview%})
-* [SplitButton]({%slug splitbutton-overview%})
-* [Stepper]({%slug stepper-overview%})
-* [ToggleButton]({%slug togglebutton-overview%})
-* [TreeView]({%slug treeview-overview%})
-* [Wizard]({%slug wizard-overview%})
+* [Breadcrumb](slug://breadcrumb-overview)
+* [Button](slug://components/button/overview)
+* [ButtonGroup](slug://buttongroup-overview)
+* [ColorPicker](slug://colorpicker-overview)
+* [ContextMenu](slug://contextmenu-overview)
+* [Drawer](slug://drawer-overview)
+* [Menu](slug://components/menu/overview)
+* [PanelBar](slug://panelbar-overview)
+* [SplitButton](slug://splitbutton-overview)
+* [Stepper](slug://stepper-overview)
+* [ToggleButton](slug://togglebutton-overview)
+* [TreeView](slug://treeview-overview)
+* [Wizard](slug://wizard-overview)
 
 ### SpriteClass
 
@@ -106,29 +106,29 @@ Removed the `SpriteClass` parameter, use the [Icon](#icon) parameter instead.
 
 List of affected components:
 
-* [Button]({%slug components/button/overview%})
-* [ButtonGroup]({%slug buttongroup-overview%})
-* [SplitButton]({%slug splitbutton-overview%})
-* [Stepper]({%slug stepper-overview%})
-* [ToggleButton]({%slug togglebutton-overview%})
+* [Button](slug://components/button/overview)
+* [ButtonGroup](slug://buttongroup-overview)
+* [SplitButton](slug://splitbutton-overview)
+* [Stepper](slug://stepper-overview)
+* [ToggleButton](slug://togglebutton-overview)
 
 
 ## Shape Parameter
 
 Removed the `Shape` parameter from:
 
-* [Button]({%slug components/button/overview%})
-* [ButtonGroup]({%slug buttongroup-overview%})
-* [SplitButton]({%slug splitbutton-overview%})
-* [ToggleButton]({%slug togglebutton-overview%})
+* [Button](slug://components/button/overview)
+* [ButtonGroup](slug://buttongroup-overview)
+* [SplitButton](slug://splitbutton-overview)
+* [ToggleButton](slug://togglebutton-overview)
 
 ## Stretched enum Value
 
-* [Card Actions `Layout`]({%slug card-actions%}#layout)
-* [Dialog Action `ButtonsLayout`]({%slug dialog-action-buttons%})
-* [Grid popup edit form `ButtonsLayout`]({%slug components/grid/editing/popup%}#edit-form-customization)
-* [Scheduler popup edit form `ButtonsLayout`]({%slug scheduler-edit-popup-customization%}#edit-form-customization)
-* [TreeList popup edit form `ButtonsLayout`]({%slug treelist-editing-popup%}#edit-form-customization)
+* [Card Actions `Layout`](slug://card-actions#layout)
+* [Dialog Action `ButtonsLayout`](slug://dialog-action-buttons)
+* [Grid popup edit form `ButtonsLayout`](slug://components/grid/editing/popup#edit-form-customization)
+* [Scheduler popup edit form `ButtonsLayout`](slug://scheduler-edit-popup-customization#edit-form-customization)
+* [TreeList popup edit form `ButtonsLayout`](slug://treelist-editing-popup#edit-form-customization)
 
 >caption Stretched enum value in UI for Blazor up to version 3.7.0 and after version 4.0.0
 
@@ -322,10 +322,10 @@ This section describes changes per component.
 
 ## Grid
 
-- [FilterRow]({%slug grid-filter-row%}) uses `CompositeFilterDescriptor` instead of `FilterDescriptor`.
+- [FilterRow](slug://grid-filter-row) uses `CompositeFilterDescriptor` instead of `FilterDescriptor`.
 - Removed default filter descriptors in the state when the Grid `FilterMode` is set to `FilterMenu`.
 - Removed the `Primary` parameter from `<GridCommandButton>`. Use the `ThemeColor` parameter instead.
-- Removed `ExcelExportableColumn` in favor of `GridExcelExportColumn` for [Excel export]({%slug grid-export-events%}#for-excel-export) and `GridCsvExportColumn` for [CSV export]({%slug grid-export-events%}#for-csv-export).
+- Removed `ExcelExportableColumn` in favor of `GridExcelExportColumn` for [Excel export](slug://grid-export-events#for-excel-export) and `GridCsvExportColumn` for [CSV export](slug://grid-export-events#for-csv-export).
 - The successor of `ExcelExportableColumn` for CSV export(`GridCsvExportColumn`) does not have `NumberFormat` and `Width`.
 - Renamed `<GridToolBar>` to `<GridToolBarTemplate>`.
 
diff --git a/upgrade/breaking-changes/5-0-0.md b/upgrade/breaking-changes/5-0-0.md
index 80b1abac2d..14f948e0ce 100644
--- a/upgrade/breaking-changes/5-0-0.md
+++ b/upgrade/breaking-changes/5-0-0.md
@@ -8,4 +8,4 @@ position: 980
 
 # Breaking Changes in 5.0.0
 
-Telerik UI for Blazor 5.0.0 targets .NET 6 and no longer supports .NET Core 3.1 and .NET 5. For more information, see [System Requirements]({%slug system-requirements%}).
+Telerik UI for Blazor 5.0.0 targets .NET 6 and no longer supports .NET Core 3.1 and .NET 5. For more information, see [System Requirements](slug://system-requirements).
diff --git a/upgrade/breaking-changes/6-0-0.md b/upgrade/breaking-changes/6-0-0.md
index a1a35c6c26..23a64bdbdb 100644
--- a/upgrade/breaking-changes/6-0-0.md
+++ b/upgrade/breaking-changes/6-0-0.md
@@ -14,11 +14,11 @@ This article outlines the breaking changes in Telerik UI for Blazor version 6.0.
 
 The theme color variable names have changed. This is relevant only to Blazor applications that:
 
-* [Use Telerik themes that are built from the source code]({%slug themes-customize%}#building-themes-from-source-code).
-* [Override theme variable values]({%slug themes-customize%}#setting-theme-variables).
+* [Use Telerik themes that are built from the source code](slug://themes-customize#building-themes-from-source-code).
+* [Override theme variable values](slug://themes-customize#setting-theme-variables).
 
 See the <a href="https://www.telerik.com/design-system/docs/themes/theme-default/migration/" target="_blank">Design System Migration Article</a>.
 
 ## See Also
 
-* [Rendering changes in Telerik UI for Blazor 6.0.0]({%slug rendering-changes-in-6-0-0%})
+* [Rendering changes in Telerik UI for Blazor 6.0.0](slug://rendering-changes-in-6-0-0)
diff --git a/upgrade/breaking-changes/7-0-0.md b/upgrade/breaking-changes/7-0-0.md
index f02126ab6b..71850c2017 100644
--- a/upgrade/breaking-changes/7-0-0.md
+++ b/upgrade/breaking-changes/7-0-0.md
@@ -14,7 +14,7 @@ This article outlines the breaking changes in Telerik UI for Blazor version 7.0.
 
 ### .NET Support
 
-[.NET 7 is no longer supported]({%slug system-requirements%}).
+[.NET 7 is no longer supported](slug://system-requirements).
 
 ### AutoComplete, ComboBox, MultiColumnComboBox, MultiSelect
 
@@ -22,29 +22,29 @@ The obsolete `ClearButton` parameter is removed. Use `ShowClearButton` instead.
 
 ## DateRangePicker
 
-* The [`ShowOtherMonthDays` parameter's default value]({%slug daterangepicker-overview%}#daterangepicker-parameters) is changed to `false`.
+* The [`ShowOtherMonthDays` parameter's default value](slug://daterangepicker-overview#daterangepicker-parameters) is changed to `false`.
 
 ## DropDownButton
 
-* The [`ShowArrowButton` parameter's default value]({%slug dropdownbutton-overview%}#dropdownbutton-parameters) is changed to `false`.
+* The [`ShowArrowButton` parameter's default value](slug://dropdownbutton-overview#dropdownbutton-parameters) is changed to `false`.
 
 ## FileSelect
 
-* The obsolete method `OpenFileSelectAsync()` is removed. [Use `OpenSelectFilesDialog()`]({%slug fileselect-overview%}#fileselect-reference-and-methods) instead.
+* The obsolete method `OpenFileSelectAsync()` is removed. [Use `OpenSelectFilesDialog()`](slug://fileselect-overview#fileselect-reference-and-methods) instead.
 
 ## Gantt
 
-* The [`Type` property of `GanttDependencyCreateEventArgs`]({%slug gantt-dependencies-editing%}) changes from `int` to [`GanttDependencyType` enum](/blazor-ui/api/telerik.blazor.ganttdependencytype).
-* The [dependency model class of the Gantt]({%slug gantt-dependencies-databind%}) must use the `GanttDependencyType` enum for its `TypeField` property.
+* The [`Type` property of `GanttDependencyCreateEventArgs`](slug://gantt-dependencies-editing) changes from `int` to [`GanttDependencyType` enum](/blazor-ui/api/telerik.blazor.ganttdependencytype).
+* The [dependency model class of the Gantt](slug://gantt-dependencies-databind) must use the `GanttDependencyType` enum for its `TypeField` property.
 
 ## Grid
 
-* Columns with `Visible="false"` are editable by default in popup edit mode. To [disable editing of a hidden column, set `Editable="false"`]({%slug components/grid/editing/popup%}) explicitly.
-* The obsolete `AutoFitColumn()` method is removed. [Use `AutoFitColumnAsync()`]({%slug components/grid/columns/resize%}#autofit-columns) instead.
+* Columns with `Visible="false"` are editable by default in popup edit mode. To [disable editing of a hidden column, set `Editable="false"`](slug://components/grid/editing/popup) explicitly.
+* The obsolete `AutoFitColumn()` method is removed. [Use `AutoFitColumnAsync()`](slug://components/grid/columns/resize#autofit-columns) instead.
 * The obsolete `AutoFitColumns()` method is removed. Use `AutoFitColumnsAsync()` instead.
 * The obsolete `AutoFitAllColumns()` method is removed. Use `AutoFitAllColumnsAsync()` instead.
-* When using [grouping and `OnRead`]({%slug components/grid/manual-operations%}#grouping-with-onread), casting `DataSourceResult.Data` to a list of objects (`.Cast<object>()`) is no longer needed.
-* [Components in some Grid templates require a `@key`]({%slug grid-kb-using-components-in-templates%}) in order to display correct values after data operations like sorting, filtering, paging, and others.
+* When using [grouping and `OnRead`](slug://components/grid/manual-operations#grouping-with-onread), casting `DataSourceResult.Data` to a list of objects (`.Cast<object>()`) is no longer needed.
+* [Components in some Grid templates require a `@key`](slug://grid-kb-using-components-in-templates) in order to display correct values after data operations like sorting, filtering, paging, and others.
 
 >caption Using custom components in Grid column templates up to version 6.2.0 and after version 7.0.0
 
@@ -85,19 +85,19 @@ The obsolete `ClearButton` parameter is removed. Use `ShowClearButton` instead.
 
 ## TextArea
 
-* The obsolete parameter `AutoSize` is removed. Use [`ResizeMode="TextAreaResizeMode.Auto"`]({%slug textarea-overview%}#textarea-parameters) instead of `AutoSize="true"`.
+* The obsolete parameter `AutoSize` is removed. Use [`ResizeMode="TextAreaResizeMode.Auto"`](slug://textarea-overview#textarea-parameters) instead of `AutoSize="true"`.
 
 ## TreeList
 
-* Columns with `Visible="false"` are editable by default in popup edit mode. To [disable editing of a hidden column, set `Editable="false"`]({%slug treelist-editing-popup%}) explicitly.
-* The obsolete `AutoFitColumn()` method is removed. [Use `AutoFitColumnAsync()`]({%slug treelist-columns-resize%}#autofit-columns) instead.
+* Columns with `Visible="false"` are editable by default in popup edit mode. To [disable editing of a hidden column, set `Editable="false"`](slug://treelist-editing-popup) explicitly.
+* The obsolete `AutoFitColumn()` method is removed. [Use `AutoFitColumnAsync()`](slug://treelist-columns-resize#autofit-columns) instead.
 * The obsolete `AutoFitColumns()` method is removed. Use `AutoFitColumnsAsync()` instead.
 * The obsolete `AutoFitAllColumns()` method is removed. Use `AutoFitAllColumnsAsync()` instead.
 
 ## Upload
 
-* The obsolete method `OpenFileSelectAsync()` is removed. [Use `OpenSelectFilesDialog()`]({%slug upload-overview%}#upload-reference-and-methods) instead.
+* The obsolete method `OpenFileSelectAsync()` is removed. [Use `OpenSelectFilesDialog()`](slug://upload-overview#upload-reference-and-methods) instead.
 
 ## See Also
 
-* [Rendering changes in Telerik UI for Blazor 7.0.0]({%slug rendering-changes-in-7-0-0%})
+* [Rendering changes in Telerik UI for Blazor 7.0.0](slug://rendering-changes-in-7-0-0)
diff --git a/upgrade/breaking-changes/list.md b/upgrade/breaking-changes/list.md
index c5b16f38dc..0d4accadd4 100644
--- a/upgrade/breaking-changes/list.md
+++ b/upgrade/breaking-changes/list.md
@@ -8,13 +8,13 @@ position: 0
 
 # List of Telerik UI for Blazor Versions with Breaking Changes
 
-This article lists the releases of the Telerik UI for Blazor product that introduce breaking changes. You may want to go through it when [upgrading]({%slug upgrade-tutorial%}) to see whether you are affected.
+This article lists the releases of the Telerik UI for Blazor product that introduce breaking changes. You may want to go through it when [upgrading](slug://upgrade-tutorial) to see whether you are affected.
 
 
-* [7.0.0]({%slug changes-in-7-0-0%})
-* [6.0.0]({%slug changes-in-6-0-0%})
-* [5.0.0]({%slug changes-in-5-0-0%})
-* [4.0.0]({%slug changes-in-4-0-0%})
-* [3.0.0]({%slug changes-in-3-0-0%})
-* [2.2.0]({%slug changes-in-2-2-0%})
-* [2.0.0]({%slug changes-in-2-0-0%})
+* [7.0.0](slug://changes-in-7-0-0)
+* [6.0.0](slug://changes-in-6-0-0)
+* [5.0.0](slug://changes-in-5-0-0)
+* [4.0.0](slug://changes-in-4-0-0)
+* [3.0.0](slug://changes-in-3-0-0)
+* [2.2.0](slug://changes-in-2-2-0)
+* [2.0.0](slug://changes-in-2-0-0)
diff --git a/upgrade/framework-versions.md b/upgrade/framework-versions.md
index 4d5798605d..6381ffa85c 100644
--- a/upgrade/framework-versions.md
+++ b/upgrade/framework-versions.md
@@ -95,5 +95,5 @@ Telerik UI for Blazor is committed to the currently supported official versions
 
 ## See Also
 
-  * [Telerik UI for Blazor: Old Versions Support Policy]({%slug old_versions_support_policy%})
+  * [Telerik UI for Blazor: Old Versions Support Policy](slug://old_versions_support_policy)
   * <a href="https://dotnet.microsoft.com/platform/support/policy/dotnet-core" target="_blank">Microsoft .NET Core and .NET 5 Support Policy</a>
diff --git a/upgrade/old-version-support-policy.md b/upgrade/old-version-support-policy.md
index 97070a1f98..905a5f3bf2 100644
--- a/upgrade/old-version-support-policy.md
+++ b/upgrade/old-version-support-policy.md
@@ -25,7 +25,7 @@ Bugs in UI for Blazor components are fixed depending on the priority set by the
 
 Bug fixes are then implemented in the product by the Development team and later introduced in the first [official product release](https://www.telerik.com/support/whats-new/blazor-ui/release-history).
 
-To get a bug fix, you have to [upgrade]({%slug upgrade-tutorial%}) your project to the same release as the release that contains the fix, or later.
+To get a bug fix, you have to [upgrade](slug://upgrade-tutorial) your project to the same release as the release that contains the fix, or later.
 
 If a workaround for an earlier version is technically feasible, you may be provided with such in the ticketing system. However, Progress Software Corporation cannot guarantee that bug fixes in earlier versions will be available and cannot give warranty for any workarounds that are provided.
 
@@ -46,4 +46,4 @@ For earlier versions, you can get suggestions on how to implement certain scenar
 ## See Also
 
 * [License Agreement](https://www.telerik.com/purchase/license-agreement/blazor-ui)
-* [Framework Versions Support]({%slug framework-versions-support%})
+* [Framework Versions Support](slug://framework-versions-support)
diff --git a/upgrade/overview.md b/upgrade/overview.md
index 0c9a9aea1c..5a72074522 100644
--- a/upgrade/overview.md
+++ b/upgrade/overview.md
@@ -18,9 +18,9 @@ The **latest** available version of UI for Blazor is **{{site.uiForBlazorLatestV
 
 >tip Before starting an upgrade of your project, you may find it useful to review the following information:
 >
-> * [Framework Versions Support]({%slug framework-versions-support%}) - this will let you see what version of the .NET framework you need and which UI for Blazor versions work on it.
+> * [Framework Versions Support](slug://framework-versions-support) - this will let you see what version of the .NET framework you need and which UI for Blazor versions work on it.
 > * [UI for Blazor Release History](https://www.telerik.com/support/whats-new/blazor-ui/release-history) — reviewing the release notes for all releases you go through will let you see what has changed, what fixes, features and components have been implemented so you are better prepared to meet your project's challenges.
-> * Whether you are affected by a breaking change. The [List of Telerik UI for Blazor Versions with Breaking Changes]({%slug versions-with-breaking-changes%}) article shows which releases of our component suite have breaking changes. Review the information for the releases you go through so you can evaluate whether you will be affected by anything.
+> * Whether you are affected by a breaking change. The [List of Telerik UI for Blazor Versions with Breaking Changes](slug://versions-with-breaking-changes) article shows which releases of our component suite have breaking changes. Review the information for the releases you go through so you can evaluate whether you will be affected by anything.
 
 In this article:
 
@@ -38,21 +38,21 @@ To upgrade the Telerik UI for Blazor components used in your project, perform th
 
 1. Update the version of the `Telerik.UI.for.Blazor` NuGet package in all applicable projects. If you are using a trial version, the package name is `Telerik.UI.for.Blazor.Trial`.
 
-1. If you are [loading `telerik-blazor.js` from CDN]({%slug common-features-cdn%}#javascript-urls), update the version number in the CDN URL to match the NuGet package version.
+1. If you are [loading `telerik-blazor.js` from CDN](slug://common-features-cdn#javascript-urls), update the version number in the CDN URL to match the NuGet package version.
 
-1. If you are [loading themes from CDN]({%slug common-features-cdn%}#css-theme-urls), update the version number in the theme URL. For example, if you are upgrading to Telerik UI for Blazor {{site.uiForBlazorLatestVersion}}, the version number in the theme URL must be:
-    * `{{site.themesVersion}}` if using [UNPKG CDN]({%slug common-features-cdn%}#unpkg-cdn)
-    * `{{site.uiForBlazorLatestVersion}}` if using the [Telerik CDN]({%slug common-features-cdn%}#telerik-cdn)
+1. If you are [loading themes from CDN](slug://common-features-cdn#css-theme-urls), update the version number in the theme URL. For example, if you are upgrading to Telerik UI for Blazor {{site.uiForBlazorLatestVersion}}, the version number in the theme URL must be:
+    * `{{site.themesVersion}}` if using [UNPKG CDN](slug://common-features-cdn#unpkg-cdn)
+    * `{{site.uiForBlazorLatestVersion}}` if using the [Telerik CDN](slug://common-features-cdn#telerik-cdn)
 
-1. If you are using a local theme stylesheet in `wwwroot`, then replace it. For example, if the app is using a [custom theme]({%slug themes-customize%}), then recreate it with the [ThemeBuilder](https://docs.telerik.com/themebuilder). Or, if the [project was created with the Telerik&reg; UI for Blazor Visual Studio Extensions]({%slug getting-started-vs-integration-new-project%}), then [download the required built-in theme]({%slug themes-overview%}#built-in-themes) and add it to the project.
+1. If you are using a local theme stylesheet in `wwwroot`, then replace it. For example, if the app is using a [custom theme](slug://themes-customize), then recreate it with the [ThemeBuilder](https://docs.telerik.com/themebuilder). Or, if the [project was created with the Telerik&reg; UI for Blazor Visual Studio Extensions](slug://getting-started-vs-integration-new-project), then [download the required built-in theme](slug://themes-overview#built-in-themes) and add it to the project.
 
-1. If the application is localized, [update the Telerik localization resource (`.resx`) files]({%slug globalization-localization%}#step-2-add-resouce-files). Otherwise, you may see [exceptions related to missing localization strings]({%slug common-kb-value-cannot-be-null-parameter-format%}).
+1. If the application is localized, [update the Telerik localization resource (`.resx`) files](slug://globalization-localization#step-2-add-resouce-files). Otherwise, you may see [exceptions related to missing localization strings](slug://common-kb-value-cannot-be-null-parameter-format).
 
-1. Clear the browser cache and optionally [add a cache buster for the Telerik CSS and JavaScript files]({%slug common-kb-browser-cache-buster%}).
+1. Clear the browser cache and optionally [add a cache buster for the Telerik CSS and JavaScript files](slug://common-kb-browser-cache-buster).
 
 ## Upgrade Wizard
 
-To upgrade the version of Telerik UI for Blazor you can use the [Upgrade Wizard]({%slug getting-started-vs-integration-upgrade-project%}) that comes as part of the [Telerik UI for Blazor Visual Studio Extension]({% slug getting-started-vs-integration-overview %}).
+To upgrade the version of Telerik UI for Blazor you can use the [Upgrade Wizard](slug://getting-started-vs-integration-upgrade-project) that comes as part of the [Telerik UI for Blazor Visual Studio Extension](slug://getting-started-vs-integration-overview).
 
 ## Upgrade from Trial to Commercial
 
@@ -91,7 +91,7 @@ The Trial version of our assembly has the `Telerik.Blazor Trial version` Title.
 
 ## Microsoft.JSInterop.JSException: Could not find ...
 
-The most common problem you will encounter when upgrading is wrong references to our JS Interop file. You can read more about fixing them in the [Troubleshoot JavaScript Errors]({%slug troubleshooting-js-errors%}) article.
+The most common problem you will encounter when upgrading is wrong references to our JS Interop file. You can read more about fixing them in the [Troubleshoot JavaScript Errors](slug://troubleshooting-js-errors) article.
 
 ## I Still See the Trial Watermark and Banner
 
@@ -122,7 +122,7 @@ To fix this in the meantime, try the following process (you can try a new test b
 
 ## See Also
 
-* [What You Need to Use Telerik UI for Blazor]({%slug getting-started/what-you-need%})
-* [Get Started with Client-side Blazor]({%slug getting-started/client-side%})
-* [Get Started with Server-side Blazor]({%slug getting-started/server-side%})
+* [What You Need to Use Telerik UI for Blazor](slug://getting-started/what-you-need)
+* [Get Started with Client-side Blazor](slug://getting-started/client-side)
+* [Get Started with Server-side Blazor](slug://getting-started/server-side)
 
diff --git a/upgrade/rendering-changes/3-4-0.md b/upgrade/rendering-changes/3-4-0.md
index 8970dfa434..7637498f28 100644
--- a/upgrade/rendering-changes/3-4-0.md
+++ b/upgrade/rendering-changes/3-4-0.md
@@ -33,5 +33,5 @@ Previous to the 3.4.0 version we used `k-state-*` CSS classes to denote that the
 
 ## See also
 
-* [Use best practices when overriding theme styles]({%slug themes-override%}#best-practices)
+* [Use best practices when overriding theme styles](slug://themes-override#best-practices)
 
diff --git a/upgrade/rendering-changes/3-6-0.md b/upgrade/rendering-changes/3-6-0.md
index 9237cc4294..1baf36262d 100644
--- a/upgrade/rendering-changes/3-6-0.md
+++ b/upgrade/rendering-changes/3-6-0.md
@@ -44,20 +44,20 @@ position: 995
 
 ## Dialog
 
-* Added `k-dialog-action` and `k-window-action` CSS classes to the [Action Buttons]({%slug dialog-action-buttons%})(`<button class="k-button">`).
+* Added `k-dialog-action` and `k-window-action` CSS classes to the [Action Buttons](slug://dialog-action-buttons)(`<button class="k-button">`).
 * Removed the `k-header` CSS class from the `<div class="k-dialog-titlebar">` element.
 
 ## Drawer
 
-* Removed the `k-drawer-mini` CSS class from the `<div class="k-drawer">` element when the Drawer is in [Expanded Mode]({%slug drawer-mini-mode%}).
+* Removed the `k-drawer-mini` CSS class from the `<div class="k-drawer">` element when the Drawer is in [Expanded Mode](slug://drawer-mini-mode).
 * Renamed the `k-drawer-left` and `k-drawer-right` CSS classes to `k-drawer-start` and `k-drawer-end`.
 
 ## Grid
 
-* Added `k-sorted` CSS class to the `<th class="k-header">` element when the column is [Sorted]({%slug components/grid/features/sorting%}).
+* Added `k-sorted` CSS class to the `<th class="k-header">` element when the column is [Sorted](slug://components/grid/features/sorting).
 * Added `k-grid-header-menu` CSS class to the `<span class="k-grid-column-menu">` element.
 * Removed the `k-grid-filter` CSS class from the `<span class="k-grid-column-menu">` element.
-* Added `k-grid-filter-menu` and `k-grid-header-menu` CSS classes to the outermost HTML element of the [Filter Menu]({%slug grid-filter-menu%}).
+* Added `k-grid-filter-menu` and `k-grid-header-menu` CSS classes to the outermost HTML element of the [Filter Menu](slug://grid-filter-menu).
 
 ## Menu
 
@@ -95,8 +95,8 @@ position: 995
 ## Window
 
 * Added `k-window-minimized` CSS class when the Window is minimized.
-* Added `k-window-action` CSS class to the [Action Buttons]({%slug components/window/actions%})(`<button class="k-button">`).
+* Added `k-window-action` CSS class to the [Action Buttons](slug://components/window/actions)(`<button class="k-button">`).
 
 ## See also
 
-* [Use best practices when overriding theme styles]({%slug themes-override%}#best-practices)
+* [Use best practices when overriding theme styles](slug://themes-override#best-practices)
diff --git a/upgrade/rendering-changes/4-0-0.md b/upgrade/rendering-changes/4-0-0.md
index 90bce320a2..4188817e10 100644
--- a/upgrade/rendering-changes/4-0-0.md
+++ b/upgrade/rendering-changes/4-0-0.md
@@ -90,7 +90,7 @@ The `k-toolbar-item` class has been added to `<div class="k-filter-toolbar-item>
 
 ## Form
 
-`k-form-{size}` has been added to the main wrapping element of the Telerik UI for Blazor Form component (`<form class="k-form">`). It's necessary to introduce the [`Size` options of the Form]({%slug form-appearance%}).
+`k-form-{size}` has been added to the main wrapping element of the Telerik UI for Blazor Form component (`<form class="k-form">`). It's necessary to introduce the [`Size` options of the Form](slug://form-appearance).
 
 ## Gantt
 
@@ -118,7 +118,7 @@ The `k-toolbar-item` class has been added to `<div class="k-filter-toolbar-item>
     </span>
   ````
 
-* Added `k-grid-{size}` to the main wrapping element of the component (`<div class="k-grid">`). It's necessary to introduce the [`Size` options of the Grid]({%slug grid-sizing%}). The child elements inherit the `k-grid-{size}` class.
+* Added `k-grid-{size}` to the main wrapping element of the component (`<div class="k-grid">`). It's necessary to introduce the [`Size` options of the Grid](slug://grid-sizing). The child elements inherit the `k-grid-{size}` class.
 
 * Added the `k-grid-header-table`, `k-grid-table`, and `k-grid-footer-table` Grid-specific classes to the header, body, and footer of the tables.
 
@@ -164,7 +164,7 @@ The `<div class="k-listview-item">` wrapper has been added to the Item template.
 * Replaced the `<a class="k-link k-page-nav">` navigation buttons with Flat buttons `<button class="k-pager-nav k-button k-button-{size} k-button-flat k-button-flat-base k-icon-button">`.
 * Replaced the `<span class="k-link>` page numbers with Flat primary buttons `<button class="k-button k-button-{size} k-button-flat k-button-flat-primary">`.
 * Removed the `k-floatwrap`, `k-link`, `k-pager-wrap`, and `k-label` classes.
-* Added `k-pager-{size}` to the main wrapping element of the component (`<div class="k-pager">`). It's necessary to introduce the [`Size` options of the Form]({%slug pager-appearance%}).
+* Added `k-pager-{size}` to the main wrapping element of the component (`<div class="k-pager">`). It's necessary to introduce the [`Size` options of the Form](slug://pager-appearance).
 
 ## ProgressBar
 
@@ -181,7 +181,7 @@ The `k-collapse-prev` and `k-collapse-next` classes have been removed from the `
 * Renamed the `k-overflow-anchor` class to `k-toolbar-overflow-button`.
 * Added Toolbar-specific classes to all built-in tools such as `k-toolbar-button`, `k-toolbar-toggle-button`, `k-toolbar-button-group`, and more.
 * All template items are now wrapped in a `<div class="k-toolbar-item">` element.
-* Added `k-toolbar-{size}` to the main `<div class="k-toolbar">` wrapping element of the component. It's necessary to introduce the [`Size` options of the Toolbar]({%slug toolbar-appearance%}).
+* Added `k-toolbar-{size}` to the main `<div class="k-toolbar">` wrapping element of the component. It's necessary to introduce the [`Size` options of the Toolbar](slug://toolbar-appearance).
 
 ## Treelist
 
@@ -241,4 +241,4 @@ The following changes are applicable when `AutoUpload = "false"`, so the **Clear
 
 ## See Also
 
-* [Use best practices when overriding theme styles]({%slug themes-override%}#best-practices)
+* [Use best practices when overriding theme styles](slug://themes-override#best-practices)
diff --git a/upgrade/rendering-changes/4-3-0.md b/upgrade/rendering-changes/4-3-0.md
index 88f8a76a95..4fdee9ba31 100644
--- a/upgrade/rendering-changes/4-3-0.md
+++ b/upgrade/rendering-changes/4-3-0.md
@@ -20,7 +20,7 @@ position: 985
 
 ## Icons
 
-The default icon type in the Telerik UI for Blazor suite changes from `FontIcon` to `SvgIcon`. This marks the next milestone in a series of improvements related to the [Content Security Policy (CSP)]({%slug troubleshooting-csp%}).
+The default icon type in the Telerik UI for Blazor suite changes from `FontIcon` to `SvgIcon`. This marks the next milestone in a series of improvements related to the [Content Security Policy (CSP)](slug://troubleshooting-csp).
 
 ### All Telerik UI for Blazor components will now use SVG icons by default
 
@@ -64,9 +64,9 @@ If you are testing the rendered HTML by the Telerik UI for Blazor components, so
 
 ### Continuing with FontIcons
 
-To continue using `FontIcons` as the default icon type in the application, [set the global icon type to `Font`]({%slug common-features-icons%}#set-global-icon-type).
+To continue using `FontIcons` as the default icon type in the application, [set the global icon type to `Font`](slug://common-features-icons#set-global-icon-type).
 
->note As part of the R3 2023 release, the font icons will be detached from the Telerik UI for Blazor themes. To continue using the font icons in your application, either add a separate CDN reference or download and reference the stylesheet included in the [Telerik UI for Blazor package]({%slug installation/msi%}#how-to-download-the-automated-installer).
+>note As part of the R3 2023 release, the font icons will be detached from the Telerik UI for Blazor themes. To continue using the font icons in your application, either add a separate CDN reference or download and reference the stylesheet included in the [Telerik UI for Blazor package](slug://installation/msi#how-to-download-the-automated-installer).
 
 ## Breadcrumb
 
@@ -82,7 +82,7 @@ To continue using `FontIcons` as the default icon type in the application, [set
 
 ## ColorGradient
 
-The `k-disabled` CSS class has been added when the Breadcrumb item is [`Disabled`]({%slug breadcrumb-data-binding%}#breadcrumb-item-features).
+The `k-disabled` CSS class has been added when the Breadcrumb item is [`Disabled`](slug://breadcrumb-data-binding#breadcrumb-item-features).
 
 | Prior to 4.3.0 | 4.3.0 and Later |
 |---|---|
@@ -94,7 +94,7 @@ The `<div class="k-colorpalette-table-wrap">` HTML element is now removed.
 
 ## FlatColorPicker
 
-* The `<div class="k-coloreditor-header-actions">` HTML element will be rendered in all [views]({%slug flatcolorpicker-views%}).
+* The `<div class="k-coloreditor-header-actions">` HTML element will be rendered in all [views](slug://flatcolorpicker-views).
 * Added the `k-actions-horizontal` CSS class to the `<div class="k-coloreditor-header-actions">` HTML element.
 * Added the `k-coloreditor-apply` CSS class to the **Apply** button.
 * Added the `k-coloreditor-cancel` CSS class to the **Cancel** button.
@@ -128,4 +128,4 @@ Such dialogs are any edit forms, filter menus, column menus, editor's tools, as
 
 ## See Also
 
-* [Use best practices when overriding theme styles]({%slug themes-override%}#best-practices)
+* [Use best practices when overriding theme styles](slug://themes-override#best-practices)
diff --git a/upgrade/rendering-changes/4-6-0.md b/upgrade/rendering-changes/4-6-0.md
index 3999fe773a..3f5e6d5b07 100644
--- a/upgrade/rendering-changes/4-6-0.md
+++ b/upgrade/rendering-changes/4-6-0.md
@@ -18,7 +18,7 @@ position: 980
 
 ### Font Icons
 
-The font icon styles are detached from the component themes. Check section [Font Icon Stylesheet]({%slug common-features-icons%}#font-icon-stylesheet) or KB article [Font Icons do not render in Telerik UI for Blazor 4.6]({%slug icon-kb-font-icons-not-rendering%}) to see how to use font icons in your application after the 4.6.0 Telerik UI for Blazor release. 
+The font icon styles are detached from the component themes. Check section [Font Icon Stylesheet](slug://common-features-icons#font-icon-stylesheet) or KB article [Font Icons do not render in Telerik UI for Blazor 4.6](slug://icon-kb-font-icons-not-rendering) to see how to use font icons in your application after the 4.6.0 Telerik UI for Blazor release. 
 
 ### Changes in Icon Rendering
 
@@ -72,4 +72,4 @@ Removed the `k-filter-toolbar-item` CSS class from the `<div class="k-toolbar-it
 
 ## See Also
 
-* [Use best practices when overriding theme styles]({%slug themes-override%}#best-practices)
+* [Use best practices when overriding theme styles](slug://themes-override#best-practices)
diff --git a/upgrade/rendering-changes/6-0-0.md b/upgrade/rendering-changes/6-0-0.md
index 4f98365ed1..8a9ea4d616 100644
--- a/upgrade/rendering-changes/6-0-0.md
+++ b/upgrade/rendering-changes/6-0-0.md
@@ -174,7 +174,7 @@ The `ul.k-menu-group` element in the popup no longer renders `k-group` and `k-re
 ## DropZone
 
 * The `span.k-icon` child of `div.k-dropzone-inner` renders a `k-dropzone-icon` CSS class.
-* The DropZone hint and note elements (`span.k-dropzone-hint` and `span.k-dropzone-note`) no longer render when [`HintText` and `NoteText`]({%slug dropzone-overview%}#parameters) are empty.
+* The DropZone hint and note elements (`span.k-dropzone-hint` and `span.k-dropzone-note`) no longer render when [`HintText` and `NoteText`](slug://dropzone-overview#parameters) are empty.
 
 
 ## Editor
@@ -297,7 +297,7 @@ The ListView container (`div.k-listview`) no longer renders a `k-d-flex` CSS cla
 
 ## LoaderContainer
 
-* The `Text` container (`div.k-loader-container-label`) prepends a `!` to its `ThemeColor` CSS class. This means that the theme color is applied with an `!important` keyword, so you also need to use `!important` to [override]({%slug themes-override%}) it.
+* The `Text` container (`div.k-loader-container-label`) prepends a `!` to its `ThemeColor` CSS class. This means that the theme color is applied with an `!important` keyword, so you also need to use `!important` to [override](slug://themes-override) it.
 * The `z-index` value of `div.k-loader-container` is `20001`, compared to `2001` in older versions. As a result, the LoaderContaier will show on top of popup Windows and Dialogs. If necessary, show the LoaderContainer after closing the popup.
 
 
@@ -361,7 +361,7 @@ The optional `span.k-icon` element renders a `k-notification-status` CSS class.
 
 ## NumericTextBox
 
-The arrow buttons (`button.k-spinner-increase` and `button.k-spinner-decrease`) render an additional CSS class that reflects the [NumericTextBox `Size`]({%slug numerictextbox-appearance%}#size). The default `Size` is medium, so the new CSS class is `k-button-md`.
+The arrow buttons (`button.k-spinner-increase` and `button.k-spinner-decrease`) render an additional CSS class that reflects the [NumericTextBox `Size`](slug://numerictextbox-appearance#size). The default `Size` is medium, so the new CSS class is `k-button-md`.
 
 
 ## Pager
@@ -369,7 +369,7 @@ The arrow buttons (`button.k-spinner-increase` and `button.k-spinner-decrease`)
 The rendering changes in the Pager also affect the components that use a Pager component internally, such as the Grid, ListView, and the TreeList.
 
 * When the `InputType` is `PagerInputType.Input`, the **Page** and **of XX** labels inside `span.k-pager-input` are rendered inside `span`s.
-* The selected `option` element in the native page number drop down (`select.k-picker`) no longer renders a `k-selected` CSS class. The `select` element shows on small screens instead of the pager buttons when the [Pager `Adaptive` parameter]({%slug pager-overview%}#pager-parameters) is set to `true`.
+* The selected `option` element in the native page number drop down (`select.k-picker`) no longer renders a `k-selected` CSS class. The `select` element shows on small screens instead of the pager buttons when the [Pager `Adaptive` parameter](slug://pager-overview#pager-parameters) is set to `true`.
 * The page number buttons (`button.k-button`) render their content in a `span.k-button-text`.
 
 <div class="skip-repl"></div>
@@ -415,7 +415,7 @@ The rendering changes in the Pager also affect the components that use a Pager c
 
 * Expanded items (`li.k-panelbar-item`) render a `k-expanded` CSS class instead of `k-state-expanded`.
 * Child item groups (`ul.k-panelbar-group`) no longer render `k-group` and `k-panel` CSS classes.
-* The [`<ContentTemplate>` wrapper]({%slug panelbar-templates-content%}) (`div.k-panelbar-content`) no longer renders a `k-content` CSS class.
+* The [`<ContentTemplate>` wrapper](slug://panelbar-templates-content) (`div.k-panelbar-content`) no longer renders a `k-content` CSS class.
 * The `li.k-panelbar-item` element renders a `k-panelbar-header` CSS class only when it is a root PanelBar item.
 
 
@@ -427,7 +427,7 @@ The rendering changes in the Pager also affect the components that use a Pager c
 * The **Zoom Out** and **Zoom In** toolbar buttons (`button.k-button`) no longer render a `k-toolbar-button` CSS class.
 * The **Zoom In** button no longer renders a `k-group-start` CSS class.
 * The **Zoom** drop down renders a `k-toolbar-combobox` CSS class.
-* All toolbar buttons (`button.k-button.k-button-solid.k-button-solid-base`) apply flat [Button `FillMode`]({%slug button-appearance%}#fillmode) and render as `button.k-button.k-button-flat.k-button-flat-base`.
+* All toolbar buttons (`button.k-button.k-button-solid.k-button-solid-base`) apply flat [Button `FillMode`](slug://button-appearance#fillmode) and render as `button.k-button.k-button-flat.k-button-flat-base`.
 * The **Folder Open** icon (`span.k-icon.k-svg-icon.k-svg-i-folder-open`) in an empty PDF Viewer renders as an [**Upload** icon (`span.k-icon.k-svg-icon.k-svg-i-upload`)](https://www.telerik.com/design-system/docs/foundation/iconography/icon-list/) with a `k-dropzone-icon` CSS class. If using font icons, then `span.k-icon.k-font-icon.k-i-folder-open` renders as `span.k-icon.k-font-icon.k-i-upload`.
 * The **Upload** icon is followed by a `span.k-dropzone-hint` element.
 * The **Upload** icon and drop zone hint render inside a `div.k-external-dropzone` element, which wraps a `div.k-dropzone-hint` element.
@@ -483,7 +483,7 @@ The rendering changes in the Pager also affect the components that use a Pager c
 
 ## ProgressBar
 
-The two `span.k-progress-status` elements no longer render if the [ProgressBar label]({%slug progressbar-label%}) is not visible.
+The two `span.k-progress-status` elements no longer render if the [ProgressBar label](slug://progressbar-label) is not visible.
 
 
 ## RadioGroup
@@ -542,8 +542,8 @@ The Scheduler `div.k-scheduler-layout` element renders a `k-scheduler-dayview` o
 
 ## Stepper and Wizard
 
-* The `span.k-step-label` element does not render if the respective [step as no `Label`]({%slug stepper-labels%}).
-* The `span.k-step` element renders a `k-step-optional` CSS class when the [step is optional]({%slug wizard-structure-stepper%}).
+* The `span.k-step-label` element does not render if the respective [step as no `Label`](slug://stepper-labels).
+* The `span.k-step` element renders a `k-step-optional` CSS class when the [step is optional](slug://wizard-structure-stepper).
 
 
 ## Switch
@@ -634,4 +634,4 @@ The child `div` of the TreeView item container (`li.k-treeview-item > div`) rend
 
 ## See Also
 
-* [Use best practices when overriding theme styles]({%slug themes-override%}#best-practices)
+* [Use best practices when overriding theme styles](slug://themes-override#best-practices)
diff --git a/upgrade/rendering-changes/7-0-0.md b/upgrade/rendering-changes/7-0-0.md
index 8c44c7cf0a..1c0e6521c3 100644
--- a/upgrade/rendering-changes/7-0-0.md
+++ b/upgrade/rendering-changes/7-0-0.md
@@ -27,7 +27,7 @@ position: 970
 
 ## Editor
 
-* The `<div class="k-form">` elements in the popups of the [`CreateLink` and `InsertImage` tools]({%slug editor-built-in-tools%}) no longer render a `k-form-horizontal` class.
+* The `<div class="k-form">` elements in the popups of the [`CreateLink` and `InsertImage` tools](slug://editor-built-in-tools) no longer render a `k-form-horizontal` class.
 * The `ViewHtml` tool popup no longer renders `div.k-form`, `div.k-form-field`, and `div.k-form-field-wrap` elements.
 * The `<label class="k-form-label">` elements in the above three popups also render a `k-label` class.
 * The popup windows (`<div class="k-window">` elements) for the `CreateLink` and `InsertImage` tools are `340px` wide by default.
@@ -80,5 +80,5 @@ The tile elements (`<div class="k-tilelayout-item">`) render `tabindex="-1"` ins
 
 ## See Also
 
-* [Use best practices when overriding theme styles]({%slug themes-override%}#best-practices)
-* [Breaking changes in Telerik UI for Blazor 7.0.0]({%slug changes-in-7-0-0%})
+* [Use best practices when overriding theme styles](slug://themes-override#best-practices)
+* [Breaking changes in Telerik UI for Blazor 7.0.0](slug://changes-in-7-0-0)
diff --git a/upgrade/rendering-changes/list.md b/upgrade/rendering-changes/list.md
index 395d572498..3888005828 100644
--- a/upgrade/rendering-changes/list.md
+++ b/upgrade/rendering-changes/list.md
@@ -8,16 +8,16 @@ position: 0
 
 # List of Telerik UI for Blazor Versions with Rendering Changes
 
-As the Telerik UI for Blazor matures we will continuously optimize the HTML rendering and the usage of CSS classes. The rendering changes only affect the styling of the components if the application [overrides the built-in CSS styles]({%slug themes-override%}) or uses an outdated [custom theme]({%slug themes-customize%}). This article tracks the product versions with rendering changes.
+As the Telerik UI for Blazor matures we will continuously optimize the HTML rendering and the usage of CSS classes. The rendering changes only affect the styling of the components if the application [overrides the built-in CSS styles](slug://themes-override) or uses an outdated [custom theme](slug://themes-customize). This article tracks the product versions with rendering changes.
 
-* [7.0.0]({%slug rendering-changes-in-7-0-0%})
-* [6.0.0]({%slug rendering-changes-in-6-0-0%})
-* [4.6.0]({%slug rendering-changes-in-4-6-0%})
-* [4.3.0]({%slug rendering-changes-in-4-3-0%})
-* [4.0.0]({%slug rendering-changes-in-4-0-0%})
-* [3.6.0]({%slug rendering-changes-in-3-6-0%})
-* [3.4.0]({%slug rendering-changes-in-3-4-0%})
+* [7.0.0](slug://rendering-changes-in-7-0-0)
+* [6.0.0](slug://rendering-changes-in-6-0-0)
+* [4.6.0](slug://rendering-changes-in-4-6-0)
+* [4.3.0](slug://rendering-changes-in-4-3-0)
+* [4.0.0](slug://rendering-changes-in-4-0-0)
+* [3.6.0](slug://rendering-changes-in-3-6-0)
+* [3.4.0](slug://rendering-changes-in-3-4-0)
 
 ## Good Styling Practices
 
-To minimize the risk of breaking changes related to rendering changes, [use custom CSS classes to override the styling of the Telerik UI for Blazor components]({%slug themes-override%}#best-practices).
+To minimize the risk of breaking changes related to rendering changes, [use custom CSS classes to override the styling of the Telerik UI for Blazor components](slug://themes-override#best-practices).