Copyright © 2024 contributors of Mutaforma • Github

Mappings

Introduction

Mappings can be defined using the mappings property in the configuration file.

A mapping specifies how a content object with a specific style (e.g., paragraph or heading) in the source document is to be converted into a HTML element.

For instance the mapping below specifies that all content objects with the style "Heading 1" in a source document are to be converted to h1 HTML elements with the attribute class="heading-1".

{
  names: ["Heading 1"],
  element: {
    name: "h1",
    attrs: {
      class: "heading-1"
    }
  }
}
<h1 class="heading-1">
  ...
</h1>

The names property accepts one ore more style names as they appear in your word processor's graphical user interface.

The element property defines the HTML element to which the content object with the styles defined in names will be converted. You can define the elements's name using the element.name property and optionally add attributes using the element.attrs property.

Mapping many styles to one HTML element

As previously mentioned the names property of a mapping accepts more than one style name, allowing you to map many styles to a single HTML element. For example, the following mappings causes all content objects with the styles "Heading 1" or "Heading 2" to map to a single h1 HTML element without any attributes.

{
  names: ["Heading 1", "Heading 2"],
  element: {
    name: "h1",
  }
}
<h1>
  ...
</h1>