Create banners with Google Web Designer

Google Web Designer

If you would like to create nice and fancy HTML5-banners you can use an application from Google, and it's actaully free. The application is called Google Web Designer.

Berfore you can use the banners you create with Google Web Designer, GWD, at Adrecord you will need to make some small adjustments.Follow these simple steps to make it all work:

1. Create your banner

When you start the application you will see a box poping up, where you can make some selection. Look at the headline Environment and make sure to choose: Non-Google Ad.

Choose Non-Google Ad when creating a new banner with GWD

2. Switch to code view

Please click on the button that is marked in the screen shot below, to switch to the code view.

Switch to code view

3. Add code snippet

Please scroll down near the end of the code, and find the row that match the screen shot below.

Add the code snippet on the marked row

Select and copy the code below, then put your marker on the from from the previous image and paste it in there.

var parsed = (document.location.href.split('#')[1]||'').split('&');
      var params = parsed.reduce(function (params, param) {
      var param = param.split('=');
        params[param[0]] = decodeURIComponent(param.slice(1).join('='));
        return params;
      }, {});
      gwdAd.addEventListener('click', function(){
        top.location=params.clickTag;
      });

Now you should have some thing that looks similar to this screen shot below, and you are ready to start designing your banner.

This is what your code should look like when your done with these steps.

4. Publish locally

When your feel good about your design, it's time to export the banner and then get it up on your account with us. Press the button Publish and then select Publish locally. When your done with that you can send that zip-file containing your banner to your manager at Adrecord, or to support@adrecord.com.

Some clarifications

The code snippet that you have just added to your banner will make the user clicking the banner go to that URL that is set by Adrecord's system. On the page where you can manage your banners you can specify the URL for a banner or a banner group. If there is not specific URL for a banner it will be the program default. In other words you should not add links or "exits" within your banner in GWD..

We know it might not feel cristal clear, so please try complete one banner i one size and then sent it to us for verification. Knowing everything works as intended you can continue designing new banners in the diffrent sizes.