【WordPress】記事中でパソコンとスマートフォンの表示内容を切り替える方法【サクっとショートコードで実装♪固定ページもOK】
テンプレート内だったら wp_is_mobile() 関数を使えば切り替えられるけど、投稿や固定ページだったらどうするの・・・？ってことで調べてみました。
結果からいうと、 wp_is_mobile() に相当するショートコードを functions.php に実装します！
1.functions.phpに以下のコードを記述
//PCでのみ表示するコンテンツ
function is_pc($atts, $content = null ){
$content = do_shortcode( $content);
if(!wp_is_mobile()){
return $content;
}
}
add_shortcode('pc', 'is_pc');
// スマートフォンで表示するコンテンツ（タブレットも含む）
function is_sp($atts, $content = null ){
$content = do_shortcode( $content);
if(wp_is_mobile()){
return $content;
}
}
add_shortcode('sp', 'is_sp');
使い方
投稿や固定ページのエディタで、以下のように記述します。
パソコン [sp] スマートフォン [/sp]
まとめ
パソコン：スマートフォンを分けて書くこともできますし、スマートフォンだけ表示させたいときに使用できる便利なコードですね。私が持っているサイトでも、仕事で抱えているお客さんでもバリバリ使っているコートでとてもおすすめです。
ひと昔は、このような切り替えがWordPressの標準機能だけでは実装できなくて、「Exec-PHP」という少しセキュリティーリスクのあるプラグインを使用して実装していただけに、今は安全になってきたなぁと思います。
ちょっと前まで wp_is_mobile() なんて機能もなかったしね。