Blogs Templates Collections for Friendster, Hi5, Myspace, Forum site,Website and more features

template name: Cafe Blog
Size: 25 KB
2 Layers , 3 Columns , Fixed Background
Special for blogger (blogspot)
Best quality (IE & Firefox) all Size and Resolutions
Live Sample

Layout Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title><$BlogPageTitle$></title> <$BlogMetaData$> <style type="text/css"> /*---------------------- Name: 3 Columns Cafe Blog Designer: j.aghili URL: www.finalsense.com date: oct 2006 ---------------------- */ body { background : #fff url('http://photos1.blogger.com/blogger/3921/4104/1600/ab4.jpg') repeat-x fixed top ; margin: 0px;padding: 0px; color: #333333; font-size: 12px; font-family: verdana, Arial, Helvetica, sans-serif; text-align: center; } #c1 {border: 1px solid #999; margin: 40px auto; padding: 10px; text-align:left; background: #000; width: 900px;} #c2{padding: 5px; border-bottom:1px solid #ccc; } /*---------------------- Replace Your Banner Address -----------------------------*/ #banner {background : #090402 url('http://photos1.blogger.com/blogger/3921/4104/1600/ac401.jpg') no-repeat right; padding: 10px; margin-bottom: 10px; border: 1px solid #999; height: 183px;} #content { padding: 10px; margin: 10px 235px; border: 1px solid #999; background : #cdb788 url('http://photos1.blogger.com/blogger/3921/4104/1600/ag1.jpg') no-repeat right top; } #side1 { float: left; width: 200px; margin: 0px 5px 10px 0px; padding: 10px; color: #cdb788;} #side2 {float: right; width: 200px; margin: 0px 5px 10px 0px; padding: 10px; text-align: center;} #footer { clear: both; padding: 10px; width: 900px; border: 1px solid #999; background: #000;} a { font-weight: bold; color: #664E38; text-decoration: none; } a:link { color: #9f6e04; text-decoration: none; } a:visited { color: #993300; text-decoration: none; } a:hover { color: #800000; text-decoration: underline; } .postinfo { font-size : 95%;margin-bottom: 35px;color: #cc6600;} #head1 { margin:5px 5px 0; padding:20px 20px; font-size:24pt; text-transform:uppercase; color: #be6526; } #head1 a:link {color: #be6526; text-decoration: none; font-size: 24pt;} #head1 a:hover {color:#cdb788; text-decoration: none; left; font-size: 24pt; } #des { margin:0 5px 5px; padding:0 20px 20px; font-size: 8pt; color: #cdb788; } .post { padding: 10px; margin: 0px; font-size: 9pt; font-weight: normal; font-weight: bold;} #title2 { color: #993300; text-decoration: none; font-size: 10pt; padding-bottom: 5px; } #title2 a:link {color: #80aad5; text-decoration: none; font-size: 10pt; font-weight: bold;} #title2 a:hover {color:#ff9966; text-decoration: none; left; font-size: 10pt; font-weight: bold;} .side { padding: 2px; margin: 2 0 2 0px; color: #cdb788; font-size: 12px; text-align: center;} .sidebar-title {background: #000 url('http://photos1.blogger.com/blogger/3921/4104/1600/abb.jpg') no-repeat left ; border: 1px solid #999; padding: 1px; margin: 0px; color: #fff; font-size: 12px; text-align: center; line-height: 175%; } .date { font-size: 12pt; color: #800000; margin: 0px 10px; padding: 2px; font-weight:bold; border-bottom:1px } #comment { margin:1 0 0 0; color:#800000; padding:0 1 0 1px; } #comments h4 { margin:4 0; font:bold 78% "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; text-transform:uppercase; color:#663300; } #comments h4 strong { font-size:130%; } #comments-block { margin:4 0 ; } #comments-block dt { margin:4 0;color:#9f6e04; } #comments-block dd { margin:2 0 0; color:#9f6e04; } #comments-block dd.comment-timestamp { font:78% "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; text-transform:uppercase; color:#9f6e04;} #comments-block dd p { margin:0 0 ;color:#fff; } .deleted-comment { font-style:italic; } #b-navbar {height:0px;visibility:hidden;display:none} </style> </head> <div id="c1" align="center"> <div id="banner" > <h1 id="head1"> <ItemPage><a href="<$BlogURL$>"></ItemPage> <$BlogTitle$> <ItemPage></a></ItemPage> </h1> <$BlogDescription$> </div> <div id="side1"> <div class="side"> <h2 class="sidebar-title">Advertising bar</h2> Your Ad here ... <h2 class="sidebar-title">Other ...</h2> Product ... Services ... Other things ... </div> </div> <div id="side2"> <div id="side"> <$BlogMemberProfile$> <h2 class="sidebar-title">Previous Posts</h2> <BloggerPreviousItems> <a href="<$BlogItemPermalinkURL$>"> <$BlogPreviousItemTitle$></a> </BloggerPreviousItems> <MainOrArchivePage> <h2 class="sidebar-title">Archives</h2> <BloggerArchives> <a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a> </BloggerArchives> </MainOrArchivePage> <h2 class="sidebar-title">Links</h2> <marquee onMouseOver="this.stop()" onMouseOut="this.start()" scrollAmount="1" scrollDelay="10" direction="up" height="99" width="170" style="text-align: center"><left> <a target="_blank" href="http://www.finalsense.com/software/software_information_review.htm">Downloads</a> <a target="_blank" href="http://www.finalsense.com/news.htm">Technology News</a> <a target="_blank" href="http://www.finalsense.com/services/blog_templates/index.htm">Templates</a> <a target="_blank" href="http://www.finalsense.com/services/webhosting.htm">Web Hosting</a> <a target="_blank" href="http://www.finalsense.com/learning/index.htm">Articles</a> <a target="_blank" href="http://www.finalsense.com/games/best_game_zone.htm">Games</a> <a target="_blank" href="http://www.blogger.com">Blogger</a> <a target="_blank" href="http://www.google.com">Google</a> </marquee> <h2 class="sidebar-title">Sponsored Links</h2> <a target="_blank" href="http://blogger.com"> Blogger</a> <a target="_blank" href="http://www.finalsense.com"> FinalSense</a> <a target="_blank" href="http://www.amazon.com"> Amazon</a> <a target="_blank" href="http://yahoo.com"> Yahoo</a> <a target="_blank" href="http://www.ebay.com"> Ebay</a> </div> </div> <div id="content"> <div > <Blogger> <BlogDateHeader> <h6 ><$BlogDateHeaderDate$></h6> </BlogDateHeader> <a name="<$BlogItemNumber$>"></a> <BlogItemTitle> <BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl> <h5><$BlogItemTitle$></h5> <BlogItemUrl></a></BlogItemUrl> </BlogItemTitle> <div class="content"> <table cellspacing="0" cellpadding="0"><tr><td><$BlogItemBody$></td></tr></table> </div> <div class="postinfo"> posted by <$BlogItemAuthorNickname$> at <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a> <MainOrArchivePage><BlogItemCommentsEnabled> <a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a> </BlogItemCommentsEnabled><BlogItemBacklinksEnabled> <a class="postinfo" href="<$BlogItemPermalinkUrl$>#links">links to this post</a> </BlogItemBacklinksEnabled> </MainOrArchivePage> <$BlogItemControl$> <div id="c2"></div> </div> <ItemPage> <div id="comment"> <BlogItemCommentsEnabled><a name="comments"></a> <h6><$BlogItemCommentCount$> Comments:</h6> <dl id="comments-block"> <BlogItemComments> <dt class="postinfo" id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a> <$BlogCommentAuthor$> said... </dt> <dd class="comment-body"> <$BlogCommentBody$> </dd> <dd class="comment-timestamp"><a href="#<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a> <$BlogCommentDeleteIcon$> </dd> </BlogItemComments> </dl> <$BlogItemCreate$> </BlogItemCommentsEnabled> <BlogItemBacklinksEnabled> <a name="links"></a><h5>Links to this post:</h5> <dl id="comments-block"> <BlogItemBacklinks> <dt class="comment-title"> <$BlogBacklinkControl$> <a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$> </dt> <dd class="comment-body"><$BlogBacklinkSnippet$> posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$> </dd> </BlogItemBacklinks> </dl> <$BlogItemBacklinkCreate$> </BlogItemBacklinksEnabled> <a href="<$BlogURL$>"><< Home</a> </div> </ItemPage> </Blogger> </div> </div> </div> <div id="footer"> Designed by <a target="_blank" href="http://www.finalsense.com"> FinalSense.com</a> Copyright © 2006-2007 <a href="$BlogURL$"> <$BlogTitle$> </a> </div> </div> </body> </html>

Replace This HTML code with Your blog template code.

by Final Sense

Button Code