稼げる副業でお小遣いを稼ぐ方法

稼げる副業でお小遣いを稼ぐだけじゃなく、料理や映画アニメ、趣味などメモにも使っているブログ

副業で稼ぐ仕組みの作り方

スマホでアクセスした時だけ違う内容を表示させる方法

投稿日:2015年6月13日 更新日:

スマホとパソコンだと広告サイズが違うのでそれぞれ違う物を表示させたい時のテクニックをご紹介いたします。

はじめに

検索エンジンのアルゴリズム変更からスマホデザインも合わせて考えなければいけなくなりました。ただ、同じサイズの広告だとスマホだと正常に表示されないので、それぞれで違うサイズの広告を表示させる方法をご紹介いたします。

注意事項

サーバーによってはphpが利用出来ないものもあるので利用しているサーバーのプランを確認して下さい。

phpだけでスマホとパソコンの分岐をしたい

稼げる副業をしている人の中にはブログだけでなくホームページを持っている人もいらっしゃるでしょう。

まずはそんな方の為にphpだけでパソコンとスマホの分岐させる方法をご紹介いたします。


<?php $ua = $_SERVER['HTTP_USER_AGENT']; ?>
<?php if ((strpos($ua, 'Android') !== false) && (strpos($ua, 'Mobile') !== false) || (strpos($ua, 'iPhone') !== false) || (strpos($ua, 'Windows Phone') !== false)) : ?>
スマホの場合はここの項目を表示させる
<?php else : ?>
スマホ以外の場合はここの項目を表示させる
<?php endif; ?>

たったこれだけでスマホとそれ以外からのアクセス時のデザインを変更する事が出来ます。実際にテスト用で作成してみました。

スマホとパソコンの分岐のテスト

パソコンで見た場合

pcacc

 

パソコンで見た場合はこのように赤文字で表示させる事が出来ます。

スマートフォンで見た場合

IMG_1165

スマートフォンで見た時はこのように青文字で表示させる事が出来ます。

結構簡単でした。

タブレットも分岐出来ます

ちなみにパソコンやスマートフォンだけでなくタブレットでアクセスした際に表示させる事が出来ます。


<?php $ua = $_SERVER['HTTP_USER_AGENT']; ?>
<?php
if ((strpos($ua, 'Android') !== false) && (strpos($ua, 'Mobile') !== false) || (strpos($ua, 'iPhone') !== false) || (strpos($ua, 'Windows Phone') !== false)) : ?>

スマホの場合はここの項目を表示させる

<?php elseif ((strpos($ua, 'Android') !== false) || (strpos($ua, 'iPad') !== false)) : ?>

タブレットの場合はここの項目を表示させる

<?php else : ?>

上記以外の場合はここの項目を表示させる

<?php endif; ?>

こんな感じでタブレットの条件を追加する事でスマホ、パソコン、タブレットでそれぞれアクセスした際にそれぞれのサイズにあった広告や内容を表示させる事が出来ます。

以上でスマホでアクセスした時だけ違う内容を表示させる方法の説明を終了致します。

さいごに

広告サイズで収入に影響します

スマホでアクセスした際の情報切り替えはしっかりと行わなければいけません。

スマホで画面から広告がはみ出していたり、するとクリック率も下がりますし、何よりも見栄えがわるいですしね笑

今では若い人はパソコンを持たずにスマートフォンしか持っていない人も増えてきているので、よりスマホからのアクセスが増えると思います。

そう考えると稼げる副業をする場合はよりスマホデザインにこだわらなければいけないでしょう。

広告をアドセンスにするのではなく企業の広告を載せる場合はcssだけで何とか出来る場合もありますが、出来ればこのやり方を覚えておく方が良いでしょう。

-副業で稼ぐ仕組みの作り方

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

tinymce advancedに絵文字を増やすTypePad 絵文字 for TinyMCE

ワードプレスでも無料ブログ同様絵文字を使いたいけど、tinymce advancedだと少ないですよね。そこで今回はtinymce advancedで絵文字を増やす方法をご紹介させて頂きます。 関連記 …

Shopifyペイメントの設定とチャージバック

Shopifyペイメントの設定は簡単ですが 関連記事: shopifyの送料設定は素晴らしい shopifyでスタッフを追加する 【ゆうちょ】アリエクのアフィリエイト報酬を受け取りました ECのショッ …

クリックポストのラベル印刷や領収証について

クリックポストを初めて使う方は不安だと思いますので、こちらの記事を参考にして頂ければと思います。 関連記事: Custom Field Suiteの表示と分岐 Gmailを使ったメールの振り分け方法 …

ボタンのクリック率を上げる簡単なcss

マウスオーバー時に少し変化がある事でクリック率を高める事が出来ます。 関連記事: ネスタリゾートを100%遊びたい人へ【宿泊あり】 iPhoneアプリ内の広告を無料で消す方法 Yahoo!ショッピング …

tinymce advancedで絵文字もフォントサイズも可能に

ワードプレスって、顔文字が使えなかったり、フォントサイズがいじれなかったりと日本人のブログとしては微妙ですよね?そこでこれらを可能にするプラグインのご紹介です。 関連記事: tinymce advan …