1
1

【10分でできる】Githubのプロフィールにオリジナル画像を設定する方法

Last updated at Posted at 2023-12-12

はじめに

休憩がてらQiitaで面白そうな記事を探していたところ、このような記事を見つけました。

どうやらGithubのトップページはある程度自分仕様にカスタマイズできるとのこと。

たしかに初期状態では少し物寂しい気もしたので、早速実践してみました!

Before-After

  • ほぼ初期状態(Before)

f4392796f1731451a79ebb37acd5f1b9.png

  • 少し手を加えてみると(After)
    01a5a2d1b11f30c140c2a64674040e19.png

実装方法

上に示したAfterバージョンの「Stats」部分の実装方法に関しては、

先にご紹介した@iijima-naoya-45bさんの記事をご覧ください!

今回は「TECH OTAKUS SAVE THE WORLD」と書かれた部分の、カバー画像の作り方と実装方法を簡単に説明します。

カバー画像の作り方

まずはCanvaにログインします(無料版で大丈夫です)。

そして左のメニューバーから「テンプレート」をクリックします。

9a790963198d929ee39fc1efe8cab97c.png

次に表示される「おすすめ」の中から、「LinkedIn背景写真」を選びます。

横長のフォルムなので、Githubのカバー画像には使いやすいかと思います。

ed453444fac41fb98ce19ad0bf0f5890.png

すると以下のようにテンプレートがたくさん表示されるので、好きなものを選んで編集し、PNG形式で保存します。

5fd61519b2caf814f9f4597435a343af.png

編集画面右上の「共有」から編集した画像を保存できます。

Githubで反映させる方法

画像の保存が終わったら、自分のGithubのアカウント名と同じ名前のパブリックリポジトリを作成します。

そして、そのリポジトリ内で「issues」をクリック。

dc077c41134e56574fd05d78bbf91b4f.png

次に「New Issue」をクリックし、「Add a discription」内に先ほどの画像をドラッグ&ドロップします。

赤丸で囲っている「Paste, drop, or click to add files」から可能です。

9396080da47be94ae795d9713c28c9ae.png

そして、上画像のように表示されたコードをリポジトリ内に作成した「README」内に書き込み、

「Commit changes」で保存すれば、プロフィールの部分に作成した画像が反映されます。

6c00131b64c2acd1253016611e13fc54.png

まとめ

結構簡単にイジれちゃうので、空き時間とかにサクッと試してみるのがおススメです!

他にもいろいろな方法があると思うので、ぜひ自分に合ったプロフィールを作成してみて下さい!

参考

偉大なる先人達に心からの感謝を。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1