


Corridorテンプレートはレスポンシブウェブデザインです。
パソコン・タブレット・スマートフォン等全デバイス間共通でお使いいただけます。
「スマートフォン版の表示設定」を「無効にする」に設定してご利用ください。
設定ページ
名称 | Corridor |
動作確認済みブラウザ |
![]() ![]() ![]() ![]() ![]() ![]() |
トップページ記事並び | 要約表示タイプ |
記事幅 | メイン --- 最大787px サイド --- 260px |
記事内で使える見出しレベル | h2からh6まで |
jQuery導入 | あり(v3.4.1) |
Font Awesome導入 | なし(インラインSVG) |
Lazyloading導入 | あり |
構造化マークアップ | 個別記事のみ 「BreadcrumbList(パン屑リスト)」 「BlogPostiong」 |
Page Speed Insigtsスコア |
![]() |
固有機能 |
・ 画像にドロップシャドウ ・ 動画縦横比固定 使い方詳細はARTICLE DEMOを参照 |
推奨カスタマイズ | 左右カラム入れ替え, 色調変更 |
ライセンス |
Required 必須事項 ・Designer Note and Backlink 製作者表記と当ブログへのリンク (Designed by) Permitted 許可事項 ・Modification 改変 ・Personal Use 個人利用 ・Commercial Use 商用利用 Forbidden 禁止事項 ・Distribution 再配布 ・Hold Liable 使用にあたっての損害・損失に対する責の一切を負いません |
備考 |
スマートフォンのみサイドメニューがドロワーに切り替わります。
![]() |
パソコン | タブレット | スマートフォン |
![]() |
![]() |
![]() |
2カラム | 1カラム or 2カラム (デバイス幅依存) | 1カラム |
プラグイン1, 2 --- 右 プラグイン3 --- 下 | プラグイン1, 2 --- 下 or 右(デバイス幅依存) プラグイン3 --- 下 | プラグイン1, 2 --- 右ドロワー プラグイン3 --- 下 |
- FC2ブログ新機能「SEOアドバイザー」対応のためのhead要素記述方法変更
- jQueryを3.6.0にアップデート
- スマートフォンでコメント送信ボタンのテキストが見づらい件修正
カスマイズ済みなどで再適用が困難な場合でもまずは修正済みテンプレートの再DLを行ってください。最新のhtmlと比較しての作業をおすすめします。
【head内容変更】
<head prefix を目印に検索し、このhead要素を最新バージョンのそれと差し替え。
【jQueryバージョンアップ】
/jquery/ の直後の数字を 3.6.0 に変更。
【送信ボタン修正】
#sendbtn, で検索するとスタイルシート内に1箇所あります。このルールセットの transition: .3s ease-in-out; の直下に color: rgb(51,51,51); を追加。インデントにタブや全角スペースを利用しないよう注意。
本ページ内容は2018年12月29日メンテナンス以降のバージョンが対象です。
ほっちきちーが降板 (´・ω・`)
豆知識: ほっちきちー = ホッチナー警部 = クリミナル・マインドの中の人
だからなんなんだって話しですけど(毎度すみません)
こりどー
承認されました。ありがとうございます。
サンプル
Samples
カスタマイズのコツ
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
スマートフォン版の表示設定「利用しない」

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

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

管理人コメントにプロフィールアイコンを表示できます。この設定を怠ると表示できません。
スクロールアンカーについて
About scrolling ancho
左右いずれかのカラムの縦(高さ)が一方よりも短いときにスクロールで画面外へ流れていかないようストップがかかります(スクロールアンカー)
現時点で以下のような注意点があります。
- 「特定のプラグインやウィジェットのJS内容 + Google Chromeのグリッチ」でChromeブラウザ上でプラグイン・ウィジェットが表示されなくなる
- アフィリエイトによってはスクロールアンカーへの掲載禁止
特定のプラグインに該当する具体的なものは「FC2動画」「FC2カウンター」「アフィリエイト」など、JSで内容を取り込むタイプのものです。表示されない、という症状が出ている場合には スクロールアンカーの解除を行ってください。
注)スクロールアンカー不要の方 で検索すると該当部位が出てきますのでガイダンスに従って削除をお願いします。
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のファイルと干渉しないはずです。
プラグイン表示位置について
Classification of plugin
パソコンなど大きな画面ではプラグイン1と2は右に、プラグイン3は下に表示されます。また、スマートフォンでは プラグイン1と2はドロワー内への掲載 になりますので、折り畳まれたくないものはプラグイン3への登録をお願いします。
プラグイン3を使わない(フッター上サイドメニューを使わない)という方はソース内から該当箇所を削除してください。
注)プラグイン3を利用しない場合はここから削除
削除せずともレイアウトには影響が出ませんが無駄な内容なので削除をおすすめします。
左右カラム入れ替えの仕方
How to reverse the direction of rows
#main-container { を検索されますとCSSソース内に4箇所ヒット、最初のものが対象です。この括りの padding: 40px 60px 80px; の直下に flex-direction: row-reverse; を 追加。
続きまして #primary { で検索。2箇所ヒットし、やはり最初のものが対象です。この括りの margin-right: 40px; 緑部分 right を left に変更。
以上2手順です。
No image画像変更
How to change alternative image
記事内の然るべき箇所に画像が存在しない場合に代替として表示するNo image画像を変更する場合は
https://blog-imgs-93.fc2.com/v/a/n/vanillaice000/corridornoimage.jpg
上記が該当URLですので全て差し替えてください。最適サイズは横800程度、縦横比不問ですが横長推奨。
画像上の白いオーバーレイとNo imageのテキストは自動で乗ります。
ドミナントカラー
Dominant colors
以下が基本色調です
数字の部分だけを抜き出して検索されますと 不透明度つきのものも全て出てきますので上手に活用してください(カラーコードクリックでコピーできます)
例) 51,51,51
rgb(250,250,250) | 全体背景色 |
rgb(51,51,51) | 基本文字色 |
rgb(220,227,233) | グローバルナビ背景色, タグホバー時背景色, フッター上SNSボタン背景色, ページ送りボタン背景色, トップページread moreボタン背景色 など |
rgb(200,207,213) | リボン切れ端の色 |
rgb(180,187,193) | ドロワーハンバーガーボタン(スマホのみ) |
削除可能な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'●)/
There are no comments yet.