

スマフォもシングルカラムだし、PCもいっそのことシングルカラムにしたいなあ
JIN のカテゴリページは、デフォルトで2カラム。これを設定で変更することはできません。テンプレートファイルを編集して実現する方法をご説明します。
- JIN のカテゴリページを1カラムにする前準備
- JIN のカテゴリーページを1カラムにする方法
あと、1カラムにする利点について気がついたことがあるので合わせてご紹介します。
JIN のカテゴリページは2カラムのみ
JIN は、この設定を変更することはできません。
過去、同じことを検索していた人もいましたが、サポート側からの回答は自分で解決してください、とのことでした。
ちょうど私もカテゴリページを1カラムにしたかったので、テーマファイルを触ってみたらうまくいったのでシェアします。
JIN のカテゴリページを1カラムにする前の準備
少しだけ準備が必要です
- FTPでサーバーへ接続することができること
- テーマファイルは JIN の子テーマを使っていること
FTP でサーバーへ接続する
FTP は、コンピュータとサーバーを接続するためのアプリケーション。テーマファイルを編集する時は必須のアプリです。
サーバーで用意してある FTP 画面でも同じことができます。しかし、操作はアプリの方が楽ので、できればアプリを用意しましょう。
FTPの接続方法、設定方法などについては、契約しているサーバー会社のマニュアルなどを参考にしてください。
FTP アプリは、Windows なら FFFTP、Mac ですと、Filezilla がそれぞれ無料で使えるのでおすすめです。
テーマファイルは JIN の子テーマを使っていること
WordPress のテーマは、親テーマと子テーマがあります。
まず、WordPress のテーマ設定で、JIN の子テーマであることを確認してください。


子テーマは、親テーマのファイルに渡したい命令などを書くと、親テーマよりも優先して実行してくれます。
今回、親テーマにあるファイルを子テーマにコピーし、それを加工して読み込ませることで、カテゴリページの1カラム化を実現しています。
WordPress へアップロードして有効化するだけですぐに利用できるようになります。
JIN のカテゴリページを1カラムにする方法
次のような流れになります。
FTP で WordPress サイトへ接続する
wp-content → themes → jin へ移動する
jin フォルダ内の、category.php をダウンロードする
※このファイルはバックアップファイルにもなります。
ファイルを jin-child フォルダへアップロードする
WordPress の管理画面へ移動
外観→テーマファイルエディタを選択して編集画面へ移動する。
右上のテーマ選択が、Child になっていることを確認する
category.php を開いて書き換える
書き換える場所は次のとおりです。
1.idの中身を書き換える
21行目と、56行目の二ヶ所ありますので注意してください。
<main id="contents" class="main-contents <?php echo is_article_design(); ?> <?php is_animation_style(); ?>" itemscope itemtype="https://schema.org/Blog">
⬇
<main id="onecolumn960" class="main-contents <?php echo is_article_design(); ?> <?php is_animation_style(); ?>" itemscope itemtype="https://schema.org/Blog">
2.サイドバーをコメントアウトする(128行目)
<?php get_sidebar(); ?>
⬇
<!-- ?php get_sidebar(); ? -->
保存して表示を確認する
「キャッシュクリア」してブラウザで表示確認をしましょう。
▽ショートカットキー
- Mac:Command + Shift + R
- Windows:Ctrl + Shift + R or Ctrl + F5
見た目の微調整をする
少しだけ見た目調整をしてみました。

本文の外枠を消す
せっかく広々となったのでコンテンツの外枠を外して広々と見えるようにしました。
フッターの幅を全幅にする
フッターの幅がコンテンツ幅だとバランスが悪く見えるので、全幅にしました。
JIN を1カラムにして出来なくなること
1カラムにすると、ウィジェトが表示されなくなります。
表示されなくなるウィジェトの場所は次のとおりです。
- サイドバー
- サイドバー追尾【PC】
- トップページ上部
- トップページ下部
- 記事上部
- 記事下部
どうしてJIN のカテゴリページを1カラムに?
1カラムにしたかった理由は次の通り。
- トップページや投稿ページを1カラムにしたのに、カテゴリだけならなかった
- ページ表示スピードが上がる
いままではサイト回遊率とか広告を配置のためという理由で2カラムにしていました。
ですが、実際にその部分をみるのって、よほどブログ記事がよかった、もっと読みたいと思った時くらいではないでしょうか。
普通に読んでいると逆に邪魔に感じることが多くないですか?
1カラムの内容に集中して欲しい、読み手も記事に集中できる、というメリットがあるのではないかと。
ページスピードは、実際にご自分のサイトで試してみてほしいのですけど、投稿ページを1カラムにするだけで表示スピードが上がります。
決して難しくはないので、もし1カラムにしたいなあというときは試してみてください。
最後まで読んでくださりありがとうございました。
おまけ:JIN 以外のテーマでカテゴリーページを1カラムにできる?
少し気になったので他のテーマはどんな感じなのか調べてみました。
SWELL のカテゴリーページ
SWELL のカテゴリーページ設定は、カテゴリーページで編集することができます。
- 投稿 → カテゴリー へ進む
- カテゴリーを一つ選んで編集画面へ移動する
- 編集画面でサイドバーの部分を非表示にする
SWELL のカテゴリーページは、ブログパーツを呼び出すことで、追加情報を表示させることができます。
Lightning G3 のカテゴリーページ
Lightning G3 のカテゴリーページは、カスタマイズページで編集できます。
- 外観 → カスタマイズ → Lightning レイアウト設定 → カラム設定
- アーカイブページ [投稿] の設定を1カラムにする
Lightning のカテゴリーページは、カテゴリーリスト一覧を表示できますが、JIN や Lightning のように追加情報を表示させることができません。
追加情報を表示させるには、別のカスタマイズが必要なようです。

ウィジェットを挿入できたりするかと思ったけれど、それも無さそうなので、phpファイルを弄るほうが早いかも。
Cocoon のカテゴリーページ
Cocoon は、カテゴリーページに設定があります。また、追加情報を加える場所があるので、カテゴリーリスト以外に情報を追加することができます。
Cocoon が一番シンプルにカテゴリーページを作れる。