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

いたおさん、こんにちは。shigsと申します。相互リンク先のサイトからいろいろ巡って辿り着きました。読んでるだけでホント勉強になるし、私も早速モノトーンを頂きました！いろいろな変更の仕方も丁寧に解説してあって、もぉーここのブログは最高です！

このブログをもっと広めるべく、リンクを張らせて頂きました！

では応援して帰ります。

standard_pinkをDLさせていただき、ちょこっとカスタマイズさせていただきました＾＾
このサイトでも色々と勉強させていただきました＾＾
ありがとうございますｍ(＿ ＿)ｍ

こんなに早く教えて頂けて、とても嬉しいです♪
さっそく設定できました。
これからも愛用させていただきます。
ありがとうございました！

みなさんの励ましのお言葉本当に有難う御座います。

> shigsさん
凄く褒めて頂いて有難う御座います＾＾
少しでも役に立てたと思うと私も嬉しいです。

> asumiさん
素晴らしいカスタマイズセンスですね。
あれ？何故か横スクロールバーが出ています？

> ゆめめんさん
また何かあったらなんでも聞いてくださいね。
私も野球のWBC決勝戦を見ました。感動しましたね。

このような嬉しいコメントを頂けると凄くモチベーションがあがります。有難う御座います。
これからも皆さんに喜ばれるテンプレートを目指して頑張ります！

いたおさんご指摘どうもです＾＾
どうやら全体のテーブル幅を間違えていたようで・・・(^▽^;)
これからまだまだ勉強せねば・・・＾＾；
いたおさん、色々と教えてくださいね＾＾

センターの記事部分の１番上に（タイトルとの間）フリースペースで宣伝、コメントなどを載せたいのですが、
時間がある時に、こちらに載せて頂けませんでしょうか！
また、変更後の感想もお聞かせ願えたら幸いです！
管理人以外の方も感想をコメントして頂けたら嬉しく思います。
http://60064.blog26.fc2.com/
たくみ！

こんばんは、asumiさん。
横スクロールも消えてヘッダー背景やアイコンも少し変わりましたね。猫が可愛らしい素晴らしいカスタマイズですね。
なんと！私のブログが記事にされているではありませんか。有難う御座います。これからも役に立てるブログを目指して頑張ります！

こんばんは、たくみさん。
プラグインをカテゴリー３に設定してみてください。記事部分(中央カラム)の一番上に表示されます。

> 管理人以外の方も感想をコメントして頂けたら嬉しく思います。

私はたくみさんのようなやる気のある人が大好きです。頑張ってくださいね。

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

カテゴリー３の件ＯＫです！
自分の好みになって来ました！
こちらのサイトから数人の方が、ご訪問下さってます！
また、リンクも貼らしてもらいました！
よろしかったでしょうか？
　　　　　　　　　　　　たくみ

こんばんは、たくみさん。
プラグインのカテゴリ３設定が出来てますね。
私はこのカテゴリ３こそ最も力を入れるべきところと考えています。是非とも有効に活用してください。
リンク有難う御座いました。もちろん大歓迎ですよ。

質問なんですが、
記事中に<table>～</table>のテーブルを記述すると、その文字サイズが100%（？）になってしまいます。テーブル内のフォントサイズも記事のフォントサイズと同じにするにはどうしたらいいでしょうか…？

すみません、上のに追加で質問です…。

テーブルを記述して保存をして確認をすると、テーブルの下に1つ余分な改行が入ってしまいます。理由がどうしてもわからないのですが、どうすればいいかわかりますか…？

こんばんは、Ruinさん。
テーブル内のフォントがディフォルトになってしまうということはIE系のブラウザをお使いのようですね。

テーブル内の文字は次のタグで囲んでください。
<font color="#666666" size="2">文字</font>

完全に同じ大きさにすることは出来ないのですが、ほぼ同じ大きさで表示されるはずです。

余分な改行が入る原因は記事投稿のテキストフォーマットが「自動改行＋HTMLタグ」になっているからだと思います。「HTMLタグのみ」にして試してみてください。余分な改行がなくなると思いますよ。

テーブル内のフォントについては解決しました。ありがとうございます。

改行についてなんですが、
エントリの最後が<table>～</table>で終わって、かつ続きを読むが存在した場合にのみ、余分な改行が入ってしまうんです。
<table>～</table>で終わっても続きを読むが無い場合は余分な改行が入りません。続きを読むが存在しても、<table>～</table>で終わって無ければ余分な改行が入りません。何故でしょう…。

ソースを張るので、もし宜しければご回答宜しくお願いします。

<div class="article">
<%topentry_body>

<!--more_link-->
<br /><br /><a href="<%topentry_link>#more">⇒続きを読む</a>
<!--/more_link-->

<!--more-->
<hr class="tuduki" noshade size="1">
<%topentry_more>
<!--/more-->

<hr noshade size="1" />

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

こんばんは、Ruinさん。
HTMLのソースがデフォルトと違うようですがカスタマイズされたのでしょうか？ソースに余計な改行タグが入っていますね。

<!--more_link-->
<br /><br /><a href="<%topentry_link>#more">⇒続きを読む</a>
<!--/more_link-->

この改行タグを取り除けば上手くいくのではないでしょうか。宜しければ現状を把握したいのでURLを教えて頂けないでしょうか。公開するのに抵抗があるならメールもあります。宜しくお願いします。

管理人さんへ
ヤフーの記事です！
http://60064.blog26.fc2.com/blog-entry-205.html

皆さんで楽しんでください！
　　　　　　　　　　　　たくみ

こんばんは、たくみさん。
私はかなり本気で回してしまいましたよ＾＾；
どうも騙されやすいみたいです。

ものすごく丁寧で分かりやすい、いたおさんの説明のお陰でだんだんお気に入りのﾌﾞﾛｸﾞになってきました♪
初心者の訳分からない説明にも答えて下さって･･･本当に感謝してます<m(__)m>

もう少し教えて下さい･･･
●記事の最下部に表示される日付（[2006/04/05 00:02]）は消せますか？（TBとCMはそのまま残す）
それともこれはﾌﾞﾛｸﾞとして消さない方がいいのでしょうか？

●真中上部の「最新の記事」(ｶﾃｺﾞﾘ3の部分のみ)の文字の大きさ(5行の)や行間を変える事はできますか？
（・を取って行間を変える方法は載ってたようですが、・はそのままで行間だけ変えられますか？）

●ﾃﾝﾌﾟﾚｰﾄはＳＥＯ対策がされていると書かれてましたが、テンプレートの中に直接文字を入れたりしなくてもOKと言う事ですか？
（ﾃﾝﾌﾟﾚｰﾄの中に<･･･ﾀｲﾄﾙ名>とか色々並んでるので、文字を入れなくちゃいけないのかな？と思いまして･･･）

HPは全部読ませていただいたつもりですが、同じ質問が出ていたとしたらお手数かけてすみませんm(__)m

こんばんは、mamamiさん。

●記事の最下部に表示される日付（[2006/04/05 00:02]）は消せますか？

本来は消さないほうが良いと思いますが、消そうと思えば消せます。

<!--▼ エントリー（記事）▼-->
～
[<%topentry_year>/<%topentry_month>/<%topentry_day>
<%topentry_hour>:<%topentry_minute>]
～
<!--▲ エントリー（記事）▲-->

この部分を削除すれば記事下の日付を消すことが出来ます。

●真中上部の「最新の記事」(ｶﾃｺﾞﾘ3の部分のみ)の文字の大きさ(5行の)や行間を変える事はできますか？

現状のテンプレートでは難しいのですが、これを実現可能にした修正版を再リリースしようと考えています。まだいつになるか解かりませんが＾＾；

●ﾃﾝﾌﾟﾚｰﾄはＳＥＯ対策がされていると書かれてましたが、テンプレートの中に直接文字を入れたりしなくてもOKと言う事ですか？

HTMLのSEOに関してはこれ以上手を加えないほうが無難です。過度なSEOはスパムとみなされる可能性があります。

私のテンプレートを使用している人を見つけて交流を持ってください。コメントにサイト名でリンクを貼れるように工夫してあります。サイト名で被リンクを増やすことはSEOに効果があるのです。

お忙しいのにいつも早々にありがとうございます。
●日付は消さない方がいいのですね･･･分かりました。

●ではそのﾃﾝﾌﾟﾚｰﾄが出来上がるのを楽しみに待ってます(^^)v

●過度なSEOはスパムとみなされる可能性があるとは知りませんでした･･･
あちこちのHPで書かれてた事に惑わされて、何行が追加してしまったので削除します！

これからも素敵なﾃﾝﾌﾟﾚｰﾄ作ってくださいね(*^_^*)
ありがとうございました！

･･･で終わるつもりだったのですが･･･
今、いたおさんのHPを見て、ﾀｲﾄﾙのところに画像を入れてみたのですが、「background-position: left;」にすると本当に左端になってしまいます。
もう少し右に画像を寄せたい時どうすればいいですか？

いたおさんの子分のあなろぐと、いいます。
サイトを拝見しましたが、左端の可愛い天使の
ような動く画像でしょうか？

この画像が左に寄り過ぎているのでもう少し
右に寄せたいと言う事でしょうか？

もしそうなら、方法としては２つ思い浮かびます。
一つは画像自体の修正と、もう一つは
画像をテーブルで囲む方法です。
ですが、ソースを見ましたが、この画像はJavaScriptで動いているようなので、テーブルで囲む方法を推薦します。

ただもう一つだけ付け加えさせて頂ければ、SEOを
意識するのであれば、この画像は必要ありません。
マイナス要因の方が多いです。

勿論特別マイナスになるという訳ではなく
足し算で計算すると、プラス効果がないと言うだけですが。

もしどうしても、Scriptをタイトルの左右に置きたいのであれば、もう少しいい方法がないか調べてみます。

今しばらくお待ちください。もしかしたら、その間にいたお親分が答えてくれるかもしれません。

有難う御座います。あなろぐ職人さん。
多忙なのに助けてくれて本当に感謝しています。
あなろぐ職人さんは私がサイト運営をはじめた頃に励ましてくれた恩師です。
神戸の日記
http://seisyunn.blog9.fc2.com/

単に画像を挿入したのであればあなろぐ職人さんの回答で十分なのですが、画像を"背景"にした場合の位置設定方法も補足しておきます。

スタイルシートの「background-position」に%表示の数値を２つ設定します。

background-position: 5% 50%;

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

mamamiさんの場合はbackground-position: 5% 50%;が程よいかと思いますが、試してみて気に入る位置に設定してくださいね。

いたおさん今わたくし全然違う事を
書き込む所でした。
流石オーナーですね、とても的確な回答です。
わたくしも勉強になりました。
ありがとうございました。

いたおさん、あなろぐさん･･･ご丁寧にありがとうございます！とても感激してます☆

他人のﾌﾞﾛｸﾞｿｰｽが分かっちゃうんですね～!!
（まだ初心者ゆえにｿｰｽって？って状態で･･･情けない^^;）
なにかﾜﾝﾎﾟｲﾝﾄ入れたいと思うのですが、JavaScriptで動いている画像がﾏｲﾅｽって事ですか？
ただの画像なら問題ないのであれば、別の画像を探してから、いたおさんが書いて下さった動かし方を参考に挿入してみようと思います。

訳も分からず始めたﾌﾞﾛｸﾞですが、ここですごく勉強させてもらってます♪
いたおさんのﾃﾝﾌﾟﾚｰﾄにして良かったです！
今度はあなろぐさんのも見に行かせてもらいますね！

いえ、特別気にする必要はありませんよ
どちらかといえばと言う程度です。
いたおさんのタイトルは明らかにマイナスです　笑
ただ、ＳＥＯなんて余り気にする必要ないですよ
特にブログの場合は気にする必要ないです。

検索エンジンに上位表示される事より
このいたおさんのサイトのように、役立つサイトを作る事が一番肝心です。
そうすれば、自然と検索エンジンに上位表示されますし、訪問者も増えると思いますよ。

mamami さんのサイトならそのうち沢山の方が、訪れてくれると思います。
がんばってください！

> mamamiさん
あなろぐ職人さんがおっしゃる通りSEOは気にしないでください。画像も取り替える必要はありません。

> あなろぐ職人さん
いつも有難う御座います。お手を煩わせてはいけないと思いつつも、やはり気にかけてくれると嬉しいです。

皆さんにも良き師を見つることをお薦めします。サイト運営が楽しく、上達も早くなりますよ。

おはようございます。
朝一でﾊﾟｿｺﾝに向かってます^^;
画像がきれいに入って大満足です！（朝から気分が良い～）

いたおさん、あなろぐさん･･･本当にお世話になりましたm(__)m
･･･と言っても、まだまだ未熟者なのでしつこいぐらいに質問してしまうと思いますが、あきれずに今後も色々教えて下さいね(^^)v

質問があります。

1つ目はカーソルです。
一応変更するタグを入れてみて、うまくできたのですが、
リンクに触れるとカーソルが普通の手に変わってしまいます。
変更する方法はありますか？

2つ目は記事を枠で囲む方法です。

回答よろしくお願いします。

もう1つ質問を書くのを忘れていました＾＾；

ブログ名を位置です。
いくらいじっても文字が中央から上にいきません。
もし、動かす方法があれば教えていただきたいです。

それと、先ほど誤ってFC2以外のブログのアドレスを入れてしまいました（汗
今度はきちんとFC2のアドレスですので～。。。

こんばんわ。

すごい良いブログですね＾＾
カスタマイズの説明がすごい丁寧で、
好感が持てますよ♪

自分は現在、違うテンプレートを使っていますが、＾＾；
いたおさんのテンプレートを使いたくなってきました！

そのうち、お世話になるかもしれませんが、
その時は、どうぞよろしくお願いします＾＾

ご無沙汰しております。shigsです。こちらのサイトからアイスマンさんが訪問して下さいました。また、もう一つブログを持っているのですが、またもやこちらからテンプレートを頂きました。月のバックにオオカミがいる例のやつです。モノトーンのスタンダード同様に見やすく、アレンジしやすく、使いやすい。最高ですね！

それでは。

こんばんは、mamamiさん。
画像が気に入るところに収まったようですね。喜んで貰えて嬉しいです。
また何かあれば何でも聞いてくださいね。

こんばんは、Amethystさん。
リンクカーソルの問題は解決されたようですね。回答が遅くなって申し訳ありません。

記事に枠を付ける方法を記事に掲載しました。こちらを参照してください。
http://10plate.blog44.fc2.com/blog-entry-53.html

ブログタイトルを上に表示させる方法はこちらのコメントを参照してください。
http://10plate.blog44.fc2.com/blog-entry-28.html#comment305

上記を参照しても解からないことがあればまた聞いてくださいね。

こんばんは、アイスマンさん。
私のテンプレートはカスタマイズ性を重視しています。もし少しでもカスタマイズに興味があるなら是非一度私のテンプレートのソースを覗いてみてください。簡単にカスタマイズ出来ると思いますよ。

こんばんは、shigsさん。
いつも私のテンプレートを使って頂いて有難う御座います。私のブログを通してアイスマンさんが訪れてくれたなんて嬉しいですね＾＾これからも多くの人が集まり交流を持てるブログを目指して頑張ります。

はじめまして。シンプルなテンプレートで気に入っています。どうもありがとう。カテゴリー3に連続写真をいれてみたいと思っていますが、まだ気に入った写真がないので入れていません。今後もちょこっとずつ変更するかもしれません。わからないことがあったときは質問させてくださいお願いします。

こんばんは、haruhanakoさん。
可愛くカスタマイズしてくれて有り難うございます＾＾
画像を使いたいのであればアクセスする度に画像を変える方法等、いろんなカスタマイズがここに載っているので参考にしてくださいね。
わからないことがあれば何でも聞いてください＾＾

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

質問なのですが、背景画像を挿入したところ
テンプレート全体が左に寄ってしまうのですが
なぜなのでしょうか？

カスタマイズの過程で消してしまったものがあるようですね。

スタイルシートのクラス
body
に
text-align: center;
の行を追加してください。

body {
～
text-align: center;
}

ありがとうございました！！
出来ました！！
きちっとCSSを理解していないせいで、多々行き詰る事があり
それでも、何か自分で変えてみたくなって
色々いじっているうちにメチャクチャに崩れてしまう・・・
そんな繰り返しばかりです。
今回は、どうにもならなくて質問させて頂き、とても勉強に
なりました。
本当に、ありがとうございました。

いたおさん、お久しぶりです。
いたおさんのカスタマイズ方法は、PCのメモ帳にコピーしていました。
先月PCが壊れ、消えてしまいました
またこちらにお邪魔して、これからもお世話になります

背景全体に画像を固定する方法が、どこに記載されているのか？見つけられません。
こちら（FC2）では、ここを参考に使用したいと思います。
いたおさんの所である程度解る様になり、応用しながらアメブロの背景に挑戦しアバウトですが何とか出来ました。
いたおさんのテンプレート工房を知らずにいたら、カスタマイズしたくても出来なかったと思います。
ありがとうございます。これからもよろしくお願い致します。

全面に背景画像を入れたくて、まだプラグイン等の手直しは要りますが何とか出来ました。
失敗し複製も×再起不能・・・再DLさせて頂きました。
いたおさんのテンプレート最高

こんにちは。きらりです♪

以前も質問させていただき
とても丁寧に教えていただきました。
ありがとうございました。

今回、背景に画像を入れようとしたところ
両サイドにしか画像がはいらないんです、、、
いたおさんがかかれているように、
やっているつもりなんですが、
どうも違う様で、、、

お忙しいと、思いますが
お時間のあるときでいいので、
ご指導いただけましたらうれしいです。
よろしくお願いします。

> 楽夢さん
左寄せが直ったようですね＾＾カスタマイズの過程でおかしくなってしまうことは珍しくありません。こまめに複製しておくとよいですよ。

> らぶりぃママさん
カスタマイズはときに根気も必要ですが、自分の思い通りのものを作れる喜びもまた格別です。どんどんカスタマイズを楽しんでくださいね。

> きらりさん、かどりんさん
いつも有り難うございます、かどりんさんm(__)m
きらりさん、かどりんさんの説明通りにカスタマイズしてみてください。きっと思い通りのかたちになると思います。

こんにちは。きらりです。

いつも、ていねいなお返事ありがとうございます。
今回もご迷惑をお掛けしております。

無事、背景カスタマイズできました♪

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

かどりん様、助けてくださってありがとうございました。

自力で解決できるぐらいになれるよう勉強も
がんばりたいと思います。

思い通りになってよかったですね＾＾
かどりんさん、有り難うございました。

今日登録したばかりの初心者です。
はじめまして！よろしくお願いします。

skullpunkのテンプレートを選びましたが
背景に画像を使いたくて参考させていただきました。
しかし

/* 画面全体 */
body {
～

がスタイルシートを探しても見つかりません（T_T)
backgroundってあるとこを　片っ端から試しても最悪になるだけです。

お忙しいと思いますが解決方法教えていただけませんか？

ここです↓


/* default

～

body {
color : #000000;
background : url(http://blog70.fc2.com/template/skullpunk/image/skullpunk_bg.gif) repeat left top;
padding-top: 15px;
padding-bottom: 15px;

～

}

太字の部分が背景URLです。

頑張っていじってみます！！
ついでに　ブログもお邪魔させて頂きます！！

> ゆうちんさん、ちゃんさん

いつも有り難うございます、ちゃんさん＾＾
ゆうちんさん、ちゃんさんが教えてくれたところを修正すると思い通りの画像を背景にできますよ。

画嬢があるURL
ってどうゆうことですか？

自分のブログの管理画面の「ファイルアップロード」を使用し、パソコン内に保存してある画像にURLを付けたものです。

ブログのカスタマイズ初心者です。
今回、standard_pinkをDLさせて頂いたのですが
背景左右のピンクの部分に画像を入れたく上に書かれている
『背景に画像を繰り返し表示する方法』を読み
スタイルシートの１番最初に書かれている部分に
画像のurlを入力したんですけど、反映されません。

/* 画面全体 */
body {
～
background-image: url(http://～);
}
教えて下さい。よろしくお願いします。

先ほど、背景がうまく表示されなくて質問したのですが
色々やってみた所、うまくいきました。
また色々質問すると思いますが、その時はよろしくお願いします。

原因が全く分からないのでお聞きしたいのですが、
サイドにあるボックスがすべて左に偏って
しまいました（TT）
プロフィールからしたを右サイドに移したいんですけど
何か方法はありませんでしょうか？

背景に壁紙を設定したところ、記事部分も壁紙と同じになってしまいました。

CSSを確認しましたが何処が悪いのかわかりません、
まだカスタマイズの途中です、どこが悪いのか教えてください、よろしくお願いいたします。

/************************************************* ▼ 記事 ▼ */
.ently_outline {

div.entry-body {
color : #6666CC; /* 記事本文に設定 */
}


background-color:#ffffff; /* 背景色 */
margin-bottom:20px; /* 次の記事までの間隔 */
}
.ently_title {
font-size11pt; /* 文字サイズ(記事タイトル)*/
background-color:#FF99CC; /* 背景色 (記事タイトル)*/
border:#666666 1px solid; /* 枠 (記事タイトル)*/
text-align:left; /* 左寄せ (記事タイトル)*/
padding:5px 20px;
margin:0;
}
/* ▽文字色とリンクの下線有無▽ */
h2 a:link { color:#6666CC; text-decoration:none; } /* 通常 */
h2 a:active { color:#666CC; text-decoration:none; } /*実行中*/
h2 a:visited { color:#666CC; text-decoration:none; } /*訪問済*/
h2 a:hover { color:#666CC; text-decoration:none; } /*マウス*/
/* △文字色とリンクの下線無△ */
.ently_body {
font-size:10pt; /* 文字サイズ(記事本文) */
font-color:#6666CC; /* 文字色 (記事本文) */
border-top: #e0e0e0 1px solid; /* 枠(上) (記事本文) */
border-left: #666666 1px solid; /* 枠(左) (記事本文) */
border-right: #666666 1px solid; /* 枠(右) (記事本文) */
border-bottom:#666666 1px solid; /* 枠(下) (記事本文) */
}
.ently_text {
text-align:left; /* 左寄せ (記事本文) */
margin:10px 20px;
}
.ently_navi {
text-align:right; /* 右寄せ(時刻・CM・TB) */
color:#666CC5; /* 文字色(時刻・CM・TB) */
margin:0px 10px 3px;
}
/************************************************* ▲ 記

色々やっていたのですがもしかすると
最初の部分で何かのタグを消してしまったと思います。

ここからです------------------

body {

background-image: url(http://blog40.fc2.com/s/supika8181/file/khfi.gif);
text-align:center;
line-height:1.3;
margin:0;
padding:0;
background-color ; ; /* 外側背景色 */
}
#outline {
background- image: url( ); /* サイト背景色 */
}


--------------------------

テンプレをお借りして背景画像を変えたのですが
周りの部分まで適用されてないみたいなんです。
ＨＰ見ていただけると分かるのですが
最大化した場合、余白が回りに出来てしまいます。
ここの背景はまた別のカスタマイズが必要でしょうか？
また、周りの部分のみ背景をかえることも
可能なんでしょうか？

初心者ですがよろしくおねがいします。

背景画像の件、コメントありがとうございました♪
おかげさまで、設定する事ができました★
新たな壁にぶち当たってしまったんですが｡･ﾟ･(*ﾉД`*)･ﾟ･。
これからも頑張ります＞＜ｂ
ありがとうございました＾＾ノ

ﾃﾝﾌﾟﾚｰﾄ[lightframe_white]をお借りして
ｶｽﾀﾏｲｽﾞ勉強中です。
いろいろと参考にさせていただいてるので、
ﾘﾝｸ貼らせていただきました。
これからもお世話になりますっ！！

初めまして。
最近良く拝見させて頂いております。
さて、現在デザイン考案中です。

（質問１）
画面よりも小さなフラッシュ埋め込みの絵を作り、その絵を中心に配置させたいと思っています。

（質問２）
その絵の上の一部分に（重なるように）、ブログを日毎にスクロールで見られるように配置したいのですが、どのように設定していいのかがわかりません。言い換えると、画面よりも一回り小さいフラッシュ画像を中心に配置。その画像よりも小さい小窓表示にしたスクロール可能な日記の小窓を配置したいと思っています。

（質問３）
日にちは、同画像上の上部に横一列に配置する予定のカレンダーと連動させ、日にちをクリックすると、その日の日記を画像中心に配置させて読める・・・といったふうにしたいのですが、そもそもできるものなのかも不明で・・・。

（質問４）
同画像直ぐ下には、フォントのシンプルなボタンを配置し、日記同様に小窓でプロフィール、ツリー状のカテゴリ、最新コメント、最新トラバなどを配置したいと考えています。

（質問５）
日記その他の小窓については、下部などに閉じるボタンなどを配置して閉じられるようにし、画像も貼れるようにしたいと考えています。

あれこれと想像ばかりが頭の中で膨らんでいます。。。
何か良い案があれば教えて下さい。

すみません。今の私にはこれを実現する方法が解りません。
お役に立てず申しわけありません。
m(__)m

いたおさん始めまして　パイプラインです。

テンプレートお借りしています・

背景画像を使ったら、ＩＥではいいのですがファイアフォックスでは左に寄ります。

原因が分かりません。アドバイスお願いできますか？

背景画像が左に寄っているのではなく、サイトの幅が画像より広がったので繰り返し表示されているのです。

standardシリーズは記事に幅をとるものがあると、それにあわせて広がります。

各記事ページでサイト幅を確認してください。パイプラインさんの記事を見ると、「お勧め商材」と「当サイトについて」が特に広がって見えます。

その記事にタグの間違いが無いか確認してください。

とつぜんのコメント失礼いたします。
今更ながらこれからブログを作ろうと考えているものです。
FC2でそちらのテンプレートを利用する方法を教えて頂けないでしょうか？まったくの初心者なのでどうかご教示よろしくおねがいいたします！

何度も失礼します。　質問の内容を訂正させてください。
そちらのカスタマイズのテンプレートはどこからDLしたらいいでしょう？？？ここのサイト内のどこかに入り口があるのでしょうか？？？　申し訳ありません。どうかよろしくお願い致します。

まずFC2に登録してください。入り口は当サイトトップページの真ん中上部にあります。

登録後、ブログ管理画面から「テンプレートの設定」→「共有テンプレート追加」と進むと検索できる画面になります。

作者を「10plate」で検索すると私のテンプレートが表示されます。

自分が情報を発信できるということは素晴らしいことだと思います。是非ブログに挑戦してみてください。

いたおさま

早速のお返事ありがとうございます！　その検索のキーワードが知りたかったのです^^これからたびたびお世話になることと思います、知らないことばかりで質問の連発になってしまうかもしれないがこれからどうかご指導の方よろしくお願い致します。すばらしいブログにブログに辿りつけてうれしく思います。

いたお様ご回答ありがとうございました！

質問不足でスミマセン・・・
ヘッダー画像の繰り返しは記事の幅で解決しました。

背景画像の質問でした・・・
背景画像を指定したら、テンプレートボディ自体が画面左により
センター表示されません・・・

↓こんな指定です


背景画像

/* 画面全体 */
body {

background-image: url(http://blog-imgs-30.fc2.com/k/i/g/kigyou26/image01236.jpg);
}

画像は200×200です。
画像が問題なのでしょうか？
それともソースの問題でしょうか？

申し訳ありませんが、原因が分かりませんでした。
ご回答お願い致します。

ファイアフォックスだと
テンプレートボディ自体がセンターではなく
左はじによります。

ＩＥではＯＫでした。

デフォルトのＣＳＳに戻すと直ります。

ファイアフォックスのバージョンは3,08
です。

お手上げ状態です・・・・スミマセンが
ご回答お願い致します。

パイプライン

スタイルシートのbodyの中に

text-align: center;

という行があったはずです。
これは消さないでください。

いたおさん、わざわざスミマセン・・・
タグはけしていません。

背景画像の指定をしたのみです↓



/* 画面全体 */
body {

background-image: url(http://blog-imgs-30.fc2.com/k/i/g/kigyou26/image01236.jpg);
}



/* ----------------------------------------------------- */
　　background-color: #eeeeee; /* 画面背景の色 */
/* ----------------------------------------------------- */
margin: 0;
text-align: center;
}



＝＝＝＝＝＝＝＝＝ここまで↑

おとなしくデフォルトに戻した方がいいのでしょうか？
ブラウザの違いで表示が違くなってしまうので困っています。

他に考えられる原因はありますでしょうか？
お忙しいのにスミマセン・・・
お時間あきましたらご回答お願い致します。

余計な}があります。
これを消してください。


/* 画面全体 */
body {

background-image: url(http://blog-imgs-30.fc2.com/k/i/g/kigyou26/image01236.jpg);
}


/* ----------------------------------------------------- */
　　background-color: #eeeeee; /* 画面背景の色 */
/* ----------------------------------------------------- */
margin: 0;
text-align: center;
}

いたお様　私の初歩的ミスだったみたいですね！

助かりました！

丁寧に教えて頂き感謝です！！
またよろしくお願い致します。

「タイトルを画像に置き換える」っていう時、
画像タグが必要ですよね！
そのタグがわからないんです。

お願いします。ぜひ教えて下さい。

タイトルを画像に置き換えたいのであれば、こちらの記事を参考にしてください。

タイトルを画像にする
http://10plate.blog44.fc2.com/blog-entry-54.html

画像タグは別に必要ではありませんが、画像を用意したURLは必要です。

背景を画像にすると、画面のサイズがあっていないのですがどうにかなりませんか?
あと、scrollにしたのですが、適応されていない気がします。scrollを設定するとどのようになるのでしょうか?希望としては、見ているとき常に背景の画像が真ん中に来て、且つサイズもフチぎりぎりまで自動でリサイズしてくれるというものです。
質問ばかりですいません。

背景を半透明にする記事はもう少しお待ちください。

scrollにしたとはbackground-attachmentですか？それならスクロールバーにあわせて画像がスクロールします。fixedにすると固定されます。

背景画像をブラウザの大きさに合わせて表示する方法も近日中に記事にするのでお待ちください。

ありがとうございます。楽しみに待ってます。
がんばってください

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

全体を半透明にして背景画像を表示する
http://10plate.blog44.fc2.com/blog-entry-206.html

ただしこの方法は記事の文字も半透明にしてしまうため、透明度をあげると見づらくなってしまいます。

文字をそのままで記事の背景のみを半透明にする方法も無いことはないのですが、透過pngを用意する必要があるので少し難しいです。この方法も後日記事にするつもりです。

背景画像をブラウザの大きさに合わせて表示する方法を探したらこちらにありました。

背景画像をリサイズさせる方法｜web bibo
http://www.webbibo.com/stylesheet/image/bg_dimension.html

試してみたのですが、縦に長いブログにこの方法は現実的ではありませんでした。画像を繰り返し表示するわけではないので、ページ下方は背景画像が無くなることになります。

背景をリサイズし、なおかつ固定（スクロールさせない）方法が見つけられませんでした。すみません。

こんにちは。
全くの初心者で、知識も全然ないので、とても初歩的な質問になってしまうのですが。。。

背景に画像を使いたく、ここのサイトに書いてあるようにやってみたのですが、うまくいきません。
テンプレートはstandard_orengeを使わせていただきました。
何か原因に思い当たることがもしありましたら、教えてください。お願いします！！

現状を確認するためにURLを教えてください。

お願いいたします！！

今、できました。
ありがとうございました！！

色々カスタマイズしていきたいと思います。
また質問するかもしれませんが、その時は宜しくお願いいたします♪

問題なく背景に画像が表示されていますね。
解決して良かったです。

プロフィールに画像を入れたいのですが、
どのようにすればいいのでしょうか？？？

写真をいれて、その下に紹介文を入れる感じにしたいです。
可能ですか？
もし可能でしたら、教えてください！！

画像が入れれたのですが、、、
何故かプロフィールが二つになってしまいます。
解決法を教えてください！！
何回もすみません。

これは環境設定画面の「プロフィールの編集」から設定した画像なのでしょうか？

プラグインの設定のhtml編集で、画像を入れました。
問題はいちおう解決しました。

てさぐりですが、頑張っていきます！

なるほど、「プロフィールの編集」ではなく、プラグインのHTMLから画像を入れたのですね。たしかにそれだと複数の画像を表示することができますね。

プラグインのメニュー部分を画像にすることはできるでしょうか？？
自分で作成したバナーなどを・・・。

プラグインの背景を画像にする方法でよろしいでしょうか。
standardシリーズのこの方法はまだ書いていなかったので、後日掲載しますね。

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

プラグインの背景を画像にする（standard）
http://10plate.blog44.fc2.com/blog-entry-218.html

外側とサイト内の背景を繰り返し表示する（両方同じ画像）ために、
[3141]かどりんさんの

＞body {
＞text-align:center;
＞line-height:1.3;
＞margin:0;
＞padding:0;
＞background-color:#ffffff; /* 外側背景色 */
＞background-image: url(http://～);
＞}
＞#outline {
＞background-color:#ffffff; /* サイト背景色 */
＞background-image: url(http://blog-imgs-12.fc2.com/y/u/m/yume89/4.gif);
＞}

を参考にcssを変更したところ、外側とサイト内の画像にずれが生じました。
他の方のコメントを引用しての質問で申し訳ないのですがご教授願います。

内側の背景設定を削除すれば、外側の背景画像が見れるようになります。今見たところ既に解決されたようですね。

背景に固定した画像を内側にも表示する
http://10plate.blog44.fc2.com/blog-entry-196.html

説明不足申し訳ありません。
プラグインのカテゴリの左下あたりの斜めの模様がちょっとずれてます。。
全体を指定して一括で背景を設定する、等の方法はありませんか？
即レスすみません。

よく見るとズレていますね。見逃してしまい申しわけありません。

一括で指定する方法はありませんが、２行削除するだけで解決しますよ。

#outline {
background-color:#ffffff; /* サイト背景色 */
background-image: url(http:～);
}

赤い２行を削除すれば、お望みの表示になると思います。

できましたっ！
丁寧な回答ありがとうございました。

解決して良かったです。綺麗に表示されていますね。

http://blog-imgs-40.fc2.com/m/p/o/mpokaizou/bg.gif

を表示したいのですが、一向に表示されません

現在はこのようになっています
body {
text-align:center;
line-height:1.3;
margin:0;
padding:0;
background-color:#ffffff; /* 外側背景色 */
}
#outline {
background-color:#ffffff; /* サイト背景色 */
}

何を消せばいいのでしょうか？

消すのでは無く赤字部分を加えます。

body {
text-align:center;
line-height:1.3;
margin:0;
padding:0;
background-color:#ffffff; /* 外側背景色 */
background-image: url(http://blog-imgs-40.fc2.com/m/p/o/mpokaizou/bg.gif ); /* 背景画像URL */
}
#outline {
background-color:#ffffff; /* サイト背景色 */
}

ちゃんさん、ありがとうございます＾＾

みやきんさん、ちゃんさんが教えてくれた部分を加えると背景画像が表示されますよ。

あれ？できませんm(_ _)m
画像がいけないのでしょうか？

あれ？僕にはそうは映っていません
パソコンの問題ですかね？

かどりんさん、キャプチャまでしてくれてありがとうございます＾＾

みやきんさん、白いほうの背景画像が表示されているので大丈夫ですよ。

ご丁寧にありがとうございます

自分が見てもなっていないのは、パソコンの性能の問題でしょうか？

OSとブラウザは何でしょうか？
最新情報に更新(Windowsなら[F5])を押しても反映されないなら、ブラウザのキャッシュを消してみてください。

Windows XP
です

全て試したのですが、できませんでした...

わざわざありがとうございます
100％って書いてありました^^；

では記事とプラグインの間などに入れるにはどうしたらいいのでしょう？

沢山フォローしてくれてありがとうございます、かどりんさん。
なるほど、見てるところが違ってたんですね＾＾；

みやきんさん、内側の背景にも表示させたい場合はスタイルシートの次の一行を消してください。

#outline {
background-color:#ffffff; /* サイト背景色 */
}

いたおさん
ありがとうございます
これがやりたかったんです^^；

かどりんさん、いたおさん
お世話になりました
あいがとうございましたm(_ _)m

お望みのかたちになりましたね＾＾

毎度ありがとうございます^^

最近こちらのテンプレを使わせてもらっています
　
シンプルでとても使いやすく、また自分でいろいろいじれるのがとても魅力的です
　
　
1つ、質問なのですが
プラグインの背景に透過設定を行いたいのですが中々上手くいきません
　
どうかアドバイスお願いします

今見たところ透過されているようですが、解決されたのでしょうか。

ちなみに完全透過ではなく半透明の状態にさせたいなら、こちらの記事が参考になると思います。

全体を半透明にして背景画像を表示する
http://10plate.blog44.fc2.com/blog-entry-206.html

ただし背景だけでなく、文字も透けてしまいます。

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

言葉足らずで申し訳ないです

完全透過でなく半透明です

早速やってみました


ただ、できれば記事本文は透過させたくないのですがどうすればいいでしょうか？

文字を透過させずに背景だけ透過する方法はありますが少し厄介で、半透明な画像(透過png)を用意してもらう必要があります。それでもよければ記事を書きましょうか？

ええと、文字じゃなくて記事の背景です
　
プラグインの背景には半透過設定を指定して
　
記事の方はそれの対象外にしたいんです

なんか上手く伝えられなくて申し訳ないです

以前のコメントで既にそのように認識してますよ＾＾

では記事にしますね。少し時間がかかるかも知れませんので気を長くしておまちください。

はじめまして。
あの、背景画像ｈｔｍｌ変更しても反映しません。↓を見てくださいｗ

/* body */
body{
font-family: "FF2DFF3320FF3030B430B730C330AF","30D230E930AE30CE20Pro20W3",Osaka,sans-serif;
font-size: 12px; color: #333333;
line-height: 130%; text-align: center;
margin: 0px auto; padding: 10px;

}
/* 画面全体 */
body {
～
background-image: url(http://blog-imgs-33.fc2.com/m/p/o/mpoplus500999/20090726191010.png);
}

↑どこか間違っているところありますでしょうか。
教えてください、おねがいします




あと、
ブログランキング登録しないのですか？？
登録すれば一気にランキング5位以内には入ると思われますがｗ
僕なんかが口出ししてすいません＾＾；

FC2ブログのテンプレート工房様配布のテンプレートをお使いではありませんので、下記に書いたスタイルシートが違うと思いますが、同じ仕様の「standard_wide_white
」で説明させて頂きますね。

リキッドレイアウトと言ってブラウザいっぱいに表示されるテンプレートの場合は背景画像を指定しても見えません。
なので、


/* 画面全体 */
body {
/* --- */
background-color: #ffffff; /* 画面背景の色 */
background-image: url(http://blog-imgs-33.fc2.com/m/p/o/mpoplus500999/20090726191010.png);
/* --- */
margin: 0;
text-align: center;
}

/* サイト全体 */
.base_table {
/* --- */
width: 80%; /* サイトの幅 */
/* --- */
background-color: #ffffff; /* 外枠の色 */
/* --- */

～

}


とすれば、両サイドに背景画像が出て来ます。

> プラトンさん
ちゃんさんがおっしゃる様に、コンテンツがブラウザ幅一杯に合わせて伸縮するリキッドレイアウトでは、手前の要素に覆い隠されて最奥であるbodyを見ることができません。作者様にbody手前の要素を教えてもらい、それに背景設定するといいかも知れませんよ。
ランキングは一応トップページ上部に貼ってますが目立たないですね＾＾；

> ちゃんさん
いつもありがとうございます m(__)m

こんにちは。
背景画像を片側だけに表示するとか、
同じ画像を敷き詰めるのならできるのですが
左右両側で違う物にしたいと思うと上手くできず困っています＾＾；

body {
background-image: url("右画像");
background-repeat : no-repeat;
background-position : right top;
background-attachment: fixed;　
　
background-image: url("左画像");
background-repeat : no-repeat;
background-position : left top;
background-attachment: fixed;
}

これでは出来ませんよね？＾＾；；；

片方を　#outline 　に持って行くと２枚とも表示はされるのですが
background-attachment: fixed;
が効かず、一緒にスクロールしてしまう状況です。

#outline {
background-image: url("左画像");
background-repeat : no-repeat;
background-position : left top;
background-attachment: fixed;　←これが効かない・・。
}

希望は、センターの記事部分を挟んで、左右違う画像。です。
おかしなお願いをして申し訳ありませんが
左右別々に表示させる方法があれば教えてください。
よろしくお願いします。
テンプレのベースは　lightframe　です。

IE6以前のブラウザだと、body以外に背景画像を固定できないバグがあるので難しいです。

sionさんはIE6をお使いですか？

はい。IE6です＾＾；

それから、この”ブラウザ”やPCの差の件で、
もう１つお聞きしたいのですが。

最近の横幅の広いワイド？のＰＣで見た場合
左右に画像を分けるというのは問題アリでしょうか？
例えば、左右の端が切れて見えるとか・・
記事とサイドバーの間が妙に開いてしまうとか・・＾＾；

私のPCは古いタイプなので(笑)実際に見て確認することが出来なくて・・＾＾；

ちなみに
/ ▼ サイトの幅 ▼/
#outline {
width:98%;
margin:0 auto;
}
で設定しています。

現ブログはその設定ではないようですね。
もう１つ製作中ということでしょうか。

幅を%にしているということは、ブラウザに合わせて伸縮するリキッドレイアウトにするのですね。

IE6はbody以外背景画像を固定することはできませんが、高解像度のモニタで左右に違う画像をしても問題ないと思います。

記事とサイドバーの幅が固定値だと離れすぎる現象が起こりえます。どちらかを%幅にするといいです。

↓出来ませんorz

/* 画面全体 */
body {
/* ----------------------------------------------------- */
background-color: #eeeeee; /* 画面背景の色 */
/* ----------------------------------------------------- */
margin: 0;
text-align: center;
}

background-image: url("http://blog-imgs-33.fc2.com/m/p/o/mpoplus500999/20090828163645616.png");
}

/* サイト全体 */
.base_table {
～

文法違反があります。}を削除してください。

body {
～
}
background-image: url("～");
}

わかりました。やってみます。
ありがとうございました＾＾

あと、ランクリしてます最近ｗ

背景画像が表示されましたね。
ランキング応援ありがとうございます＾＾

背景画像というか記事の背景についてなのですが、
記事の背景の色を変えるにはどうすればいいのでしょうか？

テンプレートによります。お使いのテンプレートは何ですか？

standard_monotoneaなのですが背景を黒にすると記事の背景も黒くなります
申し訳ありませんが解決法を教えてもらえますと幸いです

スタイルシートの末尾に加えてください。

.article {
background-color:#cccccc;
}

画像が小さいせいか、繰り返し同じ画像になってしまいます。
１つの画像を全体表示にする方法が良くわからないので教えてください。


/* 画面全体 */

body {
background-image: url(""http://blog-imgs-34.fc2.com/v/i/p/vipsister/kore_top.gif); /* 背景画像 */
background-attachment: fixed; /* 固定表示 */
background-repeat: no-repeat; /* 繰り返し表示の有無 */
background-position: right bottom; /* 表示位置 */



/* ----------------------------------------------------- */
background-color: #eeeeee; /* 画面背景の色 */
/* ----------------------------------------------------- */
margin: 0;
text-align: center;
}

背景画像は画像サイズの倍率を変えて表示したり、伸縮させることができません。予め表示したいサイズの画像を用意してください。

そうなんですか＾＾；
わかりました！ありがとうございました。

ご期待に添えず申しわけありません m(__)m

ここで良いのか分かりませんがひとつ質問です。
プラグイン背景の色を指定することはできますか？
ボディの色を指定するとプラグインの背景の色もその指定した色になりますよね？
ボディの色とプラグインの背景色の差別化をしたいのですが解決策はありますでしょうか

可能です。設定方法はテンプレートにより異なるので、お使いのテンプレートの制作者に問い合わせてください。

こちらのstandard_monotoneを使用させてもらっているのですが、どうすれば良いのでしょうか？

HTMLの以下の箇所に赤い部分を加えてください。

<!--▼▼▼ 左側ブロック ▼▼▼-->
<td class="left_outline" valign="top" style="background-color:#cccccc">

～

<!--▼▼▼ 右側ブロック ▼▼▼-->
<td class="right_outline" valign="top" style="background-color:#cccccc">

初めまして。
テンプレート　standard_wide_white　を利用させて頂いております。
背景画像を繰り返し表示したいのですが、記事やプラグインの部分などは画像を表示しないようにしたいと考えています。
色々試してみたのですが、うまく表示されません。
この記事で紹介されている方法を使ってみたのですが、読み込み中に画面が背景画像になって、その後背景には何も表示されない、というのが現状です。

CSSはこのようになっています（一度触ってみましたが元に戻しました）。どこに何を追加すればいいのか教えていただけませんか？

/* 画面全体 */
body {
/* ----------------------------------------------------- */
background-color: #ffffff; /* 画面背景の色 */
/* ----------------------------------------------------- */
margin: 0;
text-align: center;
}

/* サイト全体 */

.base_table {
/* ----------------------------------------------------- */
width: 100%; /* サイトの幅 */
/* ----------------------------------------------------- */
background-color: #ffffff; /* 外枠の色 */
/* ----------------------------------------------------- */
text-align: left;
margin-top: 0;
margin-bottom: 0;
margin-left: auto;
margin-right: auto;
}

使用したい画像のURLは　http://blog-imgs-27.fc2.com/s/h/o/shota356/RF15_07.gif　です。

スタイルシートの末尾にこれらを加えてみてください。

.base_table {
background-image: url("http://blog-imgs-27.fc2.com/s/h/o/shota356/RF15_07.gif");
}

.article {
background-color: #ffffff;
}

.menu_cont {
background-color: #ffffff;
}

上記の文をスタイルシートの最後に加えてみましたが、思うようにはいきませんでした。
もうすこし自分で勉強してみたいと思います。
ありがとうございました。

URLを教えてくれれば何か原因が解るかもしれませんが、ご期待に添えず申しわけありません。

こんにちは＾＾
いつもお世話になっております
背景画像なのですが左右両方に別々のが尾図を張り付けることは可能でしょうか？

すみませんが尾図→画像です＾＾；

なんとか解決できました＾＾どもでしたｗ

自己解決できたようで良かったです＾＾

lightframe_skyblueなのですが

/* 画面全体 */
body {
～
background-image: url("http://～");
}

の場所が分からないので教えてください

Ctrl+Fで検索もできますが、見つけることができなければスタイルシートの末尾に追加しても構いません。

表示されないです、、

http://nkualog.blog96.fc2.com/

スタイルシートをみてもこのカスタマイズの形跡が見られませんでした。編集したテンプレートと表示しているテンプレートは同じものか今一度確認してください。

できました～ありがとうございます

あと、他人ブログのスタイルシートとかって見れるんですか？

サイト上で右クリック→ソースの表示
表示されたHTMLの
<link rel="stylesheet" type="text/css" href="http://～/style.css" media="screen,tv" title="default" />
赤字の部分をコピーしてブラウザのアドレスバーに貼りつけ→Enterで閲覧出来ます。

他にもW3C CSS 検証サービス
http://jigsaw.w3.org/css-validator/validator.html#validate-by-uri
を利用する方法があります。
こちらはサイトURLをそのまま入力すれば良いです。

---

余談ですが、カスタマイズを行う際、「人のスタイルシートやHTMLを覗いて丸写し」は好まれません(むしろ嫌がられます)のであくまでも参考にする程度が良いです＾＾

> 6917の名無しさん
ちゃんさんが教えてくれたように、他の方のスタイルシートを見ることは出来ます。丸写しはいけませんが、参考にする分にはとても役立ちますよ。

> ちゃんさん
ありがとうございます＾＾

あのー。

背景の変え方は分かったのですが…。

記事の背景を透明にする事は可能ですか？

可能でしたら教えてもらえないでしょうか？

お手数お掛けして申し訳ありません。

（背景が見えないんですよ、記事の背景が白いんで。

出来ました＞＜

多分・・・


なのでありがとうございますた＞＜

またご迷惑お掛けするかもしれませんが・・・

よろしくです＞＜

頼りにしてます＞＜

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

縦にのみ繰り返しさせるには
background-repeat: no-repeat; /* 繰り返し表示の有無 */
をどう書き換えればいいですか？

background-repeat: repeat-y; /* 繰り返し表示の有無 */


一応全部書いておきますね＾＾

repeat 敷き詰め
repeat-y 縦方向に繰り返し表示
repeat-x 横方向に繰り返し表示
no-repeat 繰り返し無し

ありがとうございます！

> 77氏さん
ちゃんさんのおかげで解決しましたね＾＾

> ちゃんさん
いつもありがとうございます＾＾

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

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

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

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

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

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

題名:

名前:

URL:

COMMENT:

現在休止中で管理人はコメントに答えることが出来ないことをご了承くださいm(__)m

PASS: SECRET:管理者にだけ表示