タグ別アーカイブ: 広告

google adsenseの広告をPC用とスマフォで振り分ける

サイトを運営していると、各閲覧環境である程度の見た目を保証しないといけなくなります。

google adsenseもその一つ。広告収入なんて雀の涙ですが、ある方がやはりやりがいが出ます。そのついでにこうやって記事のネタにもなります。

今回はphpで閲覧者のブラウザを判定してPC用とスマフォ用に振り分けて広告を表示しましょう。

参考にしたのはこちら。
[WP] wp_is_mobile と iPad と WP Super Cache の怖い関係 – @mekemoke

function is_mobile(){
$useragents = array(
'iPhone', // iPhone
'iPod', // iPod touch
'Android.*Mobile', // 1.5+ Android *** Only mobile
'Windows.*Phone', // *** Windows Phone
'dream', // Pre 1.5 Android
'CUPCAKE', // 1.5+ Android
'blackberry9500', // Storm
'blackberry9530', // Storm
'blackberry9520', // Storm v2
'blackberry9550', // Storm v2
'blackberry9800', // Torch
'webOS', // Palm Pre Experimental
'incognito', // Other iPhone browser
'webmate' // Other iPhone browser
'webmate' // Other iPhone browser
);
$pattern = '/'.implode('|', $useragents).'/i';
return preg_match($pattern, $_SERVER['HTTP_USER_AGENT']);
}

自分でユーザーエージェントをそれぞれ調べるのは大変だったので、大変助かりました。そのままお借りして、こうします。

function googlead() {
if(is_mobile()) { //携帯デバイス
$ad = <<<"EOD"
<div class="googlead">
<!-- aowork mobile -->
<ins class="adsbygoogle"
style="display:inline-block;width:320px;height:100px"
data-ad-client="ca-pub-6633816946643511"
data-ad-slot="9684763319"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
EOD;
} else {
$ad = <<<"EOD"
<div class="googlead">
<!-- aoringo worksS -->
<ins class="adsbygoogle"
style="display:inline-block;width:468px;height:60px"
data-ad-client="ca-pub-6633816946643511"
data-ad-slot="6565776112"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
EOD;
}

return $ad;
}

これでスマフォとPCで広告表示を変える事が出来ますね。広告以外にも、色々な場所で利用する事がでできるかと思います。

google adsenseの広告が消えた!!「PIN」入力忘れずにネ!

キエテル!

何でですか! なんで消えてるんですか!! 1円とかしか入らなくても立派な収入源なんです! モチベーションの要なんです! 私から取らないでよ! とらないでよー!!!!

とか思ってたら

PINとやらが未入力だったようです。テヘペロ。

郵便物として送って貰うそうなので早速手配。届きました。

届くのはこんな感じの袋とじはがき。わざわざアメリカから飛んでくるみたいですよ。すげえな。

ささっと入力して警告が非表示になるのを確認。あとは広告が再度表示されるようになるのを待つだけですよ。焦った・・・。

CSSでサイトの印刷範囲を指定する

後で印刷して自分で読んだりする場合。余計な部分がついてきて無駄に紙を使うのは勿体ないし、そんな不便を万が一見ている人にさせるのは忍びない。

というわけでCSSでささっと掃除します。

今の状況はこんな感じ。

ツイートボタンとかがまあ、邪魔ですが、印刷する分にはこれぐらいどうってことない・・・んですが、ページをめくっていくと。

こうなっているわけですよ。邪魔ですよね。ページ、嵩みますよね。

印刷範囲を指定するcssを以下の通り。

@media print{
  #head{display:none;}
}

印刷する場合のそれぞれのCSS要素をここで指定してあげれば、かなりキレイになります。

すっきりかっちり。

/*印刷範囲指定*/
@media print{
  #zenback_loady{display:none;}
  #zenback{display:none;}
  #comments{display:none;}
  #site-description{display:none;}
  .menu{display:none;}
  .googlead{display:none;}
  #breadcrumb{display:none;}
  #side{display:none;}
  .social4i{display:none;}
  #main{width:100%; float:none;}
}

最終的な形はこういう感じになりました。コメント欄や、広告の表示を消して、メインを全体的に表示できるように。

これで印刷するときも気をつけなくても良くなりましたね。やったぜ!

驚くほどシンプルでイカしたwordpressテーマ「wsc7」をカスタマイズしよう – その9 – 即席ウィジェットを作る

一連の記事→wordpressテーマをカスタマイズしよう Archives – aoringo works

プロデューサー! ウィジェットですよウィジェット!! のヮの

ウィジェットはとても大事です。サイドバーを彩ります。しかし自分で作るには少しハードルが高い。テヘペロ。

いちいちオプションとかくっつけたりして、なんか意味不明なコードが沢山あって。いやん、ばかん。

だからテンプレートとして簡単な即席ウィジェットを一つ持っておくと便利ですよ。

続きを読む 驚くほどシンプルでイカしたwordpressテーマ「wsc7」をカスタマイズしよう – その9 – 即席ウィジェットを作る

驚くほどシンプルでイカしたwordpressテーマ「wsc7」をカスタマイズしよう – その2 – ブログのコンセプトを考える

一連の記事→wordpressテーマをカスタマイズしよう Archives – aoringo works

さてはて、そもそも何故ブログのテーマを自作する運びとなったのか。

私の場合、大きな要因は「コンセプト」です。ブログを利用して書評、プログラム、雑感、写真、小説・・・・など多岐にわたります。

続きを読む 驚くほどシンプルでイカしたwordpressテーマ「wsc7」をカスタマイズしよう – その2 – ブログのコンセプトを考える

記事内に自動で広告などの要素を表示する+内容によって場所を変える

広告の場所は悩み物。記事内に表示されるようなページも多いですね。このサイトも同じことをやっています。

記事は基本的に「single.php」によって書き出されます。記事自体の関数は「the_content()」だけで呼び出されているのでここを置き換えてやる。記事内容を変数に代入して、内容に割り込むようにするのだ。

続きを読む 記事内に自動で広告などの要素を表示する+内容によって場所を変える