賢威7カスタマイズヘッダーサイズと作り

賢威7カスタマイズをしたい!

賢威7ヘッダーサイズは?

ワードプレスでサイトアフィリエイトを実践中の方の中で賢威7カスタマイズに興味がある方にオススメの作り方を合わせてご紹介していきます。

賢威については、以下のようなコンテンツもご用意しています。

賢威ヘッダー画像挿入操作方法

賢威アドセンス貼り方プラグインおすすめの設定方法画像付

賢威カスタマイズ6.2と7比較|ワードプレス実践記

賢威7カスタマイズでline風吹き出しが登場!htmlタグ不要

賢威7カスタマイズトップページメニュー作り方|htmlタグ付

サイト管理人錦織大輝と申します。

この記事では、

賢威7カスタマイズヘッダーサイズ

賢威7カスタマイズヘッダー設定方法

賢威7と6.2ヘッダーカスタマイズ比較

賢威7と6.2ヘッダーを作る簡単な方法

以上の内容でご紹介していきますので、賢威を使う方の中で6.2と7を迷う方も参考にして下さい。

賢威7カスタマイズヘッダーサイズ

賢威7ヘッダーカスタマイズサイズ

賢威7ヘッダーをカスタマイズしたいなら

まず知らなければいけないのはサイズ。

賢威7は、ヘッダーサイズ初期設定は、1200px×250px

賢威7と6.2と迷う方のためにヘッダーの大きな違いをご紹介していきます。

賢威6.2と7ヘッダーサイズ比較

6.2の場合は、サイトの幅を設定する事から、ヘッダーサイズを主に決めていく手順でした。

サイト幅は950、1000、1100等が多く、レスポンシブになる分、サイドバーの配慮から好みで設定が可能でした。

私は、賢威6.2の幅サイズは1100pxで、設定しました。

しかし、賢威7では、1200というヘッダーサイズ。

この規模ですから、当然ながらヘッダー

サイドバーより大きく表示されているのです。

賢威7ヘッダーと6.2ヘッダー実例比較

賢威7ヘッダーカスタマイズ

これが賢威7を使ったサイトのトップページ。

このdaikun4.comのヘッダーと比較すると、違いが一目瞭然。

賢威6.2ヘッダー

ヘッダーを白にしなければサイズは当然色が途切れる様な構成になるのが賢威6.2。

「貴方はどちらが好みですか?」

色を使いたい方には、私は賢威7がオススメ。

白やヘッダーをシンプルにしたいなら賢威7。

こうした決め方も初心者の方には参考になると思います。

では続いて、賢威7ヘッダーカスタマイズ方法を画像付きで紹介していきます。

 

賢威7ヘッダーカスタマイズ方法画像付

賢威7ヘッダーカスタマイズ設定方法

賢威7ヘッダーカスタマイズ設定方法を画像付きでご紹介していきます。

1.「賢威の設定」→「トップページ」を選択。

賢威7ヘッダーカスタマイズ設定方法1

少し下にスクロールすると、「メイン画像」という設定があります。

2.「画像を設定する」

賢威7ヘッダーカスタマイズ設定方法2

賢威7ヘッダーサイズとなる1200px×250pxの対象画像をアップロード。

以上が賢威7ヘッダーカスタマイズ方法。

では続いて、賢威を6.2と7で比較してヘッダーカスタマイズ

が初心者に優しいのはどっち?をご紹介していきます。

 

賢威7と6.2ヘッダーカスタマイズ比較

賢威6.2ヘッダーカスタマイズ

賢威7を見た後に今度は賢威6.2カスタマイズとして

ヘッダーの設定についてご紹介していきます。

賢威6.2カスタマイズ|ヘッダー画像設定の流れ

1.「賢威の設定」を選択

2.「トップページ」を選択

3.「メイン画像」を選択

以上の3つで主に賢威7とカスタマイズは変りません。

賢威6.2ヘッダーカスタマイズ設定方法1

しかし、賢威6.2と賢威7では決定的な違いが有ります。

ヘッダーカスタマイズ最大の違い

賢威6.2には、ヘッダーを背景画像に設定するという選択肢がありません。

画像認識にするには、以下の様なカスタマイズが必要となります

賢威6.2ヘッダーを背景画像にするカスタマイズ手順

1.ヘッダー画像をメディアからアップロードします。

2.アップロードした画像のURLをコピーします。

3.「外観」→「テーマの編集」を選択

4.「ヘッダー」を選択

5.指定箇所にhtmlタグを埋め込み設定する

このような設定過程を行う必要があります。

3以降の手順を画像付きでカスタマイズ方法をご紹介していきます。

賢威6.2ヘッダーカスタマイズ設定方法2

上の画像は、テーマの編集のヘッダーを選択し、指定箇所にたどり着いた場所。

<div id=”header-title”>
<h1><a href=”&lt;?php bloginfo(‘url’); ?&gt;”><img src=”画像ファイルURL” alt=”&lt;?php bloginfo(‘name’); ?&gt;” /></a></h1>
</div>

上のコードをコピーして指定の画像URL部分へ画像URLを貼り付ければ作業は完了します。

こちらのコードをヘッダーの設定画面まで進んでから、Ctrl+Fで検索窓にコピーすることでスムーズに作業が完了します。

こうした1手間がかかるのが賢威6.2ヘッダー設定。

賢威7は確実にこうした手間を排除したより初心者に優しい設定に変わったとハッキリ言えるのです。

賢威7と6.2のヘッダーカスタマイズ違いの解説は以上となります。

では最後に、「ヘッダーを作る」という作業をより初心者にも楽しく体験してもらえる方法をご紹介していきます。

 

賢威7と6.2ヘッダーを作る簡単な方法

賢威6.2と7共通ヘッダー作り方初心者向け

賢威6.2と7共にヘッダーをカスタマイズしたいけどヘッダーを作る方法を知らない!

こうした方の為に簡単にヘッダーを作る方法を私の実践記からご紹介していきます。

賢威ヘッダー画像を作る無料ツールは色々あります。

GIMPなどは非常に評判です。

しかし、私は正直もっとシンプルに簡単操作を望んだので、Photoscapeを使いました。

photoscapeも無料で使う事が出来る簡単な画像加工ツールです。

ダウンロードしたらインストールを終わらせましょう。

フォトスケープの使い方について画像付で流れをご紹介していきます。

Photoscape作業手順を画像付でご紹介

賢威6.2と7共通ヘッダー作り方初心者向けphotoscape使い方

1.画像編集を選択

賢威6.2と7共通ヘッダー作り方初心者向けphotoscape使い方1

1.メニューを選択

2.新しい写真を選択

賢威6.2と7共通ヘッダー作り方初心者向けphotoscape使い方2

3.サイズを選択します。

賢威7:幅1200、高さ250

賢威6.2:幅サイトサイズ次第、高さ250目安

賢威6.2と7共通ヘッダー作り方初心者向けphotoscape使い方3

4.オブジェクトを選択

5.Photoを選択

6.メインとしたい画像を選択

7.重ね合わせや背後設定などは可能

賢威6.2と7共通ヘッダー作り方初心者向けphotoscape使い方5

8.リサイズをクリック

リサイズのコツは、

・画像の一部を使うなら大きめ

・画像全体を使うなら画像高さに揃える

賢威6.2と7共通ヘッダー作り方初心者向けphotoscape使い方6

画像配置が決まったらテキスト入力も可能

9.オブジェクトをクリック

10.Tの文字をクリック

賢威6.2と7共通ヘッダー作り方初心者向けphotoscape使い方7

テキストが完了したら、装飾も可能

11.ホームを選択

12.No Frameをクリック

賢威6.2と7共通ヘッダー作り方初心者向けphotoscape使い方8

このようにフレームを選ぶことも可能。

この他、フィルム効果によりアンティーク調や色彩調整なども可能なので好みで実践してみてください。

最後に保存をクリック。(JPEGで保存)

以上が、賢威6.2も賢威7も使える無料ツールを使ったヘッダー制作方法となります。

今回ご紹介したかった内容は以上となります。

私が現コンサル生から「こんな特典が欲しい」と頼まれて作った内容を

賢威購入者特典錦織のコンサル生意見が実現!

にてご紹介してますので、興味のある方は参考にして下さい。

最後まで記事をお読み頂きありがとうございました。