【Blog】ブログのソースコードの見た目UP!GitHubのGistのコードを貼り付ける方法

blog-github-gist-source-code-past

Gistは短いコードをバージョン管理に便利ということを知りまして、さらに「はてなブログ」の「Gist貼り付け機能」がありましたので試してみました。

スポンサーリンク

Gistの投稿方法

  1. GitHubのアカウントを作成(詳細は割愛)
Build software better, together
GitHub is where people build software. More than 28 million people use GitHub to discover, fork, and contribute to over 85 million projects.
  1. 上部メニューにGistの文字をクリック

f:id:min0124:20170320104315p:plain

  1. コードを記述

f:id:min0124:20170320110101p:plain

  1. 上部に専用のHTML形式のコードが生成

f:id:min0124:20170320104423p:plain

こちらをブログに貼ります。

スポンサーリンク

はてなブログ Gist貼り付け機能

  1. Gist貼り付け機能をONに

f:id:min0124:20170320104626p:plain

  1. アカウント名登録

f:id:min0124:20170320104632p:plain

  1. アカウント名登録

投稿した記事を選択して、貼り付け

f:id:min0124:20170320104708p:plain

スポンサーリンク

通常のはてなブログのコード

シンタックス・ハイライトをMarkdownの場合はバッククオート(`)を3つを上下に挟むだけですが、いまいち味気ないです。

!W::
;[alt + W]を押す
clipboard =
SendInput, ^c
ClipWait
result := clipboard
clipboard := clipboardbackup
run %result%, , UseErrorLevel
clipboard =
return
スポンサーリンク

GitHubのGistのコード

見た目も良くなって、さらに行数もついてきます。

Autohotkey 選択しているパスからエクスプローラーを開く

スポンサーリンク

感想

使ってみての感想ですが、GitHubを使うとブログのソースコードの見た目UPだけでなく、はてなブログのHTMLやCSSを外部参照(バックアップ)にも活用できそうなので、機会がありましたらこちらも記事にしたいと思います。

Blog
スポンサーリンク
すいみんをフォローする



CGメソッド

コメント