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.