Types Of Web Parts In SharePoint 2013

What Is Webpart ?

Webparts are one of the most commonly used in SharePoint.  Webparts framework was first introduced in ASP.NET 2.0. Webparts that are inherited from Webpart class are fully supported in SharePoint and are useful in many ways.

 

A Web Part, also called a Web Widget, is an ASP.NET server control which is added to a Web Part Zone on Web Part Pages by users at run time.

 

From an End User perspective it’s a single unit of a re-usable component that can be added to a SharePoint page to perform a specific task.

Types of Webparts 

 

We can create a webpart in three ways.

1. Using Visual Studio
2. Uisng SharePoint Designer
3. Using Out Of Box 

Using Visual Studio

  

Open Visual Studio -> Create a new Empty SharePoint 2013 Project -> Choose the Solution, where you want to deploy 

 

 

Right Click The Project , then Select “Add” and click the “New Item” link in the context menu  ->

 

Click on New Item then In the Installed Templates, select “Visual Web Part”



Once you click Add, then project will be created inside Visual Studio.

 

The Webpart file automatically created these many files inside project folder.  If you want to change the scope of the feature then we are able to change the feature inside Feature.feature file.

 

 

Once you set the Feature , we can open .ascx file to add the control and design the page as per the requirement. 

<%@ Assembly Name="$SharePoint.Project.AssemblyFullName$" %>
    <%@ Assembly Name="Microsoft.Web.CommandUI, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
        <%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
            <%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
                <%@ Register Tagprefix="asp" Namespace="System.Web.UI" Assembly="System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
                    <%@ Import Namespace="Microsoft.SharePoint" %>
                        <%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
                            <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="VisualWebPart1.ascx.cs" Inherits="First_VisualWebPart.VisualWebPart1.VisualWebPart1" %>
                                <table>
                                    <tr>
                                        <td>
                                            <asp:DropDownList ID="ddltest" runat="server"> </asp:DropDownList>
                                        </td>
                                        <td> </td>
                                        <td>
                                            <asp:Button ID="btngetData" runat="server" Text="Test Webpart" OnClick="btngetData" /> </td>
                                    </tr>
                                </table> // This is just a sample script. Paste your real code (javascript or HTML) here. if ('this_is'==/an_example/){of_beautifier();}else{var a=b?(c%d):e[f];}

Once you complete everything, you should deploy the WebPart .

 

Right click On Project -> select “Deploy” from the context Menu.

 

It will take some time to build the solution and once you get a success message, you should collect the WSP file (which can be located at bin\Debug folder of the project) .

 

Deploys the WSP to the Central Admin and activates the feature in the site collection which was provided during creation of this project. 

 

Open the deployed site URL in a browser and add a new page or edit an existing page, Click Add a Web Part link shown in the Web Part zones. This displays all the available Web Parts in the top of the page. Under the “Categories” section select the “Custom” category, which will list out our newly deployed Web Part. Select the Web Part and Click “Add” to add the Web Part to the selected Zone

 

 

Save the Page, now you will be able to see your first Visual Web Part on SharePoint 2013 

 

Using SharePoint Designer

 

Open Your site in SharePoint Designer -> Create a Webpart page located on top of the menu 

 

 

 

 Enter Your Webpart Page name and click ok .

 

 

 

 

Then Go to your Webpart and Open -> Design Your Page -> Deploy.

 

Using Out Of Box

 

Microsoft has already provided so many Webparts to manage our Document or other things.

 

Go to the Sharepoint site page and click Edit Page.

 

Choose a zone for the Web Part, and then click Add a Web Part in that zone. The Add Web Parts Web Page dialog box opens.

 

In the Add Web Parts dialog box, here select the Apps Web Parts,  select the Splessonslist Web Part check box, and then click Add.  You will get a direct list of content here. 

 

ListView Webpart

 

 

Media and Content 

 

Search 

                               

 

Forms 

 

Document Set

 

These all are Out Of the Box Webparts in SharePoint 2013.