Unhead

Guides

Tag Position

How tags are position in the DOM and how to configure them.

For non-attribute tags such as <script>, <style> and <link>, they are rendered by default in the document <head>.

But this isn't always useful. Sometimes you need to embed tags in different positions.

tagPosition

The tagPosition attribute lets you control where the tag is rendered for tags that support it.

Possible values:

  • head - Render in the <head> (default)
  • bodyOpen - Render at the start of the <body>
  • bodyClose - Render at the end of the <body>

Note:

  • Providing body: true is the same as tagPosition: 'bodyClose'.
  • Sorting may not be stricly honoured when moving outside the head

Examples

Render a script at the end of the document

useHead({
  script: [
    {
      src: '/my-lazy-script.js',
      tagPosition: 'bodyClose',
    },
  ],
})

useScript

Load third-party scripts with SSR support and a proxied API.

Tag Sorting

How tags are sorted and how to configure them.