WordPressの上部の黒いバー(ツールバー)を消す方法|ユーザー設定1つ

概要

WordPress上部の黒いバー(ツールバー)を消す方法について解説していきます。

というのもログイン中にサイト上部へ出てくるあの黒いバー、表示確認のときに意外と邪魔ですよね(- -;

しかも「黒いバー」で検索しても全然出てこないので、消し方を探すのに苦戦しがちです(自分はめっちゃ時間を使いました…)。

正解は「admin bar」「ツールバー」というキーワードで、ユーザー設定のチェックを1つ外すだけで消えます。

この記事では、まず一番かんたんな管理画面からの消し方を画像付きで紹介し、そのあとでfunctions.phpを使ってサイト全体や特定ユーザーだけ非表示にする方法、チェックを外しても消えないときの確認ポイントまでまとめていきます。
それではやっていきましょう!

ちなみにツールバーというのは下記の画像のようなものです。

wordpress 黒いバー(ツールバー)
wordpress 黒いバー(ツールバー)

このバーは正式には「ツールバー(admin bar / アドミンバー)」と呼ばれていて、ログイン中のユーザーにだけ表示される管理用のナビゲーションです。
便利なときもあるのですが、デザインの確認をしているときなどは実際の見た目とズレてしまうので消したくなりますよね。

目次

管理画面からツールバーを消す手順

一番かんたんなのは、管理画面のユーザー設定から消す方法です。
WordPressの管理画面を開き、下記の設定を行います。

設定内容

1
2
3
4
5
>>設定場所
管理画面 → ユーザー → ツールバー

>>設定内容
「サイトを見るときにツールバーを表示する」のチェックを外す

ちなみに設定画面は下記のように表示されていると思います。

wordpress 黒いバー(ツールバー) 表示の解除設定
wordpress 黒いバー(ツールバー) 表示の解除設定
チェックを"外す"です
間違えないようにしましょう!

設定を保存したら、一度サイト側(フロント画面)を再読み込みしてみてください。
このチェックを外すと、設定したユーザー本人のフロント表示からだけツールバーが消えます。

自分だけ消えればよいならこれで十分

この方法はログインしているユーザーごとの個人設定なので、管理画面の操作だけで完結します。
コードをいじる必要がなく、間違えてもチェックを戻すだけで元通りになるので、まずはここから試すのがお勧めです。

確認

この設定を行うと、下記のように黒いバー(ツールバー)が削除されているのが確認できると思います。

wordpress 黒いバー(ツールバー) 表示の解除設定
wordpress 黒いバー(ツールバー) 表示の解除設定

管理画面側(ダッシュボード上部)のバーはそのまま残り、フロント側だけスッキリ消えているはずです。
管理画面のバーまで消したいわけではないので、これでちょうど良い状態ですね(^^

functions.phpでサイト全体のツールバーを消す方法

「自分だけでなく、ログインする全員のフロント側からツールバーを消したい」という場合は、テーマのfunctions.phpにコードを追記する方法があります。
WordPressにはshow_admin_barというフィルターが用意されていて、これをfalseにするとフロント側のツールバーが表示されなくなります。

functions.php

1
add_filter( 'show_admin_bar', '__return_false' );

__return_falseはWordPress標準の関数で、単純にfalseを返すだけのものです。
これをshow_admin_barフィルターに渡すことで、サイト全体でフロントのツールバーを非表示にできます。

functions.phpの編集はサイト全体に影響します。
編集前にバックアップを取り、できれば子テーマ側で行うのが安全です。

特定の権限のユーザーだけ残したい場合

管理者だけツールバーを残して、それ以外のユーザーには消したい、というケースもありますよね。
その場合は、ユーザーの権限を判定して出し分けます。

functions.php

1
2
3
4
5
6
7
add_filter( 'show_admin_bar', function ( $show ) {
// 管理者だけツールバーを表示し、それ以外は非表示にする
if ( current_user_can( 'manage_options' ) ) {
return true;
}
return false;
} );

current_user_can( 'manage_options' )管理者権限を持っているかどうかを判定する標準のチェックです。
これで管理者には今まで通りバーを残しつつ、他のユーザーには非表示にできます。

チェックを外しても消えないときの確認ポイント

「設定を変えたのに黒いバーが残っている…」というときは、だいたい次のどれかが原因です。

  • 別のユーザーでログインしている
    • ツールバー設定はユーザーごとなので、複数アカウントを使っている場合は今見ているユーザーで設定したか確認する
  • キャッシュが残っている
    • キャッシュ系プラグインやブラウザのキャッシュが効いていることがあるので、スーパーリロードやキャッシュ削除を試す
  • プラグインやテーマが上書きしている
    • 一部のプラグインが独自にツールバーを出していることがあるため、一時的に無効化して切り分ける

特に多いのがキャッシュ残りです。
設定自体は正しいのに表示だけ古いまま、というのはありがちなので、消えないときはまずリロードを疑ってみてください(^^

まとめ:用途別の使い分け

ここまでの方法を整理すると、こんな使い分けになります。

  • 自分の画面だけ消したい
    • 管理画面のユーザー設定でチェックを外す(コード不要・一番かんたん)
  • ログインユーザー全員から消したい
    • functions.phpでshow_admin_barfalseにする
  • 権限ごとに出し分けたい
    • current_user_canで判定して出し分ける

まずは管理画面のチェックを外す方法で十分なケースが多いので、迷ったらユーザー設定から試すのがお勧めです。

締め

削除する方法について結構悩みましたが、無事かんたんに消すことができました。

基本的には「ツールバー」「admin bar」という単語にたどり着ければすぐ削除できるのですが、ここが自分には厳しかったです。。。
黒いバーってずっと検索してましたよ(- -;

とっかかりが難しいと思うので、もし皆さんの助けになれたら嬉しいです。

自分のブログではこんな感じで、自分が学んでいくうえで悩んだことや苦戦した内容をまとめております。
実務レベルで使用している技術も紹介していたりするので、良ければ他の記事も見ていってもらえると嬉しいです!

以上。
調べ物をするときはワードにたどり着くのが大変ですよね。。。
それではお疲れさまでした。