untuk html templatenya silahkan copy saja di bawah ini
/* kerangka template blogger by dafin */
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML>
<head>
<meta charset='utf-8'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'><link href='https://plus.google.com/101920216061028840078' rel='author'/></b:if>
<link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>
/* meta tag seo disini */
<link expr:href='data:blog.homepageUrl + "favicon.ico"' rel='icon' type='image/x-icon'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default?alt=rss"' expr:title='data:blog.title + " - RSS"' rel='alternate' type='application/rss+xml'/>
<link expr:href='"http://www.blogger.com/feeds/" + data:blog.blogId + "/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
<style type="text/css"><!-- /* <b:skin><![CDATA[
#db-on_header-wrapper {width:21%}
#db-left_page-bar {width:73%;float:left}
#db-artikel_main-wrapper {width:75%;float:right;}
#db-widget_sidebar-right {width:24.2%;float:right}
*/]]></b:skin>
<style type='text/css'>
/*
Blogger Template Style
Name : Dong dang dung
Author : Dafin
Url : http://defandaky.blogspot.com/
Url : http://www.yuuhu.info
Google+ : http://www.blogger.com/profile/09882050325461413449
*/
#navbar-iframe, #ContactForm1 {height:0px;visibility:hidden;display:none;}
header, nav, section, aside, article, footer {display:block;}
body, .body-fauxcolumn-outer {background:#272f37;margin:0;padding:0;color:#999;
font:normal normal 13.5px/20px "Roboto_Regular","Roboto","Roboto Regular","Franklin Gothic Medium","Franklin Gothic Book","Lucida Sans","Lucida Sans Unicode",Helmet,Freesans,Sans-Serif;text-align:left;height:100%;min-height:100%;}
a:link {color:#5886a7;text-decoration:none;}a:visited {color:#5886a7;text-decoration:none;}a:hover {color:#74a2c3;text-decoration:none;}a img {border-width:0;}
/* header */
#db-on_header-wrapper {float:left;padding:2% 2% 2% 1%;background-color:#2E3740;width:12%;color:white;position:absolute;left:0;top:50px;}
#header { text-align:left;color:#999;margin:0;}
#header h1 {margin:0;padding:0;font-size:240%;font-weight:normal;text-transform:uppercase;font-family:Oswald, Arial, Sans-Serif;}
#header a {color:#999;text-decoration:none;}
#header a:hover {color:#999;}
#header .description {text-align:center;margin-top:10px;padding:0;line-height:1.4em;color:#999;}
/* Navigation */
#db-fixed-nav {width:100%;font-weight:normal;float:left;font-family: Oswald, Arial, Sans-Serif;text-transform:uppercase;font-size:100%;}
#db-fixed-nav ul {height:50px;margin:0;padding:0;width:100%;float:left;background-color:#336699;}
#db-fixed-nav li {list-style:none;display:inline;margin:0;padding:0;}
#db-fixed-nav li a {line-height:50px;text-decoration:none;color:#999;padding:15px;transition:.4s ease-out;}
#db-fixed-nav li a:hover {line-height:50px;background-color:#74a2c3;color:white;}
/* Wrapper */
#db-show_content-wrapper {width:100%;background:none;margin:0 auto;padding:0;text-align:left;}
#db-left_page-bar {width:73%;float:left;background-color:#2E3740;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnVyts2gusowLXCatCiIEogVDnr2937m4YW52UGBmmBDNUqPvlWI6DxWCPOZeLi09h295TjfQRxnLvgZMeIYJG850FrbpdEqFVaXDMrylgvN5HbGX5S7ZIg8wsDAkZxBycOssUMO3rP9I/s1600/sprite.png');background-repeat:repeat-y;background-position:21.7%;border-bottom:5px solid #272f37;}
#db-artikel_main-wrapper {width:75%;padding:1.5%;float:right;background-color:#fff;word-wrap:break-word;overflow:hidden;}
#db-widget_sidebar-right {float:right;padding:1%;}
#db-widget_sidebar-right {background-color:#2E3740;width:24.2%;word-wrap:break-word; overflow:hidden;}
#db-widget_sidebar-right h2 {font-family: Oswald, Arial, Sans-Serif;font-size:110%;letter-spacing:0;color:#999;padding:5px 0 10px 0;margin:0px 0px 10px;font-weight:normal;text-align:left;border-bottom: 5px solid #ccc}
#db-widget_sidebar-right .widget-content {padding:0;margin:0 10px;}
/* Footer */
#db-credit-footer {width:auto;clear:both;margin:0 auto;padding:1%;color:white;background-color:#708090;border-top:1px solid #708090;text-align:center;display:block;}
#db-credit-footer a{color:#009933;}
#db-credit-footer a:hover{color:#ff6600;}
/* Posts */
.date-header {margin:1.5em 0 .5em;display:none;}
.post {margin:0 0 1.5em;padding:2.5%;background-color:#fff;border-radius:5px;overflow:hidden;}.post h2 {margin-top:0px;padding:0 0 4px;font-size:240%;font-weight:normal;line-height:1.4em;color:#222;font-family:Gnuolane, Oswald, Arial, Sans-Serif;}.post h2 a, .post h2 a:visited, .post h2 strong {display:block;text-decoration:none;color:#4a4a4a;}.post h2 strong, .post h2 a:hover {color:#c94e5c;}.post h4{font-family:Gnuolane, Oswald, Arial, Sans-Serif;font-size:180%;color:#222;margin:40px 0 15px;padding:0;font-weight:normal}.post .post-title {margin-bottom:15px;margin-top:15px;}.post-body {margin:0 0 .75em;line-height:1.4em;}.post-body img{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeINDyHMFb129Hxj_9n2uz-_5q8fNfk5wwAYy2j-pL1usstlcNo2vAC5VGhQfpvMsYNDnO3vRs2_Ap359fzpPmXi8_Dxp87shnLFR5ty_KtTEEOXySnvqTgA95eRngkouq8WjhujPA_BM/s1600/img+loader.gif)no-repeat 50% 50%}.post-body h3{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSxUDgfoN9HWNsCIbGDZ8HJdn0RWtdkDYZm_gvo46E7aBzzAw8XowO0jYMjKLLt78_WWVmS6IZNmjaczhiisPZmcegs3UnicfGWwwkfxOYa-Ut13cZeFcg6WrUsXvMsiZRerzDOa9xFmo/s1600/bottom-line.gif) left bottom no-repeat;font-size:200%;font-weight:400;margin:5px 0;padding-bottom:12px;font-family:Gnuolane, Oswald, Arial, Sans-Serif;}.post-body h3 code {font-size:100%}.post-body h4{font-size:180%;font-weight:normal;margin-top:20px !important;margin-bottom:10px;padding-bottom:12px;margin-top:0;}.post-body img {max-width: 98%;border-width: 0;padding: 0;margin-right: 10px;border:1px solid #b1b1b1;box-shadow:0 0 5px #aaa;page-break-after:always;}.separator img {width:430px;height:auto;position:relative;}.post-footer {margin:.75em 0;color:#999999;letter-spacing:.1em;line-height:1.4em;font-size:80%;padding: 5px 0px 5px 0px;margin: 30px 0px 15px 0px;display:none;}.post-footer ul{margin-left:0;}.comment-link {margin-left:.6em;}.tr-caption-container img {border:none;padding:0;}
table, td, th{border:1px solid #ddd;}
/* share button */
.share {font-family:Oswald, Arial, sans-serif;font-size:12px;padding:10px 0 8px 0;margin-top:25px;position:relative}.share a, .share a:hover {color:#fff}
.fb-db-sf, .tw-db-sw, .gp-db-sg {text-align:center; padding:3px 12px; font-size:12px; border-radius:3px}.fb-db-sf { background-color:#1358BA}.tw-db-sw { background-color:#03C7E9}.gp-db-sg { background-color:#FE1635}.fb-db-sf:hover, .tw-db-sw:hover, .gp-db-sg:hover {background-color:#547279; transition:background-color 0.7s ease-out 0s}.share::after {content:"";width:190px;height:30px;position:absolute;bottom:-320px;left:80px;background:#fff;}
/* Headings */
h5 {margin:0;padding:0;}
/* Sidebar */
.sidebar { color:#999;line-height:1.5em;}
.sidebar ul {list-style:none;margin:0 0 0;padding:0 0 0;}
.sidebar li {margin:0;padding-top:.5em;padding-right:0;padding-bottom:.8em;line-height:1.6em;color:#f2f2f2;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLsLmmOyHqPfKxq4iE-LbTjIq9zIjXtpy1FdHlc5IIphZuKbHDUOWKSF1u-7whQcU9vdw77SR2fgtvbfh6LygzVgAsBsJRHa-oEr84xBf8_9nTkezcglOGPGbNdfVaybxvX4ZEAk0KOh4/s1600/border-back.png) repeat-x bottom left;}
.sidebar .widget, .main .widget { margin:0 0 .5em;padding:0 0 .5em;}
.main .Blog { border-bottom-width:0;}
/* label */
#Label1 {padding-bottom:10px}
#Label1 ul {margin:10px 0 20px -10px}
#Label1 li {float: left;display: inline;margin: 0 3px 3px 0;padding: 0 4px;height: 22px;line-height: 22px;color: #aaa;background-color: #0088b2;transition: background-color 0.5s linear;}
#Label1 li a {padding: 0 4px;color: #fff;}
#Label1 li:hover {background-color: #008888;}
#Label2 li {text-align:right;}
#Label2 li a {color: #bbb;text-decoration:none;}
#Label2 li a:hover, #Label2 li a:active, #Label2 li a:focus {color: #f2f2f2;text-decoration:none;}
#Label2 li .label-counter {float:left;background-color:#4b535b;color:#999;line-height:1;margin:2px 0 0;padding:3px 5px;border-radius:2px;text-align: center;font-size:11px}
#Label2 li:hover .label-counter {background-color:#5498C9;color:white}
/* Contact Form Container */
.contact-form-widget {width: 754px;max-width: 626;margin: 0 auto;padding: 10px;background: #F8F8F8;color: #000;border: 1px solid #C1C1C1;box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);border-radius: 10px;}.contact-form-name, .contact-form-email, .contact-form-email-message {width: 750px;max-width: 750px;margin-bottom: 10px;}.contact-form-button-submit {border-color: #C1C1C1;background: #E3E3E3;color: #585858;width: 20%;max-width: 20%;margin-bottom: 10px;}.contact-form-button-submit:hover{background: #4C8EF9;color: #ffffff;border: 1px solid #FAFAFA;}
/* Pesan Komentar */
#threaded-comment-form p{position: relative;color:#999 !important;padding: 10px;font-size: 14px;font-weight:400;line-height: 1.6em;margin-top: 10px;border-radius:2px;background:#54687c;width:95%;}#blog-pager-newer-link {float:left;}#blog-pager-older-link {float:right;}#blog-pager {text-align:center;padding-right:2%;padding-top:2%;padding-bottom:5%;font-weight:normal;margin-bottom:20px;}.feed-links {display:none;}.home-link{display:none}#blog-pager-newer-link {width:100px;float:left; text-align:left;font-size:18px}#blog-pager-older-link {width:100px;float:right; text-align:right;font-size:18px}
/* Profile */
.profile-img {float:left;margin-top:0;margin-right:5px;margin-bottom:5px;margin-left:0;padding:4px;border:1px solid #cccccc;}.profile-data {margin:0;text-transform:uppercase;letter-spacing:.1em;font:normal normal 78% Cuprum;color:#999999;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:normal normal 78% Cuprum;text-transform:uppercase;letter-spacing:.1em;}
/* home page */
img {max-width:100%;height:auto;width:auto;text-align:center;}.home-index{border:none;box-shadow:none;width:250px;height:175px;text-align:center;float:left;margin:-32px 15px -30px -22px;position:relative;background:#993333;border-radius:5px 0 0 5px}.home-index img{padding:0;width:100px;height:100px;border:5px solid #bbb;border-radius:100px 100px;margin-top:33px;}.home-index img:hover{border:5px solid #000;border-radius:100px 100px;}.home-index:before{content:"";width:0;height:0;position:absolute;top:45%;right:0;border:7px solid transparent;border-color:transparent #fff transparent transparent;}.home-index span{font-size:26px;line-height:90px;font-weight:bold;color:#eee}
/* Page Navigation */
#showpageArea {font:normal normal 11px Verdana, Geneva, sans-serif;margin-top:0;padding-top:0;}.showpageOf{display:none;margin:0;}.showpageArea a {font-size:14px;font-weight:bold;text-decoration:none;}.showpageNum a,.showpage a {background:#1966C1;margin:0px 1px 0 1px;padding:3px 10px;color:#FFF;line-height:30px;cursor:pointer;white-space:nowrap;}.showpageNum a:hover,.showpage a:hover {background:#B22222;color:#e4905a;text-decoration:none;}.showpageOf{margin:0 8px 0 0;background:#1966C1;line-height:30px;padding:3px 10px;color:#FFF;}.showpagePoint {background:#2F4F4F;margin:0 3px 0 3px;padding:3px 10px;line-height:30px;cursor:pointer;white-space:nowrap;color:#e4905a;font-weight:bold;}
/* infos */
#comment-butde{color:#222;margin-right:10px;padding:3px 15px;background-color:#ff0000;font-size:12px;font-family: 'Abel', sans-serif;font-weight:400;text-transform:none;filter:progid:.Microsoft.gradient(GradientType=0, startColorstr='#46a0fb', endColorstr='#2c87e2');background-image:linear-gradient(top, #46a0fb 0%, #3892ed 50%, #2c87e2 100%);border-radius:4px;box-shadow:inset 0px 1px 0px rgba(255,255,255,0.3), 0px 1px 2px #333;text-shadow:0px -1px 0px rgba(0,0,0,0.3);color:#ffffff;text-decoration:none;outline:none;}#comment-butde a{color:#222 !important;}#comment-butde a:hover{text-decoration:none;}#comment-butde:hover {background-color:#860000;filter:progid:.Microsoft.gradient(GradientType=0, startColorstr='#3892ed', endColorstr='#2379cf');background-image:linear-gradient(top, #3892ed 0%, #2c87e2 50%, #2379cf 100%);color:#ffffff;}.add-comment {background:#bbb;text-decoration: none;color:#fff;border:1px solid #ccc;border-radius:5px;padding:3px 6px;margin-top:-10px;}
/* nav */
.breadcrumbs{background:#6699cc;padding:12px 20px 12px 65px;font-size:13px;color:#fff;margin-bottom:19px;position:relative;}.breadcrumbs a{color:#fddbd8;text-decoration:none;}.breadcrumbs a:hover{color:#fff;text-decoration:none;}.breadcrumbs:before{content: "\f041";font-family:fontAwesome;font-size:22px;font-style: normal;background-color:#0099cc;color:#fff;border-radius:4px 0 0 4px;top:0;left:0;padding:12px 20px;position:absolute;}
/* post */
.post-label{position:absolute;top:15px;right:0;z-index:99;}.post-label a{font-family: 'Oswald', Verdana,Sans-serif;text-transform:uppercase;background-color:#0099ff;color:#fff;font-size:10px;display:block;float:left;padding:4px 8px;}.post-label:first-child a {border-radius:5px 0 0 0}.post-label a:hover{background:#996600;}.post-info-icon{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjKvWivGyrLB5RDPLnAqIBCu4zBtxfH0yXcyzLyqkJ-2BPFFatqw7Xc11HEX7S7nl95cAyk2_FQOJTdzTCajMlm6qevu4RxbI1U7OJ1S5ImicK9-nD1PFwED-b7xaCnobrI-nTTuTsCjg/s1600/icnall.png);background-repeat:no-repeat;}.post-info{display:block;margin:5px 0 5px 0px;padding:3px 0;color:#999;line-height:1.6em;border-top:1px dotted #e2e2e2;border-bottom:1px dotted #e2e2e2;font-size:11px;overflow:hidden;}.post-info a{color:#999;}.post-info-icon{display:inline-block;float:left;margin:0 12px 0 0;}.post-info a:hover{color:#000;}.jam{background-position:0 -98px;height:16px;padding:0 0 0 17px}.komentar{background-position:0 -132px;height:16px;padding:0 0 0 17px;}.label{background-position:0 -166px;height:16px;padding:0 0 0 17px;}.admin{background-position:0 1px;height:16px;padding:0 0 0 17px;}.tanggal{background-position:0 -32px;height:16px;padding:0 0 0 17px;}div#widget_bounds{font-family:Arial, Sans-serif}
/* Related Posts */
.related-post{margin:2em auto 0;font-size:13px;background:#fff;border-bottom:1px solid #ccc}.related-post h4{font-size:14px;margin:0 0 .5em;background:#6699cc;color:#fff;padding:14px 20px 14px 75px;font-weight:normal;position:relative;font-family:Oswald,Arial,Sans-Serif;text-transform:uppercase}.related-post h4:before{content:"\f074";font-family:fontAwesome;font-size:22px;font-style:normal;background-color:#0099cc;color:#fff;border-radius:4px 0 0 0;top:0;left:0;padding:13px 20px;position:absolute}ul.related-post-style-1{padding-left:0!important;margin-top:-12px}.related-post-style-1 li{list-style:none;padding:15px;border-top:1px solid #eceef5}.related-post-style-1 li a{color:#79798d;text-decoration:none}.related-post-style-1 li a:hover{color:#ff6600;text-decoration:none}.related-post-style-1 li:before{content:"\f08e";font-family:fontAwesome;color:#c7cbd4;font-style:normal;top:0;left:0;margin-right:13px}.jump-link{display:none}.admin-db {display:block; width:auto; border:1px solid #ccc;padding:0; margin:20px 0 10px 0; font:normal 12px Arial,Sans-Serif; color:#222}.admin-db .kontainer{padding:5px}.admin-db h1{background:#3399cc; border:none; border-bottom:1px solid #C0C0C0; color:#fff; text-transform:normal; text-shadow:0 1px 0 rgba(0,0,0,0.4); font:bold 12px Arial,Sans-Serif; padding:5px 10px; margin:0 0 0 0; display:block}.admin-db h1 a{color:#FEEA83;text-decoration:none;}.admin-db img{width:70px; height:70px; margin:0 10px 0 0; float:left; border:0px solid #E6E6FA; padding:2px; background:#E6E6FA;}
/* komentar */
#comments {line-height:1.4em;margin: 60px 0 0 0;position:relative;background:#000000;border-radius:4px;padding:25px 17px 30px 17px;}
#comments h3 {font-size:14px;font-family:Oswald,Arial,Sans-Serif;text-transform:uppercase;font-weight:normal;left:0;top:-53px;background:#6699cc;color:#fff;width:85.8%;padding:13px 20px 13px 85px;position:absolute;}
#comments h3:before {content:"\f0e6";font-family:fontAwesome;font-size:22px;font-style: normal;background-color:#0099cc;color:#fff;top:0;left:0;padding:13px 20px;position:absolute;}
#comments .db-form-comment{color:#fff;float:right;display:inline-block;background: #003300;padding: 2px 5px;font: bold 11px Roboto;text-transform: none;border-radius: 3px;position: relative;}
.comment_avatar_wrap{width:42px;height:42px;border: 1px solid #cfcfcf;background:#e0e0e0;padding:4px;text-align:center;margin-bottom:20px;}#comments .avatar-image-container {float: left;margin: 0 10px 0 0;width: 42px;height: 42px;max-width:42px;max-height:42px;padding: 0;margin-bottom:10px;}#comments .avatar-image-container img {width: 42px;height: 42px;max-width: 42px;max-height: 42px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4VOBkGxlgSW-e9j1B-hfbtjFCQmRtr5biHA5v5mLD7Ny4wAm2xGQ9B1xSSExq7KGAsCW2ev5ZvnC1TYZIZwvhqP0uY5yQzxZPu4wJFXVVrnUbH31-n-SMI7ikm0Xj6UVRPr6BPLwp4jaK/s1600/anon.jpg) no-repeat;}
.comment_name a {font-family:Oswald, Arial, Sans-serif;padding-bottom:10px;font-size:14px;text-decoration: none;}
.comment_admin .comment_name {font-family:Oswald, Arial, Sans-serif;padding-bottom:10px;font-size:14px;text-decoration: none;}
.comment_admin .comment_date {font-weight: normal;font-size:11px;}
.comment_name {font-family:Oswald, Arial, Sans-serif;padding-bottom:10px;font-size:14px;font-weight:normal;position:relative;}
.comment_service{margin-top:5px;}
.comment_date {color: #333;float:right;font-size:11px;font-weight:normal;}
.comment_date a{color: #a9a9a9;float:right;font-size:11px;font-weight:normal;}
.comment_date a:hover{color: #a9a9a9;text-decoration:none;}
.comment_body{margin-top:-72px;margin-left:65px;border: 1px solid #dcdcdc;background:#fff;padding:15px;color: #333;}
div.comment_inner.comment_admin{background:#394549;}
.comment_body p {line-height: 1.5em;margin: 5px 0 0 0;color: #333;font-size: 13px;word-wrap:break-word;padding-bottom:10px;}
.comment_inner {padding: 15px;margin: 5px 0 5px 0;background-color:#708090;}
.comment_child .comment_wrap {padding-left:5%;}
.comment_reply {display: inline-block;margin-top:8px;margin-left:-5px;padding: 1px 12px;color: #fff !important;text-align: center;text-decoration: none;border-radius: 2px;background: #555;font: 11px/18px sans-serif;transition: background-color 1s ease-out 0s;}
.comment_reply:hover {text-decoration: none !important;;background: #333;}
.unneeded-paging-control {display: none;}
#comment-editor {width:100% !important;background:#d9d9d9 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKnMYE9_fYRcuj-iXE_fMf7AXrvA7sPAC4YR8RaEYttXSXA7loTC8FBM0K_ZjKOaYjzJtFecWHMYHhRZJyqiOHi-XWBYBGKs02FgkVequao9IsaE3pgb44dnyIe0SpTA3UepcWkMAeqsg/s1600/db-loader.gif') no-repeat 50% 30%;border-radius:4px;margin-bottom:20px;position:relative;}
.comment-form {max-width: 100% !important;}
.comment_form a {text-decoration: none;text-transform: uppercase;font-weight: bold;font-family: Arial, Helvetica, Garuda, sans-serif;font-size: 15px;}
.comment_form a:hover {text-decoration: underline;}.comment_reply_form {padding: 0 0 0 70px;}.comment_reply_form .comment-form {width: 100%;}
img.comment_emo {margin:0;padding:0;vertical-align:middle;}
.comment_emo_list{display:none;clear:both;width:100%;}.emo-rapper-db {background:#fff;border-radius:5px;margin-bottom:5px;}
.comment_emo_list .item {float: left;text-align: center;margin: 10px 5px 10px 0;height: 40px;width:30px;color:#999;}
.comment_emo_list span {color:bbb;display: block;font-weight: normal;font-size: 11px;letter-spacing: 1px;}.comment_youtube {max-width:100%!important;width:400px;height:225px;display:block;margin:auto;}
.comment_img {max-width:100%!important;}
.comment_header{width:50px;}#respond {overflow: hidden;padding-left: 10px;clear: both;}
.comment_avatar img{width:42px;height:42px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4VOBkGxlgSW-e9j1B-hfbtjFCQmRtr5biHA5v5mLD7Ny4wAm2xGQ9B1xSSExq7KGAsCW2ev5ZvnC1TYZIZwvhqP0uY5yQzxZPu4wJFXVVrnUbH31-n-SMI7ikm0Xj6UVRPr6BPLwp4jaK/s1600/anon.jpg) no-repeat;}
.comment-delete img{float:right;margin-left:15px;margin-top:3px;}.comment_author_flag {display:none;}iframe{border:none;overflow:hidden;}.deleted-comment {background:#daabab url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1z168cMFWJE-4UIuqKrgSaFahgqPCcDv2hPKaEMdQoQtYvhDWNpnjh7T2Rf8O9ZPmrgUbxtqmPjW68fO3-52MuyQABadjx85vh3MGJP0vdm8ZBwwCrJJvZcPArz8tGhEyrUG-y2SDzH0/s1600/tempat-sampah.png) no-repeat 2% 50%;color:#fff;line-height: 22px;padding:10px 15px 10px 45px;margin:5px 0;display: block;font-size:13px;}.comment-form p { background: #6d6d6d;padding: 10px 10px 14px 10px;margin: 5px 0 5px 0;color: #e5eff0;font-size: 13.6px;line-height: 20px;width:97,8%;border-radius:5px;position:relative;}div.comment_avatar img[src='http://img1.blogblog.com/img/openid16-rounded.gif'] {content: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEib4nHarKLNz5hqQ6lihjj9-_zeIeuYF5Byzu3nrguFK_T-X3zcpGM3v_HprDO5eEg28xvvUT48CensWoE_VQ9CX840LuWrIfXZMben8WQvIaW-ynufFmKaAFMfIlvQE-ertgerH8q4f74/s45-c/gravatar.png);}div:target .comment_inner{background:#3399cc;transition:all 15s ease-out;}div:target .comment_child .comment_wrap .comment_inner{background:#0099cc;}.center {text-align:center;}img.cm-prev {max-width:400px;margin:10px auto;page-break-after:always;display:block;text-align:center !important;}.comment_admin .comment_author_flag {display:inline;background:#800000;font-size:13px;font-weight:normal;padding:2px 6px;margin-left:8px;color:#fff;border-radius:4px;text-transform:uppercase;letter-spacing:.1em}.db-comment-thanks {font-family:Arial, sans-serif;font-size:12px;right:25px;margin-top:-73px;padding:6px 12px;background:#f8f8f8;color:#999;border:1px solid #c9cacb;border-radius:3px;position:absolute;}
/* error page */
#error-db {background-color:#e9e9e9;position:fixed !important;position:absolute;text-align:center;top:0;right:0;bottom:0;left:0;z-index:99999;}
#error-db-suit {margin:11% auto;}#error-db-suit .box-404-db {width:200px;height:200px;background:#1966C1;color:#fff;font-size:80px;line-height:200px;border-radius:10px;margin:0 auto 50px;position:relative;}#error-db-suit .box-404-db::after {content:" ";width:0;height:0;bottom:-8px;border-color:#1966C1 transparent transparent;border-style:solid;border-width:9px 9px 0;position:absolute;left:47%;}#error-db-suit h1 {text-transform:uppercase;}#error-db-suit p {line-height:0.7em;font-size:15px;}
@media screen and (max-width:1024px) {
#db-show_content-wrapper {width:100%;}
#db-artikel_main-wrapper {float:left;width:97%;}
#db-on_header-wrapper {display:none;}
#db-left_page-bar {width:73%;}}
</style>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<style>
.post h2{font-size:140%;margin:0px; !important;margin-bottom:5px !important;font-weight:400;line-height:1.4em;color:#4a4a4a}
.post{font-weight:400;font-size:13px;border:1px solid #ccc;padding-bottom:5px;box-shadow: inset 0 -1px 0 rgba(163, 163, 163, 0.8), 0 1px 3px rgba(163, 163, 163, 0.4);}
#blog-pager{width:100%}
.post .post-title {margin-bottom:15px;margin-top:0px;}.footer-wrapper {display:none;}
</style>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
#blog-pager {font-weight:400;font-size:20px;}
#blog-pager a{color:#2c3e50}
#blog-pager a:hover{color:#c34755; text-decoration:none}
.breadcrumbs{background:#6699cc;padding:12px 20px 12px 65px;font-size:13px;color:#fff;margin-bottom:-10px;position:relative;}
.post {margin:0 0 1.5em;padding:0;background-color:#fff;border-radius:0px 0px 5px 5px;overflow:hidden;}
</style>
</b:if>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<link href='https://googledrive.com/host/0B05MjHQkbOjhekNlaHNPajU3OHc' rel='stylesheet' type='text/css'/>
</head>
<body>
<b:if cond='data:blog.pageType != "error_page"'>
/* edit menu navigasi di bawah ini */
<nav id='db-fixed-nav'>
<ul>
<li><a href='/'><span style='font-size:25px;margin-right:10px;vertical-align:middle'><i class='icon-home-alt'/></span>Home</a></li>
<li><a href='/'>About</a></li>
</ul>
</nav>
/* headernya silahkan di ganti */
<div id='db-page-onlist_outer-wrapper'>
<header id='db-on_header-wrapper'>
<div class='header section' id='header'>
<div class='widget Header' id='Header1'>
<div id='header-inner'>
<a href='/' style='display: block'>
<img alt='Dafin Blogger' id='Header1_db-done-img-pool' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMZP8gPooTKJyT7wq1v8bLGFxqpe9TiPd4A_8JL16-roUwei1UeZ9Rbwnm_8Jg-6oDqlCDhYiTNCaXSrjO3FRNo4_CbIorrOFAG2Il_vFxPlRzNOB1fJeCMlQgxLCdrdaIxZ3AcORhcqI/s1600/logodb.png' style='display: block;'/>
</a>
<div class='descriptionwrapper'>
<p class='description'><span>Sharing & Care</span></p>
</div>
</div>
</div>
</div>
</header>
<div id='db-show_content-wrapper'>
<div id='db-left_page-bar'>
<div id='db-artikel_main-wrapper'>
/* konten blog sobat disini */
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<script>
//<![CDATA[
function resizeThumb(parentID, size) {
var parent = document.getElementById(parentID),
image = parent.getElementsByTagName('img');
for (var i = 0; i < image.length; i++) {
image[i].src = image[i].src.replace(/\/s72\-c/, "/s" + size + "-c");
image[i].width = size;
image[i].height = size;
}
} resizeThumb('Blog1', 120);
//]]>
</script>
</b:if>
</b:if>
<!-- google_ad_section_end -->
</div>
<script type='text/javascript'>window.___gcfg = {'lang': 'in'};</script>
</div>
</div>
</div>
<aside id='db-widget_sidebar-right'>
<b:section class='sidebar section' id='sidebar-r' preferred='yes'/>
</aside>
<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>
<!-- end content-wrapper -->
<footer id='db-show_footer-wrapper'>
<div class='db-credit-footer-end section' id='db-credit-footer'>
Copyright © 2014 <a id='db-credit' class='sitename' expr:href='data:blog.homepageUrl' expr:title='data:blog.title'><data:blog.title/></a> all right reserved
</div>
</footer>
<!-- end outer-wrapper -->
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
var postperpage=5;
var numshowpage=4;
var upPageWord=" ◄ ";
var downPageWord=" ► ";
var home_page="/";
var urlactivepage=location.href;
</script>
<script type='text/javascript'>
//<![CDATA[
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('6 I;6 i;6 f;6 n;1f();C 1g(15){6 5=\'\';J=K(N/2);4(J==N-J){N=J*2+1}A=f-J;4(A<1)A=1;d=K(15/j)+1;4(d-1==15/j)d=d-1;D=A+N-1;4(D>d)D=d;5+="<3 7=\'1y\'>1z "+f+\' 1A \'+d+"</3>";6 16=K(f)-1;4(f>1){4(f==2){4(i=="o"){5+=\'<3 7="1B"><a 9="\'+B+\'">\'+O+\'</a></3>\'}b{5+=\'<3 7="g"><a 9="/r/s/\'+n+\'?&c-k=\'+j+\'">\'+O+\'</a></3>\'}}b{4(i=="o"){5+=\'<3 7="g"><a 9="#" v="L(\'+16+\');w x">\'+O+\'</a></3>\'}b{5+=\'<3 7="g"><a 9="#" v="M(\'+16+\');w x">\'+O+\'</a></3>\'}}}4(A>1){4(i=="o"){5+=\'<3 7="g"><a 9="\'+B+\'">1</a></3>\'}b{5+=\'<3 7="g"><a 9="/r/s/\'+n+\'?&c-k=\'+j+\'">1</a></3>\'}}4(A>2){5+=\' ... \'}1h(6 l=A;l<=D;l++){4(f==l){5+=\'<3 7="1C">\'+l+\'</3>\'}b 4(l==1){4(i=="o"){5+=\'<3 7="g"><a 9="\'+B+\'">1</a></3>\'}b{5+=\'<3 7="g"><a 9="/r/s/\'+n+\'?&c-k=\'+j+\'">1</a></3>\'}}b{4(i=="o"){5+=\'<3 7="g"><a 9="#" v="L(\'+l+\');w x">\'+l+\'</a></3>\'}b{5+=\'<3 7="g"><a 9="#" v="M(\'+l+\');w x">\'+l+\'</a></3>\'}}}4(D<d-1){5+=\'...\'}4(D<d){4(i=="o"){5+=\'<3 7="g"><a 9="#" v="L(\'+d+\');w x">\'+d+\'</a></3>\'}b{5+=\'<3 7="g"><a 9="#" v="M(\'+d+\');w x">\'+d+\'</a></3>\'}}6 17=K(f)+1;4(f<d){4(i=="o"){5+=\'<3 7="g"><a 9="#" v="L(\'+17+\');w x">\'+1i+\'</a></3>\'}b{5+=\'<3 7="g"><a 9="#" v="M(\'+17+\');w x">\'+1i+\'</a></3>\'}}6 E=y.1D("E");6 18=y.1E("1F-1G");1h(6 p=0;p<E.P;p++){E[p].1j=5}4(E&&E.P>0){5=\'\'}4(18){18.1j=5}}C 1a(Q){6 R=Q.R;6 1k=K(R.1H$1I.$t,10);1g(1k)}C 1f(){6 h=u;4(h.e("/r/s/")!=-1){4(h.e("?S-c")!=-1){n=h.F(h.e("/r/s/")+14,h.e("?S-c"))}b{n=h.F(h.e("/r/s/")+14,h.e("?&c"))}}4(h.e("?q=")==-1&&h.e(".5")==-1){4(h.e("/r/s/")==-1){i="o";4(u.e("#G=")!=-1){f=u.F(u.e("#G=")+8,u.P)}b{f=1}y.1l("<m T=\\""+B+"U/V/W?c-k=1&X=Y-Z-m&11=1a\\"><\\/m>")}b{i="s";4(h.e("&c-k=")==-1){j=1J}4(u.e("#G=")!=-1){f=u.F(u.e("#G=")+8,u.P)}b{f=1}y.1l(\'<m T="\'+B+\'U/V/W/-/\'+n+\'?X=Y-Z-m&11=1a&c-k=1" ><\\/m>\')}}}C L(H){12=(H-1)*j;I=H;6 13=y.1m(\'1n\')[0];6 z=y.1o(\'m\');z.1p=\'1q/1r\';z.1s("T",B+"U/V/W?1t-1u="+12+"&c-k=1&X=Y-Z-m&11=1b");13.1v(z)}C M(H){12=(H-1)*j;I=H;6 13=y.1m(\'1n\')[0];6 z=y.1o(\'m\');z.1p=\'1q/1r\';z.1s("T",B+"U/V/W/-/"+n+"?1t-1u="+12+"&c-k=1&X=Y-Z-m&11=1b");13.1v(z)}C 1b(Q){1c=Q.R.1K[0];6 1w=1c.1x.$t.F(0,19)+1c.1x.$t.F(1L,1M);6 1d=1N(1w);4(i=="o"){6 1e="/r?S-c="+1d+"&c-k="+j+"#G="+I}b{6 1e="/r/s/"+n+"?S-c="+1d+"&c-k="+j+"#G="+I}1O.9=1e}',62,113,'|||span|if|html|var|class||href||else|max|maksimal|indexOf|nomerhal|showpageNum|thisUrl|jenis|postperpage|results|jj|script|lblname1|page|||search|label||urlactivepage|onclick|return|false|document|newInclude|mulai|home_page|function|akhir|pageArea|substring|PageNo|numberpage|nopage|nomerkiri|parseInt|redirectpage|redirectlabel|numshowpage|upPageWord|length|root|feed|updated|src|feeds|posts|summary|alt|json|in||callback|jsonstart|nBody||banyakdata|prevnomer|nextnomer|blogPager||hitungtotaldata|finddatepost|post|timestamp|alamat|halamanblogger|loophalaman|for|downPageWord|innerHTML|totaldata|write|getElementsByTagName|head|createElement|type|text|javascript|setAttribute|start|index|appendChild|timestamp1|published|showpageOf|Page|of|showpage|showpagePoint|getElementsByName|getElementById|blog|pager|openSearch|totalResults|20|entry|23|29|encodeURIComponent|location'.split('|'),0,{}))
//]]></script>
</b:if>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == "error_page"'>
<div id='error-db'>
<div id='error-db-suit'>
<div class='box-404-db'>404</div>
<h1>Halaman tidak ditemukan</h1>
<p>Kemungkinan halaman telah dihapus, atau Anda salah menulis URL</p>
<p>Kembali ke <a expr:href='data:blog.homepageUrl'><data:blog.title/></a></p>
</div>
</div>
</b:if>
</body>
</HTML>yang saya tandai adlah di mana sobat tinggal meletakkan yang di perlukan saja, mau di modifikasi sampai jreng juga silahkan pokoknya sesuai selera...
semoga berguna dan bermanfaat kerangka templatenya ... :-)
kerangka ini bebas anda gunakan dengan tidak menghapus creditnya
36 komentar
keren gan, ijin modifikasi
BalasHapussilahkan... :)
HapusKalau ini sih bukan sekedar kerangka mas, sudah tinggal permak aja :D
BalasHapusTerima kasih ya, saya akan coba buat template :)
silahkan sob... :)
HapusIni bukan kerangka lagi udah jadi template. Seperti mas @Prisma Try Laksana bilang tinggal di permak dan di otak atik lagi biar keren.
BalasHapusHehe iya mas, kerangkanya saja sudah bagus :-bd
Hapuskang mousir belum jadi sempurna kang, makanya saya bilang kerangka :).
Hapusprisma masih bagus buatan para master sob :D
ganti temapilan.. okok bagus banget nih mas
BalasHapusLebih elegan, hehe :D
Hapusbelum finising tu sob :(
Hapusiya sob, dari lama dah pengen make cuma lagi di permak sana sini :)
HapusKeren Mas...
BalasHapusterimakasih sob :-bd
Hapusmampir lagi nih, sudah saya ikuti dan bagus tutorialnya :)
BalasHapussip sob :-bd
Hapuswahh, keren nihh kerangka templatenya :D
BalasHapustinggal pakek sob
Hapusgood template
BalasHapustanks :)
HapusKeren mas templatenya, tinggal di modifikasi |o|
BalasHapussilahkan sob :-bd
Hapusterus berkarya :-d
BalasHapussiap sob :)
HapusDi bookmark dulu sob, siapa nanti ganti template
BalasHapusGood template :)
keren banget template nya mas
BalasHapusitu masih butuh banyak permak sob, belum keren :D
HapusMasih harus diedit lagi ya gan?
BalasHapusiya sob, yang udah jadi ada di template
Hapusizin modif sob :-bd
BalasHapussilahkan sob
Hapuspusing abah mah pasangnya juga .. gagal lagi- gagal lagi minta ilmunya kang ^_^
BalasHapusda yg slah bah di bneri dulu
HapusGak bisa mas :(
BalasHapuspanya yg gk bisa?
Hapusizin ambil Buat template sendiri
BalasHapusizin ambil Buat template sendiri
BalasHapusLink aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>