---
title: "useShareLinks() · Nuxt SEO Utils · Nuxt SEO"
canonical_url: "https://nuxtseo.com/docs/seo-utils/api/share-links"
last_updated: "2026-08-16T10:05:34.327Z"
meta:
  description: "A composable that generates social share URLs for the current page across multiple platforms."
  "og:description": "A composable that generates social share URLs for the current page across multiple platforms."
  "og:title": "useShareLinks() · Nuxt SEO Utils · Nuxt SEO"
---

Nuxt SEO on GitHub

Switch to SEO UtilsSwitch to Nuxt SEOSwitch to RobotsSwitch to SitemapSwitch to OG ImageSwitch to Schema.orgSwitch to Link CheckerSwitch to Site ConfigSwitch to Skew ProtectionSwitch to AI Ready

**Nuxt API**

# **useShareLinks()**

## Usage

Use the auto-imported `**useShareLinks**` composable to generate share URLs for the current page.

```ts
const share = useShareLinks()
// share.value.twitter, share.value.facebook, etc.
```

Access individual platform URLs and the canonical URL from the returned computed ref:

```vue
<template>
  <a :href="share.twitter" target="_blank">Share on Twitter</a>
  <a :href="share.facebook" target="_blank">Share on Facebook</a>
  <button @click="copyToClipboard(share.canonicalUrl)">Copy Link</button>
</template>

<script setup>
const share = useShareLinks()

function copyToClipboard(text) {
  navigator.clipboard.writeText(text)
}
</script>
```

### UTM Tracking

UTM tracking is enabled by default. Each platform gets `**utm_source**` set to its name, and `**utm_medium**` is set intelligently (`**'social'**` for social platforms, `**'email'**` for email):

```ts
const share = useShareLinks()
// twitter: ...?utm_source=twitter&utm_medium=social
// email:   ...?utm_source=email&utm_medium=email
```

Disable with `**utm: false**`, or pass an object for manual control:

```ts
const share = useShareLinks({
  utm: {
    source: 'newsletter',
    medium: 'email',
    campaign: 'spring-launch',
  },
})
```

Use `**source: 'auto'**` for hybrid mode: auto source and medium per platform, with additional custom params:

```ts
const share = useShareLinks({
  utm: { source: 'auto', campaign: 'spring-launch' },
})
// twitter: ...?utm_source=twitter&utm_medium=social&utm_campaign=spring-launch
// email:   ...?utm_source=email&utm_medium=email&utm_campaign=spring-launch
```

### Custom URL and Title

Override the default canonical URL and title:

```ts
const share = useShareLinks({
  url: 'https://example.com/special-page',
  title: 'Check out this page',
})
```

## Options

### `**url**`

- Type: `**MaybeRefOrGetter<string | undefined>**`
- Default: canonical URL of the current page

Override the URL to share. Defaults to the canonical URL resolved from the current route and site config.

### `**title**`

- Type: `**MaybeRefOrGetter<string | undefined>**`
- Default: site name from site config

The title or text included in the share link. Falls back to the `**name**` from your site config.

### `**utm**`

- Type: `**MaybeRefOrGetter<boolean | ShareLinkUtmParams | undefined>**`
- Default: `**true**`

UTM tracking parameters. Three modes:

| **Value** | **Behavior** |
| --- | --- |
| `**true**` | Auto mode: `**utm_source**` = platform name, `**utm_medium**` = `**'social'**` or `**'email'**` |
| `**{ source: 'auto', ... }**` | Same auto behavior as `**true**`, plus additional params like `**campaign**` |
| `**{ source: 'x', ... }**` | Manual: same params on all platforms |

`**ShareLinkUtmParams**` fields:

- `**source**` ( `**'auto' | string**`) — `**'auto'**` uses the platform name per link
- `**medium**` ( `**string**`) — overrides auto medium when using `**source: 'auto'**`
- `**campaign**` ( `**string**`)
- `**term**` ( `**string**`)
- `**content**` ( `**string**`)

### `**twitter**`

- Type: `**{ via?: string, hashtags?: string[] }**`

Platform-specific options for Twitter/X.

- `**via**`: Twitter username to attribute (without @).
- `**hashtags**`: Array of hashtags to include (without #).

### `**facebook**`

- Type: `**{ quote?: string, hashtag?: string }**`

Platform-specific options for Facebook.

- `**quote**`: Pre-filled text to accompany the share.
- `**hashtag**`: A single hashtag (without #, e.g. `**"nuxt"**`). The `**#**` is added automatically.

### `**pinterest**`

- Type: `**{ media?: MaybeRefOrGetter<string | undefined> }**`

Platform-specific options for Pinterest.

- `**media**`: Direct image URL to pin.

## Supported Platforms

| **Platform** | **Share behavior** |
| --- | --- |
| `**twitter**` | Tweet with URL and text |
| `**facebook**` | Facebook share dialog |
| `**linkedin**` | LinkedIn share dialog |
| `**whatsapp**` | WhatsApp message with title and URL |
| `**telegram**` | Telegram share with text |
| `**reddit**` | Reddit submit with URL and title |
| `**pinterest**` | Pinterest pin with URL and description |
| `**email**` | `**mailto:**` link with subject and body |

## Return Value

- Type: `**ComputedRef<ShareLinks>**`

Where `**ShareLinks**` is `**Record<SharePlatform, string> & { canonicalUrl: string }**`.

| **Key** | **Description** |
| --- | --- |
| `**twitter**`, `**facebook**`, etc. | Fully encoded share URL for each platform |
| `**canonicalUrl**` | The resolved page URL without UTM params, useful for "copy link" buttons |

**Was this page helpful?**

### **Related **

[**Open Graph Images**](https://nuxtseo.com/docs/seo-utils/guides/open-graph-images)

[**Nuxt SEO Utils**](https://nuxtseo.com/docs/seo-utils/getting-started/introduction)

[**Nuxt OG Image**](https://nuxtseo.com/docs/og-image/getting-started/introduction)

[**useFallbackTitle()** A composable that returns a computed ref with the fallback title for the current page.](https://nuxtseo.com/docs/seo-utils/api/fallback-title) [**v8.0.0** Release notes for v8.0.0 of Nuxt SEO Utils.](https://nuxtseo.com/docs/seo-utils/releases/v8)