If you used the automated MSI installer to install Telerik UI for ASP.NET Core, all required files are already available on your machine and you can skip the downloading instructions and jump to Step 4 below. By default, these js and CSS files are located in the Telerik UI for ASP.NET Core installation folder under
C:\Program Files (x86)\Progress\Telerik UI for ASP.NET Core <version>.
To add the client-side resources to your project:
Go to the UI for ASP.NET Core download page or to Account Overview > Downloads > Progress® Telerik® UI for ASP.NET Core.
Download the archive that matches the
Kendo.Mvc.UIversion in your project. For example, if your project references
2023.3.1114, then download the
telerik.ui.for.aspnetcore.2023.3.1114.commercialzip or 7z archive.
telerik.ui.for.aspnet.core.2023.3.1114.commercial-sourceincludes non-minified scripts and styles.
telerik.ui.for.aspnet.core.2023.3.1114.commercialincludes minified scripts and styles.
stylesfolders from the archive to your project under
The culture and localization (the translation of component messages) scripts are included in the
jsfolder. For more information on using localization, internationalization, and right-to-left (RTL) support with Telerik UI for ASP.NET Core helpers, refer to the article on globalization support by Telerik UI for ASP.NET Core.
Register the UI styles and scripts in
- The CDN links and/or package versions have to point to the same UI for ASP.NET Core version which your project references.
- In the default .NET Core template, the jQuery scripts are included at the end of the
<body>element. To properly load the Telerik UI for ASP.NET Core HTML Helpers, move the jQuery scripts and the Kendo UI client-side scripts to the
<head>element and make sure that the Kendo UI scripts are loaded after the jQuery ones.
<head> ... <environment include="Development"> ... <link rel="stylesheet" href="~/lib/kendo-ui/styles/default-main.css" /> </environment> <environment exclude="Development"> ... <link rel="stylesheet" href="https://kendo.cdn.telerik.com/themes/7.0.2/default/default-main.css" asp-fallback-href="~/lib/kendo-ui/styles/default-main.css" asp-fallback-test-class="k-theme-test-class" asp-fallback-test-property="opacity" asp-fallback-test-value="0" /> </environment> <environment include="Development"> ... <script src="~/lib/jquery/dist/jquery.js"></script> @* Place the Kendo UI scripts after jQuery. *@ <script src="~/lib/kendo-ui/js/kendo.all.min.js"></script> <script src="~/lib/kendo-ui/js/kendo.aspnetmvc.min.js"></script> </environment> <environment exclude="Development"> ... <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.2.0.min.js" asp-fallback-src="~/lib/jquery/dist/jquery.min.js" asp-fallback-test="window.jQuery" crossorigin="anonymous" integrity="sha384-K+ctZQ+LL8q6tP7I94W+qzQsfRV2a+AfHIi9k8z8l9ggpc8X+Ytst4yBo/hH+8Fk"> </script> @* Place the Kendo UI scripts after jQuery. *@ <script src="https://kendo.cdn.telerik.com/2023.3.1114/js/kendo.all.min.js" asp-fallback-src="~/lib/kendo-ui/js/kendo.all.min.js" asp-fallback-test="window.kendo"> </script> <script src="https://kendo.cdn.telerik.com/2023.3.1114/js/kendo.aspnetmvc.min.js" asp-fallback-src="~/lib/kendo-ui/js/kendo.aspnetmvc.min.js" asp-fallback-test="kendo.data.transports['aspnetmvc-ajax']"> </script> </environment> ... </head>
Starting with Telerik UI for ASP.NET Core version
2022.3.1109, you can choose between three module systems that allow you to import the client-side assets into your project: ECMAScript, UMD, and CommonJS.
The files for all these module systems are available in the downloaded zip or 7z archive or in the local installation directory of Telerik UI for ASP.NET Core:
- ECMAScript—The script files are located in the mjs folder. Available as of
- UMD—The script files are located in the umd folder. Available as of
- CommonJS—The script files are located in the js folder.