AFFINGER5

AFFINGER5でスマホのみサイドバーウィジェットを非表示にする方法

投稿日:

WordPressテーマ「AFFINGER5(WING)」でスマホページのみサイドバーのウィジェットを非表示にする方法をご紹介します。

AFFINGER5独自のショートコード[pc]で囲んで個別に非表示にすることもできますが、この方法ではメニューで作成した「サイドバーメニュー」などは非表示にできないため、別の方法をご紹介します。

5分でできます。

ちなみに、このサイトは1カラム設定です。

サイドバーを非表示にする方法

AFFINGER5でスマホページ(タブレットも)のみ、サイドバーのウィジェットを非表示にするには、「sidebar.php」を編集します。

  1. 「sidebar.php」を開く
  2. 「<?php if(!wp_is_mobile()): ?>」と「<?php endif; ?>」で囲む

<>は半角にしてください。

「sidebar.php」を開く

AFFINGER5の「sidebar.php」を開きます。

sidebar.phpは、サーバーのファイルマネージャーにログインして、対象のドメイン>「public_html」>「wp-content」>「themes」>「affinger5」>「sidebar.php」の順にクリックすれば見つかります。

※親テーマの場合。サーバーのファイルマネージャーへのアクセス方法は、各サーバーごとに異なるので、各自調べてください。

「<?php if(!wp_is_mobile()): ?>」と「<?php endif; ?>」で囲む

sidebar.phpを開いたら、1行目に

<?php if(!wp_is_mobile()): ?>

を追記して、最後(54行目あたり)に

<?php endif; ?>

を追記して、囲みます。

<?php if(!wp_is_mobile()): ?>は、条件分岐タグです。スマホとタブレットで見たときに非表示にできます。

AFFINGER5でスマホのみサイドバーウィジェットを非表示にする方法1

sidebar.phpの1行目に追記する条件分岐タグ

AFFINGER5でスマホのみサイドバーウィジェットを非表示にする方法2

sidebar.phpの最後に追記する条件分岐タグ

<?php if(!wp_is_mobile()): ?>と<?php endif; ?>で囲むことで、スマホとタブレットで見たときに

  • サイドバートップ
  • サイドバーウィジェット
  • スクロール広告用

の3つを一括で非表示にできました。もちろん、パソコンでは表示されています。

まとめ

AFFINGER5でスマホ・タブレットのみ、サイドバーを非表示にするには、「sidebar.php」を編集します。

方法は、sidebar.phpを「<?php if(!wp_is_mobile()): ?>」と「<?php endif; ?>」で丸ごと囲みます。

こうすることで、「サイドバートップ」「サイドバーウィジェット」「スクロール広告用」のウィジェットを、スマホ・タブレットのみ非表示にできました。

公式にはサポートされている方法ではないので、自己責任でカスタマイズしてくださいね。

管理人

この記事を書いた人

管理人

このサイトのほか、いろんなブログをWordPressで作っている男。テーマはAFFINGER5を愛用。管理人が使用しているレンタルサーバーはこの3つ

さいごまで読んでいただき、ありがとうございました。この記事が役に立ったら「シェア」していただくとウレシイです。

-AFFINGER5

Copyright© ボクアフィ , 2019 All Rights Reserved.