Add webpart to page through module (Elements.xml) in SharePoint

Introduction

There are several ways to add pages into SharePoint page. To day i will illustrate how to add a webpart to SharePoint page through modules using Elements. xml file.

Solution

Step 1: Add a page into Visual Studio SharePoint solution. You can use this post how to do it.

You need a webpart zone to add a webpart, and according to my post the webpart zone ID is WebPartZoneSearch

Step 2: Then create a webpart as your wish.

Then the solution will be looking something like this.

Step 03: Open the Elements.xml file which is inside Module1 and you have to modify it something like this.

1. <?xml version="1.0" encoding="utf-8"?>
2. <Elements xmlns="http://schemas.microsoft.com/sharepoint/">
3.   <Module Name="Module1">
4.     <File Path="Module1\ApplicationPage1.aspx" Url="Module1/ApplicationPage1.aspx" >
5.       <AllUsersWebPart WebPartOrder ="0" WebPartZoneID ="WebPartZoneSearch">
6.         <![CDATA[
7.           <webParts>
8.             <webPart xmlns="http://schemas.microsoft.com/WebPart/v3">
9.               <metaData>
10.                 <type name="SitePages.WebPart1.WebPart1, $SharePoint.Project.AssemblyFullName$" />
11.                 <importErrorMessage>Cannot import this Web Part.</importErrorMessage>
12.               </metaData>
13.               <data>
14.                 <properties>
15.                   <property name="Title" type="string">WebPart Title</property>
16.                   <property name="Description" type="string">WebPart Title</property>
17.                                       </properties>
18.               </data>
19.             </webPart>
20.           </webParts>
21.         ]]>
22.       </AllUsersWebPart>
23.     </File>
24.   </Module>
25. </Elements>

Changes for your code:

Line No 05: You have to add the WebPartZoneID which is from aspx page.

Line No 10: Full Assembly name of your webpart.

Please change both according to your solution.

Conclusion

You can add other property like chrome type through Elements.xml file as well.

Please find the solution here, which may helpful to you. 

https://drive.google.com/file/d/0ByEnOE8DAdvheEJaY1RUSkdEM28/view?usp=sharing

Create Site Pages through Visual Studio for SharePoint 2013 and SharePoint Online

Introduction

Recently I had to tell one of friends how to create Site pages in SharePoint 2013 with Visual Studio. So I had to come up with a easiest way to describe. Here is it.

Solution

I will be adding a application page and making it as the site page.

Step 01: Add a Application Page

Right click on the project and and a new item (Add –> New Item); there select Application Page.

Step 02: Add a module for site page

Right click on the project and and a new item (Add –> New Item); there select Module.

Step 03: Drop application page inside module

Drag and drop the application inside the module. So your module will look something like this.

 

Step 04: Remove the Code behind file

Our intension is to add webpart zone inside the application page and no need of code behind, So we will delete the file with the extension “.aspx.cs”. Now the module will be look something as below.

Step 05: Remove code behind reference from aspx page

Go to aspx page and in our case its “ApplicationPage1.aspx” and remove the line

1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ApplicationPage1.aspx.cs" Inherits="SitePages.Layouts.SitePages.ApplicationPage1" DynamicMasterPageFile="~masterurl/default.master" %>

Here the master page also will get removed. So we have to add the reference to the master page. Add the below code at the top of the page.

1. <%@ Page Language="C#" MasterPageFile="~masterurl/default.master" Inherits="Microsoft.SharePoint.WebPartPages.WebPartPage,Microsoft.SharePoint,Version=15.0.0.0,Culture=neutral,PublicKeyToken=71e9bce111e9429c" %>

Step 06: Remove project assemble.

Remove the below line which refer the the project. If not this is will throw an error when we try to deploy in SharePoint online.

1. <%@ Assembly Name="$SharePoint.Project.AssemblyFullName$" %>

Step 07: Add webpart zone

Now add webpart zone into PlaceHolderMain.

1. <asp:Content ID="Main" ContentPlaceHolderID="PlaceHolderMain" runat="server">
2. <WebPartPages:WebPartZone ID="WebPartZoneSearch" runat="server" Title="Webpart zone">
3.                         <ZoneTemplate>
4.                         </ZoneTemplate>
5.                     </WebPartPages:WebPartZone>
6. </asp:Content>

Once you add Webpart Zone you have to import necessary assembly. Add below register tag on the page.

1. <%@ Register TagPrefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

Step 08: Deploy the solution.

Now deploy the solution and you can go to your site page through the url in the module.

So the url will http://<SiteUrl>/Module1/ApplicationPage1.aspx

Conclusion

Now your site page is deployed and you can see the webpart zone in the edit mode also.

You can download the code from here.

https://drive.google.com/file/d/0ByEnOE8DAdvhZW5QbktFRzR3bnM/view?usp=sharing