Pages

Wednesday, January 05, 2011

Early Morning Theme | A WordPress theme converted to Blogger

Today, I am releasing Early Morning Theme converted from wordpress to blogger. This is my first wordpress theme to blogger conversion. It is a simple yet elegant theme. Feel free to try it.


{ Live Demo } | { Download Here }

{ Customizing Early Morning Theme }
/* Post images with CSS animated captions by Blogger Bits */
#post-image {
}

#figure {
position:relative;
float:left;
margin:10px;
overflow:hidden;
padding: 1px;
}

#figure:hover {
-moz-box-shadow:0 0 20px rgba(0,0,0,0.75);
-webkit-box-shadow:0 0 20px rgba(0,0,0,0.75);
box-shadow:0 0 20px rgba(0,0,0,0.75);
}

#figure .caption {
position:absolute;
bottom:0;
left:0;
opacity: 0.75;
margin-bottom:-115px;
-webkit-transition: margin-bottom;
-webkit-transition-duration: 400ms;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: margin-bottom;
-moz-transition-duration: 400ms;
-moz-transition-timing-function: ease-out;
-o-transition-property: margin-bottom;
-o-transition-duration: 400ms;
transition: margin-bottom;
transition-duration: 400ms;
transition-timing-function: ease-out;
}

#figure:hover .caption {
margin-bottom:0px;
}

#post-image .caption {
width:100%;
height:90px;
padding:10px;
background:#111;
color:#fff;
font-family: Arial, Helvetica, sans-serif;
}

#post-image .caption b {
text-shadow: 0px 2px 0px #000;
}
#post-image .caption {
color: #ddd;
line-height: 24px;
font-size: 14px;
text-shadow: 0px 2px 0px #000;
}


1. Navigation bar

2. Search Box

You have to do it manually. Click Add a gadget > HTML/Javascript > Paste the code below > Give a title > Save.







3. Date format problem

Go to Page Elements > Click on the Edit button for “Blog Posts” element > Change the time format to (Month Date, Year).

For example….. February 19, 2010

1 comment:

LinkWithin

Related Posts Plugin for WordPress, Blogger...