Support Markdown markup in wikilink alias (like standard markdown links)

These two ways refer to a page with an alias for the link:

[[Obsidian|`obsidian`]]
[`obsidian`](Obsidian.md)

I would expect both links to render as obsidian (i.e. monospace code), but the wikilink renders as `obsidian`. (The Markdown link as obsidian.)

Would it be possible to add support for markup in wikilink aliases as well?

9 Likes

+1. You can put the markup outside the wiki link as in _[[page|title]]_, but that only works for bold and italic etc, but obviously not for monospace since monospace disables interpretation of what’s inside. Making backticks work for aliases would be fantastic (and hopefully not too hard to implement?)

+1+1 !

2 Likes

+1 I would also add the the solution @rab suggested affects the entire link and you can’t target a specific section with italics or bold: [[The TeXbook|Knuth's _The TeXbook_]]

2 Likes

+1. I would love to be able to have e.g. italics within display text.

1 Like

+1, would love to see this implemented.

I’ve got a half-baked solution to styling an internal link as inline code. In Settings, go to Appearance > CSS snippets > Open snippets folder and add a file named code-link.css (or whatever you want) then paste the following contents:

.cm-formatting-code.cm-hmd-internal-link:has(
    + .cm-hmd-internal-link + .cm-formatting-code.cm-hmd-internal-link
  ) {
  border-start-start-radius: var(--code-radius);
  border-start-end-radius: 0;
  border-end-start-radius: var(--code-radius);
  border-end-end-radius: 0;
}

.cm-formatting-code.cm-hmd-internal-link
  + .cm-hmd-internal-link:has(+ .cm-formatting-code.cm-hmd-internal-link) {
  font-family: var(--font-monospace);
  font-size: var(--code-size);
  background-color: var(--code-background);
  padding: 0.1em 0;
  border-radius: 0;
  vertical-align: baseline;
  -webkit-box-decoration-break: clone;
}

.cm-formatting-code.cm-hmd-internal-link
  + .cm-hmd-internal-link
  + .cm-formatting-code.cm-hmd-internal-link {
  border-start-start-radius: 0;
  border-start-end-radius: var(--code-radius);
  border-end-start-radius: 0;
  border-end-end-radius: var(--code-radius);
}

Make sure to hit Reload snippets and toggle it on.

It doesn’t work for certain links, it doesn’t hide the backticks, it doesn’t add spellcheck="false" to disable spellcheck, and it doesn’t work in Reading view. Here’s what it looks like:

Versus before:

(Edit: nesting :has() doesn’t work)

Need this!