簡単５分！ブログタイトルにワンポイントを加えて個性を出してみた

ブログのテーマをUnderShirtに変更したのでブログタイトルの横に画像を入れて個性を出してみた。
画像をはてなフォトライフにアップロードし、CSSで参照するだけなので5分で完了します。

はじめに

ブログデザインを変えてみました。
シンプルが売りのMinimalismも嫌いではなかったけど、一覧表示をした時のブログ玄関のサムネイルの見やすさを考えると、UnderShirtの方がピンとくる感じ。

そのままだと個性がないので、サクッとできる方法でアレンジをしてみることにした。

完成図でちゃってますが、こんな感じにしてみた。
まだまだブログ自体を改築中ということで工事アイコンのピクトグラム(ﾉ∀`)
我ながらなかなか良かったと思う！

早速設定について解説していきます。

はてなブログだと大抵はテーマストアからテーマを設定しているでしょう。
テーマは全てが改変OKというわけではなくクリエイティブ・コモン・ライセンス(CCライセンス)だったりその他のライセンスルールが設定されている。
ライセンスのルールによっては改変が駄目な場合もあるので注意したい。

UnderShirtはCCライセンス表示(BY)となっている。
これは作者と作品名（テーマ名）を表示すれば改変も二次利用も可ということらしい。
CCライセンスについては次のサイトを参考にした。

今回はヒューマンピクトグラム2.0さんから拝借してみた。
このサイト、本当に大好き。
ユニークなピクトグラムはクセになる。

冒頭でも書いたが数あるピクトグラムの中から工事中をチョイス。
もともとの素材から色を変更したけどテーマ外なので記載しないでおく。
改変は許可されているので、変えたい人はお好きな色に変えてね。

ダウンロードした素材をWEB上にアップロードしないとブログでは使えないので、はてな民らしくはてなフォトライフにアップロードする。
フォトライフははてなのトップページから飛べる。

アップロードした素材のURLをコピーしておくのも忘れずに。

#blog-title{
  background-image:url("コピーしたURL");
  background-repeat:no-repeat;
  background-size:contain;
  background-position:right center;
}

貼り付ければ作業は完了です。
上の各項目の意味は下表の通り。