動機
外部公開を見据えたノートなどの場合、文字だけの情報では味気ない。
レイアウトにメリハリが無いので流し見をしてしまう。
調査
HTMLタグを記述する方法
htmlタグを使えば今からでも実現可能
data-href
属性に内部リンクを渡せば内部リンクをHTMLで記述できる
ObsidianでWikiリンク記法を使わずにInternal Linkを作成
<a data-href="Obsidian" class="internal-link">ObsidianへのInternal Link</a>
以下のようにリッチな表現も可能
<a class="link-card internal-link" data-href="Obsidian">
<div class="link-card-content">
<div class="link-card-title">
📘Title
</div>
<div class="link-card-description">
Content
</div>
</div>
<img
src="https://publish-01.obsidian.md/access/35d05cd1bf5cc500e11cc8ba57daaf88/%F0%9F%93%98Articles/attachments/2021-11-02.jpg"
class="link-card-image"
/>
<a class="internal-link" data-href="kasahala"/>
</div>
※画像は内部リンク記法では記述できなそう?
※aタグはabsolute
にして全体に広げる
利点
HTMLになっているのでどのツールで表示しても基本レンダリング可能※絶対パスの場合
欠点
メンテナンスがしにくい
大げさすぎる
リンク切れが発生する
リンクとしては解釈されないのでバックリンクなどに表示されない
HTMLタグの記述を自動化する
Markdown構文やパーサをカスタマイズできないか
以下のようなmarkdown-likeな文法で実現させたい
-
外部リンク:
http://~~
単体
-
内部リンク:
!?[[LINK]]
単体
調査結果
obsidian custom syntax
やobsidian own flavour
で調べたが有用な情報は得られなかった。
Markdown -> HTMLに変換した後に処理を追加できる。
別の場面では有用そうだが、今回の要望には合致しない
Codeblock
obsidian-auto-card-link や自分でプラグインを書けばcodeblock内の構文を独自のレンダリングできる機能がObsidianにはある。
以下のような感じで書くのはありだとは思う。
https://~~~
[[Link]]
メリット
実現が確実に可能
文法が簡単
メンテナンスがし易い
デメリット
codeblock内の内部リンクはObsidianの自動更新の対象ではないのでリンク切れが発生する
外部リンク切れは自分では対処できないので問題ない
コンポーネント機能はないか
以下の様に純粋なリンク構文の周りを囲めば展開できるようにできないか
<Link>
[[Link]]
</Link>
できない
結論
どうしても欲しい場合はHTMLタグで実現させる。