napy8gen
03-03-2016, 06:24 PM
If horizontal ads we can go to adsense and pick up responsive ads
How about vertical ads? That is good questions by james woo.
Vertical ads will consume a lot of height in mobile. If we put google responsive ads it will not be vertical ads.
But you still need ads in that space.
Here is how you can do it.
This is the ads code you will put in your related template.
You can use ads location templates. The first code is vertical, the second code is responsive but it has the same ads slot id.
One of them will be hide in desktop and one of them will be shown in mobile. Both ads code wrap in a div with a class name each of them.
<div class="showadsdesktop"><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><!-- test21 --><ins class="adsbygoogle" style="display:inline-block;width:160px;height:600px" data-ad-client="ca-pub-9202814976687561" data-ad-slot="8683907216"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script></div><div class="showadsmobile"><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><!-- test21-responsive --><ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-9202814976687561" data-ad-slot="8683907216" data-ad-format="auto"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script></div>
2. Paste this on top of additional.css
Style manager> style name> edit templates> CSS templates> Additional.css
/*--- this is default desktop setting ---*/.showadsdesktop{display:block}.showadsmobile{displ ay:none}
/*--- hidein mobile ---*/html.range_0 .showadsdesktop,html.range_1 .showadsdesktop{display:none}
/*--- show in mobile ---*/html.range_0 .showadsmobile,html.range_1 .showadsmobile{display:block}
/*--- just in case people play with desktop browser ---*/html.range_3 .showadsdesktop,html.range_4 .showadsdesktop,html.range_5 .showadsdesktop{display:block}
How about vertical ads? That is good questions by james woo.
Vertical ads will consume a lot of height in mobile. If we put google responsive ads it will not be vertical ads.
But you still need ads in that space.
Here is how you can do it.
This is the ads code you will put in your related template.
You can use ads location templates. The first code is vertical, the second code is responsive but it has the same ads slot id.
One of them will be hide in desktop and one of them will be shown in mobile. Both ads code wrap in a div with a class name each of them.
<div class="showadsdesktop"><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><!-- test21 --><ins class="adsbygoogle" style="display:inline-block;width:160px;height:600px" data-ad-client="ca-pub-9202814976687561" data-ad-slot="8683907216"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script></div><div class="showadsmobile"><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><!-- test21-responsive --><ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-9202814976687561" data-ad-slot="8683907216" data-ad-format="auto"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script></div>
2. Paste this on top of additional.css
Style manager> style name> edit templates> CSS templates> Additional.css
/*--- this is default desktop setting ---*/.showadsdesktop{display:block}.showadsmobile{displ ay:none}
/*--- hidein mobile ---*/html.range_0 .showadsdesktop,html.range_1 .showadsdesktop{display:none}
/*--- show in mobile ---*/html.range_0 .showadsmobile,html.range_1 .showadsmobile{display:block}
/*--- just in case people play with desktop browser ---*/html.range_3 .showadsdesktop,html.range_4 .showadsdesktop,html.range_5 .showadsdesktop{display:block}