8.72 K
FOLLOW

RESPONSIVE ADSENSE CODE

Lets talk about Responsive Adsense Code now. Google allows you to modify Responsive Adsense code with certain restrictions. Responsive Code can be split into 4 parts as shown in below image.

• A - CSS declaration for your Responsive Ads
CSS Styles are specified here. "@media(min-width" is where all magic is happening. Amazingly CSS media query is supported by major browsers.
This applies to all screen types and checks the min-width of the display (browser/screen).

Note
1. Google does not allow use of external Stylesheet
2. Specify fixed pixel values of width and height (e.g. 728px) and not relative (e.g. 90%)
3. Size should be one of supported Adsense size
4. Specify default size in your CSS for old browser (details later)
5. Specify from smaller screen size to larger screen.
Try Responsive Adsense Example for better understanding.


• B - Responsive Adsense Code Javascript file
This Javascript file is required only once and no need to repeat (as in synchronous Ad Code), so you can shift it in 'head' tag or before end of 'body' tag. I am declaring it only once in the head section for all Asynchronous ads on this page.


• C - Responsive Ad/Channel name
This comment specifies your code/Channel name and used for reference or can be removed for minification of Adsense Code.


• D - Javascript of Responsive Adsense Code
This asynchronous code does not need <script> tags now. Don't change anything here. This defines all your Responsive adsense data.
While I think there is lot to know here but I left it for later experiment !