Add client-side functionality to .NET Core widgets
How to reference the scripts
You can reference the scripts from the following:
In the page template
You can reference the scripts inside the template that your pages are based on.
For example, if the layout file that your pages are based on is named
RootLayout.chtml, inside it, you can reference a script in the following way:
In the widget temple
You can reference your scripts directly in the widget template.
For example, if your widget is named
MyWidget, you can reference a script in its
Default.cshtml file in the following way:
NOTE: If you do not add the
TagHelper attribute to the widget template, the section-name attribute will not work.
For example, the
section-name=”Top” attribute instructs the Renderer to include your file either at the start of the
body tag or, in case
section-name=”Bottom”, before the closing
body tag. For this attribute to work, you must include the tag helper references in your
Where to place the scripts
You have the following options:
In the root folder
If you are building a standalone website, you can place the scripts in the standard
wwwroot folder and you can reference them from there, as you would do in any standard .NET Core application.
For more information, see Microsoft documentation for Static files in ASP.NET Core. https://docs.microsoft.com/en-us/aspnet/core/fundamentals/static-files?view=aspnetcore-5.0.
As embedded resource
If you are building a widget as a class library that must be self-contained in a single assembly, you must place these client-side resources in the assembly, as embedded resources.
Place the scripts in a separate folder in your project, called
Reference the script files in the
For example, add the following:
: Following is an example of the
script reference in the
The reference is using the
section-name attribute, but it also includes the
assembly-ref attribute, which points to the name of the assembly, where this file is placed as am embedded resource.