Customize Download list widget templates

For widgets that inherit from SimpleView or SimpleScriptView classes, you change their template by setting the LayoutTemplatePath property to your own template value. This tutorial demonstrates how to set your own widget template to a widget that does not inherit from SimpleView or SimpleScriptView classes - the Download list widget.

The Download list widget displays documents and files in different ways according to the type you choose in the designer - List, Table, Table+Detail page, List+Detail page. You can customize the template for each of these types in the following way:

  1. Open your project in Visual Studio.
  2. In the context menu of SitefinityWebApp, click Add » New Folder.
  3. Name the folder CustomControls.
  4. In the context menu of the folder, click Add » New Item... » Visual C# » Class.
  5. Name the class CustomDownloadListWidget.
  6. Make the new class inherit from the original control DownloadListView.
  7. In the context menu of the folder, click Add » New Item... » Visual C# » Code File.
  8. Name the file CustomMasterTableView.ascx
    Create one more template and name it MasterListView.ascx
    These will be the custom templates for the Download list widget when you select Table or List in the designer.
  9. In the SitefinityResources GitHub repository, find the default templates with the name MasterTableView.ascx and MasterListView.ascx used by the original control.
  10. Copy the original templates' content, paste it into your custom templates, and modify it according to your needs.

    NOTE: Because there are required controls, when extending the template, you must add these controls to the new one. For example, such required control is the RadGrid with ID documentsGrid. Otherwise, you will receive A required control was not found in the template for . . . error. 

  11. In the Properties window, make the template an embedded resource, by setting its Build Action to Embedded Resource
  12. Open CustomDownloadListWidget.cs and override the LoadView method in the following way:

    NOTE: Because the template is created in SitefinityWebApp, the sample above uses a virtual path for the embedded custom template: "~/CustomPrefix/". For more information, see Taking advantage of the Virtual Path Provider.

    By default FrontentMasterListViewName is used by the DocumentsDefintions. To load your custom template according to the setting chosen in the designer, check the viewName in the LoadView method, and set the LayoutTemplatePath property accordingly.

  13. Build the solution.
  14. Register your widget in the toolbox and make it useable by content editors.

After this procedure, whenever you select a view from the Download list widget designer, the corresponding custom template is loaded.

Also, to make your templates editable from the UI, open Designer » Widget templates and store them as the default Download list templates.

Want to learn more?

Sign up for our free beginner training. Boost your credentials through advanced courses and certification.
Register for Sitefinity training and certification.

Was this article helpful?