{"id":14156612,"url":"https://github.com/artiebits/svelte-seo","last_synced_at":"2025-04-13T12:47:33.928Z","repository":{"id":38421889,"uuid":"284768309","full_name":"artiebits/svelte-seo","owner":"artiebits","description":"Optimize your website for search engines and social media with meta tags, Open Graph, and JSON-LD.","archived":false,"fork":false,"pushed_at":"2025-04-04T14:24:49.000Z","size":415,"stargazers_count":470,"open_issues_count":3,"forks_count":24,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-06T09:05:15.318Z","etag":null,"topics":["json-ld","meta-tags","open-graph","open-graph-tags","sapper","search-engines","seo","ssr","svelte","svelte-kit"],"latest_commit_sha":null,"homepage":"https://artiebits.com","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/artiebits.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-08-03T17:49:06.000Z","updated_at":"2025-04-02T19:54:18.000Z","dependencies_parsed_at":"2024-04-09T18:39:44.771Z","dependency_job_id":"0dd47ecf-25c9-42ff-8fed-62652df83b3c","html_url":"https://github.com/artiebits/svelte-seo","commit_stats":{"total_commits":90,"total_committers":10,"mean_commits":9.0,"dds":0.4666666666666667,"last_synced_commit":"d29e21d427404f988d1da503d2a71d076ad714a0"},"previous_names":[],"tags_count":16,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/artiebits%2Fsvelte-seo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/artiebits%2Fsvelte-seo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/artiebits%2Fsvelte-seo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/artiebits%2Fsvelte-seo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/artiebits","download_url":"https://codeload.github.com/artiebits/svelte-seo/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248717243,"owners_count":21150388,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["json-ld","meta-tags","open-graph","open-graph-tags","sapper","search-engines","seo","ssr","svelte","svelte-kit"],"created_at":"2024-08-17T08:07:07.765Z","updated_at":"2025-04-13T12:47:33.905Z","avatar_url":"https://github.com/artiebits.png","language":"JavaScript","funding_links":["https://www.buymeacoffee.com/artiebits"],"categories":["JavaScript","svelte"],"sub_categories":[],"readme":"# Svelte SEO\n\nOptimize your Svelte app for search engines and social media with meta tags, Open Graph, and JSON-LD.\n\nSvelte SEO is a powerful and easy-to-use package designed to optimize your Svelte app for search engines and social media. By adding essential meta tags, Open Graph, Twitter Card tags, and JSON-LD to your pages, Svelte SEO improves your website's visibility and ranking in search results.\n\n**Sponsor Svelte SEO**\n\nIf you rely on Svelte SEO and find it useful, please consider supporting it. Maintaining an open source project takes time and your support would be greatly appreciated.\n\n\u003ca href=\"https://www.buymeacoffee.com/artiebits\" target=\"_blank\"\u003e\u003cimg src=\"https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png\" alt=\"Buy Me A Coffee\" style=\"height: 60px !important;width: 217px !important;\" \u003e\u003c/a\u003e\n\n\u003c!-- START doctoc generated TOC please keep comment here to allow auto update --\u003e\n\u003c!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE --\u003e\n\n- [Installation](#installation)\n- [Usage](#usage)\n - [Basic Usage](#basic-usage)\n - [Advanced Usage](#advanced-usage)\n- [Svelte SEO Properties](#svelte-seo-properties)\n - [Open Graph](#open-graph)\n - [Twitter](#twitter)\n - [Facebook](#facebook)\n - [JSON-LD](#json-ld)\n- [Setting Default SEO Properties](#setting-default-seo-properties)\n- [Acknowledgements](#acknowledgements)\n- [License](#license)\n\n\u003c!-- END doctoc generated TOC please keep comment here to allow auto update --\u003e\n\n## Installation\n\n- npm \n `npm install -D svelte-seo`\n- or yarn \n `yarn add -D svelte-seo`\n- or pnpm \n `pnpm add -D svelte-seo`\n\n## Usage\n\n### Basic Usage\n\nTo add basic meta tags like \"title\" and \"description\" you can import the package and use it like this:\n\n```svelte\n\u003cscript\u003e\n import SvelteSeo from \"svelte-seo\";\n\u003c/script\u003e\n\n\u003cSvelteSeo\n title=\"Simple page title\"\n description=\"Simple description about a page\"\n/\u003e\n```\n\n### Advanced Usage\n\nYou can provide additional properties to SvelteSeo component. Here is an example:\n\n```svelte\n\u003cscript\u003e\n import SvelteSeo from \"svelte-seo\";\n\u003c/script\u003e\n\n\u003cSvelteSeo\n title=\"Primal Movement | Natural Movement for Better Health\"\n description=\"Learn about primal movement exercises and how they can benefit your fitness.\"\n canonical=\"https://www.primal-movement.com/\"\n keywords=\"primal movement, natural movement, squatting, lunging, crawling, jumping, fitness\"\n openGraph={{\n title: \"Primal Movement | Natural Movement for Better Health\",\n description:\n \"Learn about primal movement exercises and how they can benefit your fitness.\",\n image: \"https://www.primal-movement.com/images/squatting.jpg\",\n url: \"https://www.primal-movement.com/\",\n type: \"website\",\n images: [\n {\n url: \"https://www.primal-movement.com/images/squatting.jpg\",\n width: 800,\n height: 600,\n alt: \"Squatting\",\n },\n {\n url: \"https://www.primal-movement.com/images/lunging.jpg\",\n width: 900,\n height: 800,\n alt: \"Crawling\",\n },\n {\n url: \"https://www.primal-movement.com/images/crawling.jpg\",\n alt: \"Jumping\",\n },\n {\n url: \"https://www.primal-movement.com/images/jumping.jpg\",\n },\n ],\n site_name: \"Primal Movement\",\n }}\n twitter={{\n card: \"summary_large_image\",\n site: \"@primalmovement\",\n title: \"Primal Movement | Natural Movement for Better Health\",\n description:\n \"Learn about primal movement exercises and how they can benefit your fitness.\",\n image: \"https://www.primal-movement.com/images/squatting.jpg\",\n }}\n facebook={{\n appId: \"1234567890\",\n }}\n/\u003e\n```\n\n## Svelte SEO Properties\n\n| Property | Type | Description |\n| ------------------------- | ---------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ |\n| `title` | `string` | A page title that will appear in search results. |\n| `description` | `string` | A page description that will appear in search results. |\n| `keywords` | `string` | Keywords that give search engines more information about the content of the page. |\n| `base` | `string` | A default URL and target for all links on a page. |\n| `applicationName` | `string` | The name of the web application that the page represents. |\n| `themeColor` | `string` | A suggested color that user agents should use to customize the display of the page or the surrounding user interface. |\n| `nofollow` | `boolean` (default `false`) | Prevents Googlebot from following any links on the page. |\n| `noindex` | `boolean` (default `false`) | Prevents the page from being included in the index. |\n| `nositelinkssearchbox` | `boolean` (default `false`) | Opt out of Google's Sitelinks search box. |\n| `notranslate` | `boolean` | Prevents Google from translating the page. |\n| `canonical` | `string` | The canonical URL of the page. |\n| `amp` | `string` | A URL to the AMP version of the webpage. |\n| `manifest` | `string` | The URL to a JSON file that tells the browser about your Progressive Web App and how it should behave when installed on the user's desktop or mobile device. |\n| `languageAlternates` | `Array\u003c{ hreflang: string; href: string }\u003e` | Provides Google with information about the variations of your content in other languages. |\n| `twitter.title` | `string` | The title of the content, maximum 70 characters. |\n| `twitter.description` | `string` | A description of the content, maximum 200 characters. |\n| `twitter.image` | `string` | The URL of an image to use in the Twitter card. Images must be less than 5MB in size. |\n| `twitter.imageAlt` | `string` | A text description of the image conveying its essential nature to visually impaired users. Maximum 420 characters. |\n| `twitter.card` | \"summary\" , \"summary_large_image\" , \"player\" , \"app\" | The type of Twitter card to use. |\n| `twitter.site` | `string` | The @username of the website. |\n| `twitter.creator` | `string` | The @username of the content creator. |\n| `twitter.player` | `string` | The HTTPS URL of the player iframe. |\n| `twitter.playerWidth` | `string` | The width of the iframe in pixels. |\n| `twitter.playerHeight` | `string` | The height of the iframe in pixels. |\n| `twitter.playerStream` | `string` | The URL to the raw video or audio stream. |\n| `twitter.appNameIphone` | `string` | The name of your iPhone app. |\n| twitter.appUrlIphone | `string` | The custom URL scheme for your app on iPhone (include ”://” after your scheme name) |\n| twitter.appNameIpad | `string` | The name of your iPad-optimized app |\n| twitter.appIdIpad | `string` | Your app's ID in the iTunes App Store |\n| twitter.appNameGoogleplay | `string` | The name of your Android app |\n| twitter.appIdGoogleplay | `string` | Your app's ID in the Google Play Store |\n| twitter.appUrlGoogleplay | `string` | The custom URL scheme for your app on Google Play |\n| facebook.appId | `string` | A unique number that identifies your app when you request ads from Audience Network, known as a Facebook App ID |\n| openGraph.title | `string` | The title of your object as it should appear within the graph |\n| openGraph.type | `string` | The type of your object, such as \"video.movie\". Depending on the type, other properties may also be required. |\n| openGraph.url | `string` | The canonical URL of your object that will be used as its permanent ID in the graph |\n| openGraph.audio | `string` | An audio file to accompany the content. |\n| openGraph.audioSecure_url | `string` | An alternate URL to use if the webpage requires HTTPS |\n| openGraph.audioType | `string` | The MIME type for the audio |\n| openGraph.description | `string` | A one- or two-sentence description of your object |\n| openGraph.determiner | `string` | The word that appears before the title, e.g., \"the\" or \"a\". |\n| openGraph.locale | `string` | The locale of the content, e.g., \"en_US\". |\n| openGraph.localeAlternate | `string[]` | Alternate locales for the content. https://ogp.me/#array |\n| openGraph.site_name | `string` | The name of the website where the content is hosted. |\n| openGraph.images | `Array` | Properties about images related to the web page. |\n| openGraph.videos | [`OpenGraphVideo`](./src/lib/types.d.ts) | Properties about videos related to the web page. |\n| openGraph.music | [`OpenGraphMusic`](./src/lib/types.d.ts) | OpenGraph for music files. |\n| openGraph.movie | [`OpenGraphMovie`](./src/lib/types.d.ts) | OpenGraph for a movie. |\n| openGraph.article | [`OpenGraphArticle`](./src/lib/types.d.ts) | OpenGraph for an article. |\n| openGraph.book | [`OpenGraphBook`](./src/lib/types.d.ts) | OpenGraph for a book. |\n| openGraph.profile | [`OpenGraphProfile`](./src/lib/types.d.ts) | OpenGraph for a profile. |\n\n### Open Graph\n\nSvelte SEO supports the following Open Graph object types: basic, music, movie, article, book, and profile. For the full specification, please check out http://ogp.me/.\n\n### Twitter\n\nSvelte SEO supports all Twitter Card Tags. For more information, check out the Twitter documentation at https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/markup.\n\n```svelte\ntwitter={{\n card: \"summary_large_image\",\n site: \"@primalmovement\",\n title: \"Primal Movement | Natural Movement for Better Health\",\n description:\n \"Learn about primal movement exercises and how they can benefit your fitness.\",\n image: \"https://www.primal-movement.com/images/squatting.jpg\",\n imageAlt: \"Squatting\",\n}}\n```\n\n### Facebook\n\n```svelte\nfacebook={{\n appId: \"1234567890\",\n}}\n```\n\n### JSON-LD\n\nJSON-LD provides a more customizable and detailed representation of content in search results. With Svelte SEO, you can implement all available JSON-LD types. Here is a basic example:\n\n```svelte\njsonLd={{\n \"@context\": \"https://schema.org\",\n \"@type\": \"WebSite\",\n name: \"Primal Movement | Natural Movement for Better Health\",\n description:\n \"Learn about primal movement exercises and how they can benefit your fitness.\",\n url: \"https://www.primal-movement.com\",\n}}\n```\n\n## Setting Default SEO Properties\n\nYou can set default SEO properties that will appear on every page without needing to add them individually. Common meta tags like `theme-color`, `manifest`, and `base` can be present on every page. If you configure the Svelte SEO in your `+layout.svelte`, these properties will stay fixed for every page. They can be changed on a per-page basis if necessary. For more information on using layouts and routing with SvelteKit, please refer to the official documentation at https://kit.svelte.dev/docs/routing#layout.\n\n## Acknowledgements\n\nThis is inspired by [Next SEO](https://github.com/garmeeh/next-seo) by [@garmeeh](https://github.com/garmeeh).\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fartiebits%2Fsvelte-seo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fartiebits%2Fsvelte-seo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fartiebits%2Fsvelte-seo/lists"}