Create a Visual Webpart in SharePoint 2013

Creating a Visual WebPart in SharePoint 2013 is different than what it was available in SharePoint 2010. In SharePoint 2010, Visual WebPart was made of a User Control and a Webpart file which were used to define Controls and define properties of the webpart. In SharePoint 2013 however the Visual WebPart template has Changed. Both the User Control and WebPart classes are merged to Create one template.

Also, now you have one Visual WebPart template that can be used to Create both Sandbox and Farm solution. In this post we will look at detailed steps on how to create a Visual WebPart Farm solution and add the wsp to your SharePoint site.

Step 1 - Create a SharePoint 2013 Visual WebPart Project.

"SharePoint 2013 Create Visual Webpart"

Step 2 - Next add the Site Url and select deploy as farm.
"SharePoint 2013 Deploy As Farm"
Step 3 - The Solution should look like below.
"SharePoint 2013 Solution Explorer"

Step 4 - Next add a TextBox in the ascx file and add assign it some text using the Code behind.
"SharePoint 2013 Txt Box Code"

Step 5 - Once you add the Textbox save the project and click Start.
"SharePoint 2013 Start project"

Step 6 - Next navigate to the site and verify if the solution is added to the Solutions gallery.You can also add the wsp from your project folder in the Solutions gallery and activate it. See below.
"SharePoint 2013 wsp"
Navigate to Site Settings -> Solutions and upload the wsp. Make sure that the solution is Activated.
"SharePoint 2013 Activate Solution"
Step 7 - Next Add the Visual Webpart to the page. Create a page using "Add Page" in Settings menu and edit it. Next click on the Insert tab and select "Web Part"
"SharePoint 2013 Add Webpart to page"
"SharePoint 2013 Insert WebPart to Page"

Step 8 - Once you add the webpart, save the page and you would see the resulting webpart with a textbox.
"SharePoint 2013 Visual WebPart"


Post a Comment

Popular Posts