TEMPLATE Johny Sompret ~ HALANDRI NEWS

Live Demo
TEMPLATE

Απλό πρότυπο στυλ με το περιοδικό. Δεν υπάρχει καμία ιδιαιτερότητα σε αυτό το πρότυπο. Είναι ένα λευκό, μπλε και μαύρο χρώμα με 3 blogger στήλη εκεί, εύκολη φόρτωση με κομψό στιλ, 1 δεξιά στήλη, στήλες 3 υποσέλιδο, μενού πλοήγησης, οι διαφημίσεις έτοιμο, σελιδοποίηση για μπλόγκερ

Ο κωδικός λοιπόν για το παραπάνω κουτάκι είναι ο:
<?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>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
    <b:include data='blog' name='all-head-content'/>
    <b:if cond='data:blog.pageType == "index"'>
    <title><data:blog.pageTitle/></title>
    <b:else/>
    <title><data:blog.pageName/> - <data:blog.title/></title>
    </b:if>
    <meta content='Your Blog Description here!' name='description'/>
    <meta content='Your Keywords here!' name='keywords'/>
    <meta content='Author Name here!' name='Author'/>
    <meta content='Author Email Address here!' name='Email'/>
    <meta content='document' name='resource-type'/>
    <meta content='all' name='audience'/>
    <meta content='general' name='rating'/>
    <meta content='all' name='robots'/>
    <meta content='index, follow' name='robots'/>
    <meta content='id' name='language'/>
    <meta content='id' name='geo.country'/>
    <meta content='global' name='distribution'/>
    <meta content='1 days' name='revisit-after'/>
    <meta content='Indonesia' name='geo.placename'/>
<b:skin><![CDATA[

/* -----------------------------------------------
Blogger Template Style
Name    : Johny Simpleblog
Author  : Maskolis
Url     : http://creatingwebsite-maskolis.blogspot.com/
Updated by: Blogger Team
----------------------------------------------- */

/* Variable definitions
   ====================
   <variable name="bgcolor" description="Page Background Color"
             type="color" default="#fff" value="#b1bb8e">
   <variable name="textcolor" description="Text Color"
             type="color" default="#444" value="#444444">
   <variable name="linkcolor" description="Link Color"
             type="color" default="#58a" value="#000000">
   <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="#666666">
   <variable name="titlecolor" description="Post Title Color"
             type="color" default="#444" value="#444444">
   <variable name="bordercolor" description="Border Color"
             type="color" default="#ccc" value="#dcd9d9">
   <variable name="sidebarcolor" description="Sidebar Title Color"
             type="color" default="#999" value="#666666">
   <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="#000000">
   <variable name="bodyfont" description="Text Font"
             type="font" default="normal normal 100% Arial, Serif" value="normal normal 12px Arial, Tahoma, Helvetica, FreeSans, 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 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif">
   <variable name="pagetitlefont" description="Blog Title Font"
             type="font"
             default="normal normal 200% Arial, Serif" value="normal normal 26px Georgia, Serif">
   <variable name="descriptionfont" description="Blog Description Font"
             type="font"
             default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 12px Lucida Sans, Tahoma, Helvetica, FreeSans, 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 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif">
   <variable name="startSide" description="Side where text starts in blog language"
             type="automatic" default="left" value="left">
   <variable name="endSide" description="Side where text ends in blog language"
             type="automatic" default="right" value="right">
*/

body{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFizaiyYF4S3nXVI5-KEMM6NVXaTK6idFufhrbkUzbVIUFSY09xNwM4blagjCEpN3C6C6qRtV6-0tLB2KwhdhuZDnYXnPBj081EtV6_Iotymv-M7yv9lfFNF5a0IcCeKNzT2wKdbJCmVp9/s1600/body-bg1.png);color:$textcolor;font:x-small Trebuchet MS;font-size:small;text-align:left;margin:0}
a:link{color:$linkcolor;text-decoration:none}
a:visited{color:$visitedlinkcolor;text-decoration:none}
a:hover{color:$titlecolor;text-decoration:none}
a img{border-width:0}
#header-wrapper{width:960px;margin:0 auto}
#header-inner{background-position:center;margin-left:auto;margin-right:auto}
#header{float:left;width:222px;height:90px;border:0 solid #dcd9d9;text-align:left;margin:0}
#header2{float:right;width:728px;margin-right:0px;text-align:left;color:#555}
.header2 .widget{margin:0 auto;padding:0 0 7px}
.header .widget{margin:0 auto;padding:0}
#header h1{line-height:.8em;text-transform:none;letter-spacing:.1em;font:bold 30px Oswald;margin:0 auto;padding:0px 5px .15em;text-shadow: 1px 1px 1px #EEEFD1;color:#4c512e}
#header a:hover{color:#f89c21}
#header .description{max-width:100%;text-transform:none;letter-spacing:.01em;line-height:1.2em;font:14px Oswald;color:#595e3b;margin:0 auto;padding:0 5px 5px}
#header img{margin-startside:auto;margin-endside:auto}
#navbar-iframe{height:0;visibility:hidden;display:none}
#mainpage-wrapper{width:640px;float:left;word-wrap:break-word;overflow:hidden}
#main-wrapper{background:#fff;width:640px;float:$startSide;word-wrap:break-word;overflow:hidden}
#sidebarleft-wrapper{width:180px;float:$startSide;word-wrap:break-word;overflow:hidden}

.sidebarleft h2{font:13px Oswald;color:#193250;text-transform:uppercase;border-bottom:1px solid #c3c3c3;margin:0;padding:7px 10px;text-shadow:1px 1px 1px #ccc}
.sidebarleft{background:#fff;color:$sidebartextcolor;line-height:1.3em;}
.sidebarleft ul{list-style:none;margin:0;padding:0}
.sidebarleft li{border-bottom:1px dotted $bordercolor;text-indent:0;line-height:1.3em;margin:0;padding:3px 0 4px}
.sidebarleft .widget{border:0 solid $bordercolor;margin:0 0 5px}
.sidebarleft .widget-content{margin:0 auto;padding:6px 9px}
.sidebarleft a:link,.sidebarleft a:visited{font:bold 12px Arial;color:#666;text-decoration:none;}
.sidebarleft li a:hover{color:#4488dd}

#sidebar-wrapper{background:#e4e4e4;width:320px;float:$endSide;word-wrap:break-word;overflow:hidden}
h2{font:$headerfont;line-height:1.4em;text-transform:none;letter-spacing:.01em;color:$sidebarcolor;margin:.5em 0 .25em}
h2.date-header{text-transform:none;font:normal 12px Arial;color:#999;line-height:1.2em;margin:.1em 0}
.post{margin:.5em 0 .1em;padding:15px}
.post h3{font:20px Oswald;line-height:1.2em;color:$titlecolor;margin:.25em 0 0;padding:0 0 4px;text-shadow:1px 1px 1px #ccc;}
.post h3 a,.post h3 a:visited,.post h3 strong{display:block;text-decoration:none;color:$titlecolor;font-weight:700}
.post h3 strong,.post h3 a:hover{color:#4488dd}
.post-body{border-top:2px solid #ccc;color:#555;padding-top:6px;line-height:1.3em;margin:1em 0 .75em;font-family:arial, verdana, sans-serif}
.post-body blockquote{line-height:1.3em}
.post-footer{color:#666;text-transform:none;letter-spacing:.01em;font:$postfooterfont;line-height:1.4em;margin:.75em 0}
.comment-link{margin-startside:.6em}
.post blockquote{margin: 10px 10px 10px 20px;padding: 10px 15px 10px 15px;line-height: 1.6em;color: #333;background: #eee;border-left: 20px solid #ccc}
.post blockquote p{margin:.75em 0}
table{width:100%;border-collapse:collapse;border-spacing:0;border:1px solid #999;color:#444;margin:10px 0}
table td,table th{text-align:left;border:1px solid #999;padding:.4em .8em}
table th{text-transform:uppercase;font-weight:400;border:1px solid #999}
table td{border:1px solid #999}
table tr.even td{border:none}
.comments{padding:0 15px}
#comments h4{font-size:16px;font-weight:400;margin:20px 0}
.cm_wrap{clear:both;margin-bottom:10px;float:right;width:100%}
.cm_head{width:60px;float:left;margin:0}
.cm_avatar{vertical-align:middle;border:1px solid #DDD;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzamhyphenhyphenfBtF-lnWR8lmUvngL7K57hL1oGlNQPGoRHRZDHb19IGnz294mMRwQSEEn1qxFQ397ivXL6Eh8vLEPRcDlMQrZtmaB2XGvRPU_9iemcD1NlG1g8A6zEqLgkXu5hDtW3Gv5RwIOak/s1600/anonymous.jpg) center no-repeat;width:35px;height:35px;margin:0;padding:3px}
.cm_avatar_a{vertical-align:middle;border:1px solid #DDD;background:silver;background-position:center;background-repeat:no-repeat;width:35px;height:35px;margin:0;padding:3px}
.cm_reply a{display:inline-block;border:1px solid #C4C4C4;border-top-color:#E4E4E4;border-left-color:#E4E4E4;color:#424242!important;text-align:center;text-decoration:none;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;background:0;font:11px/18px sans-serif;margin:0;padding:1px 6px}
.cm_reply a:hover{text-decoration:none!important;background:#aaa}
.cm_entry{background:#fcfcfc;border:1px solid #E4E4E4;overflow:hidden;padding:16px}
.cm_arrow{display:block;width:9px;height:18px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn9k_JsL0p89TXoS8mXlSLwOmWsSJyXbnnhNyG9nDCgp2z3SJGQZOARGXOELot5LXlNZxAwQmYMhMBN78j1S8yyadRCbAWH-goHtXfBoWfzbyHTd6s7_k4bkjE_6x_fs02hmQboFEMSt4/s1600/comment-arrow.gif) no-repeat;position:absolute;margin-left:-25px}
.cm_info{margin-bottom:5px;border:thin solid #E6E6E6;background-color:#F4F4F4;padding:5px}
.cm_info_a{margin-bottom:5px;border:thin solid #E6E6E6;background-color:#e5e5e5;padding:5px}
.cm_name{font-size:14px;color:#333!important;text-decoration:none;float:left}
.cm_name_a{font:bold 13px Arial;color:#333!important;text-decoration:none;float:left}
.cm_date{font-size:10px;color:#999;text-decoration:none;float:right}
.cm_date_a{font:normal 10px Arial;color:#333;text-decoration:none;float:right;padding-top:5px}
.cm_pagenavi{font-size:10px;text-transform:uppercase;color:#666;text-shadow:1px 1px #FFF;font-weight:700}
.cm_pagenavi a{color:#666;text-decoration:none;padding:10px}
.cm_pagenavi span{color:#888;background:#FFF;border:1px solid #E0E0E0;padding:4px}
.comment-body-author{font-family:Arial;font-weight:300}
#blog-pager{position:relative;top:10px;width:auto;clear:both;font-family:Arial;font-weight:700;color:#4c502f;font-size:13px;margin:10px;padding:5px 10px}
.feed-links{clear:both;line-height:2.5em}
.sidebar h2{background:#ccc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4HZJqeqRAHA3I1X_8nJ1DIz7Vo232KqLS5maaxRJ_fdRB7TvTsHpoPMg_tpeiGvYdp4pdJ6pzQwGWsJrOO8mzc75HNe1dbF7I_Hmy9f-VlLbTYKeij1MNVBinkDrXl8PAvVnnQdJkrFA/s1600/fade.png) repeat-x top;font:13px Oswald;color:#444;text-transform:uppercase;margin:0;padding:6px 0 7px 10px;border-bottom:1px solid #bababa;border-top:1px solid #bababa}
.sidebar{text-shadow: white 1px 1px 1px;color:#666666;line-height:1.3em;border:1px solid #c3c3c3;border-top:none}
.sidebar li{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5M2kvTjR7FoDbCcHj0kg-Jv2zHkIl5qutXyHFyuZDxq-o45CJePjjB1iAwXJmU2WuE-yk21DAqs6p7Iy7EodjaBAvzq7YBd9z-ASOCK4MmjcX2AYZbDr766XhKygnoVk7MfpeMrYLl_A/s1600/batas.gif) repeat-x scroll bottom;text-indent:0;line-height:1.3em;margin:0;padding:3px 0 4px}
.sidebar .widget{border:0 solid $bordercolor;margin:0 0 5px}
.sidebar .widget-content{margin:0 auto;padding:5px 10px}
.sidebar a:link,.sidebar a:visited{font:bold 12px Arial;color:#555;text-decoration:none}
.main .widget{border-bottom:1px dotted $bordercolor;margin:0 0 1.5em;padding:0 0 1.5em}
.main .Blog{border-bottom-width:0}
.footer h2{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGVd6EU1LrRFt71NMWIIHJl4z_4JvgH3LfiY8KCenB-T_J4fKNBsAuPbuLgQxoIHXbIBFAX7g57hVDr5IAk2XmmOCoGrpEzLUVELK7_bNd145QG8XDVbZelm0QJcZCzZaI6bkXSm0sV3mU/s1600/batas.gif) repeat-x scroll bottom;font:14px Oswald;padding-bottom:5px;margin-bottom:15px;line-height:1.3em;text-transform:uppercase;color:#ddd}
.footer{color:#aaa;line-height:1.3em;font:normal 12px Arial}
.footer ul{list-style:none;color:#EAE9E8;margin:0;padding:0}
.footer li{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3PngHfCp5lZygWvfbnCa-dPCpQW90WYQ1ODYQ0c3eZg9TG-57fGc1OuUpMuuaTLK3bB2URcjPBGz5RQJlMJhkvpUBw3H6RY06ReBu6RzY9s7C0X6buT9ZTl1dlkwu3t1hkZSC83kKB6Yd/s1600/bullet.png) no-repeat 1px 5px;font:normal 12px Arial;color:#626262;text-indent:0;line-height:1.2em;margin:0;padding:2px 0 3px 17px}
.footer a:link,.footer li a:visited{color:#aaa;text-decoration:none}
.sidebar li a:hover,.footer li a:hover{color:#fff}
.footer .widget{margin:0 0 8px;padding:6px 0;text-shadow:1px 1px 2px #000}
.footer .widget-content{padding:0 auto}
.profile-img{float:$startSide;margin-top:0;margin-endside:10px;margin-bottom:5px;margin-startside:0;border:1px solid $bordercolor;padding:4px}
.profile-data{text-transform:uppercase;letter-spacing:.01em;font:bold 13px Arial;color:$sidebarcolor;line-height:1.3em;margin:0}
.profile-datablock{margin:.5em 0}
.profile-textblock{line-height:1.3em;margin:.5em 0}
.profile-link{font:$postfooterfont;text-transform:none;letter-spacing:.01em}
.picfooter{background-color:#222;background-image: -moz-linear-gradient(top,#444 0,#222 100%); background-image: -ms-linear-gradient(top,#444 0,#222 100%); background-image: -o-linear-gradient(top,#444 0,#222 100%); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#444),color-stop(100%,#222)); background-image: -webkit-linear-gradient(top,#444 0,#222 100%); background-image: linear-gradient(to bottom,#444 0,#222 100%);border-bottom:1px solid #000;border-top:4px solid #111;width:960px;margin-startside:auto;margin-endside:auto;text-align:center;font:normal normal 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif}
#footer-wrapper{width:940px;text-align:left;font:normal normal 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif;margin:0 auto;padding:10px}
#footer1-wrapper{width:300px;float:left;word-wrap:break-word;overflow:hidden}
#footer2-wrapper{margin-left:10px;width:300px;float:left;word-wrap:break-word;overflow:hidden;padding:0 10px}
#footer3-wrapper{width:300px;float:right;word-wrap:break-word;overflow:hidden}
.creditpic{background:#111;width:960px;margin:0 auto;padding:0 auto;border-top:1px solid #444;text-shadow:1px 1px 2px #000}
.credit{width:940px;line-height:1.6em;text-align:center;font-family:Arial;font-size:12px;color:#999;overflow:hidden;clear:both;margin:0 auto;padding:12px 0}
.credit a:link,.credit a:visited{color:#aaa;text-decoration:none}
.credit a:hover{color:#fff;text-decoration:none}
.showpageOf{font:11px Arial;border:1px solid #7b7c7d;color:#000;margin:2px;padding:3px 6px}
.showpageNum a,.showpage a{font:11px Arial;border:1px solid #7b7c7d;color:#000;text-decoration:none;margin:2px;padding:3px 6px}
.showpageNum a:hover,.showpage a:hover,.showpagePoint{font:11px Arial;border:1px solid #2d5b95;background:#3871b8;color:#edf5ff;margin:2px;padding:3px 6px}

#outer-wrapper{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_q6CmIu_c3Mg0ynDgKa8mjZPJLE28IvXmV7LP-eMjkjEPNd61UALET2-HpT_3JPJ_4m45wF6ZnsHAr3Yqni70BewQ_lqXCtZe6Bohc58TPKA0DXKckAoFIyj7zmjZ4hhk7P669faISc3D/s1600/outer-wrapper.png);width:960px;-moz-box-shadow:0 0 12px #000;text-align:$startSide;font:$bodyfont;margin:10px auto;padding:10px;padding-top:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-moz-box-shadow:0 0 40px rgba(0,0,0,.20);-webkit-box-shadow:0 0 5px rgba(0,0,0,.20);-goog-ms-box-shadow:0 0 10px #222;box-shadow:0 0 40px rgba(0,0,0,.20)}
.cm_entry p,.cm_entry_a p{clear:both;border:thin solid #E6E6E6;background-color:#fff;font-size:13px;color:#333;word-wrap:break-word;padding:5px}
.sidebar li a:hover{color:#4488dd}

#under-wrapper{float:left;width:100%;border-bottom:1px solid #aaa;margin:10px 0;padding:5px 0 15px}
#related-articles{float:left;width:275px;border-right:1px solid #ddd;margin:5px 0 0;padding:0 15px 0 0}
#related-articles .widget{margin:0;padding:0}
#related-articles .widget h2,#related-posts h2{font:bold 13px Arial;color:#000;text-transform:none;margin:0 0 5px;padding:0}
#related-articles a{color:#444;font:12px Arial}
#related-articles a:hover{color:#9daf22}
#related-articles li{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtmH5yTQ7eW8Lt4EbIkijsKO6tLkW7Dn93XiHvZ36MK9YUenxz7komgSqGBiRVl2HqSSENWt4iza82mGUqQBnJhG96ZN5Dig958lPHykuuYmBW0k598vpMGrbEmXip366ltFkgNKZSlhQ/s1600/bullet-list.gif) no-repeat 0 8px;text-indent:0;line-height:1.2em;margin:0;padding:2px 0 2px 10px}
#banner-ads{float:right;width:300px;margin:5px 0}
.comments-area {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi55tyCEefuVqVPcN-oydrI5djsk2vtg2PQWqfvSVYm6Bblyrl-JEidVihpVfjy9KlH9Kg7w93OtAL4yoAAe46d65BpgZfaTxadNvq8IQeTb4ybr21RmvPOcAYb74rHdbZbHyt1MaMhGww/s1600/comment.png) no-repeat center right;margin:0 0 0 5px;padding:0 15px 0 0;}

.cm_reply{padding-top:5px}
.sidebar ul,#related-articles ul{list-style:none;margin:0;padding:0}
.cm_pagenavi a:hover{text-decoration:underline}

#search{float:right;width:180px;height:20px;margin-top:3px;padding-right:5px}
#search form{float:left}
#search input[type="text"]{background:#e9ebdd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_kLfz_syksL0Om891HRxJnckLGfdPYSSOBpqsmChElCm2a-i8jCYR5fmj6MOZXynIpQH1UVDo3lDv5VrjgGkeJvWyfCZNrEypijHyZDBbYkFhwfe8iZ9X-BeF7Jp2ffkt_XiXfpicgcfl/s1600/search.png) no-repeat scroll 4px center;float:left;border:1px solid #acaf7b;width:146px;margin-top:1px;padding:3px 15px;font-size:12px;text-align:right}
#search input[type="text"]:focus{background:#e9ebdd}
#search input[type="submit"]{display:none}

#nav-wrapper{background:#23436c;border-top:1px solid #2b5487;height:25px;font-family:"Tahoma",Palatino,serif;overflow:hidden}
#nav{margin:0 auto;width:960px;height:25px;padding:0;text-shadow:1px 1px 2px #000}
#nav ul{float:right;width:auto;height:25px;margin:0;padding:0;list-style-type:none}
#nav ul li{float:right;height:25px}
#nav ul li a,#nav ul li a:visited{border-right:1px solid #080f18;background:#162c47;border-left:1px solid #254874;color:#e7f1fe;float:right;height:25px;padding:2px 14px;font:12px Oswald;text-transform:none;transition:all 400ms ease-in-out;-webkit-transition:all 400ms ease-in-out;-moz-transition:all 400ms ease-in-out;-o-transition:all 400ms ease-in-out;-ms-transition:all 400ms ease-in-out;}
#nav ul li a:hover{background:#0a131e;color:#aad0fe;text-decoration:none;}

.menupic{width:100%;margin:0 auto;padding:0 auto;}
.menuhorisontal{float:right;background-color:#2b5385;background-image: -moz-linear-gradient(top,#4488dd 0,#2b5385 100%); background-image: -ms-linear-gradient(top,#4488dd 0,#2b5385 100%); background-image: -o-linear-gradient(top,#4488dd 0,#2b5385 100%); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#4488dd),color-stop(100%,#2b5385)); background-image: -webkit-linear-gradient(top,#4488dd 0,#2b5385 100%); background-image: linear-gradient(to bottom,#4488dd 0,#2b5385 100%);border-bottom:1px solid #112136;border-top:4px solid #1a3352;height:45px;width:728px;margin:0 auto; padding:0 auto;text-shadow:1px 1px 2px #112136}
.menuhorisontal ul{margin: 0; padding-left: 0px;color:#357798;text-transform: capitalize;list-style-type: none;font:bold 12px Arial, Helvetica,Arial,Verdana,sans-serif;}
.menuhorisontal li{display: inline; margin: 0;}
.menuhorisontal li a{border-left:1px solid #1a3352;border-top:4px solid #112136;color:#fff;float:right;font-size:12px;line-height:20px;margin-top:-4px;padding:3px 10px;text-align:right;transition:all 600ms ease-in-out;-webkit-transition:all 600ms ease-in-out;-moz-transition:all 600ms ease-in-out;-o-transition:all 600ms ease-in-out;-ms-transition:all 600ms ease-in-out;}
.menuhorisontal li a span{color:#b6d5fd;display:block;font-size:10px;font-weight:400;}
.menuhorisontal li a:hover {background:#112136;border-top:4px solid #4488dd;}

.post-thumbnail{width:100px;height:100px;padding:4px;float:left;margin:0px 10px 0px 0px;box-shadow:0 0 4px #bbb;-moz-box-shadow:0 0 4px #bbb;-webkit-box-shadow:0 0 4px #bbb;}
.post-snippet:before{content:attr(data-snippet);}
.newsfea{margin:0px;padding:7px 10px;font:13px Oswald;color:#193250;border-bottom:1px solid #c3c3c3;text-transform:uppercase;text-shadow:1px 1px 1px #ccc}
.readmorecontent{text-align:right;width:140px;float:right;margin-top:10px;text-shadow:1px 1px 1px #ccc;}
.readmorecontent a{color:#000;text-decoration:none;font:bold 12px Arial;}
.readmorecontent a:hover{color:#1d3b5f;text-decoration:none;}

#featuredSlider {float:left;margin:0; padding:0 0 10px; width:640px; position:relative;color:#666;border-bottom:1px solid #c3c3c3}
#featuredSlider .featured-thumb {background:#fff;float:left; margin:10px; padding:5px;box-shadow:0 0 4px #bbb;-moz-box-shadow:0 0 4px #bbb;-webkit-box-shadow:0 0 4px #bbb;}
#featuredSlider .container {height:226px; margin:0 10px 0 0;overflow:hidden; position:relative;}
.featuredTitle{padding-top:10px;font:16px Oswald;text-shadow:1px 1px 1px #ccc;}
.featuredTitle a{color:#162c47}
.featuredTitle a:hover{color:#000}
.navigation {position:relative;bottom:23px;float:right;overflow:hidden;}
ul.pagination {list-style-type:none; margin:0 auto; padding:0;}
ul.pagination a { float:left; margin:0 5px; display:inline; }
ul.pagination a { display:block;width:12px; padding-top:12px; height:0; overflow:hidden; background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqGMAjm9kCcjnsIFRFyNFMhYSDenHZFtF_1dfMfncudPPu0dHNr56HN9JlJFJVuL4Z9qO7ebGFGomLgG6evIXdOxCFjE2xndXZiRwYXexOp-pCU6mxQ4J7rTZvAcrXdKMnqncp02YTEltD/s1600/slider+pagination.png); background-position:0 0; background-repeat:no-repeat; }
ul.pagination a:hover { background-position:0 -12px; }
ul.pagination a:hover { background-position:0 -12px; }
ul.pagination a.activeSlide { background-position:0 -12px }
a.readmore {float:left;border:1px solid #172d48;background:#2a548a url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4HZJqeqRAHA3I1X_8nJ1DIz7Vo232KqLS5maaxRJ_fdRB7TvTsHpoPMg_tpeiGvYdp4pdJ6pzQwGWsJrOO8mzc75HNe1dbF7I_Hmy9f-VlLbTYKeij1MNVBinkDrXl8PAvVnnQdJkrFA/s1600/fade.png) repeat-x top;display:block;margin:10px 0 0 0;padding:4px 10px;color:#d8dbc4;-webkit-border-radius:3px;-moz-border-radius:3px;
border-radius:3px;-webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.5);-moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.5);box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.5);}
a.readmore:hover {color:#14160d}

]]></b:skin>

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<style type='text/css'>
#main-wrapper{width:459px;border-right:1px solid #c3c3c3;border-bottom:1px solid #c3c3c3}
.post-footer,.feed-links{display:none}
h2.date-header{margin:.2em 0 .4em}
.post h3{font:16px Arial;line-height:1em;margin:0 0 8px;padding:0;}
.post{border-bottom:1px solid #c3c3c3;margin:10px;padding:0 0 10px}
.post-body{border-top:none;padding-top:0px;background:none;margin:0 0 .15em;text-align:justify}
#blog-pager{float:center;margin:6px;padding:8px 0}
</style>
</b:if></b:if>

<script type='text/javascript'>
var relatedpoststitle="Related Articles";
</script>
<script src='http://jamu-martin.googlecode.com/files/related-martin.js' type='text/javascript'/>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script src='http://johny-template.googlecode.com/files/jquery.innerfade.js' type='text/javascript'/>
<script src='http://johny-template.googlecode.com/files/cycle.js' type='text/javascript'/>

<script type='text/javascript'>
//<![CDATA[
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQedmSiV8XMywddnBEQxZ9DO8z9z4lmbxZySpBdNkuhRkNRnPm3e4gmR-QYHRc4HnlrQ6wObTOMFzkQvylMkY9xeeLOIbSYhWjugf7tnKOOxufMLQehlCJLYz3Smmo_tmua0iSFbo1n-Y/s1600/no+image.jpg";
showRandomImg = true;
aBold = true;
summaryPost = 200; 
summaryTitle = 25; 
numposts  = 7; 

function removeHtmlTag(strx,chop){var s=strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length)}}s=s.join("");s=s.substring(0,chop-1);return s}

function showrecentposts(json) {
	j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
	img  = new Array();
    document.write('<div class="slides">
')
	if (numposts <= json.feed.entry.length) {
		maxpost = numposts;
		}
	else
       {
	   maxpost=json.feed.entry.length;
	   }	
  	for (var i = 0; i < maxpost; i++) {
    	var entry = json.feed.entry[i];
    	var posttitle = entry.title.$t;
		var pcm;
    	var posturl;
    	if (i == json.feed.entry.length) break;
    	for (var k = 0; k < entry.link.length; k++) {
      		if (entry.link[k].rel == 'alternate') {
        		posturl = entry.link[k].href;
        		break;
      		}
    	}
		
		for (var k = 0; k < entry.link.length; k++) {
      		if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
        		pcm = entry.link[k].title.split(" ")[0];
        		break;
      		}
    	}
		
    	if ("content" in entry) {
      		var postcontent = entry.content.$t;}
    	else
    	if ("summary" in entry) {
      		var postcontent = entry.summary.$t;}
    	else var postcontent = "";
    	
    	postdate = entry.published.$t;
	
	if(j>imgr.length-1) j=0;
	img[i] = imgr[j];
	
	s = postcontent	; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);

	if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d;

	//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


	var month = [1,2,3,4,5,6,7,8,9,10,11,12];
	var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];

	var day = postdate.split("-")[2].substring(0,2);
	var m = postdate.split("-")[1];
	var y = postdate.split("-")[0];

	for(var u2=0;u2<month.length;u2++){
		if(parseInt(m)==month[u2]) {
			m = month2[u2] ; break;
		}
	}

	var trtd = '<div>
<p class="featured-thumb">
<a href="'+posturl+'"><img width="280" height="200" src="'+img[i]+'"/></a></p>
<div class="featuredTitle">
<a href="'+posturl+'">'+posttitle+'</a></div>
<p>
'+removeHtmlTag(postcontent,summaryPost)+'... </p>
<a href="'+posturl+'" class="readmore">Read more »</a></div>
';
	document.write(trtd);


	j++;
}
    document.write('</div>
')
}

//]]>
</script>

  </head>
  <body>

  <div id='outer-wrapper'>
<div id='wrap2'>
    <div id='header-wrapper'>
      <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Ολυμπιακοί Αγώνες 2012 (Κεφαλίδα)' type='Header'/>
</b:section>
      <b:section class='header' id='header2' maxwidgets='1' showaddelement='yes'>
<b:widget id='HTML3' locked='false' title='Popular Template' type='HTML'/>
<b:widget id='HTML8' locked='false' title='' type='HTML'/>
</b:section>
<div style='clear:both;'/>
<div class='menupic'>
<div class='menuhorisontal'>
<ul>
<li><a href='/'>Home <span>My Frontpage</span></a></li>
<li><a href='#'>About <span>All About this blog</span></a></li>
<li><a href='#'>Contact Us<span>Leave your message</span></a></li>
<li><a href='#'>Health<span>Take a trip</span></a></li>
<li><a href='#'>Economics<span>Human Needs</span></a></li>
<li><a href='#'>Lifestyle<span>Be Your Self</span></a></li>
</ul>
</div>
</div>
</div>
<!-- end header-wrapper -->
<div class='clear'/>
<div id='nav-wrapper'>
<div id='nav'>
<b:section class='page' id='page' showaddelement='no'>
<b:widget id='PageList1' locked='false' title='Pages' type='PageList'/>
</b:section>
</div>
</div>
<!-- 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 class='clear'/>
 
    <div id='content-wrapper'>
        <div id='mainpage-wrapper'>
<b:if cond='data:blog.pageType != "item"'> 
<b:if cond='data:blog.pageType != "static_page"'>
	<b:section id='featuredSlider' showaddelement='yes'>
<b:widget id='HTML11' locked='false' title='Featured Content Slider' type='HTML'/>
</b:section>
<div class='clear'/>
</b:if>
</b:if>

        <div id='main-wrapper'>
<b:if cond='data:blog.pageType == "index"'>
<div class='newsfea'>
Latest Post
</div>
</b:if>
        <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Αναρτήσεις ιστολογίου' type='Blog'/>
</b:section>
</div>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
      <div id='sidebarleft-wrapper'>
        <b:section class='sidebarleft' id='sidebarleft' preferred='yes'>
<b:widget id='HTML5' locked='false' title='Test midle sidebar' type='HTML'/>
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
<b:widget id='HTML4' locked='false' title='Health' type='HTML'/>
<b:widget id='LinkList99' locked='true' title='Top Navigation Menu' type='LinkList'/>
<b:widget id='HTML26' locked='false' title='Label 3' type='HTML'/>
<b:widget id='Text1' locked='false' title='About this blog' type='Text'/>
<b:widget id='Image3' locked='true' title='125x125 Ads3' type='Image'/>
<b:widget id='Image4' locked='true' title='125x125 Ads4' type='Image'/>
<b:widget id='Image1' locked='true' title='125x125 Ads1' type='Image'/>
<b:widget id='HTML98' locked='true' title='Twitter Update' type='HTML'/>
<b:widget id='Image2' locked='true' title='125x125 Ads2' type='Image'/>
<b:widget id='HTML99' locked='true' title='Welcome Message' type='HTML'/>
<b:widget id='LinkList1' locked='false' title='Blogroll' type='LinkList'/>
<b:widget id='Label3' locked='false' title='Labels' type='Label'/>
<b:widget id='PageList14' locked='true' title='Pages' type='PageList'/>
<b:widget id='HTML29' locked='false' title='Label 6' type='HTML'/>
<b:widget id='HTML28' locked='false' title='Label 5' type='HTML'/>
<b:widget id='HTML9' locked='false' title='' type='HTML'/>
<b:widget id='HTML27' locked='false' title='Label 4' type='HTML'/>
<b:widget id='HTML13' locked='false' title='Label 1' type='HTML'/>
<b:widget id='HTML14' locked='false' title='Label 2' type='HTML'/>
<b:widget id='HTML10' locked='false' title='Label 7' type='HTML'/>
<b:widget id='Attribution1' locked='true' title='' type='Attribution'/>
<b:widget id='BlogArchive2' locked='false' title='Blog Archive' type='BlogArchive'/>
<b:widget id='Followers1' locked='false' title='Followers' type='Followers'/>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
<b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar'/>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
</b:section>
<!--Page Navigation Starts-->
<script type='text/javascript'>
var pageCount=6;
var displayPageNum=6;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='http://johnytemplate.googlecode.com/files/page-navigation.js' type='text/javascript'/>
<!--Page Navigation Ends -->
    </div>
</b:if></b:if>
 </div>
<div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML6' locked='false' title='Recent Post' type='HTML'/>
<b:widget id='PopularPosts1' locked='false' title='Popular post' type='PopularPosts'/>
</b:section>
      </div>
<!-- spacer for skins that want sidebar and main to be the same height-->
      <div class='clear'>
 </div>
</div>
<!-- end content-wrapper -->

<b:if cond='data:blog.pageType != "item"'>
<div class='picfooter'>
<div id='footer-wrapper'>
<b:section class='footer' id='footer' preferred='yes'/>

<div id='footer1-wrapper'>
<b:section class='footer' id='footer1' preferred='yes'>
<b:widget id='HTML1' locked='false' title='Test Footer' type='HTML'/>
</b:section>
</div>
<div id='footer2-wrapper'>
<b:section class='footer' id='footer2' preferred='yes'>
<b:widget id='HTML2' locked='false' title='Test Footer 1' type='HTML'/>
</b:section>
</div>
<div id='footer3-wrapper'>
<b:section class='footer' id='footer3' preferred='yes'>
<b:widget id='HTML7' locked='false' title='Test Footer 2' type='HTML'/>
</b:section>
</div>
<div style='clear:both;'/>

</div>
</div>
</b:if>

<div class='creditpic'>
<div class='credit'>
<div style='float:left;text-align:left;'>
<strong>Support :</strong>
<a href='http://halandrinews.blogspot.gr//'>Creating Website</a> | <a href='http://halandrinews.blogspot.gr//'> Halandri NewsTemplate</a> | <a href='http://halandrinews.blogspot.gr//'>Mas Template</a><br/>
Copyright © 2012. <a class='sitename' expr:href='data:blog.homepageUrl' expr:title='data:blog.title'><data:blog.title/></a> - All Rights Reserved
</div>
<div style='float:right;text-align:right;'>
Δημιουργία, διαμόρφωση και συντήρηση ιστολογίου : http://halandrinews.blogspot.gr/ Created by kostas  <a href='http://halandrinews.blogspot.gr//'>Mas Template</a><br/> 
Proudly powered by <a href='http://www.blogger.com'>Blogger</a>
</div>
</div>
</div>
<script src='http://johnytemplate.googlecode.com/files/comment.js' type='text/javascript'/>
  </div>
</div>
<!-- end outer-wrapper -->
</body>
</html>
http://mas-template.blogspot.gr

Κανένα από τα templates δεν ανήκει σε μένα για αυτό παραθέτω στο καθένα την πηγή του.
Το φόρτωμα των templates είναι μια πολύ εύκολη διαδικασία:
1. Σύνδεση στο λογαριασμό blogger2. Σχεδίαση3. Επεξεργασία HTML4. Πατάμε "Επιλογή αρχείου" και επιλέγουμε το .xml αρχείο που θα βρούμε μέσα στο συμπιεσμένο αρχείο που κάναμε download.5. Πατάμε "Μεταφόρτωση" και6. Αποθήκευση προτύπου. Αυτό ήταν!