Forum Discussion

Matt9915's avatar
Matt9915
Copper Contributor
Oct 08, 2022

SPO Comms Site - Hero Web Part - Open Internal Links in New Tab

Hi,

 

If someone can tell me how to make internal links from a Hero Web Part open in a new tab it would be very much appreciated.

 

I'm not able to use a URL shortener. I have found a tutorial which explains how it can be achieved using the Modern Script Editor Web Part, but I can't figure out how (i.e., how to tie the Script Editor Web Part to the Hero Web Part).

 

Someone has asked this question in the comments of the tutorial, but it hasn't been answered unfortunately. 

 

Thanks in advance to anyone that can help.   

SharePoint Online
  • ganeshsanap's avatar
    ganeshsanap
    MVP
    Oct 08, 2022

    Matt9915 You may already know that it is not possible to open the internal links in new tab using SharePoint OOTB capabilities. URL shortener is one way to do it (& you are unable to use it).

     

    So, that leaves you with using custom SPFx web parts or extensions:

    1. Use SPFx application customizer to inject custom CSS/JS on all modern pages
    2. Use Modern script editor web part to inject custom CSS/JS on single page

    Once you get the .sppkag file, you have to deploy it to tenant app catalog or site collection app catalog as per your needs.

    Then you can add & use the modern script editor web part on site pages like any other web part in SharePoint.

    Note: DOM manipulation & CSS customizations are not recommended by Microsoft and some of your customization may break if Microsoft changes HTML element id/classes in new release updates.  

     

    Related Read:

    1. How can I include the same JS and CSS files on multiple SharePoint Modern Page? 
    2. SharePoint: Configure Navigation Links to Open in a New Tab 

    Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.

    • Matt9915's avatar
      Matt9915
      Copper Contributor
      Oct 10, 2022
      Thanks for the reply ganeshsanap. Sorry for the delayed response on my part.

      As I mentioned in my original post, I do have access to the Modern Script Editor Web Part. What I'm looking for advice on is the code snip that I need to add to the MSEWP to ensure that internal links used in the Hero Web Part open in a new tab.

      Thanks

Resources