資産サイト構築方法

Simplicityにヘッダー画像を設定する手順

ヘッダー画像
yusuke
yusuke
どうも!yusukeです!

今回はSimplicityのテンプレートを用いたサイトで、ヘッダー画像を設定する手順について解説をしていきます。

 

トレンドブログの場合、デザインよりもコンテンツに力を注ぐべきです!

しかし、デザインに関して唯一しっかりとやっておいた方が良いのが、ヘッダー画像です。

 

ヘッダー画像を設定しておいた方が良いと考えるのには主に2つ理由があります。

ヘッダー画像設定をした方が良い理由
  1. サイトの顔であり単純に目立つ!
  2. サイト運営の本気度が違って見えるので、アドセンスの審査に通りやすくなる

トップページでも、記事ページでも常に表示されているのがヘッダー部分になってくるので、それだけにはやり目立ちますよね!

人の見た目は9割という本がありましたが、サイトに置き換えると、サイトのヘッダーの見た目は9割と思ってください(笑)

 

では早速ヘッダー画像の設定手順を動画で確認していきましょう♫

設定手順の解説動画

ヘッダー画像の高さを変更したい場合

解説動画の中では触れていなかったのですが、

ヘッダー画像の高さの幅をもう少し広げたいという場合の対応方法について、少し補足をしておきます。

 

 

~設定ステップ~

ステップ1

上記のように左のメニューの中に「ヘッダーの高さpx」という項目があります。

デフォルトは100という値が指定されていますので、それを200に書き換えてあげます。

ステップ2

そのあとに一度、公開ボタンを押すようにしてください。(←これが結構重要です。)

ステップ3

解説動画と同じように画像を任意のサイズに切り抜いて設定をします。

ステップ4

再度、公開ボタンを押します。

以上でヘッダー画像の高さをお好きなサイズに変更することが可能です!

モバイル(スマホ)用のヘッダーは別で設定が必要

これを見て、マジか・・と思われたと思います。笑

実はワードプレスのほとんどのテンプレートが、PC用とモバイル用でぞれぞれヘッダー画像を設定をしてやる必要があるんです。

 

以下は設定手順になります。

 

画像を設定する

①ヘッダーの高さを指定します(下の画像では20としました)

 

②画像をアップロードします

 

設定手順はPCの時と若干異なり、あらかじめ表示させたい部分だけに加工をした画像をアップロードしてやる必要があります。

 

PCの画像をそのままアップロードすると、下記のように画像の上部分が自動的に切り取られる仕様になっていますので、注意してください

 

 

文字の色を変更

画像がアップロードできましたら、ヘッダー部分の文字色を変更してあげます。

モバイル用にも専用の変更メニューが用意されていますので、設定してやります。(下図参考)

最後に

以上がヘッダー画像設定の解説となります。

オリジナリティのあるヘッダー画像を設定することで、読者の興味を引き、あなたのブログファンを獲得していきましょう!

ABOUT ME
yusuke
当サイトの管理人yusukeです。 現在はPC1台でのんびりネットビジネスを行ないつつ、自宅で娘の成長を眺めながら生活しています。 新卒でブラック企業に入社してしまうも、起死回生の転職活動で、外資系経営コンサルティングの会社に転職を果たす。 年収1,000万円を超えた頃から、サラリーマンをこのまま続けてても、良い暮らしとか一生ムリということに気づき、ネットビジネスを開始する。 ウェブ系のビジネスに関しては完全に素人な所からスタートし、開始4ヶ月で月収45万円を達成。 副業で稼げるようになったことで、本業がやらなくてはいけない事から、趣味として楽しむ事に変わる。 現在は、かつての自分と同じように、サラリーマン以外に選択肢が無い方に向けて、ゼロから始められるネットビジネスのノウハウを提供。 時間、場所、人、あらゆる制約条件の無いビジネスをPC1台で実践できるノウハウを本サイトで紹介しています。