How can we help you today?

How to Make All Links/Hyperlinks in the Accordion Design Element Content Open in a New Tab

If you have a ShortPoint Accordion Design Element added to your SharePoint page, and you are encountering an issue where all your links/hyperlinks in its content are not opening on a new tab despite enabling this setting in SharePoint, then this article is for you.

This article would simply walk you through the process of setting all your links/hyperlinks in your Accordion Design Element to open in a new window with the help of custom JavaScript that we will be applying via ShortPoint Theme Builder.

Let's start! 


Before we begin

  • This solution would work for you if you are using ShortPoint SPFx on Office 365 and SharePoint 2019 environment.
  • You have ShortPoint installed on your SharePoint site(s). We recommend you to always have the last version installed. Visit our Download ShortPoint page to get the latest version of ShortPoint, or you can use the ShortPoint SPFx Auto Upgrade Feature to ensure you always have the latest version.
  • You are a ShortPoint user with an active license.


  • You are using the Accordion Design Element on your SharePoint page.
  • You have links/hyperlinks inside your Accordion Design Element. 

Step 1. Prepare the Custom JavaScript solution

To make this happen, we need to use this custom JavaScript we have prepared for the issue:

(function () {
'use strict';
function fixLinks() {
shortpoint.$('[data-shortpoint-type="accordions"] a').attr('data-interception', 'off');
setTimeout(fixLinks, 1000);

Please Copy it and proceed to the step 2.

Step 2. Apply the Custom JavaScript from the ShortPoint Theme Builder

Open the ShortPoint Theme Builder (Site contents / Site settings > ShortPoint Dashboard > Theme Builder).  

In the Theme Builder menu, navigate to Utilities > Custom JavaScript:  

 In Theme Builder, go to Utilities.Then click Custom JavaScript

Paste the copied JavaScript code from the step 1 to the Custom JavaScript field:

Paste the code in the JavaScript box

Now click Apply (1) and then Publish (2) to save your changes:

Hit Apply and Publish to save the changes.


That's it! The links/hyperlinks inside your Accordion Design Elements should now open in a new tab. Here's a quick preview on how it will look like on your page: 

Result after applying the custom Javascript code

Related articles:

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.

World's best intranet sites are designed using ShortPoint

Get started today! Learn more
See all 15 topics

Start a trial

Ignite your vision. Install ShortPoint directly on your site, or play in sandbox mode. No credit card required.

Get started today

World’s best intranet sites are designed using ShortPoint

Thousands of companies using ShortPoint everyday to design, brand and build award winning intranet sites.

Get started Learn more