Is Google adsense available for localhost?
Yes it is possible (as of 2015). There is a special parameter, to use Adsense on Localhost without risks.
Today the AdSense code is different. If you want to add the adtest-parameter use data-adtest="on"
within an ins block. Here is an example code:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- XYZ 336 x 280 -->
<ins class="adsbygoogle"
style="display:inline-block;width:336px;height:280px"
data-ad-client="ca-pub-XXXXXXXXXXXXX"
data-adtest="on"
data-ad-slot="XXXXXXXXXXX"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
Found this on Google AdManager Help:
It shows a basic tutorial on how to achieve this.
Test Ad Exchange tags without charging advertisers or recording clicks and impressions
Add the google_adtest = on; parameter to your ad tag to specify that this is a test implementation. Make sure you set this parameter to "on" to ensure that clicks and impressions aren't recorded and advertisers aren't charged. The default value is "off".
After lots of trials and errors, here is what I've found out. At least, those were my results.
It seems that adsbygoogle.js
will not render ads on localhost
. You'll probably will get something like the following:
So, the first thing you need to do is to set up a local custom domain for your localhost
.
Here is what I do on Windows:
- Run NotePad as Admnistrator.
- Open C:\Windows\System32\drivers\etc\hosts
- Add your custom domain to the list
Then you should be able to access your localhost
by hitting dev.mydomain.com
After you've set up your local domain, you should go to your AdSense account and add it as a subdomain under the main domain of your registered website.
From the tests I've run. It seems that AdSense will not render real nor test ads if the domain/subdomain has not been added to your AdSense account.
In this example, I've added the main domain without the www
and I've added two subdomains. One is the www.
variation and the other one is the dev.
that I've just added to my localhost
.
Then you can render it on your code, just like you would on a real add and use the data-adtest
flag set to on
to run your tests.
<ins className="adsbygoogle"
style={{display:"inline-block", width:"100%", height: "100%"}}
data-ad-client={AD_SENSE_ACCOUNT}
data-ad-slot={AD_SENSE_SLOT}
data-adtest={ON_DEV ? "on" : "off"}
>
</ins>
I have an ON_DEV
flag that automatically sets it to on
, whenever I'm on my dev.
domain.
EXTRA
This is out of the scope of this question, but is necessary for everything to work.
You also need to push it to the adsbygoogle
array. This is how I do it in React.
useEffect(()=>{
(window.adsbygoogle = window.adsbygoogle || []).push({});
},[]);
And of course, you need the adsense
<script/>
tag on your index.html
as well.
<script data-ad-client="XXXXXXXX" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
I wasn't able to get the ads to show up using data-adtest="on"
in localhost either. Since there was still an empty div, as a quick work around I added a border to the styles so it looks like display: inline-block; border: 1px solid green;
. I was only concerned about placement and how it would interact with my layout and not so much what the ad looked like, so this allowed me to see the dimensions of the ad and make any layout adjustments accordingly.