2009 12
06
Sun.
共有テンプレート・fb02_2c

---確認環境---
WindowsVista
IE8.0・Firefox3.5
要望を頂いてたfb02の2カラム版。
記事幅が広めなので写真等の掲載も可能。
始めて質問するときは最初にこちらを読んで下さい。
利用規約はこちらです。
------------------------------
10/04/07
html及びCSSの見直しと修正に伴い一部仕様を変更しました。
- パソコン用テンプレートの関連記事
-
- 共有テンプレート・browncolor03_2c (2010/02/02)
- 共有テンプレート・fb02_2c « «
- 共有テンプレート・underground01_2c (2009/11/07)
コメント
はじめまして。記事幅が広く、大きな写真が載せられるので気に入っています。
記事全体を広く見せたいので、以下のように変更したいのですがどうしたらいいですか?また変更不可のカスタマイズだった場合は、その旨教えてください。
①背景の藤色?を白くしたい
②記事の枠線を取りたい
③左コラムの幅を狭めたい
④トップ記事の「New!!」を取りたい
よろしくお願いします。
かなこさんへ
テンプレートをお使い頂きありがとうございます。
A1.~A3.の方法はスタイルシートの編集を、A4.はhtmlを編集します。
ちなみに編集箇所が多いので一応テンプレートを複製した方が良いと思います。
------------------------------
A1.
背景色を仮に白とする場合、body内にあるbackground: #eceadc;を fff とします。
A2.
.entryblock内のborder: 1px solid #c1bfad;を none とします。
このままだと go page top に枠線が残りますので必要なければ.pagetopのborder指定を上記と同じ様にします。
A3.
#left内のwidth: 200px;を変更します。
A4.
htmlの編集から下記部分を探し出し赤字箇所を削除して下さい。
<!--エントリー-->
<!--topentry-->
<div class="entryblock">
<a id="<%topentry_no>" name="<%topentry_no>"></a>
<script type="text/javascript"> nw(<%topentry_year>,<%topentry_month>,<%topentry_day>,<%topentry_hour>) </script>
------------------------------
カスタマイズの際にはセミコロン ; を消さない様に注意して下さいね。
早速の回答、ありがとうございました!しかもすごくわかりやすくて、助かりました。
すみません、さらに質問させてください。
①ブログ枠全体を取ることはできますか?背景の白と記事の背景白の境界線がないようにしたいです
②写真の枠をとりたい
③左サイドの文字を記事よりも小さくしたい
よろしくお願いします。
かなこさんへ
以下のカスタマイズは全てスタイルシートの編集から行います。
------------------------------
A1.
#container内のborderを削除します。
bodyと背景色が同じでよければbackground: #fff;を消してもいいです。
paddingも変更します。
#container {
width: 860px;
margin: 0 auto;
padding: 10px 0;
background: #fff;
border-left: 3px solid #ddd;
border-right: 3px solid #ddd;
}
A2.
.entrytext imgのborderをnoneとします。
backgroundは削除しpaddingを変更します。
.entrytext img {
margin: 3px;
padding: 0;
background: #fff;
border: 1px solid #c1bfad;
}
A3.
.menutext内のfont-size: 95%;を変更して下さい。
可読性を考えると80%か85%が下限だと思います。
------------------------------
たくさんいじっていしまったのに、今回も丁寧に教えてくださって、本当にありがとうございました!ちゃんと全部できました。
シンプルで使いやすいので長く使っていきたいと思います。
本当に、ありがとうございました。
初めまして。シンプルで見やすいテンプレを探していたらfb02_2cを見つけました。お借りして、カスタマイズしようとしているところなのですが、自力ではどうにもこうにもなのでいくつか質問させていただきたく参りました。
1. タイトル部分に横幅三分の一程度の画像を入れてそれを左端に寄せています。右側の空白部分にのみ、文字を入れたいと思っているのですが、可能でしょうか。可能であれば、どのようにしたらいいでしょうか。
2. 上記の空白部分が現在は色の無い状態ですが、この空白部分に好きな色をのせたいのですができるでしょうか。
自力でやろうとしたところ、タイトル部分の色を変えるのはマニュアルを参考にしたのですが、タイトルの上の部分に(ブログタイトルのでる部分)が画像の上にまで変えた色がでる、という状況になりました。その下のブログの説明文が出る部分には色はのりませんでした。
また、ブログタイトルを含めた文章を右側に、画像にかぶらないようにしてのせようとしましたが、タイトルはもともと右端にでるのですが以下の文章はタイトル一面に出るのを変えられず、悩んでいます。
カスタマイズOKということでこのようにいじっているのですが、もしも御不快に思われたら申し訳ありません。
浜谷雅樹さんへ
テンプレートをお使い頂きありがとうございます。
ご質問の件ですがスタイルシートの編集を行います。
------------------------------
A1.
h1のpaddingを変更します。
padding: 10px 10px 10px 400px;
ブログ説明文も同様であればh2を変更して下さい。
A2.
.headerに background-color: カラーコード; を追加して下さい。
------------------------------
初めまして。
れん様のテンプレはシンプルで素敵ながら使いやすくて大変重宝しています。
以前までhalfgray-2lをお借りしていたのですが、
最近になってfb02_2cに変えました。
プラグインでポップアップ形式のものを使用しているのですが、
(link listのところなど)
開こうとすると、ブログの背景に表示されるようになってしまいました。
halfgray-2lの時は普通に前面に表示されていたのですが…。
スタイルシートやhtmlを修正して前面に表示することは可能でしょうか?
ちなみに画像や文字のサイズ・色以外はカスタマイズしていません。
お手隙の際にご回答いただけますと幸いです。
よろしくお願いいたします。
*infini*さんへ
テンプレートをお使い頂きありがとうございます。
link listというのがこちらで試せないのでとりあえずブログ上のhtmlソースだけで判断しました。
動作の保証は出来ませんので予めご理解下さい。
プラグインのフリーエリアにスクリプトのhtmlタグを貼ったと思うのですが、そのstyle属性という箇所に一工夫するだけで出来そうな気がします。
下記のようにstyle属性の一番最後、 " の直前に青字を追加してみて下さい。
複数あっても同様です。1でダメなら2もしくは3を試して下さい。
<div id="~省略~" style="~省略~; z-index: 1;">
もし上記でダメな場合はスクリプト作者に訪ねた方が良いかもしれません。
早々にご回答いただきありがとうございます。
無事に直すことが出来ました。
理想的なテンプレですので、永く使わせていただきたいと思います。
本当にありがとうございました。
ありがとうございました
お礼を申し上げるのが遅くなってしまい、申し訳ありません。教えていただいたとおりにしたら思うとおりになりました。ありがとうございました。また何かの時にはよろしくお願いします。
またお願します。
こんにちは、また質問させていただいてよろしいでしょうか。
前回、タイトル部分に自分の画像をいれ、空白部分に好きな色をのせるにはというのをお聞きしたのですが、
1. タイトル部分を三等分し、1/3サイズの画像を二つ、両脇あるいは右側か左側に寄せてのせたい。
2. タイトル下の説明文が、文章を入力の際に改行をしていてもそれが反映されず、文がひとつながりになる。改行を反映させるにはどうしたらいいか。
3. 現在タイトル下のトップ部分に、
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
というのがでており、一回分の記事が無くて広告だけ載っているスペースが出ています。これを出ないようにすることはできるしょうか。ちなみに一度、新しい記事を書いてアップし、その後削除するということをしたのですが、それでも上記の広告スペースは消えませんでした。「新しい記事」が削除されずに残り続けていないと出てきてしまうのでしょうか。
長々と書いてしまいましたが、お時間のあるときでにもよろしくお願します。
浜谷雅樹さんへ
A1.
画像は1つしか扱えません。
width・heightに合わせた画像を作り変更した方がベターです。
A2.
改行されないのは仕様です。
どうしても改行したいのであればhtmlの編集から
<h2><%introduction></h2>
の<%introduction>を改行コード<br />を含めた文言に置き換えます。
A3.
広告についてはFC2へ直接問い合わせて下さい。
ありがとうございました
うるさいことをあれこれ言ってしまったのに丁寧な返信、ありがとうございました。また、広告についてはすみませんでした。ところで、
>A2. <%introduction>を改行コード<br />を含めた文言に置き換えます。
<br />を含めた文言というのが、すみません、どうもよく分かりません。<br />が改行させるものというのは知っていましたが、どう書いたらいいものでしょうか。またご面倒おかけしますが、お願します。
浜谷雅樹さんへ
文字通りhtmlの該当箇所(93行目付近)に表示させたい文言を直接書く、という事です。
ありがとうございました
教えていただいたとうりにしたら希望どおりになりました、ありがとうございました。
またお願いします
何度もすみません。
トップの記事をいつも同じものにしたいので、http://blogsns.fc2.com/forum_community/topic/12548/25878/特定の記事をいつも最初に表示したい を参考に手を加えようとしています。未来日付は避けたいので、プラグイン3を使ったやり方をと思いました。htmlを見たらプラグイン3が記述されているのでできるかと思ったのですが、無理でしょうか。自分でいじってみるのですが、うまくいきません。
・もしも上記アドレスのやり方が駄目なら、他に方法はありますか?
・トップの記事を常に同じものにと加えて、その他の記事をそれぞれ左側にリンクを作り、そこをクリックしたら記事に飛べるというように出来ないかと考えていますが、この場合にはクリックした記事だけ表示されるようになるでしょうか。こちらはまだ手をつけていないので無駄な心配かもしれないですが・・。
お時間のあるときにでもまたよろしくお願いします。
浜谷雅樹さんへ
プラグイン3を記事の代用にするという事でしょうか?
参考urlの 2' の方法を試して頂ければ良いと思います。
公式マニュアルも参考までに。
http://fc2blogmanual.blog60.fc2.com/blog-entry-57.html
トップページに記事を載せない方法はhtmlの編集で青字を追加して下さい。
------------------------------
<!--not_index_area-->
<!--topentry-->
~省略~
<!--/topentry-->
<!--/not_index_area-->
------------------------------
浜谷雅樹さんへ
>トップの記事はそのままに、それ以下の記事だけに反映させるというのはむりでしょうか。
これの意味がよく分かりません。
通常エントリーの記事ですか?それともプラグイン3代用の記事ですか?
質問を拝見した限りでは特定の記事をトップページに記載し、他の記事はサイドメニューのリンクから飛びたいという事だと判断しました。
そのトップページの特定記事はプラグイン3で代用したいという事ではないのですか?
プラグイン3に記事を書いて<!--not_index_area-->を使って頂ければプラグイン3以外は表示されません。
回答した通りやって頂ければ分かります。
こちらも一つ一つ確認しながら回答してますので間違いなくカスタマイズして頂ければ少なくとも画面真っ白(失敗)という事にはなりません。
それとも特定記事(プラグイン3)の下は普通に記事を表示させたいという事ですか?
それなら<!--not_index_area-->は必要ありません。
丁寧な回答、本当にありがとうございます。
書き込んだ時点で、自分で分かっているつもりでよく分かっていなかったといいますか、無意味かつ不要なことを書いてしまいました。なので問題ありません。教えた頂いたとおりにしてみたら、全部希望どうりになりました。ありがとうございました。ところで、まだあるのかと言われそうですが、もうひとついいでしょうか?
左側に「メニュー」として、トップ以下の普段は隠れている記事に飛べるリンクを貼ろうと思っていました。そこで共有プラグインの「便利ナビ」を見つけまして、これでできると思い、ダウンロードしてプラグインに加え、「使用する際に書き加えてください」とされたhtmlを書き加えてとやったのですが、いざクリックしても記事に飛びません。
●便利ナビとは?
http://myhurt666.blog22.fc2.com/blog-category-1.html#entry3
●プラグインを追加するだけでは、動作しません。テンプレートの HTML を編集する必要があります。
HTMLの
<!--topentry-->
直後に以下のタグを挿入
<a id="entry<%topentry_no>" name="entry<%topentry_no>"></a>
どうしてもこれでないとというわけではないのですが、すでに色々いじっている今は、便利ナビは使えないでしょうか。また無理ということなら、左側から隠した記事に飛べるようにリンクを貼るにはどうしたらいいでしょうか。ユーザーフォーラムなどで「記事 リンク」などで調べようとしたら便利ナビがでてきて、他はどうも希望していることとは違うようでした。何度もお手間をおかけしてしまいますが、御願いします。
背景画像のリンクについて
はじめまして。テンプレート「fb02_2c」を使用させていただいております。
お忙しい中申し訳ありませんがどうしてもわからないことがあるので質問させてください。
下記の赤線部内のエリアをクリックしたときにトップに戻れるようリンクを貼りたいのですがどのように行えばよいのでしょうか?
http://blog-imgs-36.fc2.com/1/n/v/1nv/test.jpg
また赤線部上にマウスカーソルがきたときにその部分の画像を変更したいです。
よろしくお願いいたします。
浜谷雅樹さんへ
ブログパーツの類は制作者への質問や掲示板・FAQ等で解決策を探して下さい。
「質問する前に読んで下さい」にその旨記載済みです。
リンクについても公式マニュアルや記事を書くときのツール、ネット検索などで解決できると思います。
ばなな汁さんへ
テンプレートをお使い頂きありがとうございます。
ブログタイトルを画像に置き換え、且つ画像をロールオーバーさせるという事でしょうか。
まずhtmlの編集から93行目付近。
<%blog_name>を削除します。
------------------------------
<div id="right">
<div class="header">
<h1><a href="<%url>"><%blog_name></a></h1>
<h2><%introduction></h2>
</div>
------------------------------
この方法だとブログ説明文が邪魔になるので<h2><%introduction></h2>も削除します。
どうしても説明文が必要な場合は</div>の下に移動させると良いと思います。
(必要に応じてCSSのh2を編集)
次にCSSの編集です。
赤字は削除、青字は変更でh1 a は追加、リンク指定も書き換えます。
------------------------------
/* 画像URL */
.header {
width: 646px;
height: 180px;
margin: 0 0 10px;
padding: 0;
border: 2px #c1bfad solid;
background: url(http://blog-imgs-26.fc2.com/f/l/a/flaw/fb02-title.jpg);
}
h1 {
font-size: 160%;
margin: 0;
padding: 0;
font-weight: bold;
text-align: right;
}
h1 a {
display: block;
width: 646px;
padding-top: 180px;
text-align: center;
background-repeat: no-repeat;
background-position: top center;
}
h1 a:link, h1 a:visited { background: url(画像url) no-repeat;}
h1 a:hover, h1 a:active { background: url(画像url) no-repeat;}
------------------------------
link visitedのurlは非マウスオーバー、hover activeのurlはマウスオーバー時の画像を入れます。
追記:h1のリンク指定を一部修正
お礼
質問への回答、本当にありがとうございます。
説明はとてもわかりやすく、簡単に編集することが出来ました。
そして無事画像をクリックしてTOP画面を開くことが出来るようになりました。
しかしマウスオーバーだけは赤い部分を削除
background: url(http://blog-imgs-26.fc2.com/f/l/a/flaw/fb02-title.jpg);
その後青い部分を追加
h1 a:link, h1 a:visited { background: url(http/画像1jpg);}
h1 a:hover, h1 a:active { background: url(http/画像2.jpgl);}
と行ったのですが画像が何も表示されず空白の状態になってしまいました。
(空白で画像は表示されていないがクリックすればTOPに飛べる)
その後、画像が表示されなかったので青い部分を残したまま赤い部分に画像を入れてみたのですがこの場合でも同じくなにも表示されません。
そして現在青い部分を削除して通常に画像が表示されています。
また現在はこの画像の赤の範囲になっていますが、黄色部分のみをリンクの範囲とする。といった設定は簡単にできるのでしょうか?
http://blog-imgs-36.fc2.com/1/n/v/1nv/test.jpg
簡単に変更出来るようでしたら今後バーナーの画像を変えたときの為にもおぼえておきたいのでご教授お願いいたします。
(自分でh1 a{ の中を弄ってみたら範囲が狭まったりしたのですが、どの数値をどのように変更すればうまく切り替わるのかわかりませんでした。)
あとこちらの変更要望もFC2のシステム的に可能でしたら是非お願いします。
http://blog-imgs-36.fc2.com/1/n/v/1nv/2010y02m10d_031528875.jpg
質問続きで申し訳ありませんがよろしくお願いいたします。
ばなな汁さんへ
まず始めに説明の中で画像を利用されてますが、それが閲覧不可になった(削除された)場合にこのコメントを見た方が参考に出来なくなる恐れがあるので今後画像についてはご遠慮下さい。
コメントは他の閲覧者も参考にしますのでご理解願います。
ロールオーバーについては私の方では特に問題ありませんので該当のhtmlCSSを見直して下さいとしか言えません。
(リンク指定を一部修正しましたのでコピー&ペーストでお試し下さい)
>黄色部分のみをリンクの範囲とする
画像の一部にリンクを指定するという事でしょうか?(黄色部分が見当たりませんが)
htmlの area shape という方法が使えると思いますがロールオーバーと組み合わせて使えるかは不明です。
・記事中の水平線について
水平線は記事ツールでの挿入以外ありません。
恐らくカスタマイズした部分に問題があると思います。
(ご自身で行われたカスタマイズについては関知しません)
・アカマイ広告の上部にバナー等を表示したい。
html158行目付近。
------------------------------
<!--/more_link-->
~ここに設置~
<!--more-->
<a name="more" id="more"></a><%topentry_more>
<!--/more-->
------------------------------
ただしバナーとアカマイ広告の間に拍手・ブックマークボタンが入るのは仕様です。
(環境設定で拍手ボタンの表示位置が追記リンクの後の必要があるかもしれません)
ありがとうございます。
画像の使用については配慮が足りませんでした。申し訳ありません。
以後気をつけます。
リンク指定の方法を変更していただきありがとうございます。おかげで今度のリンク指定では無事マウスオーバーすることができました。
またバーナーの設置もできました。
「htmlの area shape」と言うものについてはまた調べて挑戦して見たいと思います。
何度も質問に丁寧に答えていただきありがとうございました。
また自分では解決出来ないCSSの問題などありましたらまた質問させていただくかもしれませんがどうぞよろしくお願いいたします。
すみませんでした
質問する前に~は読んでいたのですが、失念していました。失礼しました。 リンクの件ももっと自分で調べてみます。
色について
はじめまして。
このテンプレートをお借りしようと思っているのですが
文字色を変えるのは良いのでしょうか??
その変更が良いのか何処を探しても見当たらなかったので・・・
なのでまだ使用はしていないです。
こんな質問をしてしまいすみません・・・。
でもシンプルで記事幅の大きさも写真を載せるには良いテンプレートだなと思いましたので。
りぃさんへ
テンプレートをお使い頂きありがとうございます。
文字色の変更程度は全然問題ありません。
スタイルシートの編集からbody内の color: #333; を変更して下さい。
(色については カラーコード でネット検索すれば専門サイトが見つかりますので参考にして下さい)
こんばんは。
また質問したいことができたので質問させてください!
コメント欄の形式が
~~~本文~~~
~水平線~
| URL / 名前
| 日付・時間
となっているのを
| URL / 名前
| 日付・時間
~~~本文~~~
~水平線~
という具合に変更したいのですがどのように行えばよいのでしょうか?
お手数おかけいたしますがどうぞよろしくお願いいたします。
ありがとうございます。
回答をありがとうございます。
わかりやすく教えていただき有難いです。
後また質問なのですが・・・
①これは文字色の件と似ているのですが
日記のタイトルの背景とかがうっすらと緑色になっていますよね?
この部分の色の変更はしても宜しいのでしょうか?
またまたすみません・・・
濃い色ではないので緑色のままでも良いかなとは思ったのですが
ちょっと違う色にしたいなという希望も少しありましたので・・・
②上の画像の縦幅をもう少し広くしたいのですが・・・
縦幅の変更はしてもこのテンプレート自体に支障はありませんか?
もう少し大きめの画像にしたいなと思いまして。
③追記を開閉式にしたいのですがやっても問題ないでしょうか?
といってもユーザーフォーラム等で調べてみて
試してみてできたらの話なのですが・・笑
質問がいっぱいでごめんなさい・・・
ステキなテンプレートをお借りするのに我侭を言ってすみません。
お返事待ってます。
ばなな汁さんへ
まずhtml226行目付近の青字部分を移動させます。
------------------------------
<!--comment-->
~ここへ移動~
<div class="entrytext" >
<p class="com_title" id="comment<%comment_no>"><%comment_title></p>
<%comment_body>
</div>
<div class="entrystate">
<%comment_url+str> | <%comment_mail+name> #<%comment_trip><br />
<%comment_year>/<%comment_month>/<%comment_day> <%comment_hour>:<%comment_minute>
* <a href="<%comment_edit_link>">編集</a> *
</div>
<!--/comment-->
------------------------------
entrystateを何か違うクラス名に置き換えてCSSに下記を追加。
------------------------------
.XXX {
font-size: 95%;
color: #666;
margin: 20px 10px 0;
padding: 0 5px;
border-left: 3px solid #c1bfad;
}
------------------------------
marginとpaddingは適当に調節して下さい。
りぃさんへ
A1.
h3の background: #eceadc url(~省略~) no-repeat 99% 50%; で変更できます。
A2.
.headerの height: 180px; を変更して下さい。
縦幅については制限はありませんが横幅は他にも変更する必要が出てきます。
A3.
追記は開閉式になってます^^
scriptをお借りしてる都合上、-- read more と -- c l o s e という文字についてのみ変更可能としています。
必要であればご質問下さい。
ありがとうございます!
うまく編集出来ました。
ありがとうございます!!
色変更をして理想に近づきました☆
ただ、追記の部分に試しに書いてみたのですが開閉がうまくいかないのでちょっと調べてみようと思っています。
read mora の言葉すらでてこなかったという・・・
きっと私のやり方が変なんじゃないかと思ってます。
りぃさんへ
追記開閉scriptに関しては動作確認してますし不具合の報告もないので問題ないと思います。
とりあえず追記をキチンと書いているという事が前提ですが。
公式マニュアル:追記を使う
http://fc2blogmanual.blog60.fc2.com/blog-entry-25.html#a3
もし記事作成画面のプレビューで確認しているのであればダメです。
必ず保存した後、トップ画面から見る様にして下さい。
記事の個別画面(http://~省略~/blog-entry-○○.html)とプレビューでは追記があっても記事全文が表示される(続きを読む等は表示されない)のが仕様です。
ありがとうございます。
追記の開閉はちゃんとできました!!
ありがとうございます。
これで最後になると思うのですが、
横のカテゴリーの項目を増やしたいのですが・・・
バナーありのリンクを貼りたいです。
そしてそのカテゴリーを最新コメントの下に追加したいと思っています。
そのやり方がイマイチわからなくて・・・
すみませんがお返事よろしくお願いします。
りぃさんへ
カテゴリーのリンクをバナーで表示させたいという事でしょうか。
おそらく一番簡単な方法はフリーエリアのプラグインに直接タグを書く方法です。
http://fc2blogmanual.blog60.fc2.com/blog-entry-57.html
フリーエリアのhtmlにリンクさせたいカテゴリーのurlを用いてバナーを表示させます。
青字部分を適切に書き換えて下さい。
<p class="cat_banner"><a href="ブログurl/blog-category-○.html"><img src="画像url" border="0" width="120" height="60" /></a></p>
(このテンプレートではwidthは185px以内)
そしてテンプレートのCSSに下記を追加して適切な間隔を取ります。
.cat_banner { margin-bottom: 5px;}
プラグイン項目の移動は管理画面で行えます。
http://fc2blogmanual.blog60.fc2.com/blog-entry-150.html
ありがとうございます。
回答ありがとうございます。
やってみたらちゃんと表示されてできました。
何から何までありがとうございました。
こんばんわ、初めまして。
写真を主に掲載している部ログを始め丁度よく好みのテンプレートを発見させていただき現在お借りしている状態です。素敵なテンプレートをありがとうございますm(__)m
(HPは編集中のため現在が非公開です)
ここで質問なのですが、
・「04«1.2.3.4.5.~」と上にページを表す数字に薄い背景?(ラインのような)があるのですがこちらはどちらを#fff;にすればいいのでしょうか?
・上に同様、「アーカイブ」・「プロフィール」にもある薄いラインをどの記号をいじればいいのでしょうか?
・プロフィールをタイトルより下に表示させて記事と並ばせた状態にしたいのですが移動可能でしょうか?
・こちらのテンプレは左カラムですが逆にすることは可能でしょうか?
長々と質問ばかり申し訳ありません。
トロさんへ
テンプレートをお使い頂きありがとうございます。
4点のご質問、全てスタイルシートの編集から行います。
A1.
>ページを表す数字
ページではなくカレンダーです。
.yokoのbackground: #eceadc;を変更して下さい。
A2.
A1同様、h4.plugtitleのbackgroundを変更します。
A3.
プラグインの位置の事なら公式マニュアルを参考にして下さい。
http://fc2blogmanual.blog60.fc2.com/blog-entry-150.html
A4.
#rightと#leftそれぞれのfloatのleftとrightを入れ替えて下さい。
なおURLは全ての方に原則公開をお願いしています。
ご理解下さい。
コメント欄のところについて質問させてください。
ブログにコメントを残してもらった際、普通にURLを入力していただいた方の物は問題なくその方の入力したURLが開けるのですが。
URL欄を空白でコメントして頂いた方のコメント欄のURLリンクが何故か、私の記事のURLになってしまいます。
http:~~fc2.com/blog-entry-***.html(コメントして頂いた記事のURL)
こうならないように、コメントの時にURL欄が空白だった場合はリンクを表示しないようにするにはどのようにすればいいのでしょうか?
よろしくお願いいたします。
ばなな汁さんへ
色々試してみましたが同様の症状は確認できませんでした。
他に報告もないので現状ではテンプレートに問題があるとは思えません。
不具合の可能性もあるので直接FC2へ問い合わせて下さい。
わかりました。
ご返事ありがとうございました。
ご連絡遅くなり大変失礼致しました。
URL現在公開中になっております。
又回答のほうもありがとうございました!ある程度答え通りにしていたのですがやはりどうしてもプロフィールを左カラム式でなく右に移動すると本文枠などいろんなものが全てずれて動いてしまいました・・・orz
結果消せば元には戻ったのですが・・・
色々とありがとうございました!
コメント欄のカスタマイズについて教えて下さい
はじめまして。
『fb02_2c』を使わせて頂いてます。
使い勝手が良くてシンプルで色合いがとても気に入ってます。
れん様が今、お使いのテンプレートのコメント欄の様に
コメント者の名前・url・時間・editの所にコメント欄の横の長さ一杯にラインを入れたいのです。
色々と試してみたのですがうまく出来ませんでした。
お時間のある時で構いませんので
どうぞ、宜しくお願いいたします。
キキさんへ
テンプレートをお使い頂きありがとうございます。
ご質問の件はコメント投稿者の部分でしょうか。
コメント部分だけの場合はhtmlも多少変更します。
まずhtmlの編集から下記部分を探し出し、青字部分を仮にcomstateと変更します。
------------------------------
<div class="entrybody">
<h3 class="entrytitle">この記事に対するコメント</h3>
<!--comment-->
<div class="formtext" >
<p class="com_title" id="comment<%comment_no>"><%comment_title></p>
<p><%comment_body></p>
</div>
<div class="entrystate">
<%comment_url+str> | <%comment_mail+name> #<%comment_trip><br />
<%comment_year>/<%comment_month>/<%comment_day> <%comment_hour>:<%comment_minute>
* <a href="<%comment_edit_link>">edit</a> *
</div>
<!--/comment-->
<span class="pagetop"><a href="#wrap" title="<%template_go_top>">go page top</a></span>
</div>
------------------------------
スタイルシートに.comstateを追加し、線であればborderを指定すれば良いと思います。
(例:太さ1pxの灰色の下線を引く)
------------------------------
.comstate {
font-size: 95%;
color: #666;
margin: 0 10px 10px;
padding: 0 5px;
border-bottom: 1px solid #AFAFAF;
}
------------------------------
borderの指定にはいくつか種類があるのですが、その辺はCSSの解説サイトなどを参考にして頂ければと思います。
れん様
早速のご返答ありがとうございました。
コメント投稿者の名前・url・日時・editの所にラインをかぶせて入れたかったのです。
お陰様で思い通りにする事が出来ました。
それで、もうひとつお願いが(。-人-。)
コメント投稿者の名前・url・日時・edit~を横一列にする事は可能でしょうか。
何度も申し訳ありません。
宜しくお願い致します。
*追記*
すみませんm(__)m
色々と試してみたら、横一列にする事が出来ました。
お世話になり、大変にありがとうございました。
これからも何かとお尋ねするかも知れません。
宜しくお願い致します。
れん様、初めまして HN:yukiと申します。
写真を大きく貼りたいと常々思っておりこの度このテンプレートを使わせて頂きたいと思っている次第です。
当方初心者のためお教え願いたいことがあります。
タイトルの位置が画像と被ってしまうのでサブタイトルの位置をメインタイトルの位置に近づけるか、メインと離してサブを右下に配置しよかと思っております。
ご教授の程よろしくお願いいたします。
yukiさんへ
テンプレートをお使い頂きありがとうございます。
ご質問の件ですがブログを拝見した限りではタイトル・サブタイトルの余白調節で対応出来るかもしれません。
スタイルシートの編集からh1がブログタイトル、h2がサブタイトル(説明文)となります。
青字部分の様に変更してもらえばタイトルの上下が詰まると思います。
------------------------------
h1 {
font-size: 160%;
margin: 0;
padding: 0 10px;
font-weight: bold;
text-align: right;
}
h2 {
color: #efefef;
margin: 0;
padding: 0 10px;
font-size: 120%;
text-align: right;
}
------------------------------
右下に移動させるという意味が画像上での事であれば同じくh2を以下の様に編集してください。
(こちらの方法の場合は上述h1を変更する必要はありません)
------------------------------
h2 {
color: #efefef;
margin: 0;
padding: 100px 10px 0;
font-size: 120%;
text-align: right;
}
------------------------------
早速お返事いただきましてありがとうございます。
両パターンを試して自分的にこっちかと右下に配置してみました。
使わせていただいててまたお尋ねすることがあるかもしれません。
よろしくお願いいたします。