Tag Attributes

data-trio-* tag attributes are used as markers to indicate that a specific action is associated with its HTML tag.

When building for release Trio removes all the data-trio-* attributes from the generated pages.

You can add your own custom data-trio-* attributes to your markup which you can then target in your tag-based callbacks:

$page("[data-trio-myattribute]").addClass("someCssClass")

data-trio-fragment

• Optional
• Applicable in template assets.
• Is used to indicate that the HTML tag is the target of a fragment asset's content.
• See appendToTarget and fragment for more information.

data-trio-include="[filename] | [fragment front matter property]"

• Optional
• Applicable in template and fragment assets.
• The name of the file to be included can be directly assigned or can be determined indirectly by assigning the name of a fragment front matter property whose value names the file to be included.
• The name of the file to be included requires a file extension (e.g. .html | .md).
• Is used to indicate that the HTML tag is the target of the named include asset's content.
• See Include for more information.

data-trio-callback="name of tag-based callback"

• Optional
• Applicable in template, fragment and include assets.
• File extension is not required; it is assumed that it is .js.
• Is used to indicate that the HTML tag is requesting that Trio call the named tag-based callback.
• The named callback can reference this tag using the $tag parameter.
• See Tag-Based Callbacks for more information.

data-trio-link

• Optional
• Applicable when your Web hosting services hosts your site in a subfolder and requires that your URLs be prepended with a base URL.
• See Base URL for more information.

See Also

• Blogging
• Fragment
• Include
• JSON Data
• Core Concepts
• Metadata
• Tag-Based Callbacks
• Template