2.3 KiB
2.3 KiB
| title | date | description | categories | tags | ||
|---|---|---|---|---|---|---|
| ショートコード | 2026-01-26 | Stack テーマでサポートされているさまざまなショートコードを紹介します。 |
|
|
Stack テーマには、コンテンツを強化するためのカスタムショートコードがいくつか用意されています。
引用 (Quote)
quote ショートコードを使用すると、著者、出典、URL を含む引用を表示できます。
{{< quote author="有名な人" source="彼らが書いた本" url="https://ja.wikipedia.org/wiki/Book">}} Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. {{< /quote >}}
使い方
{{</* quote author="著者名" source="出典タイトル" url="https://example.com" */>}}
ここに引用内容を入力します。
{{</* /quote */>}}
ビデオ (Video)
video ショートコードを使用すると、セルフホストまたはリモートのビデオファイルを埋め込むことができます。
{{< video src="https://www.w3schools.com/html/mov_bbb.mp4" >}}
使い方
{{</* video src="https://example.com/video.mp4" */>}}
Bilibili
Bilibili からビデオを埋め込みます。av および bv ID の両方をサポートしています。
{{< bilibili "BV1634y1t7xR" >}}
使い方
{{</* bilibili "BV1634y1t7xR" */>}}
YouTube
Hugo 内蔵の YouTube ショートコードです。
{{< youtube ZJthWmvUzzc >}}
使い方
{{</* youtube ZJthWmvUzzc */>}}
騰訊視頻 (Tencent Video)
Tencent Video からビデオを埋め込みます。
{{< tencent "u00306ng962" >}}
使い方
{{</* tencent "u00306ng962" */>}}
GitLab Snippet
GitLab からスニペットを埋め込みます。
{{< gitlab 2349278 >}}
使い方
{{</* gitlab 2349278 */>}}
図表 (Diagrams)
Stack は Mermaid 図表を標準でサポートしています。
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
使い方
Mermaid コードを、言語を mermaid に設定したコードブロックで囲みます。
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```