Modify widget templates

You use widget templates to change the appearance of the widget in Sitefinity CMS. Every widget has built-in templates that are packaged in the same assembly.

With Sitefinity CMS,  you can override the default widget template by placing the physical file (either a CSS, JavaScript, HTML, or other file) in a specific location inside the SitefinityWebApp project structure. Sitefinity CMS searches for this location and, if it finds any of these files, it uses them to replace the default widget template. The location depends on the built-in ASP.NET MVC view engines. By default ASP.NET MVC comes with WebFormViewEngine and RazorViewEngine.

NOTE: You can find the default widget templates in the GitHub repository. Open the folder of the module you are extending, for example, Telerik.Sitefinity.Frontend.ContentBlock. Navigate to Mvc » Views/ContentBlock.

The following procedure describes how to change the built-in widget template depending on the view engine you are using.

By default, all MVC-oriented logic must reside in folder Mvc folder in the SitefinityWebApp project. This folder is created automatically by Sitefinity CMS in your web application. New MVC widgets appear in Sitefinity CMS toolbox.

To modify the default template of the ContentBlock widget that uses the RazorViewEngine, perform the following:

  1. In Visual Studio, open your SitefinityWebApp project and click Mvc » Views.

  2. Create a new folder and name it ContentBlock.

    NOTE: The name of the folder must correspond to the name of the widget whose template you want to change. In case, for example, you need to change the template of the Navigation widget, you must name the folder Navigation.

  3. Open the context menu of folder ContentBlock and add new file with name Default.cshtml 
    The name of the file must be Default, because the ContentBlockController renders a view named Default. The extension .cshtml is valid for Razor view engine. For any other widget the name of the newly created file must match the name of the template that you are trying to replace.

    IMPORTANT: You can use only alphanumeric characters and underscore. For more information about naming your files, see Naming conventions.

  4. Enter a sample text inside.
    For example, enter Testing new template.
  5. Build the solution and run it.
  6. Create a new page in Sitefinity CMS and place the ContentBlock widget that is located in the MvcWidgets toolbox section.

As a result, the Testing new template text is displayed.

Increase your Sitefinity skills by signing up for our free trainings. Get Sitefinity-certified at Progress Education Community to boost your credentials.

Get started with Integration Hub | Sitefinity Cloud | Sitefinity SaaS

This free lesson teaches administrators, marketers, and other business professionals how to use the Integration hub service to create automated workflows between Sitefinity and other business systems.

Web Security for Sitefinity Administrators

This free lesson teaches administrators the basics about protecting yor Sitefinity instance and its sites from external threats. Configure HTTPS, SSL, allow lists for trusted sites, and cookie security, among others.

Foundations of Sitefinity ASP.NET Core Development

The free on-demand video course teaches developers how to use Sitefinity .NET Core and leverage its decoupled architecture and new way of coding against the platform.

Tags

Was this article helpful?