lifehack blog

役に立つガジェットや知識を配信します

Canva を使ってはてなブログ用ヘッダーを作成してみた

記事目安...10分

この記事はこんな人におすすめです!

  • はてなブログを始めたばかりの方
  • デザインの知識はないがおしゃれなヘッダーを作りたい方
  • オリジナルのヘッダーを作りたい方

はじめに

僕はブログを始めたばかりなのですが、いきなりヘッダーの設定で躓いてしまいました笑

ということで備忘録がてらヘッダーを作成するまでの経緯をまとめていこうと思います。

はてなブログの人はこのブログに則ることですぐヘッダーを設定できます!


今回使うのは、Canva と呼ばれるサービスです!

https://www.canva.com/

■ Canva とは?

  • だれでも簡単にデザインを作成できるサイト
  • 雑誌のカバーやWebサイトヘッダー、提案書などあらゆるコンテンツに対応しています。
  • 無料の素材がたくさんあるので、クオリティの高いデザインを無料で作成できます。

なぜ今回このサイトを使うのか?というと、
用意されたテンプレートを使って、はてなブログのヘッダー画像に最適なサイズデザインを行うことができるからです!

ヘッダーの設定手順

STEP1. ヘッダーを作成しよう

まずは、ヘッダーを作成していきましょう。


①以下リンクで Canva のホームページにアクセスしてください

https://www.canva.com/

アクセスすると以下のページに飛びます。

f:id:walk0204:20210722161441p:plain

会員登録してる人はログインを、まだの人は登録してください。
※会員登録しなくても作ったデザインをダウンロードできますが、デザインの保存機能は使えません。


②テンプレートを使用して、デザインを開始します。

f:id:walk0204:20210722161517p:plain

右上の「デザインを作成」を押します。

f:id:walk0204:20210722161532p:plain

次に、「はてなブログ」と入力してください。その後検索候補にでた、「はてなブログ ヘッダタイトル画像」を押してください。


③以下のページでデザインを作成しましょう。

f:id:walk0204:20210722161547p:plain


④デザインが完成したらダウンロードを行います。

f:id:walk0204:20210722161552p:plain

  1. デザインが完成したら右上の「ダウンロード」ボタンを押します。
  2. ポップアップが開いたら一番下の「ダウンロード」ボタンを押して、適当なディレクトリに保存します。

STEP2. ヘッダーをはてなブログに設定しよう

続いて、はてなブログの管理ダッシュボードにアクセスしてください。

https://blog.hatena.ne.jp/


①デザイン設定ページに飛びます。

管理ダッシュボード左ペインの「デザイン」を押してください。

f:id:walk0204:20210722161830p:plain


②デザイン設定ページに遷移した後は、
「カスタマイズ」> 「ヘッダ」の順で押します。

次に 「ファイルを選択」して、先ほどのヘッダー画像を選択してください。

f:id:walk0204:20210722161856p:plain


③アップロードが完了したら「適用」ボタンを押してください! ※画像サイズがぴったしなので、トリミングする必要がないです!

f:id:walk0204:20210722161915p:plain


④最後にプレビューを見て、問題なければ「変更を保存する」ボタンを押しましょう。

「設定が更新しました」というメッセージが出れば完了です!

f:id:walk0204:20210722161929p:plain

おわりに

いかがだったでしょうか?

Canva を使えば簡単にはてなブログのヘッダーを簡単に作成・設定できることがわかっていただけたのではないかと思います!
はてなブログライフ楽しんでくださーい!