# @astrolib/seo
> Managing your SEO easier in Astro projects
Latest version **1.0.0-beta.8** (published 2024-10-04) · MIT license · 0 weekly downloads
## Install
```sh
npm install @astrolib/seo
pnpm add @astrolib/seo
yarn add @astrolib/seo
bun add @astrolib/seo
```
## Health
**Score 30/100 (F)** — status: abandoned.
Positive: has types; esm support; no vulnerabilities; high quality score.
Warnings: low downloads.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 1.0.0-beta.8 |
| Published | 2024-10-04 |
| First published | 2022-09-11 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 48.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 75 |
| Author | onWidget |
| Maintainers | prototypa |
| Keywords | astro-component, withastro, astro, astrolib, seo, astro-seo, astro-integration |
## Links
- npm: https://www.npmjs.com/package/@astrolib/seo
- Repository: https://github.com/onwidget/astrolib
- Homepage: https://github.com/onwidget/astrolib/tree/main/packages/seo
- Issues: https://github.com/onwidget/astrolib/issues
- npm.io page: https://npm.io/package/@astrolib/seo
## Recent versions
- 1.0.0-beta.8 (latest) — 2024-10-04
- 1.0.0-beta.4 (beta) — 2023-08-23
- 1.0.0-beta.7 — 2024-10-04
- 1.0.0-beta.6 — 2024-09-17
- 1.0.0-beta.5 — 2023-12-09
- 1.0.0-beta.3 — 2023-08-23
- 0.6.0 — 2023-08-07
- 0.5.2 — 2023-08-07
- 0.5.1 — 2023-08-07
- 0.5.0 — 2023-08-07
- 0.4.0 — 2023-06-14
- 0.3.1 — 2023-06-14
- 0.2.2 — 2023-06-14
- 0.3.0 — 2023-01-13
- 0.2.1 — 2022-09-11
- … 2 more at https://npm.io/package/@astrolib/seo/versions
## README
# Astro SEO - @astrolib/seo
`Astro SEO` is an integration that makes managing your SEO easier in Astro projects. It is fully based on the excellent [Next SEO](https://github.com/garmeeh/next-seo) library
## Usage
`Astro SEO` works by including it on pages where you would like SEO attributes to be added. Once included on the page you pass it a configuration object with the page's SEO properties. This can be dynamically generated at a page level or in some cases your API may return an SEO object.
### Setup
First, install it:
```bash
npm install @astrolib/seo
```
or
```bash
yarn add @astrolib/seo
```
### Add SEO to Page
Then you need to import `@astrolib/seo` and add the desired properties. This will render out the tags in the `` for SEO. At a bare minimum, you should add a title and description.
**Example with just title and description:**
```astro
---
import { AstroSeo } from '@astrolib/seo';
---
```
But `Astro SEO` gives you many more options that you can add. See below for a typical example of a page.
**Typical page example:**
```astro
---
import { AstroSeo } from '@astrolib/seo';
---
```
### Options
| Property | Type | Description |
| ---------------------------------- | ----------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `titleTemplate` | string | Allows you to set default title template that will be added to your title |
| `title` | string | Set the meta title of the page |
| `noindex` | boolean | Sets whether page should be indexed or not |
| `nofollow` | boolean | Sets whether page should be followed or not |
| `robotsProps` | Object | Set the more meta information for the `X-Robots-Tag` |
| `description` | string | Set the page meta description |
| `canonical` | string | Set the page canonical url |
| `mobileAlternate.media` | string | Set what screen size the mobile website should be served from |
| `mobileAlternate.href` | string | Set the mobile page alternate url |
| `languageAlternates` | array | Set the language of the alternate urls. Expects array of objects with the shape: `{ hrefLang: string, href: string }` |
| `additionalMetaTags` | array | Allows you to add a meta tag that is not documented here. |
| `additionalLinkTags` | array | Allows you to add a link tag that is not documented here. |
| `twitter.cardType` | string | The card type, which will be one of `summary`, `summary_large_image`, `app`, or `player` |
| `twitter.site` | string | @username for the website used in the card footer |
| `twitter.handle` | string | @username for the content creator / author (outputs as `twitter:creator`) |
| `facebook.appId` | string | Used for Facebook Insights, you must add a facebook app ID to your page to for it |
| `openGraph.url` | string | The canonical URL of your object that will be used as its permanent ID in the graph |
| `openGraph.type` | string | The type of your object. Depending on the type you specify, other properties may also be required |
| `openGraph.title` | string | The open graph title, this can be different than your meta title. |
| `openGraph.description` | string | The open graph description, this can be different than your meta description. |
| `openGraph.images` | array | An array of images (object) to be used by social media platforms, slack etc as a preview. If multiple supplied you can choose one when sharing. |
| `openGraph.videos` | array | An array of videos (object) |
| `openGraph.locale` | string | The locale the open graph tags are marked up in. Of the format language_TERRITORY. Default is en_US. |
| `openGraph.site_name` | string | If your object is part of a larger web site, the name which should be displayed for the overall site. |
| `openGraph.profile.firstName` | string | Person's first name. |
| `openGraph.profile.lastName` | string | Person's last name. |
| `openGraph.profile.username` | string | Person's username. |
| `openGraph.profile.gender` | string | Person's gender. |
| `openGraph.book.authors` | string[] | Writers of the article. |
| `openGraph.book.isbn` | string | The [ISBN](https://en.wikipedia.org/wiki/International_Standard_Book_Number) |
| `openGraph.book.releaseDate` | datetime | The date the book was released. |
| `openGraph.book.tags` | string[] | Tag words associated with this book. |
| `openGraph.article.publishedTime` | datetime | When the article was first published. |
| `openGraph.article.modifiedTime` | datetime | When the article was last changed. |
| `openGraph.article.expirationTime` | datetime | When the article is out of date after. |
| `openGraph.article.authors` | string[] | Writers of the article. |
| `openGraph.article.section` | string | A high-level section name. E.g. Technology |
| `openGraph.article.tags` | string[] | Tag words associated with this article. |
---
_Source: https://npm.io/package/@astrolib/seo · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._