Try ShortPoint nowWhen you embed the Recent Documents Web Part or the Sites Web Part on your SharePoint page using ShortPoint's SharePoint Web Part Design Element, sites and documents will open in a small dialog box by default.
This article will demonstrate how to open sites and documents in the Recent Documents Web Part or the Sites Web Part in a new tab:
TABLE OF CONTENTS
Prerequisites
- You must have the latest version of ShortPoint SPFx installed on your SharePoint environment.
- You must be a ShortPoint Designer with an active license.
- You must have the Recent Documents Web Part or the Sites Web Part embedded on your SharePoint page using the SharePoint Web Part Design Element.
Step-by-step Tutorial
Before proceeding, identify the embedded web part you are using first. If you are using the Sites Web Part, follow the steps under that section. Otherwise, follow the steps under the Frequent Documents section.
Frequent Documents Web Part
This is for users who have the Frequent Documents Web Part embedded on their page using the SharePoint Web Part Design Element.
Step 1: Edit the ShortPoint Web Part
- Go to the SharePoint page you want to use and click Edit:
- Click the close icon:
- Click the ShortPoint tag:
- Select the Edit Properties icon:
Step 2: Edit the SharePoint Web Part Design Element
NOTEBefore proceeding, make sure you have already embedded the Frequent Documents web part on your page using the SharePoint Web Part Design Element. To learn how to do this, check out How to Embed a SharePoint Web Part into ShortPoint.
- Click the ShortPoint Web Part tag:
- Select the cogwheel icon:
Step 3: Add ID name
- Go to the Custom CSS tab:
- Assign recent-documents-embed as the ID name:
- Click the green check mark:
Step 4: Copy the Code
- Copy the code below:
[code code_html="%0A%0A%0A%0A" code_css="%0A%0A%0A%0A" code_js="(function()%7B%0A%20%20const%20myInterval%20%3D%20setInterval(function%20()%20%7B%0A%20%20%20%20const%20iframeElement%20%3D%20document.querySelector('%23recent-documents-embed%20iframe%5Bid%5E%3D%22sharepoint-webpart-shortpoint%22%5D')%3B%0A%20%20%20%20if%20(iframeElement%20!%3D%20null)%20%7B%0A%20%20%20%20%20%20const%20iframeDoc%20%3D%20iframeElement.contentDocument%20%7C%7C%20elem.contentWindow.document%3B%0A%20%20%20%20%20%20if%20(iframeDoc%20!%3D%20null)%20%7B%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20clearInterval(myInterval)%3B%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%2F%2F%20Make%20pdfs%20and%20other%20documents%20always%20open%20in%20a%20new%20tab%20inside%20the%20documents%20embed%20iframe%0A%20%20%20%20%20%20%20%20const%20myInterval2%20%3D%20setInterval(function%20()%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20iframeDoc.querySelectorAll(%60a%5Bclass*%3D%22documentTitle-%22%5D%60).forEach(elem%20%3D%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20elem.setAttribute('data-interception'%2C%20'off')%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D)%0A%20%20%20%20%20%20%20%20%7D%2C%202000)%3B%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20iframeDoc.querySelector(%22head%22).insertAdjacentHTML(%0A%20%20%20%20%20%20%20%20%20%20%22beforeend%22%2C%0A%20%20%20%20%20%20%20%20%20%20%60%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%3C%2Fstyle%3E%60%0A%20%20%20%20%20%20%20%20)%3B%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%2C%202000)%3B%0A%7D)()" code="%7B%22javascript%22%3A%22(function()%7B%5Cn%20%20const%20myInterval%20%3D%20setInterval(function%20()%20%7B%5Cn%20%20%20%20const%20iframeElement%20%3D%20document.querySelector('%23recent-documents-embed%20iframe%5Bid%5E%3D%5C%22sharepoint-webpart-shortpoint%5C%22%5D')%3B%5Cn%20%20%20%20if%20(iframeElement%20!%3D%20null)%20%7B%5Cn%20%20%20%20%20%20const%20iframeDoc%20%3D%20iframeElement.contentDocument%20%7C%7C%20elem.contentWindow.document%3B%5Cn%20%20%20%20%20%20if%20(iframeDoc%20!%3D%20null)%20%7B%20%20%20%20%20%20%20%20%5Cn%20%20%20%20%20%20%20%20clearInterval(myInterval)%3B%5Cn%20%20%20%20%20%20%20%20%5Cn%20%20%20%20%20%20%20%20%2F%2F%20Make%20pdfs%20and%20other%20documents%20always%20open%20in%20a%20new%20tab%20inside%20the%20documents%20embed%20iframe%5Cn%20%20%20%20%20%20%20%20const%20myInterval2%20%3D%20setInterval(function%20()%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20iframeDoc.querySelectorAll(%60a%5Bclass*%3D%5C%22documentTitle-%5C%22%5D%60).forEach(elem%20%3D%3E%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20elem.setAttribute('data-interception'%2C%20'off')%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%7D)%5Cn%20%20%20%20%20%20%20%20%7D%2C%202000)%3B%5Cn%20%20%20%20%20%20%20%20%5Cn%20%20%20%20%20%20%20%20iframeDoc.querySelector(%5C%22head%5C%22).insertAdjacentHTML(%5Cn%20%20%20%20%20%20%20%20%20%20%5C%22beforeend%5C%22%2C%5Cn%20%20%20%20%20%20%20%20%20%20%60%3Cstyle%20type%3D%5C%22text%2Fcss%5C%22%3E%5Cn%20%20%20%20%20%20%20%20%20%20%20%3C%2Fstyle%3E%60%5Cn%20%20%20%20%20%20%20%20)%3B%5Cn%20%20%20%20%20%20%7D%5Cn%20%20%20%20%7D%5Cn%20%20%7D%2C%202000)%3B%5Cn%7D)()%22%2C%22html%22%3A%22%5Cn%5Cn%5Cn%5Cn%22%2C%22css%22%3A%22%5Cn%5Cn%5Cn%5Cn%22%2C%22showErrors%22%3Afalse%7D" sandbox="false" padding-top="0px" padding-right="0px" padding-bottom="0px" padding-left="0px" /]Step 5: Paste the Code
Right-click inside the SharePoint Web Part Design Element and select Paste Code After SharePoint Web Part:
Step 6: Save
- Click the eye icon to see your page in real-time:
- Click Save to apply your changes:
That’s it! Your documents will now open in a new tab.
Sites Web Part
This is for users who have the Sites Web Part embedded on their page using the SharePoint Web Part Design Element.
Step 1: Edit the ShortPoint Web Part
- Go to the SharePoint page you want to use and click Edit:
- Click the close icon:
- Click the ShortPoint tag:
- Select the Edit Properties icon:
Step 2: Edit the SharePoint Web Part Design Element
NOTEBefore proceeding, make sure you have already embedded the Sites web part on your page using the SharePoint Web Part Design Element. To learn how to do this, check out How to Embed a SharePoint Web Part into ShortPoint.
- Click the ShortPoint Web Part tag:
- Select the cogwheel icon:
Step 3: Add ID name
- Go to the Custom CSS tab:
- Assign frequent-sites-embed as the ID name:
- Click the green check mark:
Step 4: Copy the Code
- Copy the code below:
[code code_html="%0A%0A%0A%0A" code_css="%0A%0A%0A%0A" code_js="(function%20()%20%7B%0A%20%20%20%20const%20myInterval%20%3D%20setInterval(function%20()%20%7B%0A%20%20%20%20%20%20%20%20const%20iframeElement%20%3D%20document.querySelector('%23frequent-sites-embed%20iframe%5Bid%5E%3D%22sharepoint-webpart-shortpoint%22%5D')%3B%0A%20%20%20%20%20%20%20%20if%20(iframeElement%20!%3D%20null)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20iframeDoc%20%3D%20iframeElement.contentDocument%20%7C%7C%20elem.contentWindow.document%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(iframeDoc%20!%3D%20null)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20clearInterval(myInterval)%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20myInterval2%20%3D%20setInterval(function%20()%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20anchors%20%3D%20iframeDoc.getElementsByTagName(%22a%22)%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Array.from(anchors).forEach((anchor)%20%3D%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20url%20%3D%20anchor.href%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(url)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Store%20the%20URL%20before%20removing%20attributes%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20targetUrl%20%3D%20url%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Remove%20all%20attributes%20that%20could%20cause%20navigation%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.removeAttribute(%22href%22)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.removeAttribute(%22target%22)%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Add%20a%20custom%20data%20attribute%20to%20store%20the%20URL%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.setAttribute(%22data-url%22%2C%20targetUrl)%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Add%20styles%20to%20make%20it%20look%20like%20a%20link%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.style.cursor%20%3D%20%22pointer%22%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2Fanchor.style.textDecoration%20%3D%20'underline'%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Add%20click%20event%20listener%20instead%20of%20onclick%20property%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.addEventListener(%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22click%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20function%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Prevent%20default%20in%20multiple%20ways%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation()%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Open%20in%20new%20window%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20window.open(targetUrl%2C%20%22_blank%22)%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20false%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20false%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20)%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Also%20prevent%20default%20on%20mousedown%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.addEventListener(%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22mousedown%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20function%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20false%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20false%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20)%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Prevent%20middle-click%20navigation%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.addEventListener(%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22auxclick%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20function%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation()%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20false%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20false%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C%203000)%3B%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20iframeDoc.querySelector(%22head%22).insertAdjacentHTML(%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22beforeend%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%60%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fstyle%3E%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%2C%202000)%3B%0A%7D)()%3B%0A" code="%7B%22javascript%22%3A%22(function%20()%20%7B%5Cn%20%20%20%20const%20myInterval%20%3D%20setInterval(function%20()%20%7B%5Cn%20%20%20%20%20%20%20%20const%20iframeElement%20%3D%20document.querySelector('%23frequent-sites-embed%20iframe%5Bid%5E%3D%5C%22sharepoint-webpart-shortpoint%5C%22%5D')%3B%5Cn%20%20%20%20%20%20%20%20if%20(iframeElement%20!%3D%20null)%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20const%20iframeDoc%20%3D%20iframeElement.contentDocument%20%7C%7C%20elem.contentWindow.document%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20if%20(iframeDoc%20!%3D%20null)%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20clearInterval(myInterval)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20myInterval2%20%3D%20setInterval(function%20()%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20anchors%20%3D%20iframeDoc.getElementsByTagName(%5C%22a%5C%22)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Array.from(anchors).forEach((anchor)%20%3D%3E%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20url%20%3D%20anchor.href%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(url)%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Store%20the%20URL%20before%20removing%20attributes%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20targetUrl%20%3D%20url%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Remove%20all%20attributes%20that%20could%20cause%20navigation%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.removeAttribute(%5C%22href%5C%22)%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.removeAttribute(%5C%22target%5C%22)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Add%20a%20custom%20data%20attribute%20to%20store%20the%20URL%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.setAttribute(%5C%22data-url%5C%22%2C%20targetUrl)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Add%20styles%20to%20make%20it%20look%20like%20a%20link%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.style.cursor%20%3D%20%5C%22pointer%5C%22%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2Fanchor.style.textDecoration%20%3D%20'underline'%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Add%20click%20event%20listener%20instead%20of%20onclick%20property%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.addEventListener(%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%5C%22click%5C%22%2C%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20function%20(e)%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Prevent%20default%20in%20multiple%20ways%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault()%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation()%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Open%20in%20new%20window%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20window.open(targetUrl%2C%20%5C%22_blank%5C%22)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20false%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20false%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Also%20prevent%20default%20on%20mousedown%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.addEventListener(%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%5C%22mousedown%5C%22%2C%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20function%20(e)%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault()%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation()%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20false%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20false%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2F%2F%20Prevent%20middle-click%20navigation%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20anchor.addEventListener(%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%5C%22auxclick%5C%22%2C%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20function%20(e)%20%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault()%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation()%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20false%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20false%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20)%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D)%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C%203000)%3B%5Cn%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20iframeDoc.querySelector(%5C%22head%5C%22).insertAdjacentHTML(%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%5C%22beforeend%5C%22%2C%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%60%3Cstyle%20type%3D%5C%22text%2Fcss%5C%22%3E%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fstyle%3E%60%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20)%3B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20%7D%5Cn%20%20%20%20%20%20%20%20%7D%5Cn%20%20%20%20%7D%2C%202000)%3B%5Cn%7D)()%3B%5Cn%22%2C%22html%22%3A%22%5Cn%5Cn%5Cn%5Cn%22%2C%22css%22%3A%22%5Cn%5Cn%5Cn%5Cn%22%2C%22showErrors%22%3Afalse%7D" sandbox="false" padding-top="0px" padding-right="0px" padding-bottom="0px" padding-left="0px" /]Step 5: Paste the Code
- Right-click inside the SharePoint Web Part Design Element and select Paste Code After SharePoint Web Part:
Step 6: Save
- Click the eye icon to see your page in real-time:
- Click Save to apply your changes:
That’s it! Your sites will now open in a new tab.
Related articles:
