https://github.com/daun/mark-external-links

Add target and rel attributes to external links
https://github.com/daun/mark-external-links

external javascript links newtab

Last synced: 11 months ago
JSON representation

Add target and rel attributes to external links

• Host: GitHub
• URL: https://github.com/daun/mark-external-links
• Owner: daun
• License: mit
• Created: 2020-08-01T17:02:27.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2020-08-10T21:49:27.000Z (almost 6 years ago)
• Last Synced: 2025-04-03T03:44:24.322Z (about 1 year ago)
• Topics: external, javascript, links, newtab
• Language: JavaScript
• Homepage:
• Size: 19.5 KB
• Stars: 1
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Mark External Links

[![NPM version](https://img.shields.io/npm/v/mark-external-links)](https://www.npmjs.com/package/mark-external-links)

[![Bundle size](https://img.shields.io/bundlephobia/minzip/mark-external-links?label=size)](https://bundlephobia.com/result?p=mark-external-links)

[![GitHub license](https://img.shields.io/github/license/daun/mark-external-links)](./LICENSE)

![Travis Build](https://img.shields.io/travis/com/daun/mark-external-links)

![Codecov](https://img.shields.io/codecov/c/github/daun/mark-external-links)

Add target and rel attributes to external links.

Automatically detects new links added to the document by installing a mutation

observer. This makes it safe to use when adding content via AJAX, using frontend

frameworks, etc.

**Before**

```html

link

```

**After**

```html

link

```

## Installation

```bash

npm install mark-external-links

```

## Usage

Import and call `markExternalLinks()`.

```js

import markExternalLinks from 'mark-external-links'

markExternalLinks()

```

## Options

All options and their defaults:

```js

markExternalLinks({

  target: '_blank',

  rel: 'nofollow noopener noreferrer',

  test: link => link.hostname !== window.location.hostname

})

```

## In the browser

If you don't have the luxury of using a bundler, slap it in a script tag and

call it a day.

```html

  markExternalLinks.markExternalLinks()

```

## License

[MIT](https://opensource.org/licenses/MIT)