Tatehito's Programming Blog

現役プログラマがITっぽいネタを書いてアウトプット欲を満たすブログ

Qiitaのブログパーツをブログに設置しました!ついでにはてなブログのデザインテーマも変更しました

当ブログのサイドバーに、投稿したQiitaの記事を表示するブログパーツを設置してみました!(スマホなどモバイル表示の場合は記事下に表示されます)

↓これです。

f:id:tatehito-st:20190522205939p:plain:w300

利用させて頂いたのは@shunさんのQiita Widgetというブログパーツです。利用方法は簡単で、ブログパーツを表示したい箇所にコードを埋め込むだけ。

はてなブログのサイドバーに表示させたい場合は、「ダッシュボード ▶︎ デザイン ▶︎ カスタマイズ ▶︎ サイドバー ▶︎ モジュール追加 ▶︎ HTML」と進み、

f:id:tatehito-st:20190522210131p:plain:w400

このようにコードをコピペすればOKです。

詳しい利用方法はQiitaのこちらの記事で解説されています。こちらのページではデモを見ることができます。

Qiitaのブログパーツを設置した理由

今回、ブログパーツの設置に至った理由は2つあります。

  • Qiita(技術記事)更新のモチベーションを高めるため
  • Qiita記事への導線をつくるため

設置したブログパーツを見てもらえればわかる通り、まだQiitaへ1記事しか投稿できていません。。。

もっと投稿数が増えてからブログパーツを設置するつもりでいましたが(投稿数少ないと恥ずかしい)、むしろ今の段階で設置してしまうことで技術記事を書くモチベーションを高められるのではないか、と思い設置してみることにしました。

また、このブログ経由で少しでもQiita記事を読んでもらえる人が増えればいいなとも考えています。

ちなみに、Qiitaにはコードを含む技術記事を書く、ブログには技術記事以外ならなんでも書く、というように使い分けていく予定です。

(ついでに)はてなブログのデザインテーマも変更

これまではEpicというはてな公式のテーマを使っていました。Epicはシンプルなデザインが魅力的なテーマで、はてなテーマストアのランキングで1位となっているテーマです。

僕も非常に気に入っていたのですが、Epicはレスポンシブデザインに対応しておらず、モバイル端末では、はてなブログのデフォルトデザインで表示されてしまいます。

はてなのデフォルトデザインは、サイドバーのコンテンツを表示してくれません。つまり、今回設置したQiitaのブログパーツも、モバイル端末から見たときは表示されません。

せっかく設置したのだから、スマホで閲覧している人の目にも入ってほしいよね、ということでレスポンシブ対応のテーマに変更することにしました!

採用したのはblankというテーマで、Epicのようにシンプルなデザインであることが決め手になりました。

ただテーマを導入するだけでなく、一部のデザインをいじっています。ブログタイトルを中央寄せにしたり、記事タイトルを青字にしたりしているのは大好きなEpicに寄せるためです(笑)

あとがき

ということで、Qiitaブログパーツ設置したよ、デザイン変えたよ、というお知らせでした。設置したからには頑張って技術記事も書いていきます!今後もよろしくお願い致します!

余談ですが、そろそろ適当につけたブログタイトルも変更したいと思ってます。とはいえ良いタイトルが思いつかないんだよなぁ......。