「モバイルのみ表示するテキストウィジェット」をコピペ一発で作るWordPressカスタマイズ方法

サイバーマンデー
Amazonプライム会員限定の大セール「サイバーマンデー」開催中!プライム会員限定の大セール

昨今、サイト訪問者のモバイル利用率が増加の一途です。

それとともに、nendのようなスマホ用の高報酬広告が表示されるASPなんかも出てきました。

特にnendに限らずとも、ブログを運営している方の中には「スマホだけに広告を表示したい」 なんて思ったこともあるのではないかと思います。

そして、できれば「テキストウィジェットみたいに手軽に利用できる」なんてことができれば、運営者にとっても非常に楽です。というか、そういったテキストウィジェットを自分が欲しくなってしまいました。

ということで、そういったことが簡単にできるようになるカスタマイズをするためのWordpressコードを書いてみたので紹介です。

スポンサーリンク
レクタングル(大)広告

カスタマイズ方法

カスタマイズをするといっても、とても簡単です。

単に、functions.phpの最後にでも、以下のコードをペタッと貼り付けるだけです。

やっていることは簡単で、単にテキストウィジェットを自前で作成して、条件分岐でモバイル(スマホ)のみに表示しているだけです。

こういった方法は、「Widget Logicプラグイン」と「Wordpressデフォルトのテキストウィジェット」との組み合わせでも行うことはできます。

ただ、今回の方法だとプラグインをインストールする必要はありません。それに、インストール後、ウィジェット設定画面で、プログラムが苦手な人には複雑な条件分岐などを書く必要もなくコピペ一発でできるので、手軽に行えます。

functions.phpは、編集を失敗すると、画面が真っ白になってしまうので、編集前には、functions.phpのバックアップを取ってご利用ください。

モバイル用テキストウィジェットの使い方

上記のカスタマイズを行うと、「外観→ウィジェット」に以下のような「モバイル用テキストウィジェット」が表示されます。

ウィジェット設定画面に「モバイル用テキストウィジェット」か表示される

あとは、ウィジェットエリアに、「モバイル用テキストウィジェット」をドラッグ&ドロップします。

モバイル用テキストウィジェットを設置する

あとは、ウィジェットの設定項目に、以下を記入します

  • ウィジェットのタイトル(未入力で表示されない)
  • モバイルのみで表示するテキストもしくはタグ

モバイル用テキストウィジェットにテキストを記入する

すると、モバイル表示したときのみ表示される、以下のようなウィジェットを手軽に作成することができます。

モバイル用の広告など

まとめ

今回のカスタマイズコードは、多少長めですが、どこもコードを変更する必要がなく、ただfunctions.phpにペタッと貼り付ければ良いだけなので、結構手軽にできるのではないかと思います。

「モバイルユーザーに効果の高い広告を、モバイルのみに表示させたい」なんて場合には、なかなか良い方法なのではないかと思います。

パソコンのみに表示するウィジェットは以下。

「パソコンのみ表示するテキストウィジェット」をコピペ一発で作るWordpressカスタマイズ方法
前回、モバイルだけに表示されるテキストウィジェットの作成方法を紹介しました。 今回はその逆バージョンで、パソコンのみにされるテキス...

『「モバイルのみ表示するテキストウィジェット」をコピペ一発で作るWordPressカスタマイズ方法』へのコメント

  1. わいひら 名前:わいひら 投稿日:2016/06/24(金) 05:44:12 ID:742957fc9

    関連トピック。
    「モバイルのみ表示するテキストウィジェット」をコピペ~記事内のコードについて