ぜひシェアをお願いします!

Gistを使ってスタイリッシュにソースコードを表示する

code

WordPress では、様々なプラグインを利用することによって、ソースコードを綺麗にわかりやすく表示することができます。

しかし、他のブログサービスではそれができないのが残念。という人向けに Gist を使ってソースコードを表示する方法を紹介したいと思います。

スポンサーリンク

Gistとは

Gist とはプログラムのバージョン管理をオンライン上で可能にする Web サービス GitHub の機能です。(私なりの解釈です。)

一度保存した内容を後から変更でき、編集履歴も保存できます。

その他詳しい説明は、色々ググってみてください。

Gistの使い方

Gist を使うためには GitHub にアカウントを登録する必要があります。

Gist

登録後の使い方は至って簡単です。

ソースコードを書いて名前をつけたら保存します。説明文は任意です。

保存するときは Secret ではなく Public にしましょう。

ブログへの貼り方

ブログに貼るには、ソースコード一覧から各ソースコードのページへ行き、Embed という表示の横の <script src=”…”></script> を本文に貼りつけるだけです。

貼りつけると、次のように表示できます。

最後に

CSS をごちゃごちゃ書かなくてもソースコードを見やすく載せることができるので、便利ですね。

スポンサーリンク

ぜひシェアをお願いします!

mktia は、Amazon.co.jp を宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazon アソシエイト・プログラムの参加者です。