TwentySeventeenで1カラム（シングルカラム）にする

2017年5月8日

先日、当サイトのテーマをTwentySixteenからTwentySeventeenに変更した。当サイトは1カラム（シングルカラム）である。一手間必要だったのでメモ。

謎のオフセット

サイドバーにウィジェットを設置しない1カラムレイアウトにすると、フロントページやアーカイブページ、固定ページに謎のオフセットが発生する（下図）。

謎のオフセット

何故こうなるのか、よくわからない。

対応

「Topic: Single column posts page in Twenty Seventeen? « WordPress.org Forums」を参考に対応した。

まず、固定ページの「カスタマイズ」→「テーマオプション」より、「1カラム」を選択する。

1カラムを選択

変更したら保存する。

これでなおればよいのだが、自分の場合、フロントページやアーカイブページは謎のオフセットが発生したままであった。で、参考ページにあったコードを、style.cssに追記する必要があった。

@media screen and (min-width: 48em) {
  .blog:not(.has-sidebar) #primary article, .archive:not(.page-one-column):not(.has-sidebar) #primary article, .search:not(.has-sidebar) #primary article, .error404:not(.has-sidebar) #primary .page-content
  {
    width: 100%;
  }
}

これを適用すると、オフセットは発生しなくなるが、余白の設定が本来と異なるようだ。

なお、style.cssを変更しても、ブラウザでページを閲覧すると、変更前のキャッシュが残っているためリロード（更新）しても変更が反映されないことがある。そのような時、即時変更を反映させるには、通常のリロードではなくスーパーリロードする（Mac版ChromeではCmd+Shift+R…参考記事「君は3つのリロードを知っているか？ - os0x.blog」）。

後日、上記コードをコメントアウトしてみたところ、一時的にオフセットが発生せず、適切な余白のある1カラムとなり、「アレ？やっぱりいらないのか？」と思ったのだけれど、その翌日にサイトを確認すると、やはりまたオフセットが発生していた。どうにもよくわからない。