Discussion

This theme has an 852x182 pixel fixed-width header graphic. Therefore, any other "drop and go" headers that are 852 pixels wide (the height doesn't matter as much) are suitable for use with this theme. This theme has tabbed navigation on the menu bar.

Drop and Go Banners

We have created a series of drop and go banners to which we have applied saturation to approximate the blue tone of the original image. You can find those images in this photo album. The header graphics can be linked to from here and each header graphic has code for you to copy and paste into your own blog. If you want to download the image and upload it to your own blog space, you certainly can. If you do so, remember that you will need to modify the stylesheet to include the path to your image. And depending on the image, you may want to modify the H1 (Header) and Subtitle color.

Applying Styles to Your New Banner

For each drop and go banner in the photo album, we have modified the below code to link to the banner here. So unless you wish to download the header graphic to upload to your own Opera blog space, there's really no need to do much else to the code unless you simply want to personalize it further. We've highlighed areas of the code that you might want to tweak to suit.

#top {
font-size:11px;
width:852px;
margin:0 -10px;
text-align:left;
background:#c1ccd9 url(/community/graphics/users/7/top.jpg) top left;
height:195px;
color:#516b92;
}

#top h1 {
margin:0;
width:100%;
overflow:hidden;
font-size:20px;
font-weight:normal;
padding-top:18px;
}

#subtitle {
margin:0;
font-size:12px;
width:100%;
overflow:hidden;
color: #fff;
}

The Stylesheet

The entire stylesheet, comprising common.css and main.css, can be downloaded below. Having every element in a custom stylesheet allows you more leeway to change things, and yet, unchanged items do not disturb any portion of the design you do not wish to change. Refer to other sections of this blog for tips and tricks to further customize your stylesheet.

theme4.css