tsuyu-noteHOME備忘録ガーデニングツールプライバシーポリシーお問い合わせtsuyu-noteめんつゆが買ったものとか勉強したことをつらつら書くよ。2019年7月31日canvaではてなブログのヘッダ画像のテンプレートを作ってみました。当ブログは現在WordPressで運用しております。まとめcanvaでヘッダ画像のテンプレートを作ってみたみなさん、今ブログに設定しているヘッダ画像は気に入っていますか?私は今のヘッダ画像は結構気に入っているのですが、過去に設定していたヘッダ画像は嫌いでした。ブログ初心者はカスタマイズの前に、とにかくブログを書くのが大事だと言われていますが、いざ書こうと自分のブログを開くと、気に入らないヘッダーが目に入るんですよ。恥ずかしいのですが、過去のヘッダ画像を紹介するとブログ名見切れ過ぎ。お洒落なヘッダにしたかったの、今思えば非常に恥ずかしい(恥)適当にアイコンを組み合わせた感満載あとブログのアクセス数がまだ少ないので、ブログの顔であるヘッダをあまり変えない方がいいのかなとも思ったり。私は飽き性なので、飽きるのは時間の問題です。そこで背景画像を簡単に差し替えることができる背景画像以外の部分(ブログ名など)は使い回しできるようなヘッダ画像のテンプレートをcanvaで作ることにしました。事前にcanvaでアカウントを登録しておきましょう。背景画像の設定canvaにアクセスし、右下のカスタムサイズをクリックします。幅:1000px、高さ:200pxに設定し、「新しいデザインを作成」をクリックします。画像をアップロードより使用したい画像をアップロードします。画像を右側の領域にドラッグアンドドロップします。↓この画像の上にブログ名などを置いていくので右上の「ロック」でロックしておきましょう。左側の「T」を選択、さらに「テキストボックスの追加」をクリックします。テキストボックスが追加されました。左側のこの部分でフォントを変更します。フォントの読み込みには非常に時間(低スペックパソコンだとカップラーメンができるくらい?)がかかりますので注意してください。canvaのフォントは可愛いものが多いので、めげずに待ってみてください。個人的におすすめは「ふい字」と「うずらフォント」で、うずらフォントはこのブログのヘッダにも使用しています。今回はふい字にしてみました。基本の部分ができたので、図形などを追加していきます。ここでヘッダ画像にオリジナリティを出しましょう。今回は大きさの違う丸を配置してみました。図形を配置する際は、ブログ名が最前面にくるよう設定しましょう。ブログ名を選択し、配置を選択します。最前面へを選択します。配置した図形を透明化してもいいと思います。透明化する場合は図形を選択して、透明度を調整してください。ヘッダに使用したいアイコンがあれば追加しましょう。ヘッダ画像が完成しました。画像を綺麗に見せたいので、丸は緑から白に変更して、透明度50%にしました。ブログ名が見切れないようにするためにPC版ではいい感じでもスマートフォン版ではブログ名が見切れる場合があるので注意しましょう。スマートフォン版のヘッダサイズは幅:350PX、高さ:200pxと言われています。下の画像の青枠部分がスマートフォン版では表示しない部分です。ヘッダ画像は幅:1000px、高さ:200pxなので、だいたい中央1/3の位置にブログ名が入るように注意しましょう。背景画像だけ変更してみようcanvaは編集した画像を自動で保存してくれます。canvaのトップページに戻り、すべてのデザインから先ほど作成したデザインを選びます。テンプレートとして使用をクリックします。今回はcanvaの無料画像を使用して、ヘッダ画像の背景のみ変えてみましょう。最初に作ったヘッダ画像はこちら。