WordPressでスマホだけキャッチ画像を表示させて直帰を減らすPHPコード

公開日: : 最終更新日:2015/03/02 WordPress


LINE facebook twitter URLコピー
B! pocket note 楽天


RSS購読のURLが変わりました。
新しいFEED購読方法を見る

DSCN6880

スマホファーストにしてます。

キャッチ画像にジェネレータを使ってみました、いい感じです。

さて、レスポンシブデザインにしているサイトで、実際にスマホで見ていますと、きれいに表示はされるものの、冒頭の部分が文字ばっかりになってしまうことがあります。うまくグリッドが回りこんでくれればいいのですが、その順番までコントロールするのは、結構面倒ですよね。

そこで、強制的にスマホだけ、キャッチ画像を表示させることにしました。WordPressであれば、関数でキャッチ画像URLなどがかんたんに取れますので、すぐに実装できます。

$UA = $_SERVER['HTTP_USER_AGENT'];
if (ereg("iPhone|iPod|Android.*Xperia|Mobile|Windows.*Phone", $UA)) {
	$files = get_post_meta($post->ID, '_thumbnail_id', true);
	$file = wp_get_attachment_url($files);
	echo "<img src='".$file."'/>";
}

最近のバイラルメディアなどを見ますと、タイトル文よりも上にキャッチが来ているサイトが多いので、記事タイトルなどに上記コードを入れておけば、スマホにだけ反応してキャッチ画像を表示してくれます。

WordPressはセキュリティさえ気をつければ、ほんとグロースハックのための改善がすぐにできますので、ほんと便利ですよね。

なお上記コードですが、どこかで見つけたのを使ってたような気がしますが、すみません失念しました・・。開発者の方に感謝申し上げます。


Web制作者のためのGitHubの教科書


本格ビジネスサイトを作りながら学ぶ WordPressの教科書 Ver.4.x対応版: プライム・ストラテジー株式会社

「キャッチ画像のかぶりには気をつけるのよ。」
  • このエントリーをはてなブックマークに追加
  • Pocket

Profile


Yoshihiko Yoshida
ブロガー兼ユーチューバー。個人事業主でネット業界のお仕事24年目です。40代で2児の父。「マツコの知らない世界」Googleマップ案内人TV出演。Googleストリートビュー認定フォトグラファー。教育システム情報学会会員。元立教大学非常勤講師。Googleアナリティクス公式コミュニティ・アンサリスト最高ランク「レジェンド」国内初獲得。主な著書「Googleアナリティクス基礎講座」(技術評論社)。趣味はデジカメとゲームとパン作り。>>もっと読む

Instagram

◆代表者略歴 ◆受賞歴
◆おもな著書 ◆TV出演歴
◆新聞掲載歴 ◆雑誌/連載歴
 <<お問い合わせはこちら>>

PAGE TOP ↑