賢威6.2の初期設定では、ヘッダーにはテキスト(文字)が表示されますが、

これを、画像に変更して印象に残るブログを作る方法

図解入りで丁寧に解説します^^

 

ヘッダーテキスト(文字)を画像に変更するとは?

下の画像を見てください。

賢威の初期設定では、ヘッダー部分に
ブログのタイトルが自動的に文字(テキスト)として表示されますが、
これではすこ~~し寂しい感じがしますね(;^ω^)

 賢威ヘッダー画像

 

ヘッダーのテキスト部分を、画像に入れ替えてみました。
ブログの印象が一気に変わりましたね♪♪
今回は、この作業をやって行きたいと思います(^^)

賢威ヘッダー画像

 

画像をWordpressの【メディアライブラリ】に追加しよう

まずは画像を準備しておきます。
ここでは、画像作成の方法は割愛しますが、
今回はサイズ【横1000×縦200】で作成しました。
保存場所はデスクトップにしました。(別の場所でもOKです)

※ちなみに画像は【GIMP】という無料ソフトで作成しました。
興味のある方はGoogle等で検索してみてください^^

賢威ヘッダー画像

 

  Wordpressのダッシュボードにログインしておきます。
 左メニューの【メディア】をクリックし、
 画面が変わったら【新規追加】をクリック。

賢威ヘッダー画像

 

 画面が変わったら【ファイルを選択】をクリック。

賢威ヘッダー画像

 

  ファイルの選択画面が表示されますので
①【デスクトップ】をクリック
(ここは画像の保存場所によって変わります)
② 保存しておいた写真をクリック
③【開く】をクリック。

賢威ヘッダー画像

 

 Wordpressのメディアライブラリに画像が追加されました^^
この画像をクリックします。

keni-topgazo7

 

 画像と、その詳細情報が表示されますので、
①【URL】を選択してメモ帳などにコピーしておきます。
 コピーが出来たら右上の【×】をクリックして閉じます。

賢威ヘッダー画像

 これで下準備が完了しました♪♪もう一頑張りです!

 

ヘッダーテキストの代わりに画像を挿入しよう

 左メニューの【外観】にマウスをあて、
 出て来たメニューから【テーマの編集】をクリック。

賢威ヘッダー画像

 

 画像が切り替わったら、
右側のリストから【ヘッダー(header.php)】をクリック。

賢威ヘッダー画像

 

 ヘッダーの記述が表示されますので、
赤枠の部分を探します。
その中の、青く色が付いている部分を 
↓↓↓

 ↑↑↑

に変更します。

賢威ヘッダー画像

 

 変更が出来ました。

賢威ヘッダー画像

 

 次に、【画像URL】の部分を、準備の段階でメモ帳にコピーしておいた
メディアライブラリの画像のURLに置き換えます。

賢威ヘッダー画像

 

置き換えが出来ました。(画像のURLは塗りつぶしてあります)
次に、【alt=” “】のチョンチョンの間に、画像の説明となる言葉を入れます。

賢威 ヘッダー画像

 

 全て完了したら、画面下の【ファイルを更新】をクリック。
これで画像の設置は完了です!

賢威ヘッダー画像

 

 もう一つ、最後の作業です!!
画像の上に余計な文字が表示されないようにしていきます。
 左メニューの【賢威の設定】にマウスを当て、
 出て来たメニューから【賢威の設定】をクリック。

賢威ヘッダー画像

 

 【サイトの簡単な説明】欄の中の文字を消します。

賢威ヘッダー画像

 

 【変更を保存】をクリックします。

keni-topgazo18

 

 さあ、これで全て完了です!
画面左上の、ブログのタイトル部分をクリックして
プレビューを表示してみましょう。

賢威ヘッダー画像

 

 じゃん♪♪
ヘッダー部分に画像がきちんと入りました(#^^#)

賢威ヘッダー画像

 

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

今回は手順が沢山あって大変でしたね。
お疲れ様でした(;^ω^)

こういった作業は最初だけなので、
頑張って乗り切りましょう。

記事を書き始めるとうんと楽しくなりますので♪♪

それでは、今回は、このへんで^^

 

PS.

もし、【ここが分かりにくい!】とか
【こんな記事も書いて欲しい!】とか
【こんな事も教えて!】とかいう事がありましたら

どうぞ、遠慮なくマルコにメッセージをくださいませ♪
 ↓↓↓
マルコにメールしてみる(#^.^#)

 

PPS.
マルコは、パソコン1台でインターネットで収入を得て暮らしています。

自宅で家事をこなしながら、毎月自動でも20万円、
頑張った時には月収100万円以上を達成して
家庭を犠牲にして働きづめだった生活から、救われました。
そんなマルコのゼロからの道のりをメルマガでお話しています。

メルマガ内でマニュアル等のプレゼントも行っていますので
良ければ詳細をご確認くださいませ^^
(強引な勧誘などはおこなっていませんのでご安心くださいね)
 ↓↓↓
マルコのメルマガを読んでみる(#^.^#)