賢威7のヘッダーカスタマイズ方法!最適な画像サイズの横幅は?

賢威7のヘッダーの変更方法が分からない・・。

ヘッダーに最適な画像のサイズが分からない・・。

今回はこんな悩みを持っているあなたのために、賢威7のヘッダーカスタマイズ方法を詳しく解説していきます。

ヘッダー画像の幅や高さだけではなく、ヘッダー画像を作る方法も紹介するので、この記事を参考にヘッダーをかっこよくカスタマイズしてください。

 

賢威7に最適なヘッダーのサイズは?

賢威7のヘッダーをカスタマイズする際に使う画像は横幅1200pxが目安。

記事スペースとサイドバーを足した横幅が1200pxなので、このサイズだと画像サイズ的にピッタリです。

(メニュー下のメイン画像は、スマホ表示にした場合の縮小率を考えて少し大きいサイズを使ってあります。)

ただ、問題なのは高さをどのくらいに設定するか?

賢威7はレスポンシブデザインなのでスマホで見た場合にはヘッダー画像が縮小されてしまい、高さが低いと文字が読めなくなってしまいます

なので、低くても300px~350px。

高くても400px~450pxくらいがベストです。

参考までに1200px×300pxの画像をヘッダーに設定するとこんな感じ。

これがスマホ表示だとここまで縮小されます。

文字を大きめにしているので普通にタイトルは読めますが、これ以上細かな文字にしてしまうとスマホ表示では判読不可能。

そこでおすすめなのがヘッダー画像をロゴサイズにしてしまうことです。

下記のように570px×120pxくらいのロゴ画像を作っておけば、パソコン表示でもスマホ表示でも問題はありません。

スマホ表示でもこの大きさ。

初めてヘッダー画像を作る時は細々と作り込んでしまいがちですが、僕はシンプルなものをおすすめします。

ヘッダー画像を作る方法

ヘッダー画像は元となる画像と文字入れツールがあれば簡単に作成することができます。

作業の流れは次の3ステップ。

  • ベースとなる画像を用意する
  • 画像をヘッダーサイズに合わせて切り取る
  • 切り取った画像に文字を入れる

これらは全て無料のサイトやツールを使ってできます。

まずは無料素材サイトからベースとなる画像を入手。

画像が決まったらPhotoScapeという無料ソフトでヘッダーの大きさに合わせて画像を切り抜きます(使い方はググってみてね)。

切り抜きが終わったら、そのまま文字を入れることが可能です。

シンプルなロゴを作りたいならロゴメーカーというサイトも便利。

ソフトをインストールせずに無料で簡単にロゴ作成ができます。

無料ではなく、もう少し本格的にヘッダー画像やロゴを作りたいのであればPhotshop Elements(フォトショップエレメンツ)というソフトがおすすめ。

これがあれば写真を使ったバナーやアイキャッチ画像が思いのままに作れるので、画像作成に困ることはありません。

このサイトのロゴもPhotshop Elementsで作っているのですが、PhotshopCCのように月額課金ではないので安く使えて本当に便利です。

賢威7のヘッダー画像(ロゴ)の設定方法

ヘッダーに使う画像を用意したら賢威7の設定に移りましょう。

まずはWordPressのダッシュボードに進み、【賢威の設定】をクリックします。

中段より少し下のロゴ画像という項目で、【画像を設定する】を選びます。

用意した画像をドラッグ&ドロップして移動。

フルサイズを選択して【投稿に挿入】をクリックしましょう。

これでロゴ画像がヘッダーに挿入されます。

画面の一番下まで進んで【変更を保存】をクリックしましょう。

サイトを表示して確認すると設定が反映されています。

これで賢威7のヘッダー画像の設定は終了です。

画像さえ用意できれば後は簡単ですね。

無料プレゼント

目標達成すごろくの作り方

目標達成の羅針盤

目標達成までの道のりを可視化して最短距離でゴールに辿り着くためのマニュアルです。

「目標達成すごろく」の作り方をメルマガ会員限定で無料でプレゼントしています。

あなたの夢の実現にお役立てください。

無料マニュアルプレゼント
SERVICE

提供中のサービス

オンラインビジネスを学びたい方に向けて、下記のサービスを提供しています。
サポート付で学べる

WordPressオンライン講座

WordPressでホームページを作るためのオンライン講座。

動画マニュアルとオンラインサポート付でWordPressが学べます。

>>WordPressオンライン講座の詳細はこちら<<

自己理解&オンラインビジネスが学べるコミュニティ

スタンドポイント

自己理解を深めるための「11日間集中無料メルマガ講座」。

オンラインビジネスが学べる「オンラインビジネスの学校」を運営しています。

>>スタンドポイントの公式ページはこちら<<

この記事を書いた人

たかゆき

広島県在住。
WEBメディア運営/オンラインスクール運営/WordPress講師/Udemy講師/アフィリエイトスクールのコーチ