Free Dreamweaver Template for Google AdSense
AdSensation is a free Dreamweaver template for easy implementation of Google AdSense into a website.
Use this template - Make more money!
Our AdSensation Dreamweaver template is designed for optimal AdSense ad block placement and includes a variety of pre-styled ad containers.
By simply wrapping your AdSense code in the proper CSS tag, the code is properly positioned for maximum visibility and profitability.
Easily include AdSense ads in this web template
We've created a number of CSS styles that make inserting your AdSense code very simple. Here are the examples of the code blocks and ad sizes that are included with this template.
728x90 Leaderboard
This ad is displayed at the top of this page between the header and content sections. The CSS tag that styles the block is called 'adblock728' and includes a background image and proper padding around the ad.
Banner 468x60
This ad is styled with proper margins to center it in the content area.
Square 250x250
This ad has two different styles depending on whether you want it positioned at the left margin or the right margin.
For a right margin positioning, apply the 'adblock250x250right' class to your AdSense code.
For a left margin positions, apply the 'adblock250x250left' class to your code.
This ad is shown at the top of the content section of this page using a live AdSense ad.
Wide Skyscraper 160x600 and Skyscraper 120x600
The 160x600 ad is displayed with a live AdSense ad in the left sidebar of this page. The surrounding div has the 'adblock160x600' class applied and the class also used center positioning so the Skyscraper 120x600 size ad can also be used in the same container.
To create an ad for the left sidebar that has no background or border like the ad shown to the left, use the color F3F3F3 for the background and border in your AdSense ad creation.
Using other AdSense ad sizes
If you want to use other sizes of AdSense blocks other than those included with the template, simply create a new CSS class or change an existing class to work with your ad size.
For example, if you want to use the Small Square 200x200 ad instead of the 250x250 ad, simply change the width and height of the 'adblock250x250right' (or left) to 200 pixels. This will change the dimensions for the new ad size.
Examples of pre-styled template features (this uses the H2 tag)
This is a text link to nowhere - this just shows the default link color and bold font used for links in the content section of the page
Image Floated Left
An image with the assigned class "fltlft" will be aligned with the left edge of the content div, with a 15 pixel right margin and a 10 pixel bottom margin.
Image Floated Right
An image with the assigned class "fltrt" will align with the right margin of the content with a left margin of 15 pixels and a bottom margin of 10 pixels.
An Unordered List
Unordered lists are styled with a 5 pixel bottom margin.
- This is a list item
- This is another list item
- This is the third list item
This is a Blockquote.
The blockquote CSS defines the background color, borders and the left and right margins, and the left and right padding inside the box. The #mainContent p selector controls the top and bottom padding around the paragraphs inside the blockquote tag.
The Logo and Header
The logo is simply a .gif image with a transparent background to allow the header background to show through. To change the logo image, simply find the #logo entry in the CSS file and change the background image to your logo. The #logo id also controls the navigation links on the upper right side of the header. The included Fireworks file makes it easy to create a custom logo to insert into this template.
If you don't have Adobe Fireworks, you can download a free trial here.
The Menu Navigation
The navigation is a pure CSS navigation menu. To add a menu item to the list, simply find the code towards the top of the code view that looks like this:
<li><a href="#1">Make Money Online!</a></li>
<li><a href="#2">Free Template!</a></li>
<li><a href="#3">AdSense-ready!</a></li>
<li><a href="#4">All pre-styled!</a></li>
<li><a href="#5">Just add content and go!</a></li>
<li><a href="#5">Download template here</a></li>
To add menu items, copy the last line including the <li> and </li> tags and paste directly beneath it. You can edit the text in code view or switch to design view and simply type in your new link on the menu itself.
To edit the menu items already there, simply highlight the item and type in new anchor text and assign new links.
Editable Metatags and Head Section
The template allows for editing of the Title, Description and Keywords tags for each page plus another editable area in the Head for inserting scripts and other Head content.
Editable Template Areas Included
The template has editable areas included for the content section and the sidebar section below the navigation. If you wish to include the same content on every page on the sidebar, simply delete the editable region called "Sidebar Content".
Fireworks Graphics File Included
To make custimization of this Dreamweaver template easier, the original Fireworks file is included in the template zip file. It includes all the graphic elements in this template with all the slices already created. It will be very easy to customize this template to suit your needs. All the image elements are vector graphics, so you can change colors, gradients, shadows, etc very quickly to generate a new look.
If you don't have Adobe Fireworks, you can download a free trial here.
What's the Catch?
We supply our templates and graphic files free of charge, with the only requirement being the small link at the bottom of the template be left in place and not altered in any way. We've styled it very small and unobtrusive, so that's a pretty minor requirement considering the time we spend creating these templates AND it will keep us developing more templates in the future!
Thanks for trying out our template and if you run into any code or browser issues, let us know. We test our templates in IE 6, IE 7, Firefox 2, Netscape 9 and Opera 9, so if there's any issues on Safari we'd be interested to know.
