2020年4月31日 配布終了致しました。ご利用頂きありがとうございました。


Stoicテンプレートはレスポンシブウェブデザインです。
パソコン・タブレット・スマートフォン等全デバイス間共通でお使いいただけます。
「スマートフォン版の表示設定」を「無効にする」に設定してご利用ください。
設定ページ
- コメント返信のJS変更
- jQueryを3.4.1にアップデート
パソコン | タブレット | スマートフォン |
![]() |
![]() |
![]() |
Blue 1カラム Brown 2カラム |
Blue 1カラム Brown 1 or 2カラム (デバイス幅依存) | 1カラム |
Blue サイドメニュー --- 下 Brown サイドメニュー --- 右 |
Blue サイドメニュー --- 下 Brown サイドメニュー --- 右 or 下(デバイス幅依存) | サイドメニュー --- 下 |
本ページの内容は2019年1月9日メンテナンス以降のバージョンが対象です。
グレートストイックが!!! 。゚(´。∩ω∩`。)゚。
(How to train your dragon) ← わかる方いますか。
すといっく ぶるー/ ぶらうん ( ゚Д゚)ノ
此度は超シンプル 初心者の方向け(たぶん)
サンプル
Samples
StoicBrown
カスタマイズのコツ
A few tips on customizing
1. カスタマイズ対象部位の見つけ方
カスタマイズをブラウザ上で行う方は
Ctrl + F --- Windows
Command + F --- Mac
キー検索を利用するとページ内の対象文字列をすぐに見つけることができます。
2. ご質問の前に
カスタマイズされるであろうと想定される部位については 予めガイダンスを付けてあります。
注)
で検索すると出てきますので、カスタマイズ前にご確認ください。
もしかしたら既に答えが記されているかもしれません。
3. 全角スペースの利用に注意
ソースコードの見た目(文頭)を揃えるために 全角スペースを利用してしまう方が大変多いです。
この全角使用が思わぬレイアウト崩れを引き起こすことがあります。
ソース内でスペースを打つ必要がある時はキーを押下する前に半角に変更する癖付けをしましょう。
お受けできないご質問・ご相談
I'm sorry I couldn't be of any help.
- サイドバーの形状変更
- レスポンシブを固定幅化
- デフォルトテンプレートと無関係なhtml, CSS, JS等導入の手引き
- テンプレートの仕様やデザインを著しく変えてしまうようなカスタマイズの手引き
必須個人設定
Necessary personal settings
スマートフォン版の表示設定「利用しない」

レスポンシブ設定。パソコン・タブレット・スマートフォンなど全てのデバイス閲覧を本テンプレートで共通化します。この設定を怠るとスマートフォンではスマートフォン専用テンプレートで表示されてしまいます。
検索バーの設定「利用しない」

タブレット端末で検索バーがビューポートを超過する(はみ出す)ため。
コメント設定 > コメンテーターの情報「記憶する」

管理人コメントにプロフィールアイコンを表示できます。この設定を怠ると表示できません。
Font Awesomeについて
About Font Awesome
Font Awesome 5(SVG) を入れていましたが、どうにもこうにも動作が遅いものですから思い切って排除しました。Font Awesome(以下 FA と称す)のライブラリに頼らずインライン化することでパフォーマンスが若干改善されました。
FAがどうしても必要、という方はhtml内に
注)Font Awesome(JS)必要な方この一行削除
という形でコメント化してありますので、ガイダンスに従ってコメントの解除を行ってください。FAのメインJS+疑似要素が使えるようになります。
CSS(webフォント)のFAをご希望の場合にはFA本家サイトから直接コードを取得してください。
Font Awesome
JSかCSSかの選択も含め自己責任で導入をお願いします。テンプレートで表示しているアイコン類についてはFAのファイルと干渉しないはずです。
左右カラム入れ替えの仕方(StoicBrown)
How to reverse the direction of rows
#float-container { を検索されますとCSSソース内に4箇所ヒット、最初のものが対象です。この括りの padding: 30px 60px 100px; の直下に flex-direction: row-reverse; を 追加。
続きまして #primary { で検索。2箇所ヒットし、やはり最初のものが対象です。この括りの margin-right: 30px; 緑部分 right を left に変更。
以上2手順です。
ドミナントカラー
Dominant colors
以下が基本色調です。
数字の部分だけを抜き出してCtrl+Fキー検索されますと 不透明度つきのものも全て出てきますので上手に活用してください。
例) 51,51,51
Blue
rgb(26,36,47) | グラデーション濃色 |
rgb(154,177,199) | グラデーション淡色, リンク色, ボーダー色, ページ移動ボタン など |
Brown
rgb(151,145,146) | グラデーション濃色 |
rgb(218,208,198) | グラデーション淡色, リンク色, ボーダー色, ページ移動ボタン など |
削除可能なJSについて
Delete specific JS if you want to
特定条件下でしか利用しないJSが含まれていますが、特定条件に該当しない場合には無駄な内容 です。以下の2項目に当てはまる方は削除をおすすめします。
【FC2検索バーを利用しない人は削除】
<!-- 注)FC2検索バー非表示の方ここから削除可 -->
各々上記を目印にガイダンスに従って削除。
個別記事ページ送りを複製する方へ
Cautions when copying pagination in permanent page
2020.3.25バージョンから個別記事のサムネイルつきページ送りを複製掲載できるようにしました。html内の <!-- 個別記事ページナビ --> から <!-- 個別記事ページナビここまで --> までをコピーし、掲載希望場所へペーストしてください。
ご質問・ご相談時のお願い
Cautions before asking for something.
ご質問 不備・不具合のご報告はお気軽にどうぞ。
その際には
・ ご自身のブログアドレスの明記 (鍵付きで構いません)
・ 該当テンプレートを設定状態に
・ 右クリック禁止の解除
上記3点をお約束としてくださいね。
お守り頂けない場合にはお答え致しませんので 自己解決でお願いします。
また、質問を投げっぱなしで放置する方は以降二度と回答することはありませんのでご理解をお願いします。
いつもありがとうございます (●'0'●)/
- Quiet (配布終了 2018年8月6日)2016/03/30
- BetweenNeo - FC2ブログテンプレート(配布終了 2020年4月31日)2016/02/01
- Fields - FC2ブログテンプレート(配布終了 2020年4月31日)2016/01/08
- Bliss - FC2ブログテンプレート(配布終了 2020年4月31日)2015/12/11
- GrungeFlower_resp - FC2ブログテンプレート「配布終了 2019年2月6日」2015/11/23
- WorldOfMine - FC2ブログテンプレート「配布終了 2019年2月6日」2015/11/14
- Faint - FC2ブログテンプレート「配布終了 2019年2月6日」2015/10/14
- BeHappy - FC2ブログテンプレート「配布終了 2019年2月6日」2015/09/07