How to create a functional advert banner

Posted by admin on October 25th, 2009

This guide should help those who have the task to create a flash banner, which will work in advertising systems. In the introductory section explains the meaning and use of variables other part is the very detailed and step by step describes how to insert variables into the banner. At the end of the article is available for download HTML file to test your banners.

A bit of history or why we put the variable in the banner

For banner advertising systems is the need to monitor how many people clicked on the banner. This can be measured using a special URL, which counted in the advertising system, click and then redirects the user to the target page. In the days of animated GIF banners have been easy to insert the URL directly into the HTML and thus independent of the banner. With the advent of flash banners, however, there was a problem. URL to which refers to the flash banner must be placed directly into the banner. The banner is, as we have said, must have a special URL, banner maker that does not know yet, because it generates only the system itself after the insertion of advertising banner. On the contrary, a person serving advertising system does not have the capacity nor the possibility that the URL for each banner putting. Vicious circle you might say.

Then he devised a clever system of the head, when the banner inserted only variable that can take its value from HTML page to which the banner inserted. In practice it appears that the banner is inserted as the variable “clickthru. This variable is then assigned the HTML directly in the special link from the advertising system, which ensures both the counting and clickthrough redirection to the target web address. This would ideally be able to quit, but the happy ending will be made.

The problem occurs when you insert a variable in the banner. Your first question probably is: What is the variable I have to insert a banner? The answer is simple. Given that there is no usage of the variable which will be used in advertising or systems in that way will the banner files, each server resolves this problem on their own. The technical specification of the media plan (ideally you have it) then read that some websites use variable clickthru some clickTAG, some to write clickTAG and some servers are added another variable “clickTarget” manages to which the window should link to open. As the creators of the banner you would always have accurate information on these variables.

What do we need to know in advance?

If you are preparing a campaign banner, then ideally you will receive, as part of a media plan, the technical specifications of individual servers. There, in addition to size and data size, read the script, you have to insert the banner looks like this:

on (release) {
          if (clickTAG.substr(0, 5) == "http:") {
              getURL(clickTAG, "_blank");
         }
 }

This script basically tells the server uses the variable clickTAG, link opens in a new window and the URL parameter clickTAG must begin with “http:”. This last condition is there for safety. This code uses Google AdWords for example. Similar scripts you would find for the other servers. Even for an example of what I will use the script server family Seznam.cz:

on (release) {
        if (!_root.clickthru && _root.clickTag) {
                  _root.clickthru = _root.clickTag;
    }
    getURL(_root.clickthru, _root.clickTarget);
}

This script, other than variable clickthru ‘work is variable clickTarget, which controls what the window by clicking on the banner to open a link.

What to do if I know nothing

Quite often confronted with the fact that no technical specification get. Then, you need to ask. Basically you will suffice if you can find out the variable name as the server uses to which a window is a link to open. Most often you get responses that use the variable ‘clickthru “or” clickTAG “(pay attention to uppercase and lowercase letters, depending on size), and that the banner after you click open in new window (which means you use the parameter” _blank ” in the same window the day it was the parameter “_top”). According to this information, you can then you can easily edit the code I put there first demo.

Thus the code may look, if we use the variable “clickthru” a banner will open in the same window:

on (release) {
    if (clickTAG.substr(0, 5) == "http:") {
        getURL(clickthru, "_top");
    }

}

Jak kód do banneru vložit

ban-01

Click on the symbol rectangle and draw a scene any color, any rectangle. In the Properties inspector, change its size to equal what is your banner. For example 250 x 250 px.

ban-02

Click the inspector tools on the arrow and then click to mark a rectangle. Press the F8 key, which brings up a dialog where select “Button” and confirm. Thus you have created a button on which hang the specified code.

ban-03

Click on the rectangle so you get to the editing. At the top of the search at this time should see the timeline, only 4 frames. Click on the first page and drag transfer its contents into the fourth box called “Hit”. This box indicates the active area of the buttons that the final export is not visible. The first three fields should remain empty.

ban-04

Click the top left click “Scene 1″ which will take you back to the main stage. Rectangle now changes its color to light blue, it is pure sign of transparency. When you export this blue will not show. The button should now be placed exactly over the banner. Please click on the button, and then set paletceProperties X and Y to “0″.

Make sure you have identified key security for him then again. Press F9 brings inspector Actions. Copy the example code from this page:

on (release) {
    if (clickTAG.substr(0, 5) == "http:") {
        getURL(clickTAG, "_blank");
    }
}

and through the CTRL + V to paste it into the inspector Actions. This is the insertion of code done. Banner Save and export the resulting SWF file.

ban-06

How to test banner
Banner before sending to the server, we have yet to test that we put the banner code in correctly. This can be done very easily and that you create a simple HTML page in which you give the variable in the banner.

Test HTML page where we will test the proper insertion of the variable “clickthru” might look like this:

<body>

 <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
width="250" height="250">
 <param name="movie" value="banner-250x250.swf?clickTAG=http://www.designportal.cz/" />
 <embed SRC="http://www.designportal.cz/banner-250x250.swf?clickTAG=http://www.designportal.cz/"
width="250" height="250" />
 </object>

</body>
</html>

In this HTML page, I test the functionality of variable parameter URL forwarding site design portal. Shown in red are parts of code that you may change if your file will be named differently or you have another variable to the target URL, etc. HTML code to copy, paste and save as doNotepadu as a htm, for example, “banner-test.htm .

ban-07

Additional requirements for banner

addition to the variable is properly inserted, you can still meet with other like version of flash player, 1px line around the banner, non-repeating animation, etc. It all depends from the requirements of the server where the banners will run, so good advance request any technical requirements that you will avoid remodeling banner.

Hopefully this guide will help you a bit in creating banners for advertising systems. If you have any inaccuracy or something you are missing in the instructions, write to me, no problem to adjust the instructions according to your requirements.

Leave a Reply