Routify 3 public BETA is here! Check it out

HTML Metatags and OpenGraph

HTML metatags and OG can be set with the metatags helper.

import { metatags } from '@roxi/routify' metatags.description = 'Routes for Svelte'
import { metatags } from '@roxi/routify'
metatags.description = 'Routes for Svelte'

Would render the following HTML:

<meta name="description" content="Routes for Svelte"> <meta property="og:description" content="Routes for Svelte">
<meta name="description" content="Routes for Svelte">
<meta property="og:description" content="Routes for Svelte">

Tags without a colon, like description will render a metatag and an OG metatag with the same name/property. Tags with a colon like twitter:card will not generate OG data.

Title

Setting metatags.title = "Routify" also generates <title>Routify</title>

import { metatags } from '@roxi/routify' metatags.title = 'Routify'
import { metatags } from '@roxi/routify'
metatags.title = 'Routify'

Would render the following HTML:

<title>Routify</title> <meta name="title" content="Routes for Svelte"> <meta property="og:title" content="Routes for Svelte">
<title>Routify</title>
<meta name="title" content="Routes for Svelte">
<meta property="og:title" content="Routes for Svelte">

Non-OpenGraph Metadata

You can set any kind of tag you want. For example, a twitter:card metatag can be created by doing the following

import { metatags } from '@roxi/routify' metatags['twitter:card'] = 'summary_large_image'
import { metatags } from '@roxi/routify'
metatags['twitter:card'] = 'summary_large_image'

Would render the following HTML:

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:card" content="summary_large_image">

Templates

Templates can be set with metatags.template(property, callback) ie. metatags.template("title", value => `My Site - ${value}`). If multiple layouts with templates are present, the layout nearest the root takes precedence.


Writing good documentation that is up-to-date is difficult. If you notice a mistake, help us out.