Wednesday, September 24, 2014

Content Editor Web Part Example (Writing Custom Web Part

The Content Editor Web Part (CEWP) allows you to add text, html, JQuery or styles to a SharePoint page. It is great to use this if you,

  1. Are good in JQuery or Javascript.
  2. Want to use Web Services, REST API (Introduced in SharePoint 2013) or ECMA script.
  3. Need One or two pages of customization and do not want to touch Visual Studio and going through process of uploading solutions.
  4. Do not have deployment permissions on Central Administration.

Add a Web Part to a page


1. From a page, in the ribbon, click the Page tab, and then click the Edit command.

Image: Edit command of the Edit tab


2. Click on the page where you want to add a Web Part, click the Insert tab, and then click Web Part.Web Part command

3. Under Categories, select a category named Media and Content and then select Web Part named Content Editor, and then click Add.



4. Create a text file named "myFirstCEW.txt" and put it in the Site Assests library. for testing purpose you can just write following lines in the text file,

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script>
$(document).ready(function() {
  $(".jqueryVersion").val($.fn.jquery);
});

</script>
<input type='text' class='jqueryVersion' />



5- You can Go into Web part Edit mode,


6- Enter the link of "myFirstCEW.txt" file in the "Content Link" text box, press ok button and you can see the text box on the page showing current jquery version

Copying Web Part Page Trick

Please see my article regarding solution of Copying Web Part Page.


Edit Web Part pages trick
Some times the edit Option is grayed on page level, adding following query string will make page in edit mode automatically,
 “?ToolPaneView=2” 

Example:
http://myserver/pages/edit.aspx

Changed to,

http://myserver/pages/edit.aspx?ToolPaneView=2

No comments:

Post a Comment