I installed several Remark and Rehype plugins, here I document which features they and my own plugins provide to my blog.

Table of contents

Frontmatter
Directives
Emoji
GitHub Flavored Markdown (GFM)
Github links
Blockquote Admonitions
LaTeX Math
Reading Time
Table of Contents (TOC)
Autolinking Headings
Code Highlighting

Frontmatter

Allows for defining frontmatter in my markdown files like this:

---
meta: This is frontmatter data
what: Later accessible as an object
---
 
> Text...

Directives

Plugin Link

Allows to create custom directives to easily create custom items and blocks with my own code. Currently, I implement:

Abbreviations

YAML has a tooltip!

:abbr[YAML]: YAML Ain't Markup Language

Emoji

Plugin Link

Allows for emoji text codes to be replaced with actual emoji (:thumbsup: => 👍 ).

GitHub Flavored Markdown (GFM)

Plugin Link

Allows me to use GitHub Flavored Markdown, enabling features like strikethrough, tables, tasklists, and more.

An example table in GFM:

Column 1	Column 2
Cell 1	Cell 2
Cell 3	Cell 4

| Column 1 | Column 2 |
| -------- | -------- |
| Cell 1   | Cell 2   |
| Cell 3   | Cell 4   |

Github links

Plugin Link

Allows to easily link to GitHub stuff, for example me (@vypxl), or an issue (vypxl/tx8#1).

@vypxl fixed this in #42

Blockquote Admonitions

Plugin Link

Allows to create custom blocks via blockquote admonitions, for example info or warning blocks.

Warning This is a warning

Note This is a note

> **Warning**
> This is a warning
 
> **Note**
> This is a note

LaTeX Math

Plugin Link

Allows math formula rendering.

Inline math:

Block math:

Inline math: $e=mc^2$
 
Block math:
 
$$
f(x) = \frac{1}{\sqrt{2\pi}}e^{-\frac{1}{2}x^2}
$$

Reading Time

I wrote this plugin myself.

This plugin estimates the time it takes to read an article. Uses dead simple word counting. Reading time is .

Table of Contents (TOC)

Plugin Link

Automatically generates a TOC, when a level 2 heading ## Table of contents is present as the first subheading.

Autolinking Headings

Plugin Link

This plugin automatically adds links to headings. See the little link icons that appear when you hover over a heading? Try clicking on one!

Code Highlighting

Plugin Link

Uses shiki for highlighting code blocks. Also supports features like linenumbers, titles, captions and highlighting specific lines or words.

I added some more functionality, like showing the language of the code block, and a 'copy code' button.

Title for rust code example

fn helloWorld() {
  println!("Hello, world!")
 
  println!("Code {} are cool!", "blocks");
}

This is a demonstration of a caption.

```rust showLineNumbers {2} /{}/ title="Title for rust code example" caption="This is a demonstration of a caption."
fn helloWorld() {
  println!("Hello, world!")
 
  println!("Code {} are cool!", "blocks");
}
```

Posts tagged webdev

About my Website

What my Markdown can do

Posts tagged `webdev`