FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか？

ヘッダー背景を画像にする

ヘッダーの背景に画像を入れる方法を紹介します。
スタイルシートの#headerに次の記述を加えます。

#header {
～
background: #ffffff; ※この背景色指定よりも下に記述してください
～
background-image: url(http://～);
height: 300px;
～
}

(http://～)に画像があるURLを入れてください。
heightには画像の高さを指定してください。

横幅は画像をサイトの幅に加工するのがよいかと思います。
サイト幅は初期設定(50em)で800px程です。

画像がサイトサイズにピッタリ合わなくても
繰り返しなしの中央寄せにすれば良いと思います。

#header {
～
background-image: url(http://～);
height: 300px;
background-repeat: no-repeat;
background-position: center;
～
}

<02/04追記>
青い部分は大文字で書いてください。IE,Operaでは小文字でも問題ないのですがFireFox,NetScape,では大文字でなければ有効にならないようです。

<02/11追記>
記述は小文字でも大文字でも構いません。
上手く表示されない原因は複数ありました。

１．背景の色をしている「background: #ffffff;」を消すか
　　これより下に記述を挿入しなければならない

２．全角スペースが含まれると有効にならない
　　※（IE,Operaでは全角スペースが含まれても有効になります）

私の記事をコピーペーストした場合、行頭に全角スペースが含まれてしまうようになっていました。誠に申し訳ありません。改めて全角スペースを排除して掲載しました。

画像は左寄せ(left)や右寄せ(right)することもできます。

<04/13追記>
スタイルシートの「background-position」に%表示の数値を２つ設定することで微妙な位置設定も出来ます。

background-position: 5% 50%;

1番目の数値　左右に対応　少ないほど左　多いほど右
2番目の数値　上下に対応　少ないほど上　多いほど下

管理画面左メニューに「ファイルアップロード」があります。
これを使って画像ファイルをアップロードしてください。

あなたの好きな画像を背景にしてみましょう。
オリジナリティがぐっと増しますよ。是非挑戦してみてくださいね。

関連記事

[ 2006/02/11 11:01 ] カスタマイズ standard 専用 | TB(2) | CM(89)

≪ 新テンプレートをリリースしました。 | HOME | プラグインのスタイル ≫

[ 73 ] いたおさん、おおきに！！

うゎぁ～　早速の説明ありがとうございます。

週末に早速試してみたいと思います。

感謝、感謝です。

[ 2006/01/26 07:41 ] [ 編集 ]

[ 74 ] 質問です。

テンプレを使わせていただいてます。
そこで質問なのですが、コメントを書いてくれた人のURLをクリックした時に、飛び先のサイトを別窓で表示するにはどうすれば良いのでしょうか？トラックバックのURLをクリックすると別窓で表示されるのですが・・・。
僕が知っている方法が通用しなくて困ってます。
これからもシンプルで使えるテンプレを提供してください。応援してます。

[ 2006/01/26 11:27 ] [ 編集 ]

[ 76 ] p(^^)q

私も画像の入れ方を知りたかったんです。
わーい、挑戦してみます

[ 2006/01/26 23:47 ] [ 編集 ]

[ 77 ]

こんにちは。いい事聞きました。^^
載せる画像を考える楽しみができました。
いつも有難うございます！

[ 2006/01/27 00:52 ] [ 編集 ]

[ 78 ] 皆さん有難う御座います。

神崎タカシさん、サイトナビゲーションのほうはもうちょっと待ってくださいね＾＾；
ひろきさん、おっしゃる通りコメントリンクは別窓のほうが使いやすそうですね。ちょっと調べて近日中に記事にしますのでもう少々お待ちください。
ねこキックさん、入れる画像はやはりネコ!?知りたいことはどんどん聞いてくださいねー。
くろねさん、画像背景ネタは絵師としての腕の見せ所ですね。イラコンも頑張ってくださいね。

これからも皆さんのお役に立てる記事が書けるように頑張ります。

[ 2006/01/27 01:52 ] [ 編集 ]

[ 96 ] 背景透過にするには？

はじめまして。
こちらのテンプレはどれもシンプルで素敵ですね。
私もひとつ、お借りしています。

ところで、今日は背景画像を透過表示する方法を
教えていただきたくて、こちらにお邪魔しています。

記事の後ろあたりに背景画像を透過表示させたいのですが、
どのようにすればいいのかわかりません。
大変申し訳ないのですが、何かアドバイスをいただけますか？
宜しくお願い致します。

[ 2006/02/04 02:19 ] [ 編集 ]

[ 98 ] こんばんは、cielさん

こちらの記事で画像をヘッダーの背景にする方法を紹介していますが、それを記事の背景に応用すればよいのです。

スタイルシートに記述されているヘッダーのクラス

#header {
～
}
に指定する背景画像情報を、記事のクラス

.article {
～
}
に指定するだけです。Ctrlキー+Fキーを押せば
検索できて素早く目的のクラスを見つけられる
と思います。

記事の最後尾に置きたい場合は
background-position: bottom;とします。
height指定は必要ありません。

カスタマイズ頑張ってくださいね。

[ 2006/02/04 02:59 ] [ 編集 ]

[ 99 ] 早速のお返事ありがとうございました。

早速お返事頂きましてありがとうございました。
どうして、画像入っていないんでしょうね・・・。
エントリー画面で試して見る分には、ちゃんと出るのですが。。。

使えない画像なのでしょうか？？
昨日お送りした画像URLは
http://blog40.fc2.com/m/motoma/file/20060203190956.gif
であってますよね？？

困りました...。
やっぱりスキルのない私には無理なんですかね～。

アップロードするのは、fc2の管理画面のものでいいんですよね？？

[ 2006/02/04 09:00 ] [ 編集 ]

[ 100 ] 度々すみません

いたお様
昨日ブログ背景の透過についてお尋ねしたcielです。
ご丁寧なアドバイス有難うございました。

もう少し教えていただきたいのですが、
下記をHTMLに入れて背景設定したのですが、
ヘッダーや記事の下に画像が表示されてしまい、
画像表示がうまくされませんでした。

<STYLE type="text/css">

</STYLE>

CSSのどこを改編すればいいのでしょうか。
大変申し訳ないのですが、またお時間のあるときに
アドバイスをいただけませんか。
宜しくお願い致します。

[ 2006/02/04 15:07 ] [ 編集 ]

[ 101 ] mamiさんへの回答

私のメールに記載した画像URLと
今朝コメントに書き込んだ画像URLが違いますよ!?

後者は画像が確認できます。こちらのURLであることを確認してください。URLの誤記が問題だったのであればこれで解決できるはずです。

[ 2006/02/04 17:01 ] [ 編集 ]

[ 103 ] cielさんへの回答

まず質問の意図を確認させてください。

>記事の後ろあたりに背景画像を透過表示させたいのですが、
>どのようにすればいいのかわかりません。

背景にした画像を透過表示させてしまうと何も写りません。
「記事の最後尾あたりの背景を画像にしたいのではないか」
と推測して回答しましたがどうやら違ったようですね。申し訳ありません。

ひょっとして「画像の背景」を透過させたものを記事の背景にしたいのでしょうか？そうだとしたら画像処理の問題になります。

もし差支えなければcielさんのブログの閲覧パスを教えて頂けないでしょうか。左側メニューにメールフォームがあります。直接見ることができれば質問の意図が汲み取れるかも知れません。

[ 2006/02/04 18:08 ] [ 編集 ]

[ 104 ] ごめんなさい！！

すみませんでした！！抜けてしまっていた所があった様です。
あっているほうのURLでチャレンジしてみたのですが、やっぱりヘッダー部分が縦に伸びるだけでした・・・。

ヘッダーの部分の端から端までにこの画像を入れたいのですが、その際に入れるタグを出来れば教えていただけないでしょうか？？
本当に本当にごめんなさい...
その様なレベルのお願いに対応は出来ない様でしたら断ってくださってけっこうですので・・・。

[ 2006/02/04 18:47 ] [ 編集 ]

[ 106 ] mamiさんへの回答

この記述を使ってみてください。

/* ヘッダーレイアウト */
#header {
background: #FFC0CB;
text-align: left;
background-image:url(http://blog40.fc2.com/m/motoma/file/20060203190956.gif);
　 BACKGROUND-REPEAT:repeat-x;
　 BACKGROUND-POSITION: top;
}

画像がヘッダー背景となります。
ただタイトルの色と同じ白い画像なので

1.タイトル文字の色を変えるか
2.画像の背景を他の色に塗り替えるか
3.画像の背景を透過処理するか

いずれかの処理が必要になります。
お好みの方法でカスタマイズしてください。

「ヘッダー背景を画像にする」の記事に追記しました。
http://10plate.blog44.fc2.com/blog-entry-28.html
大文字にしなければならないところもあるようです。
参考にしてください。

[ 2006/02/04 22:00 ] [ 編集 ]

[ 109 ] ありがとうございました＾＾

いたおさんのお陰でカワイく仕上げる事が出来ました！
ワガママを聞いてくださって本当に感謝しております。

画像は何か思ってたイメージと違ったので、変えちゃいました＾＾；

もう一つのブログもいたおさんのに変える事に決めました♪

本当にありがとうございました。

[ 2006/02/05 00:54 ] [ 編集 ]

[ 110 ] お役に立てて光栄です

また何かあったらなんでも聞いてくださいね。

[ 2006/02/05 02:20 ] [ 編集 ]

[ 133 ] 全くの素人なのですが。

初めまして、ｓｔａｎｄａｒｄ＿ｂｌｕｅを使わせて頂いているのですが、
ヘッダー部に画像が上手く乗りません。
青い部分が伸びるばかりで・・・。
記述の通りにやってみたのですが、上手く行きません。
差し込む位置がわるいのでしょうか？
画像のアドレスは、エントリ作成時のモノをコピーして
貼りつけたのですが。

[ 2006/02/08 18:21 ] [ 編集 ]

[ 140 ] > ジムカニアンさん

こんばんは、ジムカニアンさん。
まず画像URLが正しいことを確認したいので、コメントに画像URLを掲載して頂けないでしょうか。
お手数ですが宜しくお願いします。

[ 2006/02/09 01:37 ] [ 編集 ]

[ 143 ] お手数掛けます。

＞いたおさん。
すみません、このＵＲＬなんですが・・・

http://blog46.fc2.com/g/gymkaniann/file/nsx65.jpg

[ 2006/02/09 23:29 ] [ 編集 ]

[ 145 ] >ジムカニアンさん

画像URLは問題ないですね。

ヘッダーには"background"というクラスもあります。

#header {
background: #3333cc;
}

この"background"の行を削除してから画像背景のカスタマイズを試してみてください。
私のほうでもいろいろ試しているのですがFireFox,NetScapeでは"background"があると"background-image"と競合するのか上手くいかないようなのです。

[ 2006/02/10 01:56 ] [ 編集 ]

[ 146 ] カテゴリーの前に小さいアイコンを入れたい

こんばんは。はじめまして＾＾
シンプルで素敵なので、使わせていただこうかと
思っています。
初心者なのですが、カテゴリーのタイトルの前に
アイコンを入れたいのですが、可能でしょうか？
教えてください。
よろしくお願いします。

[ 2006/02/10 02:45 ] [ 編集 ]

[ 149 ] ありがとうございました。

＞いたお様。

お蔭様で上手く行きました。
ありがとうございました。

[ 2006/02/11 11:39 ] [ 編集 ]

[ 150 ] > Sinobuさん

こんばんは、Sinobuさん。
回答が遅くなって申し訳ありません。

リストの行頭にある「・」をアイコン(画像)に換えることはできます。この際カテゴリだけでなく、他のリストの「・」も換わってしまいますが宜しいでしょうか？

スタイルシートに次の記述を追加してください。

li {
list-style-image:url("http://～")
}

赤いところにはアイコンがあるURLを記述してください。
あまり大きいアイコンを使うと変な表示になってしまうので気をつけてくださいね。

[ 2006/02/11 22:05 ] [ 編集 ]

[ 153 ] > ジムカニアンさん

こんばんは、ジムカニアンさん。
カッコイイサイトになりましたね！

実はもう一つ問題が発覚したのです。
ジムカニアンさんのブログはIEでは背景画像が表示されますが、FireFox,NetScapeでは表示されません。問題解決方法を追記しましたので参考にしてください。

http://10plate.blog44.fc2.com/blog-entry-28.html#comment149

スタイルシートに書き込んだ記述の行頭に全角スペースが入っていると思われます。それを取り除いてください。

やはり全ての訪問者にそのカッコイイ背景画像を見てもらいたいですよね。

[ 2006/02/12 00:41 ] [ 編集 ]

[ 154 ] ありがとうございます

＞いたおさん。
わざわざすみません。
思い当たる部分は消して見ましたが、
如何なものでしょうか？

[ 2006/02/12 13:25 ] [ 編集 ]

[ 155 ] トップページ・・・

こんちには前回はありがとうございました。
いつも、いたお様のお陰です。m(__)m

今回はトップページについてですが、お借りしているテンプレートにトップページを作る事できますか？

ENTERとBACKを付けたいのですが・・・

もし出来るのであれば教えてください。当方初心者なので、詳しく教えていだだけたら幸いです。

[ 2006/02/12 14:35 ] [ 編集 ]

[ 156 ] > ジムカニアンさん

こんばんは、ジムカニアンさん。
FireFox,NetScapeで確認しましたが、まだ背景画像が表示されません。
問題の箇所を指摘できれば良いのですが、こちらでスタイルシートの全角スペースの有無は確認することができないのです。
申し訳ありませんがもう一度確認をお願いします。
もし問題箇所が解からなければもう一度テンプレートをダウンロードして背景画像のカスタマイズを施してみて下さい。

[ 2006/02/12 21:53 ] [ 編集 ]

[ 158 ] > ダンディパパさん

こんばんは、ダンディパパさん。
すみませんがまず質問を確認させてください。

>今回はトップページについてですが、お借りしているテンプレートにトップページを作る事できますか？

これは入場の可否を問う扉ページを作りたいという解釈で宜しいでしょうか？。扉ページは訪問者に好まれませんので必要に迫られないのであれば付けないほうが良いかと思います。
また質問の解釈が間違っていれば申し訳ありませんがもう一度説明してください。

[ 2006/02/13 00:44 ] [ 編集 ]

[ 166 ] なんて親切なテンプレート屋さん

はじめまして
シンプルで機能的でいいですねぇ

こちらの
ＴＯＰ画面中央（リリーステンプレート一覧）
のようなお知らせ欄のカスタマイズ方法を
是非ｗｗ　伝授してください

アフターメンテナンス付きの
テンプレート屋さん・・　最高です

そのうちこちらでお世話になると思います

[ 2006/02/14 12:07 ] [ 編集 ]

[ 171 ] > きれい・カワイイ情報局

こんばんは、きれい・カワイイ情報局さん。

プラグインをカテゴリ３にするとトップ画面中央に配置されます。

参照記事
http://10plate.blog44.fc2.com/blog-entry-13.html

「最新の記事」を置いてナビゲートしたり、フリーエリアにサイト紹介文を書く等いろんな使い方ができますよ。是非お試しください。

[ 2006/02/15 02:29 ] [ 編集 ]

[ 176 ] 教えてください

はじめまして♪
いたおさんのテンプレートを使用させていただいてます。私ブログ初心者なものでカスタマイズで
いろいろと悩んでます。

さて、後輩がgifでアイコンを作成してくれました。
それを、プラグインの"最近の記事"とか
"最近のコメント"の前（or後ろ）につけたいのですが
どうしてよいかわかりません。
イメージは　（画像）最近の記事　な感じにしたいのですがどうすればよいのでしょうか？
唐突ですみませんが教えてください。
よろしくお願いします。

[ 2006/02/16 23:57 ] [ 編集 ]

[ 177 ] 何度もすみません。

＞いたおさん

再度、やり直して見ましたが。
如何でしょうか？

お忙しいのに申し訳ありません。

[ 2006/02/17 11:07 ] [ 編集 ]

[ 179 ] > かぴぱらさん

こんばんは、かぴぱらさん。
回答が遅くなって申し訳ありません。

プラグインタイトルの前にアイコン画像を飾る方法の記事を掲載しました。

http://10plate.blog44.fc2.com/blog-entry-44.html

こちらを参考にしてください。
カスタマイズ頑張ってくださいね。

[ 2006/02/19 01:25 ] [ 編集 ]

[ 180 ] > ジムカニアンさん

おめでとうございます。ジムカニアンさん。
FireFox,NetScape,Operaでも背景画像が表示されることを確認しました。
これで何処かで誰が見てもバッチリ決まったブログを見せられますね＾＾

[ 2006/02/19 01:34 ] [ 編集 ]

[ 183 ] ありがとうございました

＞いたおさん

お手数お掛け致しました。
本当に親切に教えていただいてありがとうございました。

[ 2006/02/19 23:32 ] [ 編集 ]

[ 191 ] > ジムカニアンさん

こんばんは、ジムカニアンさん。
お役に立てて光栄です。
私のテンプレをここまでカッコよくカスタマイズしてくれると私もとても嬉しいです。
またなにかあったら何でも聞いてくださいね。

[ 2006/02/26 04:10 ] [ 編集 ]

[ 305 ] タイトル移動

毎回質問ばかりで、すみません。
また教えて欲しいのですが、
タイトルと背景画像の一部が重なってしまったので、
タイトルを画像の上に移動したいのですが、
ど～～してもわからないので、教えてください。

[ 2006/04/05 15:43 ] [ 編集 ]

[ 307 ] > ねこにゃんさん

こんばんは、ねこにゃんさん。

HTMLにvalign="top"の記述を加えてくささい。


<tr><td id="header" valign="top" >

これでタイトルが上の方に表示されますよ。

[ 2006/04/06 00:42 ] [ 編集 ]

[ 308 ] 出来ました

いたおさん、出来ました＼＾o＾／
いつもありがとうございます。
半日悩んでいたんです(^^ゞアセ
やっぱり、いたおさんは、すごいですね。
平日だからお仕事だったんでしょ。
遅い時間なのに、ごめんなさいね。
本当に助かりました。

[ 2006/04/06 01:28 ] [ 編集 ]

[ 311 ] > ねこキックさん

こんばんは、ねこキックさん。
タイトルが上の方に表示されましたね。
それとお気遣い有難うございます＾＾
私は平気ですよ。また何かあれば聞いてくださいね。

[ 2006/04/06 22:23 ] [ 編集 ]

[ 408 ] ヘッダー背景を画像にすることについて

いたおさんはじめまして。
テンプレートおかりしてます。お忙しいところ申し訳ありません。質問ですが、ヘッダー背景を画像にしてみたのですが、右端に表示され、左端や中央はあいており、さびしい感じになってしまいました。画像を一枚ではなく、詰めて二枚～三枚表示させたいと思っています。どのようにすればいいか教えてください。

[ 2006/06/06 02:42 ] [ 編集 ]

[ 409 ] いたおさんへ

以前、ヘッダー背景の質問をしたぺこりです。。無事解決しました。今後なにかあるときは教えてくださいね。

[ 2006/06/09 14:58 ] [ 編集 ]

[ 413 ] > ぺこりさん

こんばんは、ぺこりさん。
解決できたのですね。おめでとうございます。
また何かあれば聞いてくださいね。

[ 2006/06/12 00:40 ] [ 編集 ]

[ 809 ] ヘッダー背景を画像にする件

はじめまして。
テンプレートありがたく使わせていただいております。

題名の件なのですが、
#header {
background: #000000;
text-align: left;
height: 116px;
BACKGROUND-IMAGE: url(back.jpg);
BACKGROUND-REPEAT: no-repeat;
BACKGROUND-POSITION: right;
}
このように記述しまして、プレビューボタンを押すと正しく表示されますが、実際に更新ボタンを押してからURLにアクセスすると、背景が真っ黒なままで画像が表示されません。
Heightに関しては変わっているので、変更自体が反映されていないということはないと思うのですが・・

お答えいただければ幸いです。
よろしくお願いします。
では失礼します。

[ 2006/11/21 15:57 ] [ 編集 ]

[ 811 ] ぴこさんへ

記事中＜02/11追記＞として書かれている様に
background: #000000;
の記述を消したらどうでしょう？

[ 2006/11/23 08:19 ] [ 編集 ]

[ 815 ] 通りすがりのものです。さんへ

お返事ありがとうございます。

/* ヘッダーレイアウト */
#header {
text-align: left;
height: 116px;
BACKGROUND-IMAGE: url(back.jpg);
BACKGROUND-REPEAT: no-repeat;
BACKGROUND-POSITION: right;
}

このように記述してみるのは試したのですが、
同じくプレビュー時のみ反映されている状態です(ノ∀`)

[ 2006/11/24 11:05 ] [ 編集 ]

[ 816 ] 何度もごめんなさい。

プレビューで見られるのであれば、もしかして
画像をサーバーにアップロードしていない‥‥とかじゃないですかね？

url(back.jpg);　←この部分が単なる「例」として書かれたのなら良いのですが。

[ 2006/11/24 11:20 ] [ 編集 ]

[ 817 ] こちらも何度もすみません

F2Cブログ内にアップロードしてあった画像だったので相対パスで書いていました。
同じくF2CのHPをレンタルし、そこにアップロードした画像を絶対パスで指定してみたのですが、それも同じ現象でした。

試しに全く違うサイトにアップしてみた画像を使用し、絶対パスで記入したところ、無事表示されました。

ご迷惑おかけしました。

[ 2006/11/24 11:35 ] [ 編集 ]

[ 827 ] > ぴこさん

こんばんは、ぴこさん。
無事解決されたようですね^^;
返答が遅くて申し訳ありませんでした。

[ 2006/11/29 00:07 ] [ 編集 ]

[ 828 ] > 通りすがりさん

こんばんは、通りすがりさん。
アドバイス有難う御座いました。本当に助かります。
通りすがりさんのような方がいてくれると私はとても嬉しいです^^

[ 2006/11/29 00:09 ] [ 編集 ]

[ 883 ] 始めまして

シンプルで私のＨＰにあっていたので、いたおさんのテンプレートでブログを始めてみました。ブログはまだ初心者ですが、少しｈｔｍｌを習ったので、まずはヘッダーの部分を変えてみました。だんだん楽しくなってきたのでもう少し変えてみようと思います。とても、参考になりました。ありがとうございました！

[ 2006/12/17 15:09 ] [ 編集 ]

[ 884 ] > Riqueさん

こんばんは、Riqueさん。
喜んでもらえて私も嬉しいです＾＾
どんどんカスタマイズにチャレンジしてみてくださいね。

[ 2006/12/18 00:24 ] [ 編集 ]

[ 1846 ] 再ＤＬしました。

質問を出した後、他の方のスタイルシート及び、別ブログのＣＳＳ編集を参考に毎日画像ＵＰを試していました。
ゴールデンウィークも試し続け、他の方のテンプレートでは出来ました。
本日も先程まで試し、いたお様のテンプレートのみ画像ＵＰが出来ない・・・。
どこかおかしいと思い、テンプレートを再ＤＬしました。
いじり過ぎどこか？変になっていたみたいです。

まだ写真も始めたばかり。
画像編集してもサイト幅に合わす事が出来ないため、centerでno-repeatだと余白部分が中途半端。
取りあえずセンターで繰り返しですが、何とか画像ＵＰ出来ました。
テンプレートを変更しようかな・・・何度も思いましたが出来て良かったです。

[ 2007/05/06 16:06 ] [ 編集 ]

[ 1853 ] > らぶりぃママさん

いろいろカスタマイズするうちにどこかおかしくなってしまうことはよくある話です。「複製」でこまめにコピーをとっておくと良いですよ。
らぶりぃママさんはブラウザサイズにサイト幅が伸縮するリキッドレイアウトなので繰り返し表示でいいと思います。頑張りましたね＾＾

[ 2007/05/07 00:33 ] [ 編集 ]

[ 2885 ] はじめまして

テンプレートをダウンロードさせていただきました。
いま、一生懸命カスタマイズしているとことです。

そこで、上記のぺこりさんの質問ないよと重複するのですが、

＞ヘッダー背景を画像にしてみたのですが、右端に表示され、左端や中央はあいており、さびしい感じになってしまいました。画像を一枚ではなく、詰めて二枚～三枚表示させたいと思っています。どのようにすればいいか教えてください。

まさに、この内容について私も悩んでいます。
自己解決されたということで、回答がなかったのですが、
ぜひ教えていただけますか？
お願いします。

[ 2007/10/17 18:25 ] [ 編集 ]

[ 2940 ]

いたおさま、いつもお世話になります。

別のブログのテンプレートもいたおさま
のstanderdを使用しておりますが

ヘッダー、フッターの枠線の指定は
どこでしてやるのでしょうか？

ヘッダーの下線、フッターの上線を
消したいのですがその方法がわかりません。

どうぞ宜しくお願いいたします。

[ 2007/11/11 14:22 ] [ 編集 ]

[ 3545 ] はじめまして

ヘッダーに画像を使っているのですが、

トップページ以外に表示させないようにするにはどうしたらよいですか？

[ 2008/10/06 02:51 ] [ 編集 ]

[ 3553 ] だべさんへ

ヘッダー


では解決しませんか？

[ 2008/10/17 16:23 ] [ 編集 ]

[ 3699 ] 管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

[ 2009/03/06 01:41 ] [ 編集 ]

[ 3846 ] ヘッダーの部分のタイトルの位置

こんにちは。突然失礼いたします。

ヘッダーの部分のタイトルの位置を中央から右下か左下に移したいのですが、いまいちHTMLとCSSのいじり方が分かりません。

HTMLまたはCSSのどちらを、そしてどの部分をいじればよいのか教えていただけますでしょうか。

ちなみにFC2のgrave-bearのテンプレートを使っています。

[ 2009/04/06 21:55 ] [ 編集 ]

[ 3847 ] > みんじさん

それは私が作成したテンプレートではないので確かなことは解らないのですが、おそらくスタイルシートにある次の数値を変更すればいいと思います。

.site_title {
padding-top: 50px;
padding-left: 50px;
}

padding-topの数値を増やせば下へ
padding-leftの数値を増やせば右へ
タイトルの位置が変わると思います。

[ 2009/04/06 23:17 ] [ 編集 ]

[ 3851 ] ありがとうございます！！！！

いたお様

アドバイスありがとうございました！！！今、数値を変えてみたところタイトルの位置が見事に変わりました！！！

本当にありがとうございましたm(__)m

[ 2009/04/07 11:05 ] [ 編集 ]

[ 3861 ] 立て続けに申し訳ありません。

上で質問したみんじと申します。
申し訳ないんですが、再び質問があります。

style seatを色々といじっていたせいか、記事を載せる際に「この画像で記事を書く」で画像を添付してエントリーするとテーブルが写真の大きさに合わせて変形してしまいます。

普通は画像の大きさに係わらず、自動的に画像の大きさがテーブル内に収まるようになると思うんですが、これはどう直したら良いのでしょうか。

「サムネイルで記事を書く」でやるとテーブル内に収まるのですが、毎回画像をクリックしないとオリジナルサイズの画像が見れない状況なんですが、これはどのテンプレートでも同じことが起きるのでしょうか？出来たら、オリジナルサイズをある程度保ちつつ、テーブルを変形させないようにしたいので手を貸していただけたらと思います。

ちなみにフォントを明朝からＯＳＡＫＡまたは他のフォントに変更したいのですが、どこをいじったらいいでしょうか。

こんなに何度も質問してしまって申し訳ありません。自分でも色々と調べたのですがお手上げ状態で・・・やはりＦＣ２のブログのことはここで聞いたほうがいいと思ったのでご迷惑をおかけしますがよろしくお願いいたします。

[ 2009/04/08 11:12 ] [ 編集 ]

[ 3868 ] > みんじさん

自動的に画像の大きさがテーブル内に収まることはありません。

アップする画像を記事枠内に収まるように加工するか、サムネイルの大きさを変更してください。

サムネイルの画像サイズを設定する
http://10plate.blog44.fc2.com/blog-entry-181.html

フォントの変更は次の記事を参考にしてください。そのテンプレートは詳しくないので確かなことは言えませんが、スタイルシートの.bodyに加えるといいかも知れません。

字体（フォント）を変える
http://10plate.blog44.fc2.com/blog-entry-68.html

[ 2009/04/09 01:53 ] [ 編集 ]

[ 3876 ] 再び・・・

いたお様

おかげさまで問題解決しました。
力を貸していただき本当にありがとうございましたm(__)m

[ 2009/04/09 17:58 ] [ 編集 ]

[ 4054 ]

はじめまして・・
私は以前ブログをしていまして、現在はお休み中です。
６月には再開の予定ですので、その準備段階でのお願いになります。
この項目の上のほうで『ぺこりさん』が自己解決し、
『tsuさん』が再び質問なさっている
「ヘッダーに画像を二つ」の件です。
私もお借りするフリーソフトによっては二つ入れたいと思ってますので、
どのようにしたらよいのか教えていただきたくお願いいたします。
どこかに記載があるのかと探しましたが、見つからずにいます。
すでに別項目にあるのでしょうか・・
もしあるのでしたら項目を教えていただければ幸いです。

[ 2009/05/03 14:02 ] [ 編集 ]

[ 4065 ] お時間があれば、返事を下さい。

私はニダーと申しますが、すみませんがこれでヘッダーの背景画像をランダムに表示とかできますか？

[ 2009/05/04 18:44 ] [ 編集 ]

[ 4066 ] > ニダーさん

こちらの記事を参考にしてください。

背景画像をランダムに変える
http://10plate.blog44.fc2.com/blog-entry-81.html

[ 2009/05/04 20:02 ] [ 編集 ]

[ 4073 ] > yuu_hiさん

背景に複数の画像を同時に表示することはできません。
（ランダムに違う画像を表示させることならできますが・・・）

ペイント等の画像編集ツールを使って、複数の画像を１つの画像としてまとめてください。

すみません。ちょっと面倒ですが、これ以外に方法がありません。

[ 2009/05/04 23:26 ] [ 編集 ]

[ 4078 ]

そうですか…
何とか１つの画像にまとめて背景にしてみます。
お忙しい中ありがとうございました。

[ 2009/05/05 09:21 ] [ 編集 ]

[ 4350 ] 質問、良いですか??

行き成りですが、質問しても宜しいでしょうか??

さて、初めにわたしは馬鹿なくらいの初心者なので、
｢ヘッダー｣とは何なのかが分からないのです。。

良かったら、教えてもらえませんか？

[ 2009/05/20 17:11 ] [ 編集 ]

[ 4359 ] > 媛愛さん

ここでいうヘッダーとは、ブログタイトル周りの部分を言います。

[ 2009/05/21 00:42 ] [ 編集 ]

[ 6356 ]

すいません。ヘッダってなんですか？？無知ですいません＞＜；；

よろしくお願いします

[ 2009/10/04 13:36 ] [ 編集 ]

[ 6361 ] > ヤスさん

ページの上の方、タイトルまわりのことです。

[ 2009/10/04 22:41 ] [ 編集 ]

[ 6374 ] 管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

[ 2009/10/06 00:29 ] [ 編集 ]

[ 7002 ]

お兄ちゃんのブログでも・・・

背景画像を見えるように
記事などの背景を

透明にしたいそうなんですが・・・・。

どうやって透明にしたか
私が忘れてしまい＞＜

兄のブログのURLは↓
http://kouyousuzaku.blog50.fc2.com/
です＞＜

おねがいします＞＜

[ 2009/11/16 00:54 ] [ 編集 ]

[ 7011 ] > 紗那さん

テンプレートが違うので全くこの記事の通りとはいきませんが、一応参考になると思います。

背景を半透明にする（透過png）
http://10plate.blog44.fc2.com/blog-entry-257.html

[ 2009/11/16 22:29 ] [ 編集 ]

[ 8162 ]

こちらのテンプレを利用させて頂いてる者です　.:*･゜┌○゛
素晴らしいカスタマイズ方法をいつも参考にさせて頂いております♪

上記の方法でしてみたら、画像は上手くできたのですが
ヘッダーのタイトル部分【ＨＰのタイトル】が
画像から上に出ており、ＨＰのタイトル部分を
画像の、ど真ん中にもってきたいのですが
どうすれば、出来るのでしょうか＞＜

宜しくお願いします　(ノ I `。)

[ 2010/02/01 22:37 ] [ 編集 ]

[ 8164 ]

誠にすいませんｐｑ

試行錯誤をしていたら無事出来ることができました　○┓
ありがとうございました(*´I`*)

[ 2010/02/01 22:48 ] [ 編集 ]

[ 8170 ] > リアさん

自己解決されて良かったです＾＾

[ 2010/02/02 01:13 ] [ 編集 ]

[ 8400 ] くりあ

いつもお世話になっております。
ヘッダ画像をタイトルに差し替えたのですが、
画像にTOPへのリンクをつける事は可能でしょうか？

文字表示の場合はタイトルにリンクが付いていたのですが、
これが無くなると不便な気がするのです。

[ 2010/02/14 17:35 ] [ 編集 ]

[ 8404 ]

>>[ 8400 ] くりあさん
http://10plate.blog44.fc2.com/blog-entry-187.html
この記事が参考になりそうです。

[ 2010/02/14 18:34 ] [ 編集 ]

[ 8659 ] ヘッダーを入れる場所

はじめまして。Unmerryです。

ブログ初心者で分からない事だらけなので、此処で質問させていただきます。

ヘッダーに画像を入れたいのですが、どこに、ヘッダーのHTMLを入れればいいのかが分かりません。

あと、HTMLも教えて頂ければと思います。

初歩的な疑問ですみません。

よろしくお願いします。

ちなみに、URLは

http://flowingcloudy.blog82.fc2.com/
http://shiorifeather.blog29.fc2.com/

の2つです。

[ 2010/04/11 19:06 ] [ 編集 ]

[ 8716 ] 承認待ちコメント

このコメントは管理者の承認待ちです

[ 2010/07/14 12:47 ] [ 編集 ]

[ 8717 ] 承認待ちコメント

このコメントは管理者の承認待ちです

[ 2010/07/15 08:29 ] [ 編集 ]

[ 8733 ] 承認待ちコメント

このコメントは管理者の承認待ちです

[ 2010/08/24 20:57 ] [ 編集 ]

[ 8777 ] 承認待ちコメント

このコメントは管理者の承認待ちです