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

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

WordPress

「WordPressのサイドバーって、どうやって single.php から削除するの?」って疑問を、さくっと解決します。

サイドバーを「display: none;」じゃなくて、そもそも読み込まないようにして、ワンカラムにしたくないですか?

サイドバーを呼び出している文言がわからないと、サイドバーを直接削除するのって、むずかしいんですよね。

PHP ファイルは、編集をまちがえるとブログを表示できなくなることもあります...

今回の記事でできること
サイドバー削除まえ
Getsidebar before
サイドバー削除あと
One column sample
参考記事:Macでやる!!DTMライブ配信講座|誰でもできるやり方を徹底解説

というわけで今回は、WordPress のサイドバーを single.php から削除する方法を解説します。

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

削除するコード
get_sidebar();

WordPressのサイドバーをsingle.phpから削除する方法を、解説します。

今回は、TCD「Bloom」というテンプレートの編集について、忘備録的に書き記したメモになります。同じ環境の人にとって、参考にあれば幸いです。それでは、いってみよ〜!

1.外観のテーマエディターから、single.php をひらく

外観のテーマエディターを、ひらきましょう。まずは、WordPress のダッシュボードをひらきますよ。

つづけて左サイドバーの外観 にある テーマエディター をクリックしてください。

テーマファイルにある single.php を、クリックします。

single.php ファイルがひらいたら、オッケーです。

2.サイドバーのよびだしコードを削除する

Getsidebar01

サイドバーのよびだしコードを、削除していきましょう。

single.php ファイルがひらいたら、以下の文言をみつけてください↓

削除するコード
get_sidebar();

今回は TCD「Bloom」で説明していきますが、WordPress ブログならサイドバーを呼びだす文言は一緒のはずですよ。

Getsidebar02

当メディアの環境では、こんな感じで「get_sidebar();」を削除してみました。

ファイルを更新 を、クリックしてください。

ブログを確認すると、こんな感じになっているはずです↓

変更まえ
Getsidebar before
変更あと
Getsidebar after
参考記事:Macでやる!!DTMライブ配信講座|誰でもできるやり方を徹底解説

このままだと、サイドバーぶんの余白がのこってしまいますよね。

次の見出しで、デザインを整えていきましょう。

3.CSS でデザインを整える

追加した CSS コード
.l-primary {width: 100%;}
.l-inner {max-width: 1200px;}

それでは、CSS でデザインを整えていきます。

クラス名「.l-primary」に「width: 100%;」をわりあてたのは、ワンカラムにしたいので記事の幅を、横いっぱいに広げるためです。

クラス名「.l-inner」に「max-width: 1200px;」を指定したのは、おおきいディスプレイで広がりすぎないようにするためですよ。

するとこんな感じで、ブログからサイドバーが消えて、記事だけのワンカラム表示にすることができます↓

One column sample

いい感じですね!サイドバーがきえて、ワンカラムのブログにすることができました。

single.php の編集は、ブログが表示できなくなる可能性もあるので「投稿の属性」でテストするといいですよ。やり方は、次の見出しで解説しています!

ここまでで、「WordPressのサイドバーをsingle.phpから削除する方法」の解説は終了です。おつかれさまでした。

PHP の編集はむずかしいので、投稿の属性でまずは試してみよう!

Wp article attribute icatch

PHP の編集はむずかしいので、投稿の属性でまずは試してみてください。PHP は、ちょっとでも構文をまちがえると、ブログが表示されなくなってしまうんですよ。

「投稿の属性」という機能をつかうことで、テスト環境がなくてもテストができる〜みたいなことができてしまいます。もし記事が表示できなくなったときも、投稿の属性をかえるだけでもとに戻るようなので、初心者におすすめです!

詳しやり方は、記事「WordPressに投稿の属性テンプレートを追加する方法」にまとめてありますので、よんでみてください!

まとめ

WordPressのサイドバーをsingle.phpから削除する方法を、まとめてみました。まとめると、こんな感じでした↓

削除するコード
get_sidebar();
追加した CSS コード
.l-primary {width: 100%;}
.l-inner {max-width: 1200px;}

↑うえのコードを削除して、CSS を追加するだけでオッケーでしたね。やることはむずかしくないのですが、PHP の編集はなかなかこわいので、しっかりバックアップをとってから行うようにしてください。

ブログをワンカラムにすることで。スマホとおなじようなデザインにできますよね。だから、見た目の統一感もでて、デザインを考える効率性もあがります。ぜひ、参考にしてみてくださいね。

そんじゃあ、今回はこの辺で!? そのほか、WordPress やブログに関する悩みや便利な使い方をまとめた記事がありますので、あわせてこちらもどうぞ!

【関連】ブログ記事まとめ | サウンドテック・ラボ

サウンドオルビス

3,507,213 views

サウンドテック・ラボ編集部兼ライター。「音楽×テクノロジー」をキーワードに、毎日記事を更新中。DTM音楽制作のハウツーや最新情報で、あなたの「やってみたい!...

プロフィール

ピックアップ記事

カテゴリ内の記事