diff --git a/assets/search/js/index.ts b/assets/search/js/index.ts
index 17973dbfdaa..e73407d7421 100644
--- a/assets/search/js/index.ts
+++ b/assets/search/js/index.ts
@@ -13,7 +13,7 @@ import { init as i18nInit } from "./i18n"
       new Search()
     
       if (params.modal_container !== '') {
-          (new Modal()).init()
+        (new Modal()).init()
       }
     })
   })
diff --git a/assets/search/js/renderer.ts b/assets/search/js/renderer.ts
index ead66540f3b..895337d8a15 100644
--- a/assets/search/js/renderer.ts
+++ b/assets/search/js/renderer.ts
@@ -19,6 +19,8 @@ export default class Renderer {
 
     private time = 0
 
+    private resultLinkTarget = ''
+
     constructor(
         private container: string | HTMLElement,
         private statistics: string | HTMLElement,
@@ -325,13 +327,24 @@ export default class Renderer {
 
     }
 
+    private resultLinkTarget = ''
+
+    private getResultLinkTarget(): string {
+        if (this.resultLinkTarget === '' && this.getContainer().closest('.search-container') !== null) {
+            // open result on new tab on single search page mode.
+            this.resultLinkTarget = ' target="_blank"'
+        }
+
+        return this.resultLinkTarget
+    }
+
     private renderPage(page = 1) {
         const max = page * this.paginate
         const min = max - this.paginate
         let results = ''
         for (let i = min; i < this.results.length && i < max; i++) {
             const result = this.results[i]
-            results += `<a title="${result.item.title}" href="${this.url(result.item, result.item.url)}" class="search-result" aria-selected="false">
+            results += `<a title="${result.item.title}" href="${this.url(result.item, result.item.url)}"${this.getResultLinkTarget()} class="search-result" aria-selected="false">
   <div class="search-result-icon">${this.icon(result.item)}</div>
   <div class="search-result-content">
     <div class="search-result-title">${this.title(result)}</div>
@@ -377,7 +390,7 @@ export default class Renderer {
                 ancestors = ancestors.concat(result.item.title)
                 const subtitle = ancestors.join(' · ')
                 
-                headings += `<a title="${heading.title} - ${subtitle}" href="${this.url(result.item, result.item.url)}#${heading.anchor}" class="search-result search-result-heading">
+                headings += `<a title="${heading.title} - ${subtitle}" href="${this.url(result.item, result.item.url)}#${heading.anchor}"${this.getResultLinkTarget()} class="search-result search-result-heading">
   <div class="search-result-icon search-result-heading-icon">${params.icons['heading']}</div>
   <div class="search-result-content">
     <div class="search-result-title">${this.highlight(heading.title, [matches[j]])}</div>