ブログにコードを載せるにはこれ!

皆さんこんにちは!

内山です!

 

プログラミングを学習していくと、
次から次に覚えることが出てくるので
学習が大変ですよね!

そこで人に説明すれば、
ただ学習をするより理解を深められるので

ブログで自分なりにまとめてみよう!
と思ったことある人もいるのではないでしょうか。

 

ただブログにコードを貼り付けても良いのですが、

どうせなら見る人がストレスを感じずに利用できる方が良いですよね。

 

そこで今回は、
ブログにコードを綺麗に載せる方法をお伝えして行きたいと思います!

PR

コード表示方法

 

まずブログにコードを表示するには、いくつかの方法があります!

今回は非常に簡単なものだけご紹介します。

  1. 外部サービスを利用する(GitHubなど)
  2. プラグインを導入する(SyntaxHighlighter Evolvedなど)

 

どちらも楽に導入できるので、お好みで選んでください。

ただプラグインは導入しているテーマとの相性が悪かったりすると、
上手く表示ができないことがあるので、

私はGitHubのGistを使用してソースコードを載せています。

 

Gitsの使い方

まずはGitHubに登録します。
登録したら自分のアイコンをタップします。

Yourgistsを選択してください。

 

Gistの画面に飛ぶので、赤枠の部分を選択してください。

すると下記の様な画面になり、大きい赤枠のところにコードを記述します。
書き終えたら、Createを押してあげましょう。

すると画面が遷移するので赤枠のところからスクリプトタグをコピーし、ブログに貼り付けて完了です

 

実際にGistを使ってる記事はこちらです。

関連記事

C#の基礎学習したものをまとめていきます。 とりあえず勉強がてらPaizaの問題を解いて毎日C#の学習を行っています!ですが学習開始したばかりの頃は、最初はDランクすらつまづいてしまうレベル[…]

 

 

ただ学習用にまとめるなら・・

自分のサイトにまとめるのも良いですが、
1から始めるとなると、何かと用意しないといけないことが多く手間がかかってしまいます。

 

なので、現状自分のサイトを持っていない場合はQiitaなどにまとめてしまうのもオススメです。

私は一応使い分けて使っています。

Qiita

Qiitaは、プログラマのための技術情報共有サービスです。 プログラミングに関するTips、ノウハウ、メモを簡単に記録 …

まとめ

以上がブログにコードを載せる方法でした。

 

実際にブログにコードをまとめたり、説明を考えたりしてから
知識の定着率が上がったので、学習方法としてとてもオススメです!

自分のブログを持っている方は、Gistやプラグインを
現在持っていない方はQiitaなどでまとめて見てください!

 

 

最後まで読んでいただきありがとうございました!

>ゲーム開発初心者向けにLINE@を始めました

ゲーム開発初心者向けにLINE@を始めました

ゲーム開発初心者を無料でサポート!分からないことがあれば質問してみてください!Udemyのクーポンも配布しているので、有効利用してください!