Shibablog(しばぶろ)

月収が10万しかないけど好きなことで生きていく

【はてな】ブログのタイトル画像を変えました!!

f:id:sibalove:20180518170955p:plain
こんにちは!しばらぶです。

 

今日は以前からやりたいと思っていながら、なかなかできなかった「ブログのタイトル画像」をようやく作ったので、その報告です。

 

 

作るに至った経緯

今まではずっとデフォルトのタイトルを使っておりました。

それでもよかったのですが、いろんなサイトやYouTubeを見ていて、「このヘッダーのデザインいいな~」と思うことがよくありました。

 

ヘッダーとかブログのタイトルって、やっぱり一番初めに目に入る部分だと思うので、そこで個性を出したいな、と思ったわけです。

 

(ブログのタイトルが「月収が12万しかないので、お金稼いでみた」というセンスのかけらもないタイトルなので、せめて見た目くらいは良くしたかったというのはここだけの話です。)

 

作り方

いろいろ調べてようやくのことで設定できたので、備忘録として残しておきます。

これからタイトルの画像を変えようと思っている方は、よかったら参考にしてみてください。

 

手順は

  1. 画像を用意する
  2. ヘッダーのタイトル下にコードをコピペ
  3. コードの一部を修正

の3ステップで出来ます。

 

順番に説明していきます。

 

画像を用意する

まずはペイントを使って画像を作りました。

大きさは縦が200px、横が1000pxの横長~い形です。

 

デザインの案はいろいろと考えましたが、できるだけシンプルにすることにしました。

シンプルでもフォントに特徴があればオリジナリティが出るかな、と思ったので、こちらのサイトからフリーのフォントを探しました。

fontfree.me

 

そして出来上がった画像がこちら。

f:id:sibalove:20180518143838p:plain

 

どうでしょうか?

最後まで柴犬の絵を入れるか迷いましたが、なんだか「お金稼いでみた」という文字の横に柴犬を描くのがいたたまれない気がしたのでやめました(笑)

 

ちなみに私が使わせていただいたフォントはこちらのサイト様の廻想体というものです。

moji-waku.com

 

ダウンロードして、ファイルをインストールすると、Wordなどで使うことができるようになります。

 

直感で「これだ!!」と思って選んだのですが、漢字も使えるし、とても簡単で助かりました。

 

文字の大きさは、パソコンから見たときと、スマホから見たときで変わるので、スマホからでも文字がつぶれてしまわないように何回か修正しました。

 

ヘッダーのタイトル下にコードをコピペ

画像の設定についてはコチラのサイト様を参考にさせていただきました。(余白部分が気になっていたので助かりました。ありがとうございます!)

tukinasikotonoha.hatenablog.com

 

こちらのサイト様のソースコードを「デザイン」→「カスタマイズ」→「ヘッダ」→「タイトル下」に貼ります。

 

コードの一部を修正

あとは先ほどのサイト様の手順に従って、ソースコードの一部を設定します。

 

気になったこと

今回はタイトルを画像にしましたが、本当はテキストのまま何とかフォントをいじれないかなと思っていました。

というのも、画像だとタイトルの文字をコピーできないんですよね。

 

よっぽどタイトルをコピーする機会はないのかもしれませんが、私のブログはタイトルが長くて本人ですら正確に覚えられないレベルなので、どこかにコピーしておこうとか思う人がこの先少しくらいはいるんじゃないか、とか思うわけですよ。

 

なので、文字として認識できるようにしたいなと思ったのです。

結構時間をかけて調べてみたんですが、特殊なフォントってできないんですかね?

わからなかったので断念しました。

自力で頑張って、仮にできたとしても、文字化けしそうで怖かったですしね……。

 

画像にすることでアクセス数が激減したりしたら、さすがにもとに戻そうと思いますが、そんなことはよっぽどないと思うので、とりあえずタイトルはこれで完成としておきます。

 

最後に:ブログへの愛着がわきました

今回は、タイトル画像のカスタマイズをしてみました。

自分としては納得の出来なので、今後しばらくはこのタイトル画像で行こうかなと思っております。

 

ぶっちゃけ、画像は自分で作らなくても、ココナラなどを使って誰かに描いてもらった方がきれいなものにはなると思います。

私もはじめは誰かに描いてもらおうかな~と思っていました。

 

ですが、結果的に自分で作ってみてよかったなと思っております。

やっぱり自分で作るとそれだけブログに対する愛着とか、思い入れ?みたいなものがわくんですよね。

 

興味のある方はぜひオリジナルのタイトル画像を考えてみてはいかがでしょうか?

 

それでは今回もお付き合いいただき、ありがとうございました!

しばらぶでしたっ