Adding a Pinterest Board to SharePoint

There are all types of productivity tools out there, and I have blogged about Pinterest and its usefulness before as a work and productivity tool. I have been asked a few times about adding a Pinterest board to a SharePoint site, and I am pleased to say that it is possible to do so. As of today however, for some reason, the Pinterest board only shows in a SharePoint site in Chrome, Firefox, Edge, and various browsers on the Mac, but not in Internet Explorer.

If you plan on embedding Pinterest in your page, you may need to include a disclaimer that the user should view your page in a browser other than Internet Explorer. Considering we’re advocating people use Internet Explorer because certain things won’t work in other browsers, this is a bit of a deal breaker for me.

An alternative to embedding a Pinterest board would be to use the Promoted Links app to point to Pinterest boards. There will be a future post on using promoted links in this fashion.

In any case, the code for adding a Pinterest board to your SharePoint page can be found at the Pinterest Developers Site. You add the code to the SharePoint site using two Snippet Editor web parts, which are found under the Media and Content subsection of the INSERT WEBPART menu.

Use the Styles when formatting text in SharePoint

While reviewing the sites ​that were updated by the SPOCKs on Friday, I noticed a common theme, and that’s that formatting was somewhat inconsistent across the sites. Some had Times New Roman, others had larger text, others had incorrect leading.

If you are finding inconsistencies with your text on your page, I suggest you use the styles that are standard with your text boxes. SharePoint comes with a bunch of standard font styles including

• Paragraph
• Heading 1
• Heading 2
• Heading 3
• Heading 4
• Heading 1 Alternate
• Heading 2 Alternate
• Heading 3 Alternate
• Heading 4 Alternate
• Normal
• Quote
• Intense Quote
• Emphasis
• Intense Emphasis
• Reference
• Intense Reference
• Accent 1
• Accent 2

Between all of these styles, you should have enough variation while remaining consistent.

You can find these styles in the FORMAT TEXT tab at the top of the page.

Fixing the titles on wiki pages

SharePoint Online has a bit of a glitch when it comes to creating wiki pages. It doesn’t allow us to change the Title without also changing the aspx file name. If you include spaces, then you end up with %20 in the file name (such as file%20name.aspx), which makes the URL tough to read.

Our guru at work whipped up some specialized javascript code for me today that lets me use underscores in the file name, and then his javascript strips it out. Pretty cool. The code he gave me is shown below

< script type="text/javascript" language="javascript" >
var title_replacement_target = document.getElementById("DeltaPlaceHolderPageTitleInTitleArea").getElementsByTagName('a')[0];
title_replacement_target.innerHTML = title_replacement_target.innerHTML.replace(/_/g, " ");
 < /script >

Just remove the spaces from the < and the >

Wiki Pages in SharePoint Online

Wiki Pages allow you to create web pages within your SharePoint sites. You can place web parts on them, or you can use them as I do for tutorial writing.

But, as with other OOTB (out of the box) features, SharePoint Online’s Wiki Pages app has a slight glitch. Surprise!

Here’s the glitch:

The file name of the page, is also the title of the page.

In older versions of SharePoint, you could set the title of the page to be different from the file name, e.g. file name aspire.html could be used to show title of “Aspirations of Student Learning.” In this version of SharePoint Online, the name of the file is the same as the title on the page.

Why do we care?

We care because generally titles have spaces. In the example of “Aspirations for Student Learning,” there are three spaces.  Those same spaces will end up in the file name, and the Internet doesn’t do well with spaces in a file name. In fact, they will replace that space with %20, which means “Aspirations for Student Learning” becomes Aspirations%20for%20Student%20Learning.aspx.

What can we do?

Well, to solve the issue of the %20s we in the web world place underscores between words so that we get a file name that looks like Aspirations_for_Student_Learning.aspx, which, I hope you agree looks cleaner.

But, didn’t you just say that the file name of the page, is also the title of the page?

Yes, I did… While we just fixed the file name issue, we now have a title of the page (and links) that look like this:

Aspirations_for_Student_Learning

and that is where our friend Joe comes in. Joe is a magical programmer and he whipped up a magical script that takes those underscores, and replaces them with spaces. This now lets us have a file name called  Aspirations_for_Student_Learning.aspx while preserving the title (and link) Aspirations for Student Learning.

Beware the changing page title

When you change the title of a page, a couple of things happen. As noted in yesterday’s post, the title of the page is the same as the file name, which means that changing the title of a page also changes the file name.

Links to your page could break

Since SharePoint is a database, changing the name of the file often results in SharePoint correcting the address for you, since it doesn’t care what you call a page; it knows it as 00ZKJSD9A8E09JKD9D01 or something like that, and it will change its internal pointer accordingly.

Where it does matter, is if anyone inserts a link to a page and keeps the https://######.sharepoint.com in front of the URL because then it’s not a link within the database, but an actual address. Changing the title of the page may then in fact break the links in other places, so think carefully before you do that. Also think about links from the outside. I recently had this happen where someone changed the title of a page, but had not realized that the link was active from a non-SharePoint site.

Images can get lost

Images uploaded to a page, live within a folder by the same name as the page name. Changing the page name doesn’t move existing images to a new folder, but if you add another image to the page after you have changed the page name, then SharePoint will create a new folder with the new page name, and now you have two folders supporting the same page. Just something to think about as you plan out your site.