初級者の人や、プロジェクトにあとから入ってきた人がわかりやすいようにGitHubのREADME.mdを詳細に書いていくことは大切です。しかし、文字ばかりになるのも味気ないですし、やはり絵や図があったほうがわかりやすいはずです。ふと、画像を貼るにはどうしたらいいのだろうと思ったので調べて実践してみました。
README.mdに画像を貼る手段はいくつかあるようで、外部サービスを利用するものもあります。外部サービスに保存し、そこを参照しに行く方法です。
GitHubでREADME.mdに画像を使用したい - Qiita
個人的にはGitHubの同じリポジトリの中だけで閉じておきたいなと思ったので、空のブランチを用意しその中に画像だけ保存しておく方法を選択しました。今回はそのメモです。
空のブランチを作る方法
空のimagesのブランチを作成します。orphanオプションをつけることによって、元のブランチの情報を引き継がないブランチを作成できます。
git checkout --orphan images
空のブランチに画像を入れる方法
フォルダの中を削除し、表示したい画像をコミットし、最後はプッシュします。
今回使う画像はこちらです。
git rm -rf . git add dog_akitainu.png git commit -m "犬の画像を追加しました" git push origin images
これで独立したimagesブランチとdog_akitainu.pngがGitHub上にあがりました。masterには一番最初に作ったREADME.mdがあります。
README.mdに画像を表示する
masterブランチに移動し、README.mdを編集します。
git checkout master vim README.md
vimでREADME.mdに書く内容です。
masterブランチにコミットしてプッシュします。
git add README.md git commit -m "画像を表示" git push origin master
完成
GitHub - yoshitaku-jp/test_doc: Githubで画像を保存してREADME.mdに表示するブログ記事のリポジトリ
