Customizing AdSense Design – Make Your Ads Perfect

AD

adsenseCustomizing AdSense Design – Make Your Ads Perfect

One of the easiest ways to monetize your website is through contextual advertising and one of the largest companies providing this service is Google with its Google AdSense.

So far nothing new, let’s change that. Most people simply create an AdSense account, put ads on their site and they consider the job done. What’s completely ignored is the “AdSense Setup” button…

Adsense Setup Screen

adsense setup screen

Color Palletes

We’ll be talking about the Color Palletes option. It gives you great possibilities to alter your ads design and make them a perfect complement to your website.

Color Pallete

As you can see, there are several pre-configured layouts for the ads displayed on your site. You can match one of these designs with your own website templates or create a whole new one.

Premade Templates

Let’s shortly describe all templates that’s been made for you:

Open Air - Basic template, white background makes it good for almost any website.

Seaside – A little more distinctive thanks to larger presence of blue, otherwise very similar to Open Air.

Shadow – Gray background makes it an excellent choice for professional looking ads.

Blue Mix – Probably the worst one, mixing together light and dark blue. It doesn’t give a good impression.

Ink – A typical black model, it can be used for better contrast with white website template.

Graphite – Having gray as its main (and pretty much the only one) color, this layout is probably too boring and not enough expressive.

Examples of Premade Templates:

Preview Adsense colors

Create Your Own Layout

The funny part is that you can completely ignore all of the layouts above and create your own. I won’t be telling you what each column does, it’s a simple trial-error method.

However, there are some guidelines, such as:

  • avoid gaudy colors (like pink)
  • test multiple variations before you decide
  • don’t change anything if you are generating the income you want

Customizing Adsense with Code

Now we will try the redesign our AdSense through simple, pre-defined Google code/parameters. These are simple parameters which can be used inside the ad code provided by Google.

It is also called old school, but it can become a real asset to your business. I have personally asked Google if it is against their TOS to use such parameters… Apparently, it is not!

Where and Why Use Code Modification?

It is a good idea to use this type of customization when you are implementing Adsense Revenue Sharing or you have a blog with multiple authors who use their own Publisher and Channel ID.

Every author’s ad can possibly have different colors, types, design and sizes. So to keep all ads on a site alike you can use these codes.

If you have a code ready and you want to make some changes, it is impossible to do it from the AdSense control panel.

You can customize it using these parameters:

Parameters for Customizing Adsense

google_color_border = "FFFFFF"; //Border Color 

google_color_bg = "FFFFFF"; // Background Color

google_color_link = "0000CC"; //Link Color

google_color_url = "333333"; // URL Color

google_color_text = "333333"; // Text Color

google_ad_type = "text_image"; // Ad Type (image or text, in this case it's both)

All these parameters are self explanatory. You can easily embed them in your ad code and change color, border color, link color, ad type etc.

How to Implement it

These parameters are inserted inside the ad code provided by Google.

This is how a simple ad code looks like :

<script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxx";
google_ad_slot = "xxxxxx";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

Adding Parameters in the code:

<script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxx";
google_ad_slot = "xxxxxx";
google_ad_width = 300;
google_ad_height = 250;
google_ad_type = "text_image";
google_color_border = "FFFFFF";
google_color_bg = "FFFFFF";
google_color_link = "0000CC";
google_color_url = "333333";
google_color_text = "333333";
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

Each Parameter is added as : Parameter_name = “parameter_value” ; . Make sure to end every parameter with a semicolon ‘;’.
Enjoy your color game and thank you for reading!

PS: Feel free to discuss in comments…

Share the Love:


Advertisement

Join the 98,750+ Subscribers

Subscribe and grab Free Ebook! Photoshop Crash Course!

We promise not to spam!

Further Related Readings

Vogin

24y old visionary Czech.
All Articles by
29 Comments on “Customizing AdSense Design – Make Your Ads Perfect” Join The Discussion!
  1. Habibies says:

    Superb Post but i have no Google Ad sense id if anyone have then kindly tell me plz i badly need and i will pay you Thank’s alot :)

  2. Ondrej Dyrka says:

    Google AdSense is a free service, you can register here: http://google.com/adsense

    If you got banned before, that’s unfortunate, because you can’t create a new account…but there are some AdSense alternatives, such as AdBrite or Chitika.

  3. Claudia says:

    Wow…that`s nice…I should start beautifying my ads too…thank you!

  4. shenoyjoseph says:

    cool so we can design our google ads attractively

  5. DoableFinance says:

    I don’t see AdSense ads on your page. Your writing would make more sense if you practice what you preach. In the beginning of the article, you state that you asked Google about changes to AdSense. Your answer is not 100% clear whether Google said yes, maybe or no.

    If I started doing that, Google Ads would be more apparent than my content. Many more experts say the ads should blend in with the background and foreground of the page. That’s why at the time of AdSense setup, one of the options Google gives you is if the Ads should pick up the font of the article itself.

  6. alec says:

    Helpful tips! Thanks.

  7. Marcell | Webdevtuts.net says:

    Great Post! Making ads fit your content is great!

  8. Ondrej Dyrka says:

    @DoableFinance – I have no AdSense, because the page itself is not ready for full monetization. That doesn’t mean I didn’t have AdSense in the past, does it?

    The answer about AdSense code is quite clear, the word “apparently” is used to stress the fact, not to doubt it.

    After all, these are all tips and it is obvious that practical application will be different for each niche. If you don’t want to put an extra effort in modifying your ads, I’d be the last person to force it upon you :P

    @the rest – thanks, I’m glad you liked it…

  9. Jonathan O. says:

    Usually using adsense will drop your appearance overall grade but using these codes , they can look very blended in.

  10. Ahmad says:

    I think choosing the right adsense template is very effective factor for getting more clicks beside the good position

  11. Ivan says:

    nice thanx its very informative

  12. Ondrej Dyrka says:

    Thanks for your input guys, I’m glad you liked it!

  13. burman says:

    I was desperate in search of an article like this

  14. Eric says:

    I used to run a website that got nearly 75k hits a month, but AdSense only generated me about $15. I looked through the Google forums but could not find any good info.

    Any ideas why this happens this way?

  15. Ondrej Dyrka says:

    @Eric – I can come up with a few suggestions:

    – your visitors were not in a buying mood
    – you had wrong ads popping up on your site (like the example from The Challenge, where AdSense showed a skateboarding ad on a site about baking)
    – your targeted keywords were “cheap” => advertisers paid only ridiculous amounts of money per click

  16. Swopper Stuhl says:

    Adses customizations allow some site owners to trick people into clicking the ads as if they were part of the internal links or navigation of the site. This is a good article :) thanks

  17. Ondrej Dyrka says:

    @Swopper – true, but that’s against AdSense TOS and a quick way to get banned for sure…

  18. Richard says:

    Great post.

  19. best ways to make money online says:

    It is so annoying to try to make decent money using Google AdSense. I started with them a year ago and todate I have not much. I have 4 blogs and 6 places, I diligently followed the philosophy of content, content, and content.

  20. Ondrej Dyrka says:

    Actually, earning a decent amount of money via AdSense is based on having tens or even hundreds of sites – but all of them have to fully comply with the TOS, so no 1 page sites filled with ads (aka MFA, Made For AdSense)…

  21. Ayaz Malik says:

    @Ondrej and @best way to make money … well not actually we don’t need hundreds of sites.. there are a few things we need to keep in mind to make some good amount of money via adsense .. for example
    1. Blind Ad.. means design your ad in a way that it seems like a part of the content not a seperate ad.
    2. you can always do a little keyword research before making content.. which content have more payout value.
    3. Get lots of traffic, the more the traffic the more clicks and earning :) .

  22. mubashir says:

    think done hide your google ad’s in your website design nice post thanks

  23. Tubebibo says:

    Thank you for the very helpful tips : )

  24. muhammad waqas-19883 says:

    thank you for useful information about adsense.it will help me to earn some extra money with adsense

  25. Ondrej Dyrka says:

    I’m glad it helped guys…

Comments are closed.

Copyrights © 2014 - Designzzz. All Rights Reserved