Layout widgets: Create custom layout widgets

Sitefinity CMS comes with 10 built-in layout widgets that you can use to create more complex layout for your pages or layout templates. You can also create your own layout widgets and use them from the toolbox of the page editor.

Create an .ascx file that describes the HTML

To create a layout widget you need to create a simple .ascx with standard HTML markup. The file can be placed anywhere in your project. We recommend placing the file in your website templates folder ~/App_Data/Sitefinity/WebsiteTemplates/YourTemplate/CustomLayouts/Custom1.ascx.

Following is a sample code for the file:

Register the custom layout widget in the toolbox

To register a custom layout widget (.ascx), perform the following:
  1. In the main menu, click Administration » Settings.
    The Basic settings page appears.
  2. Click Advanced.
  3. Expand Toolboxes » Toolboxes » PageLayouts » Sections » TwoColumns » Tools.
  4. Click Create new.
  5. Fill the form in the following way:
    • In Control CLR Type or Virtual Path enter Telerik.Sitefinity.Web.UI.LayoutControl
    • In the Name and Title fields enter the programmatic name and the display title.
    • In LayoutTemplate filed enter the path to your custom template.
      For example ~/CustomLayouts/treecolumns.ascx.
  6. Click Save changes.

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

Web Security for Sitefinity Administrators

The free standalone Web Security lesson teaches administrators how to protect your websites and Sitefinity instance from external threats. Learn to 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.

Was this article helpful?