読者です 読者をやめる 読者になる 読者になる

CGメソッド

CG制作に関してのヒント

MENU

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

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

Gistの投稿方法

  1. GitHubのアカウントを作成(詳細は割愛)

https://github.com/

  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を外部参照(バックアップ)にも活用できそうなので、機会がありましたらこちらも記事にしたいと思います。