Metadata Plugin

The metadata plugin is a built-in Coralite tool that extracts metadata from <meta> tags in your page's <head> and makes them available as template variables. This allows you to easily reuse page metadata within your components and layout templates.

Basic Usage #

The plugin automatically scans the <head> section of your pages for <meta> tags with name and content attributes. These values are exposed to your templates as variables prefixed with meta_.

Defining Metadata #

Define your metadata in the page HTML:




<html>
<head>
  <meta name="title" content="My Awesome Page"></meta>
  <meta name="description" content="This is a description of my page."></meta>
  <meta name="author" content="Coralite Team"></meta>
</head>
<body>
  <page-header></page-header>
  

</body>
</html>

Accessing Metadata #

Access the values in your components using the meta_ prefix:

<template id="page-header">
  <header>
    <h1>{{ meta_title }}</h1>
    <p>By {{ meta_author }}</p>
    <div class="summary">{{ meta_description }}</div>
  </header>
</template>

In this example:

name="title" becomes meta_title
name="author" becomes meta_author
name="description" becomes meta_description

Dynamic Metadata #

The metadata plugin can also process components placed inside the <head>. This is useful for creating reusable SEO components or dynamic metadata bundles.

Using Components in Head #



<template id="seo-bundle">
  <meta name="robots" content="index, follow"></meta>
  <meta name="theme-color" content="#ffffff"></meta>
  <meta name="generator" content="Coralite"></meta>
</template>




<html>
<head>
  <seo-bundle></seo-bundle>
  <meta name="page-specific" content="value"></meta>
</head>
<body>
  <debug-panel></debug-panel>
</body>
</html>

The plugin will render the <seo-bundle> component and extract any <meta> tags it produces. These values will then be available to other components on the page.

<template id="debug-panel">
  <div class="debug">
    <p>Theme: {{ meta_theme-color }}</p>
    <p>Generator: {{ meta_generator }}</p>
  </div>
</template>

Key Points #

Built-in: Included by default in Coralite.
Prefix: All variables are prefixed with meta_.
Attributes: Only tags with both name and content attributes are processed.
Scope: Variables are added to the page's global values and available to all components.
Execution: Runs at build time during the onPageSet lifecycle hook.