Tuesday, March 10, 2015

Add jQuery to Your Sample Page (KSUG 03.10.15)

These are the steps for adding jQuery and Site.js references to your Sample Page using Designer.
Don't have access to Designer?  No problem.  Instructions to do the same using the regular UI are further below.

Creating the Sample Page and adding script tags using Designer

1) Open the "Site Page" folder
2) On the ribbon Click "Web Part Page" drop down
3) Choose "Single Web Part Page"
1) Still in the "Site Pages" folder
2) Right Click on your newly created Sample Page
3) Select "Edit File in Advanced Mode" from the shortcut menu
1) Locate the line indicated
2)  Add the two script tags shown
<%-- add script tags between here... --%>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
<script type="text/javascript" src="../SiteAssets/site.js" ></script>
<%-- ...and here --%>

(the comment lines above and below the script tags are optional) 

Or...Creating the Sample Page and adding script tags through the UI

1) Navigate to the "Site Pages" library
2) On the ribbon Click "Files"
3) On the ribbon drop down "New Document"
4) On the ribbon select "Web Part Page"
After naming and saving, open the page
1) On the ribbon Click "Page"
2) On the Ribbon Click the "Edit Page" drop down 
3) On the Ribbon menu Click "Edit Page"
On the page Click "Add New Web Part" (not shown)
1) Click "Media and Content"
2) Click "Content Editor"
Click the "Add" button (not shown )
Once the Content Editor Web Part appears on the page...
1) On the web part Click the drop-down-arrow
2) Click "Edit Web Part" from the menu

Click "Hidden" (we don't want this web part to be visible)
Click "Apply" or "Save" (not shown)
Back on the web part Click the hyperlink shown below 

On the Ribbon select the "Edit HTML" menu item (not shown)
The "HTML Source" dialog box will appear. 
1) Enter the scripts tags into the textbox
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
<script type="text/javascript" src="../SiteAssets/site.js" ></script>
2) Click OK


Click "Stop Editing"
Happy jQuery-ing


Sunday, February 8, 2015

SOLVED: SharePoint Designer Inserting Blank Lines

Frustrated by Designer adding unwanted blank lines to your .aspx or .master pages?

Here's the problem:


The first time the file is saved in SharePoint Designer blank lines are inserted or added like this...




The second time the file is saved Designer doubles the number of blank lines, plus adds an extra line - a total of three blank lines...






The third time the file is saved it doubles again, adding one line for a total of seven blank lines...





The fourth time the file is saved a total of fifteen blank lines appear (double previous plus one)....

It's simple to see how after several iterations of changes hundreds or thousand of unwanted blank lines can be inserted.





Notice the culprit here - it occurs around lines of literal text within tag-blocks...

Where ever you encounter <SharePoint:ScriptBlock> and <SharePoint:StyleBlock> tags you will experience this problem:
   

Here's the fix (read all the way to the end):

Simply add an HTML/XML comment tag right after Script or Style Tags.  Like this...


...and that's it.  Fixed.  Save as many times as you want - no more blank lines inserted between these tags.

Crucial Tips!

  • Notice that the comment tag must be on the same line as the <SharePoint:...block> tag. Must!  If you put it on it's own line the problem will persist
  • Adding this text is necessary for every <SharePoint:...block> tag on the page.