WordPressのサイドバーをsingle.phpから削除する方法

「WordPressのサイドバーって、どうやって single.php から削除するの?」って疑問を、さくっと解決します。
サイドバーを「display: none;」じゃなくて、そもそも読み込まないようにして、ワンカラムにしたくないですか?
サイドバーを呼び出している文言がわからないと、サイドバーを直接削除するのって、むずかしいんですよね。
PHP ファイルは、編集をまちがえるとブログを表示できなくなることもあります...
今回の記事でできること |
---|
サイドバー削除まえ |
![]() |
サイドバー削除あと |
![]() |
参考記事:Macでやる!!DTMライブ配信講座|誰でもできるやり方を徹底解説 |
というわけで今回は、WordPress のサイドバーを single.php から削除する方法を解説します。
目次
WordPressのサイドバーをsingle.phpから削除する方法
get_sidebar();
WordPressのサイドバーをsingle.phpから削除する方法を、解説します。
今回は、TCD「Bloom」というテンプレートの編集について、忘備録的に書き記したメモになります。同じ環境の人にとって、参考にあれば幸いです。それでは、いってみよ〜!
1.外観のテーマエディターから、single.php をひらく
外観のテーマエディターを、ひらきましょう。まずは、WordPress のダッシュボードをひらきますよ。
つづけて左サイドバーの外観 にある テーマエディター をクリックしてください。
テーマファイルにある single.php を、クリックします。
single.php ファイルがひらいたら、オッケーです。
2.サイドバーのよびだしコードを削除する
サイドバーのよびだしコードを、削除していきましょう。
single.php ファイルがひらいたら、以下の文言をみつけてください↓
get_sidebar();
今回は TCD「Bloom」で説明していきますが、WordPress ブログならサイドバーを呼びだす文言は一緒のはずですよ。
当メディアの環境では、こんな感じで「get_sidebar();」を削除してみました。
ファイルを更新 を、クリックしてください。
ブログを確認すると、こんな感じになっているはずです↓
変更まえ |
---|
![]() |
変更あと |
![]() |
参考記事:Macでやる!!DTMライブ配信講座|誰でもできるやり方を徹底解説 |
このままだと、サイドバーぶんの余白がのこってしまいますよね。
次の見出しで、デザインを整えていきましょう。
3.CSS でデザインを整える
.l-primary {width: 100%;}
.l-inner {max-width: 1200px;}
それでは、CSS でデザインを整えていきます。
クラス名「.l-primary」に「width: 100%;」をわりあてたのは、ワンカラムにしたいので記事の幅を、横いっぱいに広げるためです。
クラス名「.l-inner」に「max-width: 1200px;」を指定したのは、おおきいディスプレイで広がりすぎないようにするためですよ。
するとこんな感じで、ブログからサイドバーが消えて、記事だけのワンカラム表示にすることができます↓
いい感じですね!サイドバーがきえて、ワンカラムのブログにすることができました。
single.php の編集は、ブログが表示できなくなる可能性もあるので「投稿の属性」でテストするといいですよ。やり方は、次の見出しで解説しています!
ここまでで、「WordPressのサイドバーをsingle.phpから削除する方法」の解説は終了です。おつかれさまでした。
PHP の編集はむずかしいので、投稿の属性でまずは試してみよう!
PHP の編集はむずかしいので、投稿の属性でまずは試してみてください。PHP は、ちょっとでも構文をまちがえると、ブログが表示されなくなってしまうんですよ。
「投稿の属性」という機能をつかうことで、テスト環境がなくてもテストができる〜みたいなことができてしまいます。もし記事が表示できなくなったときも、投稿の属性をかえるだけでもとに戻るようなので、初心者におすすめです!
詳しやり方は、記事「WordPressに投稿の属性テンプレートを追加する方法」にまとめてありますので、よんでみてください!

まとめ
WordPressのサイドバーをsingle.phpから削除する方法を、まとめてみました。まとめると、こんな感じでした↓
get_sidebar();
.l-primary {width: 100%;}
.l-inner {max-width: 1200px;}
↑うえのコードを削除して、CSS を追加するだけでオッケーでしたね。やることはむずかしくないのですが、PHP の編集はなかなかこわいので、しっかりバックアップをとってから行うようにしてください。
ブログをワンカラムにすることで。スマホとおなじようなデザインにできますよね。だから、見た目の統一感もでて、デザインを考える効率性もあがります。ぜひ、参考にしてみてくださいね。
そんじゃあ、今回はこの辺で!? そのほか、WordPress やブログに関する悩みや便利な使い方をまとめた記事がありますので、あわせてこちらもどうぞ!

※画像:WordPress 操作画面より引用させていただきました
※掲載内容は記事作成時のものであり、現在は変更になっている場合があります。また PHP ファイルを編集するため、あくまでも自己責任にてご参考にしていただきますようお願いいたします。