Tuesday, January 4, 2011

Open PDF Files in a New Window in SharePoint 2010

A request that I get occasionally is how to force SharePoint to open up PDF files up in a new window.  Assuming you have Adobe Reader installed, the default behavior is to prompt the user to open the PDF file.  For some customers, they want it to automatically open up in the same browser window.  This is easy to do by following the answer shown here. (Note: this does assume that the browser plug-in is installed and enabled).
For me, I like this solution and simply use the back button when I’m done and want to return to SharePoint.  If I want it in a new window, I either hold down Ctrl and click the link or just right-click the link and select Open in New Window.  Basic browser stuff, right?  In most cases, I convince the customer that this is a training issue on how to use the browser. However, that doesn’t always fly with every customer, does it?
If you to force the PDF file to load into a new browser window, keep reading...
There are a number of posts on workarounds to the problem.  One says that you should write a httphandler.  Not a bad solution, very thorough, but a complex one unless your a seasoned SharePoint and ASP.NET developer.  Another talks about editing the global onet.xml file (gasp!) which is not supported by Microsoft and this targets much more than just PDF files.  Others suggest a somewhat elegant JavaScript solution.  This searches through the <A> tags on the page and inserts a target attribute and sets it to _blank which opens it in a new window.  The problem with this is that the target attribute is deprecated when using the strict XHTML doctype which will present problem with SharePoint 2010 sites.
I think I have a pretty-good workaround that addresses the problem.  This is a page-specific fix, so it is not global to all libraries or links in your farm. I like it this way as you have granular control where you want to use it, meaning you may only want to use it on certain pages within team sites.
The solution is to add this code to a Content Editor Web Part (CEWP) on the page:
<script language="javascript" type="text/javascript">

    function OpenPDFInNewWindow()
      // Get the collection of <a> tags
      var aAllLinks = document.getElementsByTagName('a'); 

      // For each <a> tag
      for(var i=0;i<aAllLinks.length;i++)
         var oA = aAllLinks[i];
         var sHREF = oA.attributes["href"].value.toLowerCase();
         // Is this a pdf link?
         if(sHREF.indexOf(".pdf") > 0)
            oA.href="javascript:window.open('" + sHREF + "').focus();";

Credit goes to Daniel whose code I modified to have this functionality.  To simplify this for all of you, I am also making this available using a .DWP web part.  You can simply upload this into the web part gallery of your site collection which allows you to more easily add it to any page. To download, click here.  

No comments:

Post a Comment