根據視窗寬度,動態調整google adsense廣告大小

原本最笨的方法, 就是透過display:none
但實在太遜而且違反google建議, 所以跳過

所以我就想自己修改javascript, 根據screen width 之類
這個網址有列出一些可用的變數, 列在下方:

function GetWidth()  {          var x = 0;          if (self.innerHeight)          {                  x = self.innerWidth;          }          else if (document.documentElement && document.documentElement.clientHeight)          {                  x = document.documentElement.clientWidth;          }          else if (document.body)          {                  x = document.body.clientWidth;          }          return x;  }  function GetHeight()  {          var y = 0;          if (self.innerHeight)          {                  y = self.innerHeight;          }          else if (document.documentElement && document.documentElement.clientHeight)          {                  y = document.documentElement.clientHeight;          }          else if (document.body)          {                  y = document.body.clientHeight;          }          return y;  }

但改了改都不優, 隨興看看google說明,
原來其實google已經寫了基本範例, 可以參考
https://support.google.com/adsense/answer/1354736?hl=zh-Hant

我一開始誤會了, 以為一個ID只能出現一個大小
實際上是一個ID可以根據你餵給它的width與height去動態變化
我的程式碼如下:

<style type="text/css">.adslot_1 { width: 234px; height: 60px; }  /* 半橫幅*/@media (min-width:768px) { .adslot_1 { width: 468px; height: 60px; } } /* 中橫幅*/@media (min-width:960px) { .adslot_1 { width: 728px; height: 90px; } } /* 大橫幅*/</style><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle adslot_1" style="display:inline-block;" data-ad-client="YOUR_AD_CLIENT_ID" data-ad-slot="YOUR_AD_SLOT_ID"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script>