【Cocoon】ヘッダーの画像変更に苦労した話

  • URLをコピーしました!

ブログの上側に表示されている画像でブログの顔とも言えるものそれがヘッダーである.

ヘッダーを変えるだけでブログの印象は大きく変わるので,ブログで生計を立てたい人はこだわるべき要素である.

そこまで言っておきながらなんだが僕は今までフリー画像に文字を乗せただけのお粗末なヘッダーにしていた.

ブログ始めたてで形だけ作ろうと思い適当に作ったのもので,ブログに慣れ落ち着いたら変えようとずっと思っていたのだが,変えるのが面倒でそのまま数ヶ月の間放置してしまっていた.

しかし今日ついに重い腰を上げ,ヘッダーを新しいものに変更することができた.

なので今回は別の画像に差し替える過程を記事にすることにした.誰かしらの力になれば幸いである.

目次

ヘッダー画像を作る

まずヘッダー画像のサイズを決める.今回は適当に調べて出てきた1240×360で作ることにする.

これが新しく作ったヘッダーである.今回使ったペイントソフトは「アイビスペイント」で見やすさを重視して作った.

新しいヘッダー画像に変える

作ったヘッダーを新しく設定したいと思う.

これから新しくヘッダーを変える人に注意してほしい部分がある.それはヘッダーの画像を適用させる部分についてだ.

Cocoonの設定からヘッダーを選択するとこのような画面になる.新しくヘッダーの画像を入れるには,画像下のヘッダー背景画像ではなく画面上部のヘッダーロゴの方に画像を選択し入れる必要がある.

筆者はこれに気づかず30分を無駄にしてしまった.ぜひ注意して欲しい.

感想

これで新しいヘッダーにできて新鮮な気持ちになれた.

だが一つだけ不満点がある.

それはヘッダーの画像の縦のサイズが少し大きすぎたことだ.画面の半分がヘッダーとメニューになってしまっていて肝心の記事が見にくくなっている.次回作るときはサイズ確認用の画像を仮入れすることにする.

次回はアイコン作成をしようと思う.またどこかで.

よかったらシェアしてね!
  • URLをコピーしました!
目次