Skip to main content

Responsive Design Ad Units For Google AdSense

What took so long?! Google has finally announced a beta of a new ad unit designed for responsive designed web pages.
In the past, Google said you can modify your ad code to make it work for responsive design web pages, but now, you have the option of using a native AdSense ad unit specifically for responsive design web pages.

Responsive Design Ad Units For Google AdSense


What is Responsive ads?
Responsive web design allows you to dynamically control the presentation of your website according to the properties of the screen/device that it’s being viewed on. By using a responsive ad unit, you can control the size of the ads on your page

Responsive ad units use the new asynchronous ad code. With the asynchronous ad code, you can set the size of the ad code directly via Cascading Style Sheets (CSS), which allows you to dynamically specify the size of the ad that will be served

To access this, go to your AdSense console, login and create a new ad unit. Then from the drop down of ad sizes, select "Responsive ad unit (BETA)." Yes, Google warns this is a beta.

Step 1. Generate the ad code
Step 2. Place the ad code on your site
Step 3. Set the size of the responsive ad unit

Test and Experiments on sizes but here are a few pointers to keep in mind when setting your size:
Responsive ad units have no predefined size, so you need to specify the size dynamically through CSS. As this feature is still in beta,
    • Be sure to specify fixed pixel values when setting the width and height of the ad to be served. Make sure that the specified width and height match one of our supported ad sizes.
    • The asynchronous ad code is responsive on initial page load only, subsequent changes to the ad size (e.g., after a screen orientation change) will not cause a new ad to be displayed. This is something that we’ll look to address in the future.
    • Always set a default ad size in case media queries aren’t supported.
      You can ask Queries regarding this at Support Group

      Comments

      Popular posts from this blog

      How To Add HTML Contact Form for Blogger Blogs

      Our problem in creating a contact form is that you don't want third party contact form cause it will burden your loading page and if you want to give your reader an instant contact form but don't want to show your email, this HTML form will help you with your problem

      You can create a simple form, as displayed below, to enable your visitors to send you comments, questions or whatever you'd like.

      1.Log in to your dashboard--> layout

      2.Click on "Add a Gadget".

      Now Select "HTML/Java Sricpt"

      3.Copy and Paste below code into it.
      <FORM action="mailto:[email protected]" method="post" enctype="text/plain"><TABLE BORDER="0" CELLSPACING="0" CELLPADDING="4" WIDTH="90%"><TR><TD width="30%"><DIV align="right"><B>Name:</B></DIV></TD><TD width="70%"><INPUT type="text" name="name" s…

      High PageRank Do-Follow Forums List (606)

      Besides from getting your answers to unanswerable queries, the good thing of do-follow forums is to create a good back links through their High Page rank pages on Google, creating your pointing to your site makes your blog grows faster in ranking,

      Now a days it is very hard to find do-follow link website because they are making their site as no-follow, like the wiki, it is before a do-follow site but since many SEO experts use wiki as spam they control it and made it no-follow, so now I am giving you a list of do-follow and high ranking sites that you can use to make your blog popular.

      Its your tactics on how to create your links on this site, but remember not to spam cause Google might hit you. :)

      Here are the list enjoy

      ForumPR1http://www.addthis.com/forum92http://chronicle.com/forums/83http://forums.myspace.com/84http://forum.joomla.org85http://forums.cpanel.net86http://forum.siteground.com87http://c7y-bb.phparchitect.com88http://forum.meebo.com89http://forums.mysql.com/710http://f…

      How to Add Random Post Widget to blogger Blogs

      Instead of creating new post everyday to reduce your bounce rate, many respected bloggers are suggesting to sell your old posts to readers. We all know that many of our posts are useful even time passed. today I am going to make a tutorial on how to add a beautiful random post and reduce your bounce rate also to promote your older posts

      Hows Random Posts.
      Doesn’t add load to your page loading
      Shows the Name Of The Author.
      Shows the number of comments.
      Summary Showing Enabled.
      CSS Added.
      Hover effect for images. Installing It On Your Blog Go to blogger > Open layout tab
      Now Add A new HTML/JavaScript widgetGive any title you want [ eg: Being Viewed, Recently Viewed, Now Viewing etc. Its up to you. ].
      Now paste the code given below :  <style type="text/css"> .recent_post_content{width:100%;} .recent_post_content_item {filter: alpha(opacity=80);opacity: 0.8;} .recent_post_content img {width:45px;height:45px;background-position: center;margin:7px;padding: 2px;border:#888 solid th…