European Sharepoint 2013 Hosting Blog

SharePoint 2013 Hosting – HostForLIFE : SPFx Fast Serve To Reduce The Build Time In SharePoint Framework Solutions

Jun 24th

Posted by Peter in European SharePoint 2013 Hosting

Problem Statement

When you will create an SPFx webpart/extension using the yo generator of @microsoft/SharePoint it takes time to build the solution when you use “Gulp serve”. The time taken is large and impacts our work, and moreover, whenever we make changes to the code it further takes time to refresh the latest changes on the workbench(local/SharePoint).

Solution

Thankfully, we have something which can reduce our build time drastically.

“spfx-fast-serve” is a CLI tool that does the job. A command-line utility, which modifies your SharePoint Framework solution, so that it runs continuously to serve command as fast as possible.

Steps to implement

Step 1 – Install the spfx-fast-serve package.

Open the spfx solution structure in nodeJs and run the command,

npm install spfx-fast-serve -g

Step 2

Run spfx-fast-serve and follow the instructions if prompted.

Step 3

Run npm install,

Step 4

Run npm run serve and enjoy the incredible speed of serve command,

Outcome

The time difference between the gulp serve and the npm run serve is huge and you can see the difference in the below table.

Final Thoughts

This is useful when you are building a large solution where you are using multiple webparts/extensions in a single solution as this will decrease the time taken to build the solution. Though the first time, it might take some more time but as soon as you make the changes in code the workbench loads up quickly compared to standard.

SharePoint 2013 Hosting – HostForLIFE : Implementation Of ListPicker And Associated FieldPicker In Property Pane Of SPFx

Jun 17th

Posted by Peter in European SharePoint 2013 Hosting

In this article, we will learn how to implement listpicker and associated fieldpicker in propertypane of SPFx webpart component.

Steps

Open a command prompt and create a directory for the SPFx solution.

md spfx-ListAndFieldPicker

Navigate to the above created directory.

cd spfx-ListAndFieldPicker

Run the Yeoman SharePoint Generator to create the solution.

yo @microsoft/sharepoint

Solution Name

Hit enter for the default name (spfx-ListAndFieldPicker in this case) or type in any other name for your solution.

Selected choice – Hit Enter

Target for the component

Here, we can select the target environment where we are planning to deploy the client web part; i.e., SharePoint Online or SharePoint OnPremise (SharePoint 2016 onwards).

Selected choice – SharePoint Online only (latest).

Place of files

We may choose to use the same folder or create a subfolder for our solution.

Selected choice – same folder.

Deployment option

Selecting Y will allow the app to be deployed instantly to all sites and be accessible everywhere.

Selected choice – N (install on each site explicitly).

Permissions to access web APIs

Choose if the components in the solution require permission to access web APIs that are unique and not shared with other components in the tenant.

Selected choice – N (solution contains unique permissions)

Type of client-side component to create

We can choose to create a client-side web part or an extension. Choose the web part option.

Selected choice – WebPart

Web part name

Hit enter to select the default name or type in any other name.

Selected choice – ListAndFieldPicker

Web part description

Hit enter to select the default description or type in any other value.

Framework to use

Select any JavaScript framework to develop the component. Available choices are – No JavaScript Framework, React, and Knockout.

Selected choice – React

The Yeoman generator will perform a scaffolding process to generate the solution. The scaffolding process will take a significant amount of time.

Once the scaffolding process is completed, lock down the version of project dependencies by running the below command,

npm shrinkwrap

In the command prompt, type the below command to open the solution in the code editor of your choice.

Needed Props

for Listpicker,

for FieldPicker,

Initialization model for list picker,

<span class="token function"><span class="token maybe-class-name">PropertyFieldListPicker</span></span><span class="token punctuation">(</span><span class="token string">'lists'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
  label<span class="token operator">:</span> <span class="token string">'Select a list'</span><span class="token punctuation">,</span>
  selectedList<span class="token operator">:</span> <span class="token keyword keyword-this">this</span><span class="token punctuation">.</span><span class="token property-access">properties</span><span class="token punctuation">.</span><span class="token property-access">lists</span><span class="token punctuation">,</span>
  includeHidden<span class="token operator">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span>
  orderBy<span class="token operator">:</span> <span class="token maybe-class-name">PropertyFieldListPickerOrderBy</span><span class="token punctuation">.</span><span class="token property-access"><span class="token maybe-class-name">Title</span></span><span class="token punctuation">,</span>
  disabled<span class="token operator">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span>
  onPropertyChange<span class="token operator">:</span> <span class="token keyword keyword-this">this</span><span class="token punctuation">.</span><span class="token method function property-access">onPropertyPaneFieldChanged</span><span class="token punctuation">.</span><span class="token method function property-access">bind</span><span class="token punctuation">(</span><span class="token keyword keyword-this">this</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
  properties<span class="token operator">:</span> <span class="token keyword keyword-this">this</span><span class="token punctuation">.</span><span class="token property-access">properties</span><span class="token punctuation">,</span>
  context<span class="token operator">:</span> <span class="token keyword keyword-this">this</span><span class="token punctuation">.</span><span class="token property-access">context</span><span class="token punctuation">,</span>
  onGetErrorMessage<span class="token operator">:</span> <span class="token keyword null nil keyword-null">null</span><span class="token punctuation">,</span>
  deferredValidationTime<span class="token operator">:</span> <span class="token number">0</span><span class="token punctuation">,</span>
  key<span class="token operator">:</span> <span class="token string">'listPickerFieldId'</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>

PropertyFieldListPicker('lists', {

label: 'Select a list',

selectedList: this.properties.lists,

includeHidden: false,

orderBy: PropertyFieldListPickerOrderBy.Title,

disabled: false,

onPropertyChange: this.onPropertyPaneFieldChanged.bind(this),

properties: this.properties,

context: this.context,

onGetErrorMessage: null,

deferredValidationTime: 0,

key: 'listPickerFieldId'

})

Initialization model for column picker,

In some version of spfx you will face context error in the line,

You can resolve that using the below replacement of code,

Full Code

In IListAndFieldPickerProps.ts,

In ListAndFieldPickerWebPart.ts,

SharePoint 2013 Hosting – HostForLIFE : Modal Popup In SPFx

Jun 9th

Posted by Peter in European SharePoint 2013 Hosting

In this article, we will learn about the implementation of Modal Popup in our SPFx component using FluentUi.

Steps

Open a command prompt and create a directory for the SPFx solution.

md spfx-MyModalPopup

Navigate to the above created directory.

cd spfx-MyModalPopup

Run the Yeoman SharePoint Generator to create the solution.

yo @microsoft/sharepoint

Solution Name

Hit Enter for the default name (spfx-MyModalPopup in this case) or type in any other name for your solution.

Selected choice – Hit Enter

Target for the component

Here, we can select the target environment where we are planning to deploy the client web part; i.e., SharePoint Online or SharePoint OnPremise (SharePoint 2016 onwards).

Selected choice – SharePoint Online only (latest).

Place of files

We may choose to use the same folder or create a subfolder for our solution.

Selected choice – same folder.

Deployment option

Selecting Y will allow the app to be deployed instantly to all sites and be accessible everywhere.

Selected choice – N (install on each site explicitly).

Permissions to access web APIs

Choose if the components in the solution require permission to access web APIs that are unique and not shared with other components in the tenant.

Selected choice – N (solution contains unique permissions)

Type of client-side component to create

We can choose to create a client-side web part or an extension. Choose the web part option.

Selected choice – WebPart

Web part name

Hit Enter to select the default name or type in any other name.

Selected choice – MyModalPopup

Web part description

Hit Enter to select the default description or type in any other value.

Framework to use

Select any JavaScript framework to develop the component. Available choices are – No JavaScript Framework, React, and Knockout.

Selected choice – React

The Yeoman generator will perform a scaffolding process to generate the solution. The scaffolding process will take a significant amount of time.

Once the scaffolding process is completed, lock down the version of project dependencies by running the below command,

npm shrinkwrap

In the command prompt, type the below command to open the solution in the code editor of your choice.

In MyModalPopup.tsx,

In MYModal.tsx,

Expected Output

Conclusion

In this article, we learned how to implement Modal Popup in our SPFx component. I hope this helps someone. Happy coding 🙂

SharePoint 2013 Hosting – HostForLIFE : Get User Properties And User Information List in SharePoint REST API

May 27th

Posted by Peter in European SharePoint 2013 Hosting

Hey there! In this blog, we are going to see how can we fetch User Names and User Emails using a REST API call that displays particular user information.

In SharePoint, you can access the User Information List to get basic data about a user.

This list is hidden and there’s no direct link provided by Microsoft to access the list, which I will discuss later in this blog.

To get the user Name and Email, we are going to use the endpoint,

_spPageContextInfo.webAbsoluteUrl + “/_api/web/getuserbyid(” + UserID + “)”;

JavaScript Code

function fnGetUserProps() {      
    var UserID = _spPageContextInfo.userId;      
    var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/getuserbyid(" + UserID + ")";      
    $.ajax({      
        url: requestUri,      
        type: "GET",      
        headers: {      
            "Accept": "application/json; odata=verbose"      
        },      
        async: false,      
        success: function(data) {      
            var userName = data.d.Title;     
            var userEmail = data.d.Email;    
            alert(userName+' '+userEmail);

        },      
        error: function(error) {      
            console.log("fnGetUserProps:: " + error);      
        }      
    });      
}

function fnGetUserProps() {

var UserID = _spPageContextInfo.userId;

var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/getuserbyid(" + UserID + ")";

$.ajax({

url: requestUri,

type: "GET",

headers: {

"Accept": "application/json; odata=verbose"

async: false,

success: function(data) {

var userName = data.d.Title;

var userEmail = data.d.Email;

alert(userName+' '+userEmail);

error: function(error) {

console.log("fnGetUserProps:: " + error);

}

});

}

REST API to Get all properties of the current user,

http://siteurl/_api/SP.UserProfiles.PeopleManager/GetMyProperties

REST API to Get all properties of Specific User,

http://siteurl/_api/SP.UserProfiles.PeopleManager/GetPropertiesFor(accountName=@v)?@v=’i:0%23.f|membership|user@domain.com’

For more information refer the URL below,

https://docs.microsoft.com/en-us/previous-versions/office/developer/sharepoint-rest-reference/dn790354(v=office.15)?redirectedfrom=MSDN#bk_PeopleManagerGetPropertiesFor

User Information List

The User Information List is hidden which resides only in Root Site Collection and contains data about the user added as part of their Active Directory (AD) profile configuration, users don’t have a direct link to access it.
Whenever you grant access to the user on the SharePoint site/list or the other resource, the user automatically gets added to the present list.
If any AD Group is given permission on-site, the group also will be added to the User Information List, and also the Group-users are going to be added to the list.
You can access the User Information list as long as you’re an Admin of the location.

To access User Information List

Get detailed information for users – https://SiteURL/_catalogs/users/detail.aspx

Get basic information for users – https://SiteURL/_catalogs/users/simple.aspx

Access SharePoint User Information List Using REST API

function fnGetAllFields() {    
    $.ajax({    
        url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists/getByTitle('User Information List')/fields",    
        method: "GET",    
        headers: {    
            "Accept": "application/json;odata=verbose"    
        },    
        success: function(data) {    
            var dataResults = data.d.results;    
            for (var i = 0; i < dataResults.length; i++) {    
                console.log(dataResults[i]["Title"]);    
            }    
        },    
        error: function(error) {    
            console.log("Failed");    
        }    
    });    
}

function fnGetAllFields() {

$.ajax({

url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists/getByTitle('User Information List')/fields",

method: "GET",

headers: {

"Accept": "application/json;odata=verbose"

success: function(data) {

var dataResults = data.d.results;

for (var i = 0; i < dataResults.length; i++) {

console.log(dataResults[i]["Title"]);

}

error: function(error) {

console.log("Failed");

}

});

}

SharePoint 2013 Hosting – HostForLIFE: How To Enable/Activate Spaces?

May 20th

Posted by Peter in European SharePoint 2013 Hosting

Let’s take a deep dive into a detailed blog about SharePoint Spaces, how you can activate this for your tenant, and many more things.

What is SharePoint Spaces?

Microsoft defines SharePoint Spaces as, “a web-based, immersive platform, which allows you to create and share, secure and extensible mixed reality experiences.”

In simple terms, SharePoint Space is a space built on an existing site wherein you can add web parts like 3D Images, 360-degree videos, 360-degree Images, 3D objects to give users a 3D immersive experience, and many more OOTB web parts.

Note

(It is recommended to use the Communication site, but you can add in Team site as well.)

First things first: how to enable/activate SharePoint spaces for your tenant.

To enable SharePoint Spaces, follow these steps:

Choose any of the existing communication sites or create a new communication site if you don’t have one,

Select Site Information -> Site Settings -> Site Actions, Select Manage site Features

In Manage site features, look for the Spaces (Preview) option and click on Activate to enable Spaces for your site.

Now, go to your home page, and click on “+New”, you will see, Spaces (Preview) enabled for your site collection and ready to create a new Space experience.

I hope all you SharePoint enthusiasts now know what SharePoint Spaces is and how to activate this for your site collection.

Stay tuned, for Blog Series 2 on creating a SharePoint space with all the OOTB web parts and how you can leverage this functionality for various use-cases.

References: https://www.exploresharepointspaces.com/

SharePoint 2013 Hosting – HostForLIFE :: Add, Update And Remove Web Part Using CSOM

May 5th

Posted by Peter in European SharePoint 2013 Hosting

Introduction

Web parts are the building blocks of the pages by which you can modify the content, appearance and behavior of pages of a SharePoint site.

In this blog we are going to discuss how to Add, Update and Remove the web part using csom. Here I have used Content Editor Web Part in Wiki page.

Adding the web part in a wikipage

Step 1

First set the credentials by providing the user credentials.

Step 2

Using the client context, load the web.

Step 3

Get the object of the file using server relative url of the wiki page in which you want to add the web part. Example (/sites/Team Site/Site Pages/wikiPage.aspx).

Step 4

Get the ‘limitedWebPartManager‘ by using object file.

Step 5

Design the Xml string for importing the web part as definition of web part in ‘limitedWebPartManager’. In xml I have added the Title of web part as ‘My Web Part’.

Step 6

Then add the web part order and left zone of the page.

Follow the below code snippet,

<span class="keyword">using</span> System;  

<span class="keyword">using</span> Microsoft.SharePoint.Client;  

<span class="keyword">using</span> Microsoft.SharePoint.Client.WebParts;  

<span class="keyword">using</span> System.Security;  

<span class="keyword">namespace</span> webpartadd {  

    <span class="keyword">class</span> Program {  

        <span class="keyword">static</span> <span class="keyword">void</span> Main(<span class="keyword">string</span>[] args) {  

            <span class="keyword">string</span> userName = <span class="string">"userName@tenantName.onmicrosoft.com"</span>;  

            <span class="keyword">string</span> password = <span class="string">"PassWord"</span>;  

            <span class="keyword">string</span> siteUrl = <span class="string">"https://tenantName.sharepoint.com/sites/TeamSite"</span>;  

            SecureString securePassword = <span class="keyword">new</span> SecureString();  

            <span class="keyword">foreach</span>(<span class="keyword">char</span> c <span class="keyword">in</span> password) {  

                securePassword.AppendChar(c);  

            }  

            var credentials = <span class="keyword">new</span> SharePointOnlineCredentials(userName, securePassword);  

            <span class="keyword">using</span>(ClientContext clientContext = <span class="keyword">new</span> ClientContext(siteUrl)) {  

                <span class="keyword">try</span> {  

                    clientContext.Credentials = credentials;  

                    clientContext.Load(clientContext.Web);  

                    clientContext.ExecuteQuery();  

                    File oFile = clientContext.Web.GetFileByServerRelativeUrl(<span class="string">"/sites/TeamSite/SitePages/wikiPage.aspx"</span>);  

                    LimitedWebPartManager limitedWebPartManager = oFile.GetLimitedWebPartManager(PersonalizationScope.Shared);  

                    <span class="keyword">string</span> xmlWebPart = <span class="string">"&lt;?xml version=\"1.0\" encoding=\"utf-8\"?&gt;"</span> + <span class="string">"&lt;WebPart xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\""</span> + <span class="string">" xmlns:xsd=\"http://www.w3.org/2001/XMLSchema\""</span> + <span class="string">" xmlns=\"http://schemas.microsoft.com/WebPart/v2\"&gt;"</span> + <span class="string">"&lt;Title&gt;My Web Part&lt;/Title&gt;&lt;FrameType&gt;Default&lt;/FrameType&gt;"</span> + <span class="string">"&lt;Description&gt;Use for formatted text, tables, and images.&lt;/Description&gt;"</span> + <span class="string">"&lt;IsIncluded&gt;true&lt;/IsIncluded&gt;&lt;ZoneID&gt;&lt;/ZoneID&gt;&lt;PartOrder&gt;0&lt;/PartOrder&gt;"</span> + <span class="string">"&lt;FrameState&gt;Normal&lt;/FrameState&gt;&lt;Height /&gt;&lt;Width /&gt;&lt;AllowRemove&gt;true&lt;/AllowRemove&gt;"</span> + <span class="string">"&lt;AllowZoneChange&gt;true&lt;/AllowZoneChange&gt;&lt;AllowMinimize&gt;true&lt;/AllowMinimize&gt;"</span> + <span class="string">"&lt;AllowConnect&gt;true&lt;/AllowConnect&gt;&lt;AllowEdit&gt;true&lt;/AllowEdit&gt;"</span> + <span class="string">"&lt;AllowHide&gt;true&lt;/AllowHide&gt;&lt;IsVisible&gt;true&lt;/IsVisible&gt;&lt;DetailLink /&gt;&lt;HelpLink /&gt;"</span> + <span class="string">"&lt;HelpMode&gt;Modeless&lt;/HelpMode&gt;&lt;Dir&gt;Default&lt;/Dir&gt;&lt;PartImageSmall /&gt;"</span> + <span class="string">"&lt;MissingAssembly&gt;Cannot import this Web Part.&lt;/MissingAssembly&gt;"</span> + <span class="string">"&lt;PartImageLarge&gt;/_layouts/images/mscontl.gif&lt;/PartImageLarge&gt;&lt;IsIncludedFilter /&gt;"</span> + <span class="string">"&lt;Assembly&gt;Microsoft.SharePoint, Version=13.0.0.0, Culture=neutral, "</span> + <span class="string">"PublicKeyToken=94de0004b6e3fcc5&lt;/Assembly&gt;"</span> + <span class="string">"&lt;TypeName&gt;Microsoft.SharePoint.WebPartPages.ContentEditorWebPart&lt;/TypeName&gt;"</span> + <span class="string">"&lt;ContentLink xmlns=\"http://schemas.microsoft.com/WebPart/v2/ContentEditor\" /&gt;"</span> + <span class="string">"&lt;Content xmlns=\"http://schemas.microsoft.com/WebPart/v2/ContentEditor\"&gt;"</span> + <span class="string">"&lt;![CDATA[This is a first paragraph!&lt;DIV&gt; &lt;/DIV&gt;And this is a second paragraph.]]&gt;&lt;/Content&gt;"</span> + <span class="string">"&lt;PartStorage xmlns=\"http://schemas.microsoft.com/WebPart/v2/ContentEditor\" /&gt;&lt;/WebPart&gt;"</span>;  

                    WebPartDefinition oWebPartDefinition = limitedWebPartManager.ImportWebPart(xmlWebPart);  

                    limitedWebPartManager.AddWebPart(oWebPartDefinition.WebPart, <span class="string">"Left"</span>, 1);  

                    clientContext.ExecuteQuery();  

                } <span class="keyword">catch</span> (Exception e) {  

                    Console.WriteLine(e);  

                }  

            }  

            Console.WriteLine(<span class="string">"Succcesfully added webpart"</span>);  

        }  

    }  

}

using System;

using Microsoft.SharePoint.Client;

using Microsoft.SharePoint.Client.WebParts;

using System.Security;

namespace webpartadd {

class Program {

static void Main(string[] args) {

string userName = "userName@tenantName.onmicrosoft.com";

string password = "PassWord";

string siteUrl = "https://tenantName.sharepoint.com/sites/TeamSite";

SecureString securePassword = new SecureString();

foreach(char c in password) {

securePassword.AppendChar(c);

}

var credentials = new SharePointOnlineCredentials(userName, securePassword);

using(ClientContext clientContext = new ClientContext(siteUrl)) {

try {

clientContext.Credentials = credentials;

clientContext.Load(clientContext.Web);

clientContext.ExecuteQuery();

File oFile = clientContext.Web.GetFileByServerRelativeUrl("/sites/TeamSite/SitePages/wikiPage.aspx");

LimitedWebPartManager limitedWebPartManager = oFile.GetLimitedWebPartManager(PersonalizationScope.Shared);

string xmlWebPart = "<?xml version=\"1.0\" encoding=\"utf-8\"?>" + "<WebPart xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\"" + " xmlns:xsd=\"http://www.w3.org/2001/XMLSchema\"" + " xmlns=\"http://schemas.microsoft.com/WebPart/v2\">" + "<Title>My Web Part</Title><FrameType>Default</FrameType>" + "<Description>Use for formatted text, tables, and images.</Description>" + "<IsIncluded>true</IsIncluded><ZoneID></ZoneID><PartOrder>0</PartOrder>" + "<FrameState>Normal</FrameState><Height /><Width /><AllowRemove>true</AllowRemove>" + "<AllowZoneChange>true</AllowZoneChange><AllowMinimize>true</AllowMinimize>" + "<AllowConnect>true</AllowConnect><AllowEdit>true</AllowEdit>" + "<AllowHide>true</AllowHide><IsVisible>true</IsVisible><DetailLink /><HelpLink />" + "<HelpMode>Modeless</HelpMode><Dir>Default</Dir><PartImageSmall />" + "<MissingAssembly>Cannot import this Web Part.</MissingAssembly>" + "<PartImageLarge>/_layouts/images/mscontl.gif</PartImageLarge><IsIncludedFilter />" + "<Assembly>Microsoft.SharePoint, Version=13.0.0.0, Culture=neutral, " + "PublicKeyToken=94de0004b6e3fcc5</Assembly>" + "<TypeName>Microsoft.SharePoint.WebPartPages.ContentEditorWebPart</TypeName>" + "<ContentLink xmlns=\"http://schemas.microsoft.com/WebPart/v2/ContentEditor\" />" + "<Content xmlns=\"http://schemas.microsoft.com/WebPart/v2/ContentEditor\">" + "<![CDATA[This is a first paragraph!<DIV> </DIV>And this is a second paragraph.]]></Content>" + "<PartStorage xmlns=\"http://schemas.microsoft.com/WebPart/v2/ContentEditor\" /></WebPart>";

WebPartDefinition oWebPartDefinition = limitedWebPartManager.ImportWebPart(xmlWebPart);

limitedWebPartManager.AddWebPart(oWebPartDefinition.WebPart, "Left", 1);

clientContext.ExecuteQuery();

} catch (Exception e) {

Console.WriteLine(e);

}

Console.WriteLine("Succcesfully added webpart");

}

In the below image webpat is added in a wikipage,

Updating the web part in a wikipage

Step 1

First set the credentials by providing the user credentials.

Step 2

Using the client context, load the web.

Step 3

Get the object of the file using the server relative URL of the wiki page in which you want to add the web part. Example (/sites/team Site/Site Pages/wikiPage.aspx).

Step 4

Get the ‘limitedWebPartManager‘ by using object file.

Step 5

Load the web part using LINQ query expression to return only the title of each Web Part.

Step 6

Check the page having at least one web part for updating.

Step 7

Get the web part definition by using the order value.

Step 8

Change the web part Title then save the web part by calling ‘SaveWebPartChanges()‘.

Follow the below code snippet,

<span class="keyword">using</span> System;  

<span class="keyword">using</span> Microsoft.SharePoint.Client;  

<span class="keyword">using</span> Microsoft.SharePoint.Client.WebParts;  

<span class="keyword">using</span> System.Security;  

<span class="keyword">namespace</span> UpdateWebpart {  

    <span class="keyword">class</span> Program {  

        <span class="keyword">static</span> <span class="keyword">void</span> Main(<span class="keyword">string</span>[] args) {  

            <span class="keyword">string</span> userName = <span class="string">"userName@tenantName.onmicrosoft.com"</span>;  

            <span class="keyword">string</span> password = <span class="string">"PassWord"</span>;  

            <span class="keyword">string</span> siteUrl = <span class="string">"https://tenantName.sharepoint.com/sites/TeamSite"</span>;  

            SecureString securePassword = <span class="keyword">new</span> SecureString();  

            <span class="keyword">foreach</span>(<span class="keyword">char</span> c <span class="keyword">in</span> password) {  

                securePassword.AppendChar(c);  

            }  

            var cred = <span class="keyword">new</span> SharePointOnlineCredentials(userName, securePassword);  

            <span class="keyword">using</span>(ClientContext clientContext = <span class="keyword">new</span> ClientContext(siteUrl)) {  

                <span class="keyword">try</span> {  

                    clientContext.Credentials = cred;  

                    clientContext.Load(clientContext.Web);  

                    clientContext.ExecuteQuery();  

                    File oFile = clientContext.Web.GetFileByServerRelativeUrl(<span class="string">"/sites/TeamSite/SitePages/wikiPage.aspx"</span>);  

                    LimitedWebPartManager limitedWebPartManager = oFile.GetLimitedWebPartManager(PersonalizationScope.Shared);  

                    clientContext.Load(limitedWebPartManager.WebParts, wps =&gt; wps.Include(wp =&gt; wp.WebPart.Title));  

                    clientContext.ExecuteQuery();  

                    <span class="keyword">if</span> (limitedWebPartManager.WebParts.Count == 0) {  

                        <span class="keyword">throw</span> <span class="keyword">new</span> Exception(<span class="string">"No Web Parts on this page."</span>);  

                    }  

                    WebPartDefinition oWebPartDef = limitedWebPartManager.WebParts[0];  

                    WebPart oWebPart = oWebPartDef.WebPart;  

                    oWebPart.Title = <span class="string">"New WebPart Title"</span>;  

                    oWebPartDef.SaveWebPartChanges();  

                    clientContext.ExecuteQuery();  

                } <span class="keyword">catch</span> (Exception e) {  

                    Console.WriteLine(e);  

                }  

            }  

            Console.WriteLine(<span class="string">"Succcesfully updated webpart"</span>);  

        }  

    }  

}

using System;

using Microsoft.SharePoint.Client;

using Microsoft.SharePoint.Client.WebParts;

using System.Security;

namespace UpdateWebpart {

class Program {

static void Main(string[] args) {

string userName = "userName@tenantName.onmicrosoft.com";

string password = "PassWord";

string siteUrl = "https://tenantName.sharepoint.com/sites/TeamSite";

SecureString securePassword = new SecureString();

foreach(char c in password) {

securePassword.AppendChar(c);

}

var cred = new SharePointOnlineCredentials(userName, securePassword);

using(ClientContext clientContext = new ClientContext(siteUrl)) {

try {

clientContext.Credentials = cred;

clientContext.Load(clientContext.Web);

clientContext.ExecuteQuery();

File oFile = clientContext.Web.GetFileByServerRelativeUrl("/sites/TeamSite/SitePages/wikiPage.aspx");

LimitedWebPartManager limitedWebPartManager = oFile.GetLimitedWebPartManager(PersonalizationScope.Shared);

clientContext.Load(limitedWebPartManager.WebParts, wps => wps.Include(wp => wp.WebPart.Title));

clientContext.ExecuteQuery();

if (limitedWebPartManager.WebParts.Count == 0) {

throw new Exception("No Web Parts on this page.");

}

WebPartDefinition oWebPartDef = limitedWebPartManager.WebParts[0];

WebPart oWebPart = oWebPartDef.WebPart;

oWebPart.Title = "New WebPart Title";

oWebPartDef.SaveWebPartChanges();

clientContext.ExecuteQuery();

} catch (Exception e) {

Console.WriteLine(e);

}

Console.WriteLine("Succcesfully updated webpart");

}

In the below image web pat title is update in a wikipage,

Removing the web part from a wikipage

Step 1

First set the credentials by providing the user credentials.

Step 2

Using the client context and, load the web.

Step 3

Get the object of the file using server relative URL of the wiki page in which you want to add the web part. Example (/sites/team Site/Site Pages/wikiPage.aspx).

Step 4

Get the ‘limitedWebPartManager‘ by using object file.

Step 5

Load the web part.

Step 6

Check the page having at least one web part for deleting.

Step 7

Get the web part definition by using the order value.

Step 8

Delete the web part by calling ‘DeleteWebPart ()‘.

Follow the below code snippet,

using System;  

using Microsoft.SharePoint.Client;  

using Microsoft.SharePoint.Client.WebParts;  

using System.Security;  

namespace RemoveWebpart {  

    class Program {  

        static void Main(string[] args) {  

            string userName = "userName@tenantName.onmicrosoft.com";  

            string password = "PassWord";  

            string siteUrl = "https://tenantName.sharepoint.com/sites/TeamSite";  

            SecureString securePassword = new SecureString();  

            foreach(char c in password) {  

                securePassword.AppendChar(c);  

            }  

            var cred = new SharePointOnlineCredentials(userName, securePassword);  

            using(ClientContext clientContext = new ClientContext(siteUrl)) {  

                try {  

                    clientContext.Credentials = cred;  

                    clientContext.Load(clientContext.Web);  

                    clientContext.ExecuteQuery();  

                    File oFile = clientContext.Web.GetFileByServerRelativeUrl("/sites/TeamSite/SitePages/wikiPage.aspx");  

                    LimitedWebPartManager ltdWebPartManager = oFile.GetLimitedWebPartManager(PersonalizationScope.Shared);  

                    clientContext.Load(ltdWebPartManager.WebParts);  

                    clientContext.ExecuteQuery();  

                    if (ltdWebPartManager.WebParts.Count == 0) {  

                        throw new Exception("No Web Parts to delete.");  

                    }  

                    WebPartDefinition webPartDef = ltdWebPartManager.WebParts[0];  

                    webPartDef.DeleteWebPart();  

                    clientContext.ExecuteQuery();  

                } catch (Exception e) {  

                    Console.WriteLine(e);  

                }  

                Console.WriteLine("Succcesfully deleted webpart");  

            }  

        }  

    }  

}

using System;

using Microsoft.SharePoint.Client;

using Microsoft.SharePoint.Client.WebParts;

using System.Security;

namespace RemoveWebpart {

class Program {

static void Main(string[] args) {

string userName = "userName@tenantName.onmicrosoft.com";

string password = "PassWord";

string siteUrl = "https://tenantName.sharepoint.com/sites/TeamSite";

SecureString securePassword = new SecureString();

foreach(char c in password) {

securePassword.AppendChar(c);

}

var cred = new SharePointOnlineCredentials(userName, securePassword);

using(ClientContext clientContext = new ClientContext(siteUrl)) {

try {

clientContext.Credentials = cred;

clientContext.Load(clientContext.Web);

clientContext.ExecuteQuery();

File oFile = clientContext.Web.GetFileByServerRelativeUrl("/sites/TeamSite/SitePages/wikiPage.aspx");

LimitedWebPartManager ltdWebPartManager = oFile.GetLimitedWebPartManager(PersonalizationScope.Shared);

clientContext.Load(ltdWebPartManager.WebParts);

clientContext.ExecuteQuery();

if (ltdWebPartManager.WebParts.Count == 0) {

throw new Exception("No Web Parts to delete.");

}

WebPartDefinition webPartDef = ltdWebPartManager.WebParts[0];

webPartDef.DeleteWebPart();

clientContext.ExecuteQuery();

} catch (Exception e) {

Console.WriteLine(e);

}

Console.WriteLine("Succcesfully deleted webpart");

}

In the below image web pat is deleted from the wikipage,

European Sharepoint 2013 Hosting Blog

SharePoint 2013 Hosting – HostForLIFE : SPFx Fast Serve To Reduce The Build Time In SharePoint Framework Solutions

Problem Statement

Solution

Steps to implement

SharePoint 2013 Hosting – HostForLIFE : Implementation Of ListPicker And Associated FieldPicker In Property Pane Of SPFx

Steps

SharePoint 2013 Hosting – HostForLIFE : Modal Popup In SPFx

Steps

Conclusion

SharePoint 2013 Hosting – HostForLIFE : Get User Properties And User Information List in SharePoint REST API

SharePoint 2013 Hosting – HostForLIFE: How To Enable/Activate Spaces?

What is SharePoint Spaces?

SharePoint 2013 Hosting – HostForLIFE :: Add, Update And Remove Web Part Using CSOM

Introduction

Adding the web part in a wikipage

Updating the web part in a wikipage

Removing the web part from a wikipage

BLOGROLL

Featured On

European Sharepoint 2013 Hosting Blog

SharePoint 2013 Hosting – HostForLIFE : SPFx Fast Serve To Reduce The Build Time In SharePoint Framework Solutions

Problem Statement

Solution

Steps to implement

SharePoint 2013 Hosting – HostForLIFE : Implementation Of ListPicker And Associated FieldPicker In Property Pane Of SPFx

Steps

SharePoint 2013 Hosting – HostForLIFE : Modal Popup In SPFx

Steps

Conclusion

SharePoint 2013 Hosting – HostForLIFE : Get User Properties And User Information List in SharePoint REST API

SharePoint 2013 Hosting – HostForLIFE: How To Enable/Activate Spaces?

What is SharePoint Spaces?

SharePoint 2013 Hosting – HostForLIFE :: Add, Update And Remove Web Part Using CSOM

Introduction

Adding the web part in a wikipage

Updating the web part in a wikipage

Removing the web part from a wikipage

BLOGROLL

Featured On

Tags