Blogger Template 5 – “Love Mask”

March 6, 2009

Blame my self-imposed amnesia!

I’ve almost totally forgotten that I have a couple more blogger templates I have not shared yet with you all! So here’s another one of them.

This one I called “Love Mask”. The mask just strikes me so much when I first saw it. And if you look closely into the eyes, it seems like the person behind the mask is trying to convey an emotion. Like hiding his real self from the world… or from a lover.

If want to see a demo of the template, click on this link. And if you do decide to use my template, just let me know, give me a holler and I’d be more than glad to visit you and add your link to my site!

Just cut and paste the code I have in here and replace the template code you have on your blogger account.

<?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 expr:dir='data:blog.languageDirection' 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'/> <b:skin><![CDATA[/* /* Variable definitions ==================== <Variable name="bgcolor" description="Page Background Color" type="color" default="#E5A" value="#EA0437"> <Variable name="textcolor" description="Text Color" type="color" default="#000" value="#ffffff"> <Variable name="linkcolor" description="Link Color" type="color" default="#EA0437" value="#2D6E89"> <Variable name="pagetitlecolor" description="Blog Title Color" type="color" default="#fff" value="#66B5FF"> <Variable name="descriptioncolor" description="Blog Description Color" type="color" default="#FEF" value="#ffffcc"> <Variable name="titlecolor" description="Post Title Color" type="color" default="#fff" value="#ffffff"> <Variable name="bordercolor" description="Border Color" type="color" default="#ffc" value="#2D6E89"> <Variable name="sidebarcolor" description="Sidebar Title Color" type="color" default="#000" value="#66B5FF"> <Variable name="sidebartextcolor" description="Sidebar Text Color" type="color" default="#333" value="#C3D9FF"> <Variable name="visitedlinkcolor" description="Visited Link Color" type="color" default="#fff" value="#ffffff"> <Variable name="bodyfont" description="Text Font" type="font" default="normal normal 100% Georgia, Serif" value="normal normal 100% Trebuchet, Trebuchet MS, Arial, sans-serif"> <Variable name="headerfont" description="Sidebar Title Font" type="font" default="normal normal 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif" value="normal bold 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif"> <Variable name="pagetitlefont" description="Blog Title Font" type="font" default="normal normal 300% Gigi" value="normal normal 363% Gigi"> <Variable name="descriptionfont" description="Blog Description Font" type="font" default="normal normal 90% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 90% '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"> <Variable name="startSide" description="Start side in blog language" type="automatic" default="left" value="left"> <Variable name="endSide" description="End side in blog language" type="automatic" default="right" value="right"> */ body { background:$bgcolor; background-image: url(http://img176.imageshack.us/img176/5633/cofiluvbakiw1.jpg); margin:0; color:$textcolor; font:x-small Georgia Serif; font-size/* */:/**/small; font-size: /**/small; text-align: center; } a:link { color:$linkcolor; text-decoration:none; } a:visited { color:$visitedlinkcolor; text-decoration:none; } a:hover { color:$titlecolor; text-decoration:underline; } a img { border-width:0; } /* Header ———————————————– */ #header-wrapper { width:745px; height:300px; margin:0 auto 10px; border:3px solid $bordercolor; background-image: url(http://img338.imageshack.us/img338/5730/coffeeluvfi5.jpg); } #header-inner { background-position: center; margin-$startSide: auto; margin-$endSide: auto; } #header { margin: 5px; border: 0px solid $bordercolor; text-align: left; color:$pagetitlecolor; } #header h1 { margin:5px 5px 0; padding:15px 20px .25em; line-height:1.2em; text-transform:normal; letter-spacing:.2em; font: $pagetitlefont; } #header a { color:$pagetitlecolor; text-decoration:none; } #header a:hover { color:$pagetitlecolor; } #header .description { margin-right: 300px; padding:0 20px 15px; max-width:600px; text-transform:uppercase; letter-spacing:.2em; line-height: 1.4em; font: $descriptionfont; color: $descriptioncolor; } #header img { margin-$startSide: auto; margin-$endSide: auto; } /* Outer-Wrapper ———————————————– */ #outer-wrapper { width: 750px; margin:0 auto; padding:10px; text-align:$startSide; font: $bodyfont; } #main-wrapper { width: 500px; border:3px solid $bordercolor; background-image: url(http://img511.imageshack.us/img511/1543/cofiluvsidexw5.jpg); float: left; 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: 225px; margin-right: 0px; border:3px solid $bordercolor; background-image: url(http://img511.imageshack.us/img511/1543/cofiluvsidexw5.jpg); float: right; 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 */ } #footer-wrapper { width: 725px; margin:0 auto; text-align:center; font: $descriptionfont; } /* Headings ———————————————– */ h2 { margin:1.5em 0 .75em; font:$headerfont; line-height: 1.4em; text-transform:uppercase; letter-spacing:.2em; color:$sidebarcolor; } /* Posts ———————————————– */ h2.date-header { margin:1.5em 0 .5em; margin-left: 10px; margin-right: 10px; } .post { margin:.5em 0 1.5em; margin-left: 10px; margin-right: 10px; border-bottom:1px dotted $bordercolor; padding-bottom:1.5em; } .post h3 { margin:.25em 0 0; margin-left: 10px; margin-right: 10px; padding:0 0 4px; font-size:140%; font-weight:normal; line-height:1.4em; color:$titlecolor; } .post h3 a, .post h3 a:visited, .post h3 strong { display:block; text-decoration:none; color:$titlecolor; font-weight:normal; } .post h3 strong, .post h3 a:hover { color:$textcolor; } .post-body { margin:0 .75em; line-height:1.6em; } .post-body blockquote { line-height:1.3em; } .post-footer { margin: .75em 0; color:$sidebarcolor; text-transform:uppercase; letter-spacing:.1em; font: $postfooterfont; line-height: 1.4em; } .comment-link { margin-$startSide:.6em; } .post img { padding:4px; border:1px solid $bordercolor; } .post blockquote { margin:1em 20px; } .post blockquote p { margin:.75em 0; } /* Comments ———————————————– */ #comments h4 { margin:1em 0; font-weight: bold; line-height: 1.4em; text-transform:uppercase; letter-spacing:.2em; color: $sidebarcolor; } #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; } .feed-links { clear: both; margin-left: 10px; margin-right: 10px; line-height: 2.5em; } #blog-pager-newer-link { float: $startSide; } #blog-pager-older-link { float: $endSide; } #blog-pager { text-align: center; } /* Sidebar Content ———————————————– */ .sidebar { color: $sidebartextcolor; margin-left: 10px; margin-right: 10px; line-height: 1.5em; } .sidebar ul { list-style:none; margin:0 0 0; padding:0 0 0; } .sidebar li { margin:0; padding-top:0; padding-$endSide:0; padding-bottom:.25em; padding-$startSide:15px; text-indent:-25px; line-height:1.5em; } .sidebar .widget, .main .widget { border-bottom:1px dotted $bordercolor; margin:0 0 1.5em; padding:0 0 1.5em; } .main .Blog { border-bottom-width: 0; } /* Profile ———————————————– */ .profile-img { float: $startSide; margin-top: 0; margin-$endSide: 5px; margin-bottom: 5px; margin-$startSide: 0; padding: 4px; border: 1px solid $bordercolor; } .profile-data { margin:0; text-transform:uppercase; letter-spacing:.1em; font: $postfooterfont; color: $sidebarcolor; 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: $postfooterfont; text-transform: uppercase; letter-spacing: .1em; } /* Footer ———————————————– */ #footer { width:660px; clear:both; margin:0 auto; line-height: 1.6em; text-transform:uppercase; letter-spacing:.1em; text-align: center; } ]]></b:skin> </head> <body> <div id='outer-wrapper'> <div id='wrap2'>  <a href='#main'>skip to main </a> | <a href='#sidebar'>skip to sidebar</a> <div id='header-wrapper'> <b:section class='header' id='header' maxwidgets='1' showaddelement='no'> <b:widget id='Header1' locked='true' title='LoveMask (Header)' type='Header'/> </b:section> </div> <div id='content-wrapper'> <div id='crosscol-wrapper' style='text-align:center'> <b:section class='crosscol' id='crosscol' showaddelement='no'/> </div> <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='Profile2' locked='false' title='About Me' type='Profile'/> <b:widget id='BlogArchive2' locked='false' title='Blog Archive' type='BlogArchive'/> </b:section> </div> <div class='clear'> </div> </div>  <div id='footer-wrapper'> <b:section class='footer' id='footer'/> <a href='http://www.manilena.com'>designed by Manilena.com </a> </div> </div> </div> </body></html>

Posted in Website Design - Red, Website Design - Two-Column, Website Designs |

Tags: Blogger Template, love mask, Red, Two-columns template

Nilo:

March 9, 2009 at 1:14 am

Galing mong gumawa ng template, two thumbs-up ako sayo!

ate sienna:

March 9, 2009 at 4:50 pm

hehehehe, maraming salamat. pero hindi ako magaling. i just try. mas maraming talagang ang gagaling na webdesigners na i wish i had their talent and time to do the things they can do

March 10, 2009 at 12:29 am

Sabagay marami ngang magagaling sige binabawi ko na di’ ka na magaling hehehe (joke lang) — Nakakabilib kasi lalo na pag babae ang gumagawa, sana magkaroon tayo ng collaboration of design someday