Integrating Adify Ad Tags with Popular Blogging Engines

Revision History

Date Version Description Author

08/22/07 0.1 First Draft Av

09/26/07 1.0 Final Draft AV

Introduction

This guide explains how to insert Adify ad tags into your blog hosted on Blogger, TypePad, MovableType or Wordpress. To obtain Adify ad tags, you will need to have an Adify account. If you already have one, you may skip ahead to the next section. If not, you can create an account by following these steps: Step 1 Point your browser to http://app.adify.com/ and click on the Create a new account button. Step 2 Complete the account information and click the Sign up button. Step 3 Click on the Sell tab and choose the Sites link from the sub-menu. Step 4 Click on the Create new site button and complete the information describing your blog or website. Proceed by clicking Next. Step 5 Set the appropriate pricing options for your site. Proceed by clicking Next. Step 6 Define one or more ad spaces for your site. An ad space is a place holder for an ad on your blog. The ad space settings you choose will determine the type and size of ads that can be displayed on your site. Refer to the compatibility chart on the next page to pick an ad space type that is best suited for your blog. Also, be sure to enter an accurate Page URL as failing to do so might result in advertisements not being displayed on your site. Step 7 Congratulations! You’ve successfully created an Adify account and Adify ad tags that are ready to be placed on your website. You may return to your Adify account at any time to retrieve these ad tags.

Compatibility Chart – Ad Sizes and Blogging Clients

Ad size suitable for IAB Ad Sizes Blogger TypePad WordPress MovableType

728x90 - Leaderboard • • Header 468x60 - Full Banner • •

120x90 - Button 1 • • • • 120x60 - Button 2 • • • • 125x125 - Square button • • • • 180x150 - Rectangle • • • •

Sidebar

120x240 - Vertical Banner • • • •

250x250 - Square popup • • • 300x250 - Medium Rectangle • • Sidebar 336x280 - Large Rectangle

120x600 - Skyscraper • • • • 300x600 - Half Page ad Sidebar 160x600 - Wide skyscraper • • • •

This compatibility chart is drawn from the default design templates available on these clients. If your blog runs a custom design template, the ad sizes supported might vary.

Blogger

Here’s how you can add Adify ad tags to your Blogger blog. Step 1 Sign in to your Blogger account and then click on Customize link located at the top right corner.

Step 2 Click on the Add a Page Element link.

Step 3 From the list of page elements, add the HTML/Javascript element to your blog by clicking the corresponding Add To Blog button.

Step 4a In a new browser window, log into your Adify account (http://app.adify.com/) and click on the Sell tab. Step 4b Check mark the ad space you would like to set up on your blog and then click the Edit Selected ad spaces button, followed by Get ad tags from the menu.

Step 4c Select all the Adify ad tag code and copy it by right-clicking and choosing Copy.

Step 5 Paste your Adify ad tag code into the Content box of the Configure HTML/Javascript window. Be sure to leave the Title box blank and click on Save Changes.

Step 6 Position the HTML/Javascript element on your blog page by dragging and dropping it into place. In this example, we illustrate the creation of a leader board space. Refer to the compatibility chart for alternate positioning of your ad space on your blog.

You should now be able to see an Adify-powered advertisement on your blog!

TypePad

Here’s how you can add Adify ads to your TypePad blog. Step 1 Log in to your TypePad account and choose your blog from the blog list.

Step 2 Create a new TypeList by clicking the TypeLists tab and followed by Create a new TypeList.

Step 3 Set the list type to “Notes” and the list name to “Sponsored Ads” and click on Create New List.

Step 4a In a new browser window, log into your Adify account (http://app.adify.com/) and click on the Sell tab. Step 4b Check mark the ad space you would like to set up on your blog and then click the Edit Selected ad spaces button, followed by Get ad tags from the menu.

Step 4c Select all the Adify ad tag code and copy it by right-clicking and choosing Copy.

Step 5 Return to your TypePad window and complete the new list by pasting your Adify code into the Note box and leaving the label box blank. Click the Save button.

Step 6 Click on the Publish button that appears in the List Items prompt.

Step 7 Check mark your blog from the list presented to you and then click on Save Changes.

You should now be able to see an Adify-powered advertisement on your blog!

MovableType 4.0

Here’s how you can add Adify ad tags to your MovableType blog. Note that these instructions were written for the default MovableType template and might have to be adapted for any custom templates you might have on your blog. Step 1 Sign in to your MovableType blog. You should be taken to the MovableType Dashboard. Step 2 Click on the Design tab and followed by Templates link.

Step 3 Click on the Main Index link.

Step 4 Insert the following line of HTML code into the template document <MTSetVar name=”turn_ad_on” value=”1”> right after this line of code <MTSetVar name=”module_monthly_archives” value=”1”> as illustrated below:

Step 5 Click the Save & Publish button at the same page, followed by the List index templates link.

Step 6 Click on the Template Modules link from the Quickfilters menu.

Step 7 Now click on the Create new Module template link.

Step 8a In a new browser window, log into your Adify account (http://app.adify.com/) and click on the Sell tab. Step 8b Check mark the ad space you would like to set up on your blog and then click the Edit Selected ad spaces button, followed by Get ad tags from the menu.

Step 8c Select all the Adify ad tag code and copy it by right-clicking and choosing Copy.

Step 9 Return to your MovableType window and complete the new template by pasting your Adify ad code into the numbered text box. Name your module “Adify Module” and click Save.

Step 10 Return to the list of modules by clicking the List module templates link. Step 11 Click on the template module that best corresponds to the ad space type you wish to create on your blog. For example, to add a skyscraper ad to your blog, click on the Sidebar module. If you are interested in adding a leader board ad, click on the Header module.

Step 12 Insert the following lines of HTML code into the template document.

<MTIf name=”turn_ad_on”> <$mt:Include module=”Adify Module”$> </MTIf>

You will need to navigate through the HTML to position the ad correctly within the sidebar, header or footer. A good place to position a skyscraper advertisement in the sidebar is right before the <div class=”widget-search widget”> tag. Click the Save button after you are done pasting the HTML into the document.

Step 13 Click on the List module templates link followed by the Index Templates link. Step 14 Click on the Main Index link. Step 16 Click on the Save & Publish button.

You should now be able to see an Adify-powered advertisement on your blog!

Wordpress 2.2

Here’s how you can add Adify ad tags to your Wordpress-powered blog. Note that these instructions were written for the default Wordpress theme and might have to be adapted for any custom themes you might have on your blog. Step 1 Sign in to your Wordpress blog by clicking the Site Admin link.

Step 2 Click on the Presentation tab.

Step 3 Click on the Theme Editor sub-tab.

Step 4 Depending on the type of ad space you wish to install on your blog, click on the Header (good for leaderboard ad spaces), Footer (good for ad spaces at the bottom of your blog) or Sidebar (good for skyscraper ad spaces) links from the list on the right-hand side. For this example, we will choose the Header and install a leader board ad space.

Step 5a In a new browser window, log into your Adify account (http://app.adify.com) and click on the Sell tab. Step 5b Check mark the ad space you would like to set up on your blog and then click the Edit Selected ad spaces button, followed by Get ad tags from the menu.

Step 5c Select all the Adify ad tag code and copy it by right-clicking and choosing Copy.

Step 6 Return to your Wordpress Theme Editor window and paste in the Adify ad code. You will need to navigate the existing HTML to appropriately position the ad within your blog. In our example, we are using the default Wordpress theme and are inserting a leader board advertisement in the header. A good place to position the Adify ad code is between the <div id=”page”> tag and <div id=”header”> tag as shown below.

When editing the Sidebar to insert a skyscraper ad, a good place to paste in the Adify ad code is between the </ul> and </div> tags towards the end of the Sidebar code. If you’re inserting an ad space into the Footer of your blog, a good place to paste in your Adify ad code is between the <?php wp_footer(); ?> and </body> tags. Step 7 Click on the Update File button followed by the View site link at the top of the page. You should now be able to see an Adify-powered advertisement on your blog!