From d0159c8a850cbd2a010a3d44bdeb97c3db651d0e Mon Sep 17 00:00:00 2001
From: T <6601329+cookesan@users.noreply.github.com>
Date: Sun, 28 Jun 2026 07:23:59 -0300
Subject: [PATCH] feat: support social link target option (#5242)

---
 __tests__/e2e/.vitepress/config.ts                    | 8 ++++++++
 __tests__/e2e/home.test.ts                            | 9 +++++++++
 docs/en/reference/default-theme-config.md             | 2 ++
 src/client/theme-default/components/VPSocialLink.vue  | 3 ++-
 src/client/theme-default/components/VPSocialLinks.vue | 3 ++-
 types/default-theme.d.ts                              | 1 +
 6 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/__tests__/e2e/.vitepress/config.ts b/__tests__/e2e/.vitepress/config.ts
index 121761e7..441eda1c 100644
--- a/__tests__/e2e/.vitepress/config.ts
+++ b/__tests__/e2e/.vitepress/config.ts
@@ -162,6 +162,14 @@ export default defineConfig({
   themeConfig: {
     nav,
     sidebar,
+    socialLinks: [
+      {
+        icon: 'github',
+        link: '/home',
+        ariaLabel: 'Home social link',
+        target: '_self'
+      }
+    ],
     search: {
       provider: 'local',
       options: {
diff --git a/__tests__/e2e/home.test.ts b/__tests__/e2e/home.test.ts
index 76868361..b6bd6ff9 100644
--- a/__tests__/e2e/home.test.ts
+++ b/__tests__/e2e/home.test.ts
@@ -32,4 +32,13 @@ describe('render correct content', async () => {
     const outlineLinksCount = await outlineLinksLocator.count()
     expect(outlineLinksCount).toEqual(4)
   })
+
+  test('social link target override', async () => {
+    const socialLink = page.locator(
+      '.VPNavBarSocialLinks a[aria-label="Home social link"]'
+    )
+
+    expect(await socialLink.getAttribute('href')).toBe('/home')
+    expect(await socialLink.getAttribute('target')).toBe('_self')
+  })
 })
diff --git a/docs/en/reference/default-theme-config.md b/docs/en/reference/default-theme-config.md
index b515cb45..cc4ffd0e 100644
--- a/docs/en/reference/default-theme-config.md
+++ b/docs/en/reference/default-theme-config.md
@@ -253,6 +253,7 @@ export default {
       // You can add any icon from simple-icons (https://simpleicons.org/):
       { icon: 'github', link: 'https://github.com/vuejs/vitepress' },
       { icon: 'twitter', link: '...' },
+      { icon: 'discord', link: '/community', target: '_self' },
       // You can also add custom icons by passing SVG as string:
       {
         icon: {
@@ -272,6 +273,7 @@ interface SocialLink {
   icon: string | { svg: string }
   link: string
   ariaLabel?: string
+  target?: string
 }
 ```
 
diff --git a/src/client/theme-default/components/VPSocialLink.vue b/src/client/theme-default/components/VPSocialLink.vue
index 2a016462..7e441ebb 100644
--- a/src/client/theme-default/components/VPSocialLink.vue
+++ b/src/client/theme-default/components/VPSocialLink.vue
@@ -7,6 +7,7 @@ const props = defineProps<{
   icon: DefaultTheme.SocialLinkIcon
   link: string
   ariaLabel?: string
+  target?: string
   me: boolean
 }>()
 
@@ -45,7 +46,7 @@ if (import.meta.env.SSR) {
     class="VPSocialLink no-icon"
     :href="link"
     :aria-label="ariaLabel ?? (typeof icon === 'string' ? icon : '')"
-    target="_blank"
+    :target="target ?? '_blank'"
     :rel="me ? 'me noopener' : 'noopener'"
     v-html="svg"
   ></a>
diff --git a/src/client/theme-default/components/VPSocialLinks.vue b/src/client/theme-default/components/VPSocialLinks.vue
index b188fb89..062f7f62 100644
--- a/src/client/theme-default/components/VPSocialLinks.vue
+++ b/src/client/theme-default/components/VPSocialLinks.vue
@@ -13,11 +13,12 @@ withDefaults(defineProps<{
 <template>
   <div class="VPSocialLinks">
     <VPSocialLink
-      v-for="{ link, icon, ariaLabel } in links"
+      v-for="{ link, icon, ariaLabel, target } in links"
       :key="link"
       :icon
       :link
       :ariaLabel
+      :target
       :me
     />
   </div>
diff --git a/types/default-theme.d.ts b/types/default-theme.d.ts
index ae3c2c71..1d4f4f85 100644
--- a/types/default-theme.d.ts
+++ b/types/default-theme.d.ts
@@ -318,6 +318,7 @@ export namespace DefaultTheme {
     icon: SocialLinkIcon
     link: string
     ariaLabel?: string
+    target?: string
   }
 
   export type SocialLinkIcon = string | { svg: string }