解決済
ブログタイトルを画像にしたい
フログのタイトルはいま自動的になっていますが、自分がgifかjpgで作成したタイトルロゴにしたいのですが、どうしたら良いのでしょう?回答(2)
2.

次に作成したタイトル画像をサーバーにアップロードします。管理画面の中の 『 ファイルのアップロード 』 をクリックして、該当するブログタイトルの画像をアップロードして下さい。この時、『 サムネイル作成 』 のチェックは必ず外しておきます。
次に管理画面の 『 カスタマイズ / 管理 』 のタブをクリックし、上から 3 項目めの 『 ブログの説明 』 の個所に以下のタグを書き込みます。
<a href="あなたのブログのアドレス"><img src="作成したブログタイトル画像のアドレス" width="画像の幅" height="画像の高さ" border="0" alt="ブログのタイトル"></a>
『 あなたのブログのアドレス 』 の部分と 『 作成したブログタイトル画像のアドレス 』 の部分なんですが、最近 ナレッジ で質問を受けていると妙に目に付くのですが、管理画面から自分のブログを開いた時にアドレスの後ろにつく 『 ?blog_id=ID 番号 』 まで記載している方が非常に多いみたいです。これは管理用の ID 番号なので、記載する必要はありませんので注意して下さい。
画像の高さと幅は数字だけで結構です。px などは記載する必要はありません。緑字 の alt のところは title と書き換えても OK です。書き込む場所は、ブログの説明文章 ( description ) があらかじめ書いてあると思います。その上に書き込めば良いでしょう。
次に書き込みが終わったら、いったんその設定を保存しましょう。その同じページの下に 『 設定を保存する 』 がありますから、そこをクリックして保存します。そして、トップページだけ再構築をかけます。あなたのブログのヘッダー上部にタイトル画像が表示されれば、まずは成功です。
字数制限の為、コメント欄 >>#2 へ。
ありがとうございました。
1.
#banner,#subbannerのbackground:urlに指示があるとおり、
http://image.blog.livedoor.com/img/usr/20040823/ma...が設定されています。
ヘッダーの背景を変えたいということなので
これを入れ替える事になります。
なお、高さは180pxと指定がありますので、
サイズが違う場合は、この設定も見直す必要があります。
コメント(7)
コジーさん、質問を誤読していますよ。
今回の質問は、ブログタイトルの画像化です (^_^;)
回答 >>1 からの続き
ですが、このままでは元々あったタイトル ( テキスト )
が見えていてかっこ悪いです。
これを非表示にしましょう。次は CSS の中に新たな記述を追加します。『 カスタマイズ / 管理 』 > 『 デザインの設定 』 > 『 カスタマイズ 』 > より、CSS の項目の中の .blogtitle{ } の中に、以下の記述を追記します。
display:none;
( テキストを非表示にする。その存在する行自体も無くなります。 )
ここまでできたらブログの再構築を 『 全て再構築 』
しましょう。これであともう少しです。
続き↓
ブログタイトル画像の位置を、自分の好みの位置に変更したい場合は、前述したタグの前後に <div> ~ </div> で囲み、クラス属性をつけて新たな指示を CSS ( スタイルシート ) に追加記述します。例えばこうです ・・・
<div class="gazoutitle">
<a href="あなたのブログのアドレス"><img src="作成したブログタイトル画像のアドレス" width="画像の幅" height="画像の高さ" border="0" alt="ブログのタイトル"></a></div>
クラス属性の中の gazoutitle は、お好きな表記を用いて下さい。このままでもかまいません。このあと CSS ( スタイルシート ) の中にそれに対する指示を書き加えます。
.gazoutitle{
text-align:left;
margin: ○○px ○○px ○○px ○○px;
}
続き↓
text-align:left; は、左寄せをあらわしています。右に寄せたかったら text-align:right; 、中央ならば text-align:center; です。margin の部分は上下左右の余白を調整します。左の数字から、上、右、下、左、です。これで位置を微調整します。
■ 追記
実は、CSS ( スタイルシート ) の中の .description{ } のプロパティ padding の数字を変更すれば、新たなクラス属性を追加しなくても画像タイトルの位置調整は可能です。ただし以下の事について気を付けて下さい。
.description{ } の中の padding の数字を変える事でブログタイトル画像の移動は可能ですが、ブログタイトルの下に表示されるブログの要約説明も同じように移動します。ブログタイトル画像とブログ要約説明を別の動きで調整したい場合 ( 例えばタイトルは右側に、要約説明は左側になど ) は、上記の説明どおり新たなクラス属性を追加する方が良いでしょう。
ブログの要約説明を削除、もしくは非表示と設定している場合や、タイトルの移動と同一の動きでよろしいのであれば、.description{ } の中のプロパティ padding の数字を変更し、調整をおこなって下さい。
頑張って ε-(´∀`*)
あはは。失敗失敗・・・
なんか違う気がしたんだよなあ。
違和感はありましたね。
