SharePoint Experts, Information Architects, Expert Witness

SICG provides a broad array of business and technology consulting from architecture to design to deployment of global systems with a focus on surfacing data in the enterprise. We focus on the "How", not just the possible. Contact me direct: or call 704-873-8846 x704.

Search This Blog

Saturday, December 17, 2016

Opening Documents in a New Window (SharePoint Online 2013/2016)

Ever wanted SharePoint Online Documents to open in a new window?

As many have needed to, some want to be able to open documents from SharePoint Online in a new window instead of the same window - useful when you have to edit a number of documents at the same time.

I looked for several solutions - most didn't work however, I found one that did after making a few tweaks.

This minor modification enables you to set it on a library by library basis or you can save the library as a template once the script is put in a set place. Once you add it to the library view page, it applies TO ALL Views in the library.

NOTE: This does make a change to the way a library works - when you add a content editor web part to a library view, it HIDES the Files/Library tabs! Thanks for the bug but there is a work around.

To get started, here's the script - taken & modified from - the original script from there didn't work for me so I modified it for Office 365/SharePoint Online:

<script type="text/javascript">
// Create a namespace for the functions so we don't collide with anything else:
var customFunctions = customFunctions || {};
// Create a function for customizing the Field Rendering of our display fields:
customFunctions.CustomizeOpenFieldInNewTab = function () {
    var fieldJsLinkOverride = {};
    fieldJsLinkOverride.Templates = {};

    fieldJsLinkOverride.Templates.Fields =
        // Make sure the Your field view gets hooked up to the method defined below
        'LinkFilename': { 'View': customFunctions.GetDocumentsField },
    // Register the rendering template
    //   SPClientTemplates.TemplateManager.RegisterTemplateOverrides(fieldJsLinkOverride);
// Create a function for setting the proper URL to open in new window:
customFunctions.GetDocumentsField = function (ctx) {
    var myColumn = ctx.CurrentItem.ServerRedirectedEmbedUrl;
    var myFileName = ctx.CurrentItem.FileLeafRef;
    var editFileLink = myColumn.replace("interactivepreview", "default");
    var myIndex = myFileName.lastIndexOf(".");
    myFileName = myFileName.substring(0, myIndex);
    // Change the default URL to use Open in New Window:
    if (myColumn) {
        return "<a href='" + editFileLink + "' target='_blank'>" + myFileName + "</a>";
    return ctx.CurrentItem.ServerRedirectedEmbedUrl;
// Call the function:

First, save this script to a text file - i.e. OpenInNewWindowForView.txt.

Step 1 - Create a new document library that everyone has access to - I like to call it 'Scripts' so I know what it is for. Everyone must have read access to this or it will 'break' the library view.

Step 2 - Upload the OpenInNewWindowForView.txt file into the library; once loaded, click on the file to open it - it will open in the browser window to display the text. Copy and save the URL from the browser.

Step 3 - Open the library you want to modify and select the "All Documents" view (actually modifying any view will modify it for all views).

Step 4 - Edit the page - add a Content Editor web part to the top of the page (above the view of documents).

Step 5 - Edit the Content Editor web part and in the "Content Link" of the properties, paste in the URL path you saved in Step 2 and click OK to save.

Step 6 - Stop Editing the page and you are done!

Once the script has been added, if desired, you can save the library as a template but be sure that the script is accessible from any location otherwise it won't work!

NOTE: CHANGE IN BEHAVIOR! Once the Content Editor web part has been added, it 'breaks' the library in that the "Files" and "Library" tab disappear (!). This is easily overcome however:

1) To get to the settings, you can use the Site Contents Page - mouse over the library and click the ellipsis (...) to get to Settings.

2) Simply select any document or folder in the list and the "Files" and "Library" tabs re-appear.

No comments: