Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(#177): enable understanding of front matter #190

Merged
merged 2 commits into from
Nov 12, 2024

Conversation

bingocaller
Copy link
Contributor

@bingocaller bingocaller commented Nov 11, 2024

Hi @jannis-baum, I hope you don’t mind me posting a PR out of the blue. I was looking for front matter support in Vivify and found #177. I looked into it a little bit myself and realised that we could get the basic functionality implemented by installing and enabling markdown-it-front-matter, so I thought I would just go for it! ☺️

Why

Some users add metadata to their Markdown files in the form of YAML-style front matter and it currently gets treated as regular content, which looks a bit odd when rendered on the page.

Instead, we would like to be able to identify front matter and not render it to the page. Ideally we would like to make the metadata available and/or optionally render it to the page in some way, but this would require some reworking of the current setup.

What

  • Install markdown-it-front-matter1, which enables markdown-it to parse YAML-style front matter.
  • Enable markdown-it-front-matter via MarkdownIt.use() like we do with other plugins.
    • Note: This doesn’t actually do anything other than enable markdown-it to recognise front matter and not treat it as regular content.

Screenshots/recordings

Source

Markdown file with the following text: --- id: 202411110946, title:, Vivify front matter demo, date: 2024-11-11 09:46, tags: [vivify, markdown, parsing, yaml, front-matter] --- # Vivify front matter demo. Hello there! This is a demo document for showing front matter functionality in Vivify.

Output, before

Document showing a long string of text at the top: “id: 202411110946 title: Vivify front matter demo date: 2024-11-11 09:46 tags: [vivify, markdown, parsing, yaml, front-matter]”. The long string is followed by a heading: “Vivify front matter demo”, which is followed by a paragraph: “Hello there! This is a demo document for showing front matter functionality in Vivify.”

Output, after

Document showing a heading: “Vivify front matter demo”, which is followed by a paragraph: “Hello there! This is a demo document for showing front matter functionality in Vivify.”

Related PRs/issues

#177

Footnotes

  1. https://github.com/ParkSB/markdown-it-front-matter

**Why:**

Some users add metadata to their Markdown files in the form of
YAML-style front matter and it currently gets treated as regular
content, which looks a bit odd when rendered on the page.

Instead, we would like to be able to identify front matter and not
render it to the page. Ideally we would like to make the metadata
available and/or optionally render it to the page in some way, but this
would require some reworking of the current setup.

**What:**

* Install `markdown-it-front-matter`[^1], which enables `markdown-it` to
  parse YAML-style front matter.
* Enable `markdown-it-front-matter` via `MarkdownIt.use()` like we do
  with other plugins.
  * **Note:** This doesn’t actually do anything other than enable
    `markdown-it` to recognise front matter and not treat it as regular
    content.

[^1]: https://github.com/ParkSB/markdown-it-front-matter

---

jannis-baum#177
@jannis-baum
Copy link
Owner

Hey there! Thanks for the PR☺️ I'll have a proper look tomorrow but at first sight this looks good :) Definitely better than what we have now and we can extend it to the functionality discussed in that issue once someone finds the time

@jannis-baum jannis-baum merged commit 23c3e71 into jannis-baum:main Nov 12, 2024
6 checks passed
@jannis-baum
Copy link
Owner

Hello, thanks again for posting the PR! Always very much appreciated :) I added an example of Markdown front matter to our render testing document, merged this am releasing 0.6.2 now with the changes.

@bingocaller
Copy link
Contributor Author

Fantastic!

Happy to help, even if it is in a rather selfish scratching-my-own-itch kinda way. 😅

And thank you for creating Vivify! It’s been a life-saver ever since markdown-preview.nvim stopped working for me. ❤️

@bingocaller bingocaller deleted the issue/177-yaml-formatter branch November 12, 2024 19:01
@jannis-baum
Copy link
Owner

Awesome, glad to hear you like it!😊 Feel free to spread the gospel as well and star the repo if you haven't already haha

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants