TOPIC
0424
共有テンプレート・fb07_2c
---確認環境---
Windows7
IE・Firefox:最新版
見やすさ重視のシンプル2カラム。
画像変更可。
始めて質問するときは最初にこちらを読んで下さい。
利用規約はこちらです。
- パソコン用テンプレートの関連記事
-
- 共有テンプレート・airs01_2c (2013/06/21)
- 共有テンプレート・fb07_2c « «
- 共有テンプレート・gallery02_3c (2013/03/16)
Posted on 2013/04/24 Wed. 21:40 [edit]
category: パソコン用テンプレート
thread: FC2ブログ共有テンプレート - janre: ブログ
tag: 右２カラム« 共有テンプレート・airs01_2c | 共有テンプレート・gallery02_3c »
コメント
タイトル画像のリンクについて
こんにちは。
このテンプレートがとても見やすくてきれいなので気に入っています。
質問なのですが、タイトル画像を変更することは出来たのですが、画像をクリックするとトップページに戻るというのはできますか？
出来るのでしたら、是非教えてください。
カスタマイズ初心者なので分からないことだらけで・・よろしくおねがいします。
mikaさんへ
テンプレートをお使い頂きありがとうございます。
ご質問の件ですが、HTMLの該当箇所を以下のように修正してください。
赤字部分を削除し青字部分のようにします。
------------------------------
<div class="header">
<h1><a href="<%url>"><%blog_name></a></h1>
<h2><%introduction></h2>
</div>
↓
<div class="header">
<h1><a href="<%url>"><img src="画像URL" width="" height=""></a></h1>
<h2><%introduction></h2>
</div>
------------------------------
スタイルシートのタイトル画像は必要なくなるので削除してください。
------------------------------
/* 画像URL(940*300) */
.header {
margin: 0 0 20px;
padding: 0;
height: 300px;
background: url(http://blog-imgs-55.fc2.com/f/l/a/flaw/fb07_title.jpg) 0 0 no-repeat;
}
------------------------------
行間変更について
れん様へ
はじめまして。
シンプルなおしゃれさが気にいって、利用させていただいております。
タイトル画像などはなんとか変更できたのですが、記事文（body?）やプロフィール文の行間をもう少し広げたいと思っております。
初心者ゆえ、どのように変更すればよいのかご教示いただけますようお願い申し上げます。
以上、よろしくおねがいします。
yoshiさんへ
テンプレートをお使い頂きありがとうございます。
ご質問の件ですが、本文およびプラグインの文字の行間についてはスタイルシートの編集から青字部分を追加して下さい。
数値%に関してはお好みで変更して下さい。
------------------------------
.entrytext, .formtext {
font-size: 90%;
margin: 0;
padding: 0 10px;
overflow: hidden;
line-height: 180%;
}
.menutext {
font-size: 90%;
margin: 0 0 30px;
padding: 0 5px;
overflow: hidden;
line-height: 180%;
}
------------------------------
お礼
れん様へ
お世話になります。
早速にご回答いただきまして、ありがとうございました。
素敵なテンプレートを末永く愛用したいと思います。
コメント欄のコメントの文字サイズとカラー変更
れん様へ
はじめまして。
本テンプレートがシンプルで気に入っており、最近ブログを作るにあたってお借りしております。
そこでご質問なのですが、題目のコメント欄のコメントの文字サイズとカラーを変更（コメント記入者が変えるのでは無く、デフォルトの文字サイズ・カラーを変える）する場合はCSSのどの部分を変更もしくは追記すれば宜しいでしょうか。
御手数ですが御教授頂ければ幸いです。
宜しく御願い致します。
秋右衛門さんへ
テンプレートをお使い頂きありがとうございます。
ご質問の件ですが「コメントだけ」となるとまずHTMLの編集から赤字部分のように変更し
------------------------------
<!--comment-->
<div class="comtext" >
<p class="com_title" id="comment<%comment_no>"><%comment_title></p>
<p><%comment_body></p>
</div>
～省略～
<!--/comment-->
------------------------------
スタイルシートに下記を追加して下さい。
------------------------------
.comtext {
color: #カラーコード;
font-size: 100%;
}
------------------------------
なおカラーコードに関してはネット検索にてお調べください。
「CSS カラーコード」でヒットするhtml関係のサイトに詳しく書かれています。
れん様へ
いつも大変御世話になります。
御連絡が遅くなり申し訳ありません。
御教授頂きました方法にて無事、コメント欄の変更が出来ました。
またなにかありましたら御連絡させて頂きます。
この度は本当にありがとうございました。
コメント欄の文字数制限について
れん様
去年の夏からテンプレートを使わせて頂いています。とても見やすく、使いやすく感謝しております！
質問ですが、コメント欄の文字数を○○文字以内、と制限することは出来ますか？
ご指南宜しくお願いいたします。
お茶の間さんへ
テンプレートをお使い頂きありがとうございます。
ご質問の件ですが、一応可能ですがあくまでテンプレート上での動作でありコメントの確認画面を設定している場合は（最終的に）FC2ブログ側のフォームを利用するので制限は無効になると思われます。
htmlの編集から青字部分を追加し○○で制限数を設定して下さい。
（ソースが長くなるため一部省略）
------------------------------
<!--comment_area-->
<dd><textarea id="comment" cols="60" rows="10" name="comment[body]" maxlength="○○"></textarea></dd>
<!--/comment_area-->
<!--edit_area-->
<dd><textarea id="comment" cols="60" rows="10" name="edit[body]" maxlength="○○"><%edit_body></textarea></dd>
<!--/edit_area-->
------------------------------
れん様
コメント欄の文字数制限について質問させていただいた者です。
早々にお返事くださり有難うございました！
早速青文字部分を追加して確認してみましたが、ご指摘のとおり制限が掛っているようで無効になってしまいました。
とご報告と御礼のコメを送信しようと何度か試みましたが、毎回「書き込み制限を受けています」と出て送信できませんでした。
なので、こちらから御礼のメールを送ります。
有難うございました。
記事一覧の表示に変更するには
れん様
度々お世話になります。
現在の仕様では月別アーカイブとカテゴリをクリックすると、記事全体が表示されるようになっていますが、それをそれぞれ「記事一覧の表示」（＋日付け）に変更したいのですが、どのようにすればよいでしょうか？
お忙しいこととは思いますが、宜しくお願いいたします。
お茶の間さんへ
htmlに青字部分を追加すればお望みの表示になるかと思います。
------------------------------
------------------------------
<!--not_permanent_area-->
<!--not_titlelist_area-->
<div class="entrybody">
<div class="entrytext">
<ul>
<!--category_area-->
<!--topentry-->
<li>
<%topentry_year>/<%topentry_month>/<%topentry_day><br />
<a href="<%topentry_link>" title="<%topentry_title>へ"><%topentry_title></a>
</li>
<!--/topentry-->
<!--/category_area-->
<!--date_area-->
<!--topentry-->
<li>
<%topentry_year>/<%topentry_month>/<%topentry_day><br />
<a href="<%topentry_link>" title="<%topentry_title>へ"><%topentry_title></a>
</li>
<!--/topentry-->
<!--/date_area-->
</ul>
<!--date_area-->
<p class="pagenavi">
<a href="<%prev_month_link>" title="<%prev_month>月">≪ <%prev_month>月</a> <a href="<%next_month_link>" title="<%next_month>月"><%next_month>月 ≫</a></p>
<!--/date_area-->
</div>
</div>
<!--/not_titlelist_area-->
<!--/not_permanent_area-->
------------------------------
<!--topentry-->
<!--not_date_area-->
<!--not_category_area-->
～省略～
<!--/not_category_area-->
<!--/not_date_area-->
<!--/topentry-->
------------------------------
れん様
ご返答有難うございます。
やってみたのですが、変更されませんでした（泣
前半の<!--not_permanent_area--> から<!--/not_permanent_area--> までをそのまま
</div>
<!--/plugin_third-->
<!--/plugin-->
の後に追加、
後半は書かれてあるとおり
<!--topentry-->の後に青文字部分２行、
<!--/topentry--> の前に青文字部分２行を追加
どこが間違っているのでしょうか？
お手数おかけして申し訳ありません、ご教示宜しくお願いいたします。
お茶の間さんへ
当方でも動作確認していますが、それで動かないとされてもhtmlの確認が出来ないため何が問題なのかは判断しかねます。
とりあえず<!--topentry-->前に挿入するhtmlをコピー＆ペーストするだけでカテゴリと月別はリスト表示されるので今一度確認して下さい。
れん様
表示されました！前回は初歩的な間違いしておりました・・。
恥を忍んで更に伺いたいのですが、
＞「それぞれ「記事一覧の表示」（＋日付け）に変更したい」と質問し、その通りにれん様が変更してくださったのですが、実は
月別アーカイブとカテゴリをクリックすると
「All archives をクリックしたときと同様の表示方法にしたい」
というのが希望なのです。
適切な言葉でお伝え出来ず、無駄にお時間をとらせてしまい申し訳ありません。
それから、今回の変更後、カテゴリをクリックすると記事のタイトルが５つまでしか表示されません。「All archives 」と同じ程度に表示されるようにしたいのですが。
お手数お掛けして恐縮しております。
今日から3日ほど不在にしますので、返信はお時間のあるときに、いつでも結構です。
お茶の間さんへ
前回のソースを修正しておきましたのでそちらで納得頂ければ幸いです。
なお表示件数についてはマニュアルをご参照願います。
http://help.fc2.com/blog/manual/Home/kankyou/entrysetting.html
お礼
れん様
全て希望通りに出来ました！
（表示件数に関しては環境設定のページがあることをすっかり忘れていました・・）
度重なる質問にも関わらず、このように細かくフォローして下さり、心から感謝しております。
有難うございました！
とてもシンプルで見やすいテンプレートお借りしています。
ブログ内文字をもう少し大きくしたいのですが
どこかに同じ質問があったらすみません
よろしくお願いします
かのんさんへ
テンプレートをお使い頂きありがとうございます。
ご質問の件ですが、ブログ全体の文字サイズを変える場合はスタイルシートの青字部分を変更して下さい。
------------------------------
body {
margin: 0;
padding: 0;
font-size: 80%;
color: #666;
background: #FFF url(http://blog-imgs-55.fc2.com/f/l/a/flaw/fb07_bg.gif) 0 0 repeat;
font-family: "メイリオ", Meiryo, Verdana, Helvetica, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", sans-serif;
}
------------------------------
お忙しい中お返事ありがとうございます。できました。
すごくわかりやすく教えていただき こころより感謝します。
テンプレート使わせて頂きます。
ありがとうございました。
ブログタイトル下に文字を入れたいです
れん 様
はじめまして。
こちらのテンプレートを利用させていただいております。
れん様のテンプレはどれも素敵で目移りします。
ブログタイトルの下にちょっとした紹介文を記載したくて、
</h1>のあとに入力するとよいらしいことは分かったのですが、
文字がスタートする場所を、ブログタイトルよりも右側にずらす
（左側にすこしスペースをあける）にはどうしたら良いでしょうか？
お手数をおかけしますが、ご教授いただければ幸いです。
よろしくお願いいたします。
むぅさんへ
テンプレートをお使い頂きありがとうございます。
ご質問の件ですが、ブログの紹介文でしたら環境設定から「ブログの説明」という機能があるのでそれを使われてはどうでしょうか？
それでブログタイトル直下に説明文が入ります。
その上でカスタマイズするのであればスタイルシートで青字のように変更すれば説明文の左側に50px分スペースが空く、という感じになります。
------------------------------
h2 {
font-size: 120%;
font-weight: normal;
padding: 0 0 0 50px;
}
------------------------------
れん様
お返事ありがとうございました。
FC2のほうで設定ができることまで
きちんと確認していませんでした。
お手間を取らせてしまい、本当に申し訳ありません。
教えていただいたカスタマイズ方法と合わせて、
やってみたいと思います。
どうもありがとうございました。
れん様へ
れん様のテンプレートはどれもステキですが
特にこちらのテンプレートが好きで、
使用させていただきたいと思っております。
質問が多くて申し訳ありませんが、以下について
教えていただけますでしょうか
１．トップ画像は変更できますが、センタリングしたい場合
どのようにしたら良いでしょうか
２．ブログタイトルが画像にかぶるので、文字を白抜きにしたいです
３．トップ画像の下に横カレンダーを入れたいです
４．記事タイトルの下に、日付、曜日、投稿時間、記事ナンバーを入れたい
よろしくお願いいたします
Romiさんへ
テンプレートをお使い頂きありがとうございます。
長くなりますが青字が変更部分で2と3のCSSは追加します。
1.
------------------------------
CSS
/* 画像URL(940*300) */
.header {
margin: 0 0 20px;
padding: 0;
height: 300px;
background: url(http://blog-imgs-55.fc2.com/f/l/a/flaw/fb07_title.jpg) center 0 no-repeat;
}
------------------------------
2.
------------------------------
CSS
h1 a:link {color: #FFFFFF;} /* 未訪問のリンク */
h1 a:visited {color: #FFFFFF;} /* 訪問済みのリンク */
h1 a:hover {color: #FFFFFF;} /* ポイント時のリンク */
h1 a:active {color: #FFFFFF;} /* 選択中のリンク */
------------------------------
3.
------------------------------
html
<div class="header">
<h1><a href="<%url>"><%blog_name></a></h1>
<h2><%introduction></h2>
</div>
<div class="yoko">
<span class="yokocal"><a href="<%prev_month_link>"><%prev_month></a></span>«
<!--calender2--><span class="yokocal"><%days>.</span><!--/calender2-->
»<span class="yokocal"><a href="<%next_month_link>"><%next_month></a></span>
</div>
CSS
.yoko {
text-align: center;
font-size: 100%;
margin: 5px 0;
}
.yokocal {
color: #ccc;
display: inline;
margin: 0 2px;
}
------------------------------
4.
------------------------------
html
<!--topentry-->
<div class="entrybody" id="e<%topentry_no>">
<h3 class="entrytitle"><a href="<%topentry_link>" title="<%topentry_title>"><%topentry_title></a> <script type="text/javascript"> nw(<%topentry_year>,<%topentry_month>,<%topentry_day>,<%topentry_hour>) </script></h3>
<p class="line"> </p>
<p class="entrydate">[<%topentry_no>] <%topentry_year>/<%topentry_month>/<%topentry_day> <%topentry_youbi>. <%topentry_hour>:<%topentry_minute> [<a href="<%server_url>control.php?mode=editor&process=load&eno=<%topentry_no>" title="<%template_edit>">edit</a>]</p>
------------------------------
<p class="entrydate">については、この部分より下に同じ記述があるのでそれをコピーアンドペーストし<%topentry_no>を追加して下さい。
元の部分は削除します。
以上のようになります。
なお位置の微調整はご自身でお願いします。
コメントの投稿
トラックバック
« p r e v | h o m e | n e x t »
