WordPressの「ウィジェット」をスマホの時は非表示にする方法

WordPressでホームページを作成していると、「ウィジェット」という表示項目があります。

↓のように画面の上下左右にカテゴリーや検索バー等を配置できる便利な機能です。

%e3%82%a6%e3%82%a3%e3%82%b7%e3%82%99%e3%82%a7%e3%83%83%e3%83%88%ef%bc%bf%ef%bc%91

コーディング等が必要ないので本当に誰でも簡単に見やすいサイトが作れるわけですね。

しかし、スマホで表示せた場合何もしないと「ウィジェット」が表示されます。

スマホの画面は小さいので「ウィジェット」が画面を占領したら見にくいですし綺麗じゃないですよね。

目次

実際に非表示設定をしてみましょう!

下図はスマホのスクリーンショットですが、検索バーが貴重な画面面積を占めていてナンセンスですよね

screenshot_2016-09-11-08-44-50

パソコンでは表示させて、スマホでは非表示にする設定を行いましょう。

プラグインの「Widget Options」をインストールします。

プラグインの新規追加から検索で「Widget Options」を入力すれば出てきます。

日本語で「ウィジェット設定」というやつをインストールして有効化してください

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-09-11-8-55-12

次に、ウィジェットのメニューへ移動します。

下図のように設定項目が追加されています。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-09-11-8-58-34

・モバイルのタグを選択し(目の左側のタブ)

・Hide/Show をHide on checked devices にします。(デフォルト)

・Devices のMobileにチェックをいれます。

・保存を押します。

上図の様になっていればOKです。

さて、スマホとパソコンの画面を見てみましょう

screenshot_2016-09-11-09-04-47

スマホ

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-09-11-9-11-14

パソコン

パソコンでは正常に表示されていますが、スマホでは非表示にする事ができました。

最後に

「Widget Options」はこの他にも色々と応用できます。

例えば、ホーム表示の時はウィジェットの「最近の投稿」を非表示にする等(このホームページがそおなっている)

色々試してみて、合理的で見やすいホームページにテューニングしていきましょう。

コメント

コメントする

目次