[Feature Request] Open external links as target "New Window" #1506

New Issue

OVERLORD · 2026-02-05T01:05:34+03:00

OVERLORD commented

2026-02-05 01:05:34 +03:00

Originally created by @bennyandresen on GitHub (Jan 24, 2020).

Describe the feature you'd like
I like the default for internal links that they use the same browser tab. However I think if you're clicking on an external link (and it is not yet #1620 visually distinguished) my expectation for it are that it opens a new browser tab instead of using the "dedicated BookStack" tab.

Describe the benefits this feature would bring to BookStack users
Not sure how common my perspective is, but I think the proposed feature doesn't violate expectations.

Originally created by @bennyandresen on GitHub (Jan 24, 2020). **Describe the feature you'd like** I like the default for internal links that they use the same browser tab. However I think if you're clicking on an external link (and it is not yet #1620 visually distinguished) my expectation for it are that it opens a new browser tab instead of using the "dedicated BookStack" tab. **Describe the benefits this feature would bring to BookStack users** Not sure how common my perspective is, but I think the proposed feature doesn't violate expectations.

OVERLORD added the 🔨 Feature Request label 2026-02-05 01:05:34 +03:00

OVERLORD closed this issue

2026-02-05 01:05:36 +03:00

OVERLORD commented

2026-02-05 01:05:40 +03:00

@james-geiger commented on GitHub (Jan 24, 2020):

Hello @bandresen,

You could accomplish this by placing the following script in your "Custom HTML Head" field in BookStack settings:

<script>
  document.addEventListener("DOMContentLoaded", function(){
    var links = document.links;

    for (var i = 0, linksLength = links.length; i < linksLength; i++) {
       if (links[i].hostname != window.location.hostname) {
           links[i].target = '_blank';
       }
    }
  });
</script>

@james-geiger commented on GitHub (Jan 24, 2020): Hello @bandresen, You could accomplish this by placing the following script in your "Custom HTML Head" field in BookStack settings: ``` <script> document.addEventListener("DOMContentLoaded", function(){ var links = document.links; for (var i = 0, linksLength = links.length; i < linksLength; i++) { if (links[i].hostname != window.location.hostname) { links[i].target = '_blank'; } } }); </script> ```

OVERLORD commented

2026-02-05 01:05:43 +03:00

@ssddanbrown commented on GitHub (Mar 7, 2020):

Thanks for the suggestion @bandresen,
Currently users have control of this via the editor so it gets a little more complicated when we have to officially take that into account. In addition, I remain very apprehensive to alter the existing behaviour of the content that users have put into their BookStack instance.

I think the above workaround covers this kind of use-case perfectly well, and could be easily altered for other requirements such as adding noreferrer or noopener attributes. Thanks for providing @james-geiger.

Therefore closing this.

@ssddanbrown commented on GitHub (Mar 7, 2020): Thanks for the suggestion @bandresen, Currently users have control of this via the editor so it gets a little more complicated when we have to officially take that into account. In addition, I remain very apprehensive to alter the existing behaviour of the content that users have put into their BookStack instance. I think the above workaround covers this kind of use-case perfectly well, and could be easily altered for other requirements such as adding `noreferrer` or `noopener` attributes. Thanks for providing @james-geiger. Therefore closing this.

OVERLORD commented

2026-02-05 01:05:45 +03:00

@rcdailey commented on GitHub (Dec 16, 2023):

While I agree the provided workaround is sufficient to get the functionality, it lacks discoverability. Seeing a simple check box for this in the settings UI is more discoverable than someone having to google the solution, which isn't guaranteed to lead here.

I would personally still appreciate seeing this built in.

@rcdailey commented on GitHub (Dec 16, 2023): While I agree the provided workaround is sufficient to get the functionality, it lacks discoverability. Seeing a simple check box for this in the settings UI is more discoverable than someone having to google the solution, which isn't guaranteed to lead here. I would personally still appreciate seeing this built in.

OVERLORD commented

2026-02-05 01:05:48 +03:00

@RobSickler commented on GitHub (Feb 16, 2024):

I couldn't help but notice that the option is now in BookStack v23.12.2 however, it's not working. I still had to use the code above to get my external links to open in a new tab. This sort of functionality is very common in wikis and the like; it's a wonder why it wasn't implemented sooner.

In the image above, I have checked the correct option, saved/closed that window and then saved/closed the editor window but the link wouldn't open into another window/tab. In fact, when I went back in to edit how the link behaves, it was set back to current window.

@RobSickler commented on GitHub (Feb 16, 2024): I couldn't help but notice that the option is now in **BookStack v23.12.2** however, it's **not working**. I still had to use the code above to get my external links to open in a new tab. This sort of functionality is very common in wikis and the like; it's a wonder why it wasn't implemented sooner. ![image](https://github.com/BookStackApp/BookStack/assets/78627710/0670464d-0abf-472f-8d6c-d636e9f9174f) In the image above, I have checked the correct option, saved/closed that window and then saved/closed the editor window but the link wouldn't open into another window/tab. In fact, when I went back in to edit how the link behaves, it was set back to _current window_.

OVERLORD commented

2026-02-05 01:05:51 +03:00

@quirkiest commented on GitHub (Jul 30, 2024):

Hello @BAndresen,

You could accomplish this by placing the following script in your "Custom HTML Head" field in BookStack settings:

<script>
  document.addEventListener("DOMContentLoaded", function(){
    var links = document.links;

    for (var i = 0, linksLength = links.length; i < linksLength; i++) {
       if (links[i].hostname != window.location.hostname) {
           links[i].target = '_blank';
       }
    }
  });
</script>

Brilliant script! If I may, I'd suggest a slight change:

<script>
  document.addEventListener("DOMContentLoaded", function(){
    var links = document.links;

    for (var i = 0, linksLength = links.length; i < linksLength; i++) {
       if (links[i].hostname != window.location.hostname && links[i].target.toLowerCase() != '_self') {
           links[i].target = '_blank';
       }
    }
  });
</script>

That way if user specifically wants the links to open in same window they can specify it in the HTML view.

@quirkiest commented on GitHub (Jul 30, 2024): > Hello @BAndresen, > > You could accomplish this by placing the following script in your "Custom HTML Head" field in BookStack settings: > > ``` > <script> > document.addEventListener("DOMContentLoaded", function(){ > var links = document.links; > > for (var i = 0, linksLength = links.length; i < linksLength; i++) { > if (links[i].hostname != window.location.hostname) { > links[i].target = '_blank'; > } > } > }); > </script> > ``` Brilliant script! If I may, I'd suggest a slight change: ``` <script> document.addEventListener("DOMContentLoaded", function(){ var links = document.links; for (var i = 0, linksLength = links.length; i < linksLength; i++) { if (links[i].hostname != window.location.hostname && links[i].target.toLowerCase() != '_self') { links[i].target = '_blank'; } } }); </script> ``` That way if user specifically wants the links to open in same window they can specify it in the HTML view.

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/BookStack#1506