ネットで稼ぎ、野菜を育て、魚を釣って、肉を狩る。「健康な心身」と「家族との時間」を手に入れるため、選んだのは半自給自足の道だった。
Read Article

【wordpress】時間差で広告を表示するコード、ウィジェットに書くだけ

【wordpress】時間差で広告を表示するコード、ウィジェットに書くだけ

どーも。こんにちは。

トシです。

 

数日悩んだものの、なんとか答えが見つかったので備忘を兼ねて。久しぶりにパソコン系の記事になります。

 

今回はWordPressのウィジェットに書くだけの、時間差で広告を表示するコードについて。

 

 

広告の時間差表示の考えられるパターン

 

今回、ネットビジネスを教えてる人から『広告を時間差で表示できるようにしたいのですが・・』という相談があったので考えてみました。

 

時間差表示で考えられるパターンは主に以下の3つかと。

 

・記事を一定ピクセル数スクロールしたら表示

・記事の特定の位置までスクロールしたら表示

・記事を開き、一定時間経過したら表示

 

んで、上から考えてみたのですが、

 

・一定ピクセル数スクロールしたら

→まあ有り。でも、ネットのブラウザによって書き方が変わるっぽいので微妙。

 

・特定の位置までスクロールしたら

→記事内にタグを差し込む必要があるため面倒。

 

・一定時間経過したら

→ブラウザで書き方は変わらないし、一番無難かも。

 

という結論に至ったため、3つ目の案を採用することにしました。

 

 

 

ウィジェットの『テキスト』に書くことで動きます

 

考えたコードは以下。

実際に書いてるコードで、その内容は『サイトを開いてから50秒に1回、合計2回まで広告を表示する』というもの。

 

リンクなんかは適当に変えてますし、実際のコードではコメント部分は省いてます。

<script src=”https://広告.js” type=”text/javascript” charset=”UTF-8″> </script>
<script type=”text/javascript”>

var i = 0; //広告を2回まで表示したいため、表示回数カウント用の変数を用意

function adopen(){
if (i>=1 && i<3) { //広告表示回数1以上、3未満の場合
Ad.show({
appkey:”personal_key”,
});   //Ad.show以降が広告表示処理

i++; //広告を表示した場合、表示回数を1追加
setInterval(adopen, 50000); //50秒に1回広告表示を繰り返し
}else{ //広告表示回数が1未満の場合
i++; //表示回数を1追加
setInterval(adopen, 50000); //以降は50秒に1回広告表示を繰り返し
}
}

adopen();

</script>

 

 

 

jQueryで考えるより、JavaScriptで書いた方が簡単だった

 

ぶっちゃけ、最近全くコードを触っていなかったため、ここに到るまで時間がかかりました。

たったこれだけ考えるのに1日使ってしまった感じ(笑)

 

んで、その過程で

・moreタグに差し込む

・広告表示をショートコード化する

 

など、いろいろ試してみたのですが、WordPressでよくある『jQuery』で書こうとするとなかなかうまく行きませんでした。

それよりも、単純にJavaScriptで書いた方が簡単で確実というね。

 

なので広告の表示を少しだけ変えたい方は、無理にjQueryで書くんではなく、JavaScriptで書いてみるといいかもしれません。

広告の表示程度なら、これで十分ですから。

 

 

最後に、今回の考察で参考にしたページを紹介。

タイマー処理系のJavaScriptについてまとめ

Element.offsetHeight- 全体の高さを取得する

 

 

プログラミングって楽しいですが、基本を忘れてると終わりが見えなくて辛いですね(笑)

URL :
TRACKBACK URL :

Leave a comment

*
*
* (公開されません)

Return Top