Gist に書いた複数のソースコードから特定のものだけを埋め込む方法

とっても簡単にできるんだけど、最初わからなくて悩んだのでメモ。

お急ぎの方のためのまとめ

呼び出す URL の .js の後に ?file=[ファイル名] とつけるだけです。

Gist べんり

GitHubGist 便利ですね。

gist

ソースコードや文書をぺたっと貼り付けたり打ち込んだりして
綺麗にシンタックスハイライトされたものをすぐに見せたり共有したりできる。

Public Gist なら全体や書いた人のページで一覧に出るし
Secret Gist にすれば URL を知ってる人だけが見られるようにできるし。

ソースコードだけじゃなくて、
Markdown なんかで文章を書くとこれも綺麗に整形されて出る。

そして素晴らしいのは、
提供されるタグを貼るだけで外部のサイトにそのソースコードを掲載できるところ。

gist-2

このブログでもよくお世話になってます。楽ちん。

こないだのこの記事でも使いました。

複数のファイルをまとめられるけど

ひとつの Gist ページには
関連する複数のソースコードを書くことができて、
Gist から与えられたタグを

<script src="https://gist.github.com/msng/cc93db44222421b4121c.js"></script>

そのまま貼り付けると、
それらがいっぺんに表示されます。
こんなかんじ。

もちろんこれが便利なところではあるんだけど、
ファイル毎に個別にコメントをつけながら記事を書きたいとか
関連文書もつけておきたいけど外部には本文だけ掲載したいとかいうときは
それだとちょっと困りますね。

単一のファイルだけを載せる方法

でもだいじょうぶ。
Gist ではファイル名を指定して個別のファイルを呼び出すことができます。

たとえば上記の例で style.css だけを載せたいときは
こんなふうに ?file= とつけるだけ。

<script src="https://gist.github.com/msng/cc93db44222421b4121c.js?file=style.css"></script>

これで単独のコードだけを出力してくれます。

解決。

  • このエントリーをはてなブックマークに追加