#How to add soft hyphen in frontmatter

1 messages · Page 1 of 1 (latest)

regal seal
#

How to add ­ to frontmatter and have it rendered as a soft hyphen instead of these characters representing it

slender dustBOT
#

Hi @regal seal. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

Astro frontmatter is written in YAML (or TOML), which is a plain text format and does not interpret HTML entities like ­ as actual characters—they are stored and rendered as the literal string ­. This means that if you add ­ in your frontmatter, it will appear as ­ in your rendered content, not as a soft hyphen.

If you want a soft hyphen to appear in your rendered output, you need to use the actual Unicode character for a soft hyphen (U+00AD) in your frontmatter value. For example:

--- 
title: "Hy­phenated Title"
---

(where the ­ is the actual soft hyphen character, not the string ­)

When you use this value in your template, Astro will render the soft hyphen as intended.

If you use ­ in your frontmatter, it will not be converted to a soft hyphen automatically. There is no built-in feature in Astro or Starlight to parse HTML entities in frontmatter values and render them as their corresponding characters. If you need this behavior, you would have to process the frontmatter value in your template or with a plugin to replace ­ with the actual character.

The knowledge sources do not mention a built-in way to automatically convert HTML entities in frontmatter to their character equivalents during rendering. For more advanced processing, you could consider using a remark or rehype plugin to modify frontmatter programmatically, but this would require custom plugin logic to replace entities like ­ with their Unicode equivalents Modifying frontmatter programmatically.

In summary:

#
  • Use the actual soft hyphen character in your frontmatter for it to render as a soft hyphen.
  • ­ in frontmatter will render as the literal string, not as a soft hyphen.
  • There is no built-in feature to convert HTML entities in frontmatter to their character equivalents.

If you need to automate this, you would need a custom plugin.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: