こんにちは！ひよりんです。
今日はブログの「顔」であるヘッダー画像の選び方とアフィンガーへの設置方法の手順について解説していきます。
ヘッダー画像を設定すると・・・
どんなブログかすぐにわかってもらえる。
目を引き付ける効果がある。
早速ヘッダー画像を設置して自分の色を存分に出していきましょう！
目次
へッダー画像設置
ブログのデザインの中で一番目立つ部分がヘッダーですよね？
多くのブロガーさんがヘッダー画像を入れています。
ヘッダー画像とはここの事
「素敵な画像をヘッダー部分に入れたい」
「ブログの内容に合った画像を設定したい」
「画像はどこから持ってくるの？」
「どうやって設定するの？」
そんなあなたにどこから画像を持ってきてどうやってアフィンガーに設置していくのかについて解説します。
ヘッダー画像選び
ブログの顔であるヘッダー画像を選んでいきます。
ヘッダー画像は自分が撮った写真を使用する事もできます。
私の場合は写真素材を無料でダウンロードできるサイトから持ってきました。
フリー素材をダウンロードできるサイトはたくさんありますが、私のこのヘッダー画像は写真ACというサイトからダウンロードして使わせてもらっています。
サイトに入るとこんな画面が出てきます。
このサイトは無料ですが会員登録が必要なのでまずは会員登録を済ませてください。
赤枠で囲んだ「ダウンロード会員登録（無料）」ボタンをクリックして手順通り会員登録をしてください。
「写真ACの公式サイト」から画像引用
ポイント
「写真AC」の会員登録をすれば、同じ会社が運営している「イラストAC」の利用も可能になります。
「写真AC」は画像素材で「イラストAC」はイラスト素材なので用途に合わせて使い分けできますね！
- 無料会員（月額無料）→1日に9点までダウンロード可能。キーワード検索は5回までです。
- プレミアム会員（月額1,096円）→無制限にダウンロード可能、また、有料で販売されているプレミアム素材も無制限にダウンロード可能です。その他もろもろ特典あり。
会員登録が終わればログインしてダウンロードしたいキーワードで検索します。
「写真ACの公式サイト」から画像引用
「パソコン」で検索してみました。
こんな風に色んな画像が出てきます。
「写真ACの公式サイト」から画像引用
ダウンロードの手順
● 好きな画像を選んでクリックする。
● ダウンロードしたい画像のサイズを選択する。
● ダウンロードをクリックする。
● ダウンロードする前にアンケート等が出てくるのでそれに回答する。
● ダウンロードをクリックする。
画像サイズについて
- Sサイズ「640×427px」主に各記事のアイキャッチ画像などに使用するサイズです。
- Mサイズ「1920×1281px」主にブログのヘッダー画像などに使用するサイズです。
- Lサイズ「4000×2668px」私は今まで使った事がありません。
画像をダウンロードして自分のPCに保存します。
これで画像選びは終わりです。
おまけ
フリー素材をダウンロードして使用できるサイトは他にもたくさんあります。
私は「pixabay」もよく使わせてもらってます。
こちらは会員登録が不要でその場ですぐにダウンロードして使えるのでとても便利です。
また、画像もとてもオシャレなものが多いと思います。
参考にしてみてください。
では次は今ダウンロードした画像の加工をしていきます！
画像の加工
画像を加工していきます。
画像をダウンロードしたらいつも私は加工してからブログに設定しています。
特にヘッダー画像は少しこだわって作りたいですよね？
「画像に文字を入れる方法はどうやるの？」
「画像に装飾をしたい」
等々・・・。
画像のサイズを変更したり画像に文字を入れたりするためには画像加工ソフトが必要です。
無料でダウンロードできるものが多いのでまだダウンロードしていない方は先にダウンロードしてから次のステップに進んでください。
私は「PhotoScapeX」という画像加工のソフトを使っています。
画像加工ソフトが準備できたら画像を加工していきます。
私は画像サイズを「1500×450px」に調整しました。
また、画像に文字を入れてこのように仕上げました。
画像の準備が整ったらいざアフィンガーのヘッダー画像に設定しましょう！
ヘッダー画像の設定
ではヘッダー画像の設定に進みます。
アフィンガーのカスタマイズ設定画面から行います。
まず、ワードプレスのダッシュボードにログインします。
サイドバーの【外観】→【カスタマイズ】→【ヘッダー画像】に入ります。
ヘッダー画像をアップロードします。
●「新規画像を追加」をクリックします。
画像を選択します。
①「ファイルをアップロード」をクリックします。
②「ファイルを選択」をクリックします。
●設定が完了したら「公開」をクリックします。
これでヘッダー画像の設定は完了です！
モバイルヘッダー画像の設定方法はPCの設定の時と同じです。
① 横幅を100％にするにチェックを入れる
②「画像を選択」をクリックする
PCヘッダー画像で使った画像をそのまま設定すればいいのでとっても簡単！
すでにアップロード済みの画像は「メディアライブラリ」に保存されてるから選ぶだけ！
①メディアライブラリをクリックする
② 画像にチェックする
③「代替えテキスト」と「タイトル」に画像の詳細を記入する
④「画像を選択」をクリックする
設定が完了したら「公開」をクリックする
これでモバイルの方でもヘッダー画像が追加されました。
ヘッダー画像の設定はこれで完了です。
お疲れさまでした。
まとめ
設定お疲れさまでした。
だんだん自分の理想のブログに近づいてきましたか？
私は時間がかかりましたがブログがだんだん自分色になっていくのがすごく嬉しくてワクワクが止まりませんでした。
ヘッダー画像の設定をするだけで自分のブログになってきたー！と感動してしまいます。
初心者の私はつまづいたり、設定すらしていなかったり、色々と順番通りには行きませんでしたが毎日新しい発見で楽しくて仕方がありません。
これからも新しい発見や、つまづいた事、難しかった事などを記事にしていきます。
よかったらまた見にきてください。
最後まで読んでくださりありがとうございます。