Creating Custom User Control Templates In SharePoint 2013 Using Visual Studio

Introduction

Custom user controls provide custom functionality for your SharePoint Solution. A user control is a control that is associated with a .ASCX extension. It can reuse that functionality within your project and can include the user controls in a master page, web part, or an application page. In this article, I will explain how to create Custom User Control Templates in SharePoint 2013, using Visual Studio.

Pre-Requisites

1. Open Visual Studio.
2. Open New Project dialog box. Expand Office/SharePoint node and then choose SharePoint Solutions.
   
   
   
   
3. Choose the SharePoint 2013 – Empty Project template. Name the project as CustomControlProject.
   
   
   
   
4. Choose the "Deploy as a farm solution" option (because User Control will work only in farm solutions) and click Finish.
   
   
   
   
5. CustomControlProject SharePoint project gets created.
   
   
   

Create Custom User Control

1. Right click on CustomControlProject -> Add -> New Folder.
   
   
   
   
2. Name the folder as “USER CONTROLS”.
   
   
   
   
3. Right click on USER CONTROLS folder ->Add -> New Item.
   
   
   
   
4. Add User Control (Farm Solution Only) from the Add New Item window. Name it as “CustomControl”.
   
   
   
   
5. User control will be created in the following folder structure.
   
   
   
   
6. Open CustomControl.ascx file and add the fields we want, in user control from the Toolbox panel.
   
   
   
   
7. Open CustomControl.ascx.cs file and write the C# code behind function for the event receivers.
   
   
   
   
8. Create Application page or Master page to the CustomControlProject.
   
   
   
   
9. Add the “CustomControl.ascx” user control to the Application page or Master page,
   

   <%@ Register TagPrefix="UserControl1" TagName="CustomControl" Src="~/_controltemplates/15/CustomControlProject/CustomControl.ascx" %>

   
   
   
10. Add the declared user control inside the page content <asp:Content> tag.
    

    <UserControl1:CustomControl runat="server" id="CustomControlTemplate" />

    
    
    
11. Build and deploy the SharePoint solution.
    
    
12. Open the SharePoint site and open the ApplicationPage1.aspx page.
    
    /_layouts/15/CustomControlProject/ApplicationPage1.aspx
    
    
13. Our User Control gets added to the application page.

Summary - Thus, you have learned how to create Custom User Control Templates in SharePoint 2013, using Visual Studio.