livedoorブログ⇒FC2ブログ引越しに向けてテンプレートを物色し、共有TPの中で aki [sorauta1] 氏作成の「ct_responsive3c」(更新日:19/09/10)、「暗色CSS(3カラム用) 2019/09/29 css更新」を設置した。その後の改造記録まとめ。過去記事との重複記載有り。
過去記事:livedoorブログ整理
過去記事:FC2ブログ、試用雑感 / FC2ブログに引越し再考 / スマホにアクセス解析
関連記事:FC2ブログ、TP更新記録 / ct_responsive3c黒助 / ct_responsive3c:改録
関連記事:ct_responsive3c:改録H / ct_responsive3c:改録C / FC2ブログ、TP作成-3 / FC2のファビコン設定 / ブログカード利用:学
関連記事:FC2用に設置プラグイン / FC2プラグイン適用実験 / FC2用に設置プラグイン2
-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-
使用するレスポンシブ対応テンプレートはct_responsive3c。作者 aki [sorauta1] 氏サイト*Essenceの解説記事の通りに実施。
  1. 着せ替え nightscapeにより『ct_responsive』暗色CSS(3カラム用)を適用
  2. 記事毎の要約表示を全文表示に変更する方法
  3. プラグイン3をお知らせ用に表示する・管理人コメントを装飾
  4. [必読]レスポンシブテンプレートの使い方(設定) ※殆ど設定済
-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-・-
<< CSS >>
1.フォントサイズ変更
font-size:80%; /* フォントサイズは1em(16px)の80% */
↓↓↓↓↓↓↓↓↓
font-size:100%; /* フォントサイズは1em(16px)の80% */
font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"MS Pゴシック","MS PGothic",Verdana,sans-serif;
↓↓↓↓↓↓↓↓↓
font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", "Osaka","Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN","ヒラギノ角ゴ Pro W3","MS Pゴシック","UDデジタル教科書体","Yu Gothic UI",Verdana, sans-serif;
<< HTML >>
1.「メールアトレス入力欄」を除去
<label for="name">Subject:</label>
<input id="subject" type="text" name="comment[title]" value="No Subject" onblur="if (!this.value) this.value = defaultValue; this.style.backgroundColor='';" onfocus="if (this.value == defaultValue) this.value = ''; this.style.backgroundColor='#f7ffff';"><br>
<label for="mail">Mail:&nbsp;管理画面にのみ表示</label>
<input id="mail" type="text" name="comment[mail]" value="<%cookie_mail>" onblur="this.style.backgroundColor='';" onfocus="this.style.backgroundColor='#f7ffff';"><br>

2.「記事編集」ボタンを付ける
<!--allow_tb-->
<div class="tb_counts"><a href="<%topentry_link>#tb">トラックバック(<%topentry_tb_num>)</a></div>
<a href="<%server_url>control.php?mode=editor&process=load&eno=<%topentry_no>" target="_blank" title="編集(管理用)">記事編集</a>
<!--/allow_tb-->  
2-1.>>コメントに返信ボタンを付ける

3.記事更新の日付部分『Last Modified』を日本語にする場合は、その部分の文字列を『最終更新日』と日本語で記述
<!-- 投稿時間不要の場合は ここから-->
<!--permanent_area-->&nbsp;<%topentry_hour>:<%topentry_minute><!--/permanent_area-->
<!-- 投稿時間不要の場合はここまでを削除 -->
<!--permanent_area--> <!--/permanent_area--> を外すと個別記事ページだけでなく、トップページにも投稿時間が表示される。
4.リストマークの表示 ※スタイルシート編集枠の一番下に以下を追加
/* リストマークを黒丸・数字表示 */
ul li{list-style-type:disc;}
ol li{list-style-type:decimal;}
ul, ol{padding-left:30px;}

nav ul{padding-left:15px;}
nav ul li{list-style-type:disc;}
nav ol{padding-left:15px;}
nav ol li{list-style-type:decimal;}
5.タグリストを付加
<!--tag_list--><p>TAG :<a href="<%url>?tag=<%topentry_tag_list_parsename>"><%topentry_tag_list_name></a></p><!--/tag_list-->
<!--topentry_tag--><p class="tag_lnk">tag : <%topentry_jointtag></p><!--/topentry_tag-->
<%topentry_jointtag>- 半角スペースで結合したタグリストを表示
以下の単変数は<!--tag_list-->~<!--/tag_list-->内で表示します。
<%topentry_tag_list_name>- 設定したタグリストのタグを表示
<%topentry_tag_list_parsename>- 設定したタグリストのURLエンコード化したタグを表示
<dev>TAG :<!--tag_list--><a href="<%url>?tag=<%topentry_tag_list_parsename>"><%topentry_tag_list_name></a> <!--/tag_list--></dev>
6.年月日&時間の表示を日本語にした
<%topentry_year>,<%topentry_month>,<%topentry_day>,<%topentry_hour>:<%topentry_minute>
※<%topentry_youbi>- 曜日(洋風)を表示 ⇒ <%topentry_wayoubi>- 曜日(和風)を表示

7.ブログタイトル部分に紹介文を足した
<h1 class="header_blog_name"><%blog_name></h1>
<span class="header_introduction"><%introduction>
<p>トキメキ団塊親父のセカンド・ステージ - 退職爺のボケ封じ</p></span>
8.全記事一覧 に コメント件数 が表示できるようになっていた。 【 ありのごとくあつまりて 】
CM:<%titlelist_comment_num> TB:<%titlelist_tb_num>

上記については利用している共有テンプレート製作者より改良版が提供されたので、それに直した。


以上を改造したCSSHTML保存。及び利用しているプラグイン
【追記:2020/03/11】文字サイズの変更 - *Essence

過去記事:FC2ブログをスマホから? / FC2ブログをスマホに最適化する方法(レスポンシブ対応テンプレート) - FC2ブログ 公式ちゃんねる) / FC2ブログに引越し再考 / livedoor ⇒ FC2、試行 / FC2ブログで広告を撤廃 / https://の信頼度:考 / FC2の模様眺め作戦 / FC2に編集ボタンを設置 / FC2ブログのSSL化
【2019年2月修正追記】レスポンシブ CSSメディアクエリ(@media)ブレイクポイントまとめ
~~<<更新記録>>~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  1. 文字サイズの変更 - *Essence
  2. 『ユーザータグ』CSSの更新。20/03/22
  3. 【ブログ】独自ドメインに他社で取得したドメインをご利用いただけるようになりました - FC2総合インフォメーション
  4. 【ブログ】トップページに固定表示する記事を作成できるようになりました - FC2総合インフォメーション
  5. コメント欄の「文字修飾ツール」を削除する場合の手順 - Heart on my sleeve。により20/04/05「コメント装飾ツール」を除去した。
    <script type="text/javascript" src="<%template_comment_js>"></script>
  6. ページネーションを上にも付ける - *Essence