Chocolate Beach Template
Chocolate and the beach are two of my favorite things. This template is more of a wedding photo theme than chocolate but regardless, it’s a nice looking template. This is a two column XML layout designed for use with the newest version of Blogger. It’s a fixed width and will fit perfectly on an 800×600 screen size and also works on wider screens as well. It has a permanent RSS Feed link in the heading.
To install just download the .zip file and unpack it, then copy and paste the contents into your HTML editor. This theme is ready to go!
The images are already hosted via Photobucket, no need to download those separately!
Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program!
Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
If you like this post then please consider subscribing to our eBlog Templates RSS feed. You can also subscribe by email and have new templates and articles sent directly to your inbox.
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
-----------------------------------------------
Name: Beta Chocolate Beach
Designer: se7en
URL: www.blogsgonewild.net
Type: Free Blogger Beta Skin
----------------------------------------------- */
/* Variable definitions
====================
<Variable name="bgcolor" description="Page Background Color"
type="color" default="#fff" value="#ffffff">
<Variable name="textcolor" description="Text Color"
type="color" default="#333" value="#333333">
<Variable name="linkcolor" description="Link Color"
type="color" default="#58a" value="#5588aa">
<Variable name="pagetitlecolor" description="Blog Title Color"
type="color" default="#666" value="#666666">
<Variable name="descriptioncolor" description="Blog Description Color"
type="color" default="#999" value="#999999">
<Variable name="titlecolor" description="Post Title Color"
type="color" default="#c60" value="#cc6600">
<Variable name="bordercolor" description="Border Color"
type="color" default="#ccc" value="#cccccc">
<Variable name="sidebarcolor" description="Sidebar Title Color"
type="color" default="#999" value="#999999">
<Variable name="sidebartextcolor" description="Sidebar Text Color"
type="color" default="#666" value="#666666">
<Variable name="visitedlinkcolor" description="Visited Link Color"
type="color" default="#999" value="#999999">
<Variable name="bodyfont" description="Text Font"
type="font" default="normal normal 100% Georgia, Serif" value="normal normal 100% Georgia, Serif">
<Variable name="headerfont" description="Sidebar Title Font"
type="font"
default="normal normal 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif" value="normal normal 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif">
<Variable name="pagetitlefont" description="Blog Title Font"
type="font"
default="normal normal 200% Georgia, Serif" value="normal bold 200% Verdana, sans-serif">
<Variable name="descriptionfont" description="Blog Description Font"
type="font"
default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif">
<Variable name="postfooterfont" description="Post Footer Font"
type="font"
default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif">
*/
/* Use this with templates/template-twocol.html */
#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}
body {
background:#120200;
margin:0;
color:#B18C5B;
font-size:90%;
font-family: Arial, Verdana, Serif;
text-align: center;
}
a:link {
color:#B18C5B;
text-decoration:none;
}
a:visited {
color:#B18C5B;
text-decoration:none;
}
a:hover {
color:#B18C5B;
text-decoration:underline;
}
a img {
border-width:0;
}
#main-wrapper a:link {
color:#DBBC94;
text-decoration:none;
}
#main-wrapper a:visited {
color:#DBBC94;
text-decoration:none;
}
#main-wrapper a:hover {
color:#B18C5B;
text-decoration:underline;
}
#main-wrapper a img {
border:2px solid #B18C5B;
}
/* Header
-----------------------------------------------
*/
#header-wrapper {
background:url("http://i254.photobucket.com/albums/hh92/eblogtemplates/chocobeach/choc-beachheading.jpg") no-repeat;
width:770px;
height:324px;
margin:0 auto;
text-align:left;
}
#header {
margin:0;
text-align: left;
}
#header h1 {
margin:0;
padding:240px 0 0 20px;
font: 160% Verdana, Arial, Serif;
font-weight:bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
font-style:italic;
color:#B18C5B;
}
#header h2 {
margin:0;
padding:0px 0 0 30px;
font: 100% Verdana, Arial, Serif;
color:#B18C5B;
}
#header a {
color:#B18C5B;
text-decoration:none;
}
#header a:hover {
color:#B18C5B;
text-decoration:underline;
}
.descriptionwrapper {
margin:-10px 0 10px;
padding:0 0 0 20px;
font: $descriptionfont;
font:78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
text-align:left;
color: #B18C5B;
}
/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
background:url("http://i254.photobucket.com/albums/hh92/eblogtemplates/chocobeach/choc-beachcontent.jpg");
background-repeat: repeat-y;
width: 770px;
margin:0 auto;
padding:0;
text-align:left;
font: 100% Arial, Verdana, Serif;
}
#main-wrapper {
width: 515px;
float: right;
margin:0;
padding:0 20px 10px 10px;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 195px;
float: left;
margin-top:-10px;
padding-left:20px;
color:#B18C5B;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
br {
clear:both;
}
/* Headings
----------------------------------------------- */
#sidebar-wrapper h2 {
background: url("http://i254.photobucket.com/albums/hh92/eblogtemplates/chocobeach/beach-h2bg.gif") no-repeat;
width:190px;
height:35px;
margin:1.5em 0 .75em;
padding:4px 8px 0 8px;
font-size:14px;
font-family: Verdana, Arial, Serif;
font-weight;bold;
line-height: 1.4em;
text-transform:uppercase;
color:#DBBC94;
}
/* Posts
-----------------------------------------------
*/
#main h2.date-header {
margin:1.5em 0 0;
padding:0 0 0 10px;
height:16px;
font-size:12px;
}
.post {
margin:.5em 0 1.5em;
padding-bottom:1em;
}
.post h3 {
background: url("http://i254.photobucket.com/albums/hh92/eblogtemplates/chocobeach/beach-titlebg.gif") no-repeat;
width:500px;
height:31px;
margin:.25em 0 0;
padding:5px 8px 0 8px;
font-family: Verdana, Arial, Serif;
font-size:16px;
font-weight:bold;
line-height:1.5em;
color:#AD0E0A;
}
.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
font-family: Verdana, Arial, Serif;
font-size:16px;
text-decoration:none;
color:#B18C5B;
font-weight:bold;
}
.post h3 strong, .post h3 a:hover {
color:#B18C5B;
text-decoration:underline;
}
.post-body {
padding:0 10px;
}
.post p {
margin:0 0 .75em;
line-height:1.6em;
}
.post-footer {
margin: .75em 0;
padding:0 10px;
color:#777;
text-transform:uppercase;
letter-spacing:.1em;
font: 78% "Trebuchet MS", Trebuchet, Verdana, Arial, Serif;
line-height: 1.4em;
}
.comment-link {
margin-left:.6em;
}
.post img {
padding:4px;
}
.post blockquote {
margin:1em 20px;
}
.post blockquote p {
margin:.75em 0;
}
p.post-footer-line-3 {
margin:0 auto;
padding:0;
}
/* Comments
----------------------------------------------- */
#comments h4 {
margin:1em 0;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
}
#comments-block {
margin:1em 0 1.5em;
line-height:1.6em;
}
#comments-block .comment-author {
margin:.5em 0;
}
#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}
#comments-block .comment-body p {
margin:0 0 .75em;
}
.deleted-comment {
font-style:italic;
color:gray;
}
#blog-pager-newer-link {
float: left;
}
#blog-pager-older-link {
float: right;
}
#blog-pager {
text-align: center;
}
.feed-links {
clear: both;
line-height: 2.5em;
}
/* Sidebar Content
----------------------------------------------- */
#sidebar-wrapper ul {
list-style-type:none;
}
#sidebar-wrapper p {
padding-left:12px;
}
.sidebar {
color:#B18C5B;
line-height: 1.5em;
}
.sidebar ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.sidebar li {
margin:0;
padding:0 0 .25em 15px;
text-indent:-4px;
line-height:1.2em;
}
.sidebar .widget, .main .widget {
margin:0 0 1.5em;
padding:0 0 1.5em;
}
.main .Blog {
border-bottom-width: 0;
}
/* Profile
----------------------------------------------- */
.profile-img {
float: left;
margin: 0 5px 5px 0;
padding: 2px;
border: 2px solid #B18C5B;
}
.profile-data {
margin:0;
text-transform:uppercase;
letter-spacing:.1em;
font: 78% "Trebuchet MS, Trebuchet, Arial, Serif;
font-weight: bold;
line-height: 1.6em;
}
.profile-datablock {
margin:.5em 0 .5em;
}
.profile-textblock {
margin: 0.5em 0;
line-height: 1.6em;
}
.profile-link {
font: 78% "Trebuchet MS, Trebuchet, Arial, Serif;
text-transform: uppercase;
letter-spacing: .1em;
}
/* Footer
----------------------------------------------- */
#footer {
background:url("http://i254.photobucket.com/albums/hh92/eblogtemplates/chocobeach/choc-beachfooter.jpg") no-repeat;
width:770px;
height:40px;
clear:both;
margin:0 auto;
padding:0;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}
#credits {
margin:0;
padding-left:12px;
font-size:11px;
}
/** Page structure tweaks for layout editor wireframe */
body#layout #header {
margin-left: 0px;
margin-right: 0px;
}
]]></b:skin>
</head>
<body>
<div id='outer-wrapper' style='margin-top:0px;'><div id='wrap2'>
<!-- skip links for text browsers -->
<span id='skiplinks' style='display:none;'>
<a href='#main'>skip to main </a> |
<a href='#sidebar'>skip to sidebar</a>
</span>
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Chocolate Beach (Header)' type='Header'/>
</b:section>
</div>
<div id='content-wrapper'>
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
</b:section>
<h2>RSS Feed</h2>
<p>
<a class='feed-link' href='/feeds/posts/default' target='_blank' type='application/atom+xml'><img src='http://i254.photobucket.com/albums/hh92/eblogtemplates/chocobeach/feed_icon.gif'/> Atom Feed (xml)</a>
</p>
<h2>Credits</h2>
<div id='credits'>
<!-- Please Don't Remove Link Back, Thanks! -->
Site Design By: <a href='http://freeskins.blogspot.com' title='Get Your Own Blog!'>Free Blogger Skins</a><br/>
Distributed by: e<a href='http://www.eblogtemplates.com/'>Blog Templates</a>
</div>
<p id='powered-by'><a href='http://www.blogger.com'><img alt='Powered by Blogger' src='http://buttons.blogger.com/bloggerbutton1.gif'/></a></p>
</div>
<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>
<br/>
</div> <!-- end content-wrapper -->
<div id='footer-wrapper'>
<p align='center'><a href='http://www.eblogtemplates.com/blogger/'>Free Blogger Templates</a></p>
<b:section class='footer' id='footer'/>
</div>
</div></div> <!-- end outer-wrapper -->
</body>
</html>
0 komentar:
Posting Komentar