Menu


Menu Tab

Pages

CSS3 3D Transforms

CSS3 3D Transforms
Memasang CSS3 3D Transforms untuk menhiasi blog menggunakan CSS3 dan HTML yang berpenampilan cukup menarik. berikut kode tersebut serta cara penerapannya :
Login ke akun blog klik entri halaman baru HTML copy kode berikut, letakan kedalam halaman baru tersebut dan klik simpan selesai.
.
<style>/*Custom Font*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300);

/*Basic Reset*/
* {margin: 0; padding: 0;}
body {
    background: #333;
    /*Removing scrollers*/
    overflow: hidden;
    /*A high perspective to give the UL an isometric look*/
perspective: 3000;
}
h1 {
    color: white;
    font: 45px 'Open Sans';
    width: 500px;
    padding: 50px;
}
.grid {
position: absolute; top: 100px; left: 0;
    /*Width = (225 + 20 + 20) * 4 = 1060*/
    width: 1060px;
    /*3D Transform*/
    transform: rotateX(60deg) rotateZ(-50deg);
    /*Preserve 3D style for children*/
    transform-style: preserve-3d;
}
.grid li {
    height: 400px; width: 225px;
    float: left; margin: 20px;
    list-style-type: none;
    /*Hide the lighting gradient from the front face*/
    background-size: 0, cover;
    /*Preserve 3D style for children(pseudo elements)*/
    transform-style: preserve-3d;
}
/*Left and Bottom Sides*/
.grid li:before, .grid li:after {
    content: '';
    position: absolute;
    /*100% height and width*/
    top: 0; left: 0; right: 0; bottom: 0;
    background: inherit;
    background-size: cover;
}
/*Left Side*/
.grid li:before {
    transform-origin: left center;
    transform: rotateY(90deg);
    /*Reducing the width of the left side for a flat feel*/
    width: 5px;
}
/*Bottom Side*/
.grid li:after {
    transform-origin: bottom center;
    transform: rotateX(90deg);
    /*Reducing the height*/
    height: 5px; top: auto; bottom: 0;
    /*Background fix - start the background from the bottom*/
    background-position: bottom center;
}
/*Shadow time - sadly all pseudo elements are used so we will have to add an HTML element in each LI*/
.s {
    position: absolute;
    /*30px smaller from each side*/
    top: 30px; left: 30px; right: 30px; bottom: 30px;
    background: rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 30px 30px rgba(0, 0, 0, 0.5);
    /*Pushing down the shadow to give an elevated feel*/
transform: translateZ(-50px);
}
/*We will add a light gradient to the sides to give some lighting effect*/
.one {
background:
linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)),
        url("http://Link Gambar.png");
}
.two {
    background:
        linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)),
        url("http://Link Gambar.png");
}
.three {
    background:
        linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)),
        url("http://Link Gambar.png");
}
.four {
    background:
        linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)),
        url("http://Link Gambar.png");
}
</style>
<h1>Your Text</h1>
<ul class="grid">
    <li class="one"><span class="s"></span></li>
    <li class="two"><span class="s"></span></li>
    <li class="three"><span class="s"></span></li>
    <li class="four"><span class="s"></span></li>
</ul>
Penjelasan :
Terapkan Link gambar beri judul pada your text yang berwarna merah
Edited by. Myscript2010
Sumber by. Kode Player

Widget Footer Empat Kolom

Widget Footer Empat Kolom
Memasang footer empat kolom di edit HTML
Footer pada blog yang berada dibagian paling bawah pada halaman blog, biasanya berjumlah lebih dari satu kolom, yang memiliki fungsi untuk menambahkan  gadged dihalaman blog, gadged tersebut berfungsi untuk tempat penyimpanan file. Dibawah ini adalah kode footer empat kolom,
berikut cara penerapannya.
Login ke akun blog klik edit HTML temukan kode ]]></b:skin>
gunakan CTRL F untuk pencarian copy kode berikut pastekan diatas kode ]]></b:skin> 

/*----- MBT MULTI COLUMN FOOTER WIDGET -----*/
#lower {
margin:auto;
padding: 0px 0px 10px 0px;
width: 100%;
background:#333333;
}
#lower-wrapper {
background:#333333;
margin:auto;
padding: 20px 0px 20px 0px;
width: 960px;
border:0;
}
#lowerbar-wrapper {
background:#333333;
float: left;
margin: 0px 5px auto;
padding-bottom: 20px;
width: 23%;
text-align: justify;
color:#ddd;
font: bold 12px Arial, Tahoma, Verdana;
line-height: 1.6em;
word-wrap: break-word;
overflow: hidden;
}
.lowerbar {margin: 0; padding: 0;}
.lowerbar .widget {margin: 0; padding: 10px 20px 0px 20px;}
.lowerbar h2 {
margin: 0px 0px 10px 0px;
padding: 3px 0px 3px 0px;
text-align: left;
border:0;
color:#ddd;
text-transform:uppercase;
font: bold 14px Arial, Tahoma, Verdana;
}
.lowerbar ul {
color:#fff;
margin: 0 auto;
padding: 0;
list-style-type: none;
}
.lowerbar li {
display:block;
color:#fff;
line-height: 1.6em;
margin-left: 0 !important;
padding: 6px;
border-bottom: 1px solid #222;
border-top: 1px solid #444;
list-style-type: none;
}
.lowerbar li a {
text-decoration:none; color: #DBDBDB;
}
.lowerbar li a:hover {
text-decoration:underline;
}
.lowerbar li:hover {
display:block;
background: #222;
}
Kemudian cari kode </body>
copy kode berikut ini pastekan diatas kode tersebut dan klik simpan selesai

<div id='lower'>
<div id='lower-wrapper'>


<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar1' preferred='yes'>
</b:section>
</div>


<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar2' preferred='yes'>
</b:section>
</div>


<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar3' preferred='yes'>
</b:section>
</div>


<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar4' preferred='yes'>
</b:section>
</div>


<div style='clear: both;'/>
</div> </div>
Edited   by. Myscript2010
Sumber by. Mybloggertricks

Tombol Link 3D Button

Tombol link 3D button
tombol ini dapat digunakan untuk demoshow maupun download isi postingan yang sudah disediakan
dibawah ini adalah kode tombol link 3D button yang dapat diterapkan di area gadged maupun entri halaman baru HTML
<style> <style type'text/css'>
#menu{ list-style: none; margin: 0; padding: 0; }
#menu img { border: none; } #menu { width: 150px; margin: 10px; }
#menu   a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #0033CC; height: 24px; text-decoration: none; }
#menu a:link,
#menu a:visited { color: #FEF280; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSL9c7OwJn54_HZ3VZvcsJAgR7XD8ibo5WQfJuYTFc68oRHEL8a2p0G0c6aWVJGJcLX4Mw8-UoSoWFLkc6UXXKF5NPmM6NHBqKK8F7jhgMSNs5RlNL35uOSAfyyicaqz2FJao2wDVENwg/s1600-r/3Dbuttons.png); padding: 8px 0 0 35px; }
#menu a:hover { color: #1919B3; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSL9c7OwJn54_HZ3VZvcsJAgR7XD8ibo5WQfJuYTFc68oRHEL8a2p0G0c6aWVJGJcLX4Mw8-UoSoWFLkc6UXXKF5NPmM6NHBqKK8F7jhgMSNs5RlNL35uOSAfyyicaqz2FJao2wDVENwg/s1600-r/3Dbuttons.png) 0 -32px; padding: 8px 0 0 35px; }</font>
</style>

 <p align="center">
     <div id="menu">
 <a href="
http://Your Link" target="_blank">3D BUTTON</a></li> </ul> </div>
</font>
<style> <style type'text/css'>
#menu{ list-style: none; margin: 0; padding: 0; }
#menu img { border: none; } #menu { width: 150px; margin: 10px; }
#menu   a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #0033CC; height: 24px; text-decoration: none; }
#menu a:link,
#menu a:visited { color: #FEF280; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLiWunaICOrU85lgZoHqyjJFya70ZW_w-FSwAHcTXytGfUO2uypYDMinkZXbKL5UChNaIooYCe7XyyriVPzWOyEaEM-s0ZL6X5U8GPcECmtgrTXZsbGLhA8qyRvhmPm1nYu9xWTfnkS3LU/s1600-r/bt_mys2010.png); padding: 8px 0 0 35px; }
#menu a:hover { color: #fff; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLiWunaICOrU85lgZoHqyjJFya70ZW_w-FSwAHcTXytGfUO2uypYDMinkZXbKL5UChNaIooYCe7XyyriVPzWOyEaEM-s0ZL6X5U8GPcECmtgrTXZsbGLhA8qyRvhmPm1nYu9xWTfnkS3LU/s1600-r/bt_mys2010.png) 0 -32px; padding: 8px 0 0 35px; }</font>
</style>

 <p align="center">
     <div id="menu">
 <a href="
http://Your Link" target="_blank">3D BUTTON</a></li> </ul> </div>
</font>
<style> .button {
-moz-border-radius:5px 5px 5px 5px;
-webkit-border-radius:5px 5px 5px 5px;
border-radius:5px 5px 5px 5px;
-moz-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);
-webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);
box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);
background:scroll 0 0 #222222;
border-bottom:1px solid rgba(0, 0, 0, 0.25);
color:#FFFFFF !important;
cursor:pointer;
font-weight:bold;
line-height:1;
overflow:visible;
font-size:17px;
padding:8px 19px 9px;
position:relative;
text-decoration:none;
text-shadow:0 -1px 1px rgba(0, 0, 0, 0.25);
width:auto;
}
.demobutton {
background-color:#00008B;
text-align:center;
width:100px;
}
.demobutton:hover {
background-color:#EB7D05;
}
.downloadbutton {
background-color:#00008B;
text-align:center;
width:100px;
}
.downloadbutton:hover {
background-color:#00AC00;
}
.homebutton {
background-color:#00008B;
text-align:center;
width:100px;
}
.homebutton:hover {
background-color: #00BFFF;
}
.button:hover {
-moz-box-shadow:0 1px 11px rgba(0, 0, 0, 0.45);
-webkit-box-shadow:0 1px 11px rgba(0, 0, 0, 0.45);
box-shadow:0 1px 11px rgba(0, 0, 0, 0.45);}}
</style>
 <p align="center">

    <a class="button homebutton" href="http://Your Link" rel="nofollow"
    style="float: center;" target="_blank"><span style="display:
    inline-block;">3D BUTTON</span></a></p>
<style>

a.css3dbutton {
    background: darkred; /* background color of button */
    color: white;
    text-decoration: none;
    font: bold 28px Arial; /* font size and style */
    position: relative;
        top: 0; /* anchor main button's position */
    bottom: -12px; /* Depth of 3D effect. :after pseudo element inherits this value so it's animated in Chrome. See: kizu.ru/en/pseudos */
        margin-bottom: 12px;
    -moz-box-shadow: 0 -15px 5px darkred inset;
    -webkit-box-shadow: 0 -15px 5px darkred inset;
    box-shadow: 0 -15px 5px darkred inset;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
a.css3dbutton, a.css3dbutton:after {
    display: inline-block;
    padding: 10px 15px; /* vertical and horizontal padding of button */
    -moz-border-radius: 8px/15px;
    -webkit-border-radius: 8px/15px;
    border-radius: 8px/15px;
    outline: none;
}
a.css3dbutton:after { /* pseudo element to construct 3D side of button */
    content: "";
    position: absolute;
    padding: 0;
    z-index: -1;
    bottom: inherit; /* Inherit main button bottom value to animate it. See: kizu.ru/en/pseudos */
    left: 0;
    width: 100%;
    height: 100%;
    background: #6e0e0c; /* background color of 3D effect */
    -moz-box-shadow: 1px 0 3px gray;
    -webkit-box-shadow: 1px 0 3px gray;
    box-shadow: 1px 0 3px fff;
}
a.css3dbutton:hover {
    -moz-box-shadow: 0 25px 5px rgba(182, 64, 61, 0.7) inset;
    -webkit-box-shadow: 0 25px 5px rgba(182, 64, 61, 0.7) inset;
    box-shadow: 0 25px 5px rgba(182, 64, 61, 0.7) inset;
    background: #bc3835; /* background color when mouse rolls over button */
}
a.css3dbutton:active {
    top: 12px; /* shift button down 12px when depressed. Change 12px to match button's "bottom" property above */
    bottom: 0;
    -moz-box-shadow: 0 -20px 5px darkred inset, 1px 1px 2px #eee;
    -webkit-box-shadow: 0 -20px 5px darkred inset, 1px 1px 2px #eee;
    box-shadow: 0 -20px 5px darkred inset, 1px 1px 2px #eee;
}
</style>
<a href="
http://Your Link" class="css3dbutton">3D BUTTON</a>
<style type="text/css">

.rssbutton{
background-color: #ff6600;
border: 1px #ff6600 outset;
padding: 0 2px;
color: white;
text-decoration: none;
font: bold 10px Verdana;
}
.rssbutton:visited, .rssbutton:hover, .rssbutton:active{
color: white;
}
.cssbutton{
background-color: #d1ec4c;
border: 2px #d1ec4c outset;
padding: 1px 4px;
color: black;
text-decoration: none;
font: bold 90% "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
}
.cssbutton:visited{
color: black;
}
.cssbutton:hover{
border-style: inset;
background-color: #e3f48e;
padding: 2px 3px 0 5px; /*shift text 1px to the right and down*/
}
.cssbutton:active{
color: black;
}
</style>
<p>
<a href="http://Your Link" class="rssbutton">Menu 1</a>
<a href="http://Your Link" class="rssbutton">Menu 2</a>
</p> <a href="http://Your Link" class="cssbutton">3D BUTTON</a>
 <a href="http://Your Link" class="cssbutton">3D BUTTON</a></p>
<style type="text/css">
.container {
  margin: 50px auto;
  width: 480px;
  text-align: center;
}
.container .button {
  margin: 10px;
}
.button {
  display: inline-block;
  vertical-align: top;
  position: relative;
  padding: 0 15px 0 15px;
  line-height: 35px;
  font-size: 12px;
  font-weight: bold;
  color: white;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
  background: #576dce;
  background-clip: padding-box;
  border: 1px solid;
  border-color: #374fbb #344cb3 #2b3e94;
  border-radius: 2px;
  -webkit-font-smoothing: antialiased;
  background-image: -webkit-linear-gradient(top, #92a0df 0%, #576dce 50%, #3f58c7 80%, #576dce 100%);
  background-image: -moz-linear-gradient(top, #92a0df 0%, #576dce 50%, #3f58c7 80%, #576dce 100%);
  background-image: -o-linear-gradient(top, #92a0df 0%, #576dce 50%, #3f58c7 80%, #576dce 100%);
  background-image: linear-gradient(to bottom, #92a0df 0%, #576dce 50%, #3f58c7 80%, #576dce 100%);
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 1px 2px rgba(0, 0, 0, 0.2);
}
.button:hover, .button.hover {
  background-color: #5f74d0;
  border-color: #2d429c #2d429c #253680;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 1px 5px #576dce;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 1px 5px #576dce;
}
.button:active, .button.active {
  border-color: #253680 #2b3e94 #3147a8;
  background: #475fc9;
  -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.8);
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.8);
}
.button:before {
  content: '';
  position: absolute;
  top: 9px;
  right: 12px;
  width: 17px;
  height: 17px;
  background: #374fbb;
  border-radius: 9px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.2);
}
.button:after {
  content: '>';
  float: right;
  position: relative;
  margin-left: 15px;
  font: bold 18px/33px "Comic Sans MS";
  /* I tried everything but couldn't get the vertical alignment to be
     consistent in IE, so this is a hack targeting IE8-9-10. */
  line-height: 31px\0;
  color: #6377d1;
  text-shadow: 0 -1px #8696dc, 0 1px 1px rgba(0, 0, 0, 0.3);
  -webkit-font-smoothing: subpixel-antialiased;
}
.button-green {
  background: #75a940;
  border-color: #5b8432 #567d2f #425f24;
  background-image: -webkit-linear-gradient(top, #9bc86e 0%, #75a940 50%, #669338 80%, #75a940 100%);
  background-image: -moz-linear-gradient(top, #9bc86e 0%, #75a940 50%, #669338 80%, #75a940 100%);
  background-image: -o-linear-gradient(top, #9bc86e 0%, #75a940 50%, #669338 80%, #75a940 100%);
  background-image: linear-gradient(to bottom, #9bc86e 0%, #75a940 50%, #669338 80%, #75a940 100%);
}
.button-green:hover, .button-green.hover {
  background-color: #7ab043;
  border-color: #476627 #476627 #354d1d;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 1px 5px #75a940;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 1px 5px #75a940;
}
.button-green:active, .button-green.active {
  border-color: #354d1d #425f24 #4f722b;
  background: #6b9a3a;
  -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.8);
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.8);
}
.button-green:before {
  background: #5b8432;
}
.button-green:after {
  color: #7db444;
  text-shadow: 0 -1px #94c462, 0 1px 1px rgba(0, 0, 0, 0.3);
}
.button-red {
  background: #cf3e38;
  border-color: #ab2e29 #a32c27 #82231f;
  background-image: -webkit-linear-gradient(top, #de7a76 0%, #cf3e38 50%, #bb332d 80%, #cf3e38 100%);
  background-image: -moz-linear-gradient(top, #de7a76 0%, #cf3e38 50%, #bb332d 80%, #cf3e38 100%);
  background-image: -o-linear-gradient(top, #de7a76 0%, #cf3e38 50%, #bb332d 80%, #cf3e38 100%);
  background-image: linear-gradient(to bottom, #de7a76 0%, #cf3e38 50%, #bb332d 80%, #cf3e38 100%);
}
.button-red:hover, .button-red.hover {
  background-color: #d14640;
  border-color: #8a2521 #8a2521 #6d1e1a;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 1px 5px #cf3e38;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 1px 5px #cf3e38;
}
.button-red:active, .button-red.active {
  border-color: #6d1e1a #82231f #962924;
  background: #c3352f;
  -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.8);
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.8);
}
.button-red:before {
  background: #ab2e29;
}
.button-red:after {
  color: #d24a44;
  text-shadow: 0 -1px #db6e69, 0 1px 1px rgba(0, 0, 0, 0.3);

    </style>
<div class="container">
<a href="
http://Your Link" class="button">Start</a><a href="http://Your Link" class="button button-green">Start</a><a href="http://Your Link" class="button button-red">Start</a><br><a href="http://Your Link" class="button hover">Start</a><a href="http://Your Link" class="button button-red hover">Start</a>
<a href="
http://Your Link" class="button button-green hover">Start</a> </div>
Penjelasan :
Terapkan Link dan edit kode yang di warnai sesuai keinginan
All Sources
Edited by. Myscript2010
Test Script Untuk melihat hasil

Kode Script Iklan Melayang

Kode Script Iklan melayang
kode ini dapat menampilkan gambar
dengan format jpg, gif, png, serta dapat menampilkan script dengan cara menambahkan kode textarea. Untuk penerapannya Login ke akun blog, klik tata letak dan klik tambahgadged, copy kode dibawah ini : terapkan kedalam ruang gadged tersebutkemudian klik simpan selesai
<style type="text/css">
#topbar {
 position:absolute;
 z-index: 80;
 padding: 7px;
 background: #444;
 background: #333)));
 border: 1px solid #000;
 border-radius: 10px;
 -webkit-border-radius: 10px;
 -moz-border-radius: 10px;
 -webkit-box-shadow: #444 0 2px 15px;
 -moz-box-shadow: #444 0 2px 10px;
 margin:0 auto 10px;
 float:left;
 color:rgba(0, 0, 0, 0.75);
 font-size: 12px;
 font-family: Verdana, serif;
 text-shadow:0 1px 0 #444;
}
#topbar img {
 border:none;
}
#topbar .tombol {
 margin:0;
 padding-bottom:5px;
 text-align:right;
}
#topbar .tombol button {
 color:#fff;
 border: solid 1px #000;
 margin:0;
 padding:2px 110px;
 cursor: pointer;
 text-shadow: 0 1px 1px rgba(0,0,0,.6);
 background: #444;
 background: -webkit-gradient(linear, left top, left bottom, from(red), to(#333));
 background: -moz-linear-gradient(top, red,  #333);
}
#topbar .isi_iklan {
 background-color:#fff;
 margin:0;
 padding:4px;
 width: 250px;
 border: 1px solid #444;
}
</style>
<script src="https://sites.google.com/site/code6916/file/Kode-Iklan-Melayang-Mys2010.js" type="text/javascript"></script>
<script type="text/javascript">
var persistclose=1
var startX = 20
var startY = 20
var verticalpos="fromtop"
</script>
<div id="topbar">
<div class="tombol"><a href="" onclick="closebar(); return false" style="text-decoration: none;"><button>Tutup</button></a></div>
<div class="isi_iklan">
<a href="http://toyotanasmoco.net/category/rush" target="_blank">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5jo6MmrGnjmm9lp2gKKLWMwN84rKwi4LTLV0E8UYlfspKRkqtK6hwGoc1TcSpOh43dXuTUmGcLxImp6SFy5DVNFc2wE5rvWzzUbpo2y-WlpU9eMuT4-BZWBGdOlRTjpr6zrqc2863muc/s1600/iklan-rush.gif " name="e902" border="0" width="250" height="150" /></a></script>
Penjelasan :
Terapkan Kode iklan dibawah Teks yang berwarna merah
Source Code by. Blogcunayz
Design code is edited by. Mys2010 on Codepen
If you want to directly copy and paste you canDownload Here Floating ad code

Kode Anti Copas


Kode Anti Copy Paste
Kode ini biasanya digunakan
untuk mengunci artikel yang tidak boleh di copy,
penyimpanan kode ini berada dibawah artikel
penerapannya ada yang di terapkan kedalam gadged ada juga yang diterapkan di edit HTML berikut kode tersebut serta cara penerapannya, login ke akun blog klik tata letak dan klik tambah gadged copy kode dibawah ini dan pastekan kedalam gadged tersebut klik simpan selesai
Kode Anti Copas 1.
<body oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false;' ondragstart='return false' onselectstart='return false' style='-moz-user-select: none; cursor: default;'>
Kode Anti Copas 2.
<script language='JavaScript1.2'>
function disableselect(e){
return false
}
function reEnable(){
return true
}
document.onselectstart=new Function ("return false")
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
</script>
Kode Anti Copas 3
Login ke akun Blogger klik edit HTML temukan kode </body>
gunakan CTRL F untuk pencarian copy kode dibawah ini letakan diatas kode </body>
dan klik simpan selesai
<script language='JavaScript1.2'> 
//Disable select-text script (IE4+, NS6+)- By Andy Scott
//Exclusive permission granted to Dynamic Drive to feature script
//Visit http://www.dynamicdrive.com for this script
function disableselect(e){
return false
}
function reEnable(){
return true
}
//if IE4+
document.onselectstart=new Function (&quot;return false&quot;)
//if NS6
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
</script>
<script language='JavaScript'>curPage=1;
document.oncontextmenu = function(){return false}
if(document.layers) {
window.captureEvents(Event.MOUSEDOWN);
window.onmousedown = function(e){
if(e.target==document)return false;
}
}
else {
document.onmousedown = function(){return false}
}</script>
.do-not-copy {
  -webkit-user-select:none;
  -khtml-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
}
<div class="do-not-copy">
do-not-copy</div>
Kode Anti Copas
Login ke akun Blogger klik edit  HTML  temukan kode  <body>
gunakan CTRL F untuk pencarian hapus kode <body> ganti dengan code
<body oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false'>
dan klik simpan selesai
All Sources
Edited by. Myscript2010


Pure CSS3 navigation


Pure CSS3 navigation
menu ini menggunakan CSS3 cukup menarik untuk dijadikan penampilan blog, dengan nomor urut otomatis, serta background warna yang dapat diedit dengan mudah. Cara penerapannyapun cukup simpel.
Jika tertarik copy kode berikut ini dan letakan pada ruang gadged klik simpan selesai
<style>
/*custom font*/
@import url(http://fonts.googleapis.com/css?family=Merriweather+Sans);
* {margin: 0; padding: 0;}
html, body {min-height: 100%;}
body {
    text-align: center;
    padding-top: 100px;
    background: #689976;
    background: linear-gradient(#689976, #ACDACC);
    font-family: 'Merriweather Sans', arial, verdana;
}
.breadcrumb {
    /*centering*/
    display: inline-block;
    box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.35);
    overflow: hidden;
    border-radius: 5px;
    /*Lets add the numbers for each link using CSS counters. flag is the name of the counter. to be defined using counter-reset in the parent element of the links*/
    counter-reset: flag;
}
.breadcrumb a {
    text-decoration: none;
    outline: none;
    display: block;
    float: left;
    font-size: 12px;
    line-height: 36px;
    color: white;
    /*need more margin on the left of links to accomodate the numbers*/
    padding: 0 10px 0 60px;
    background: #666;
    background: linear-gradient(#666, #333);
    position: relative;
}
/*since the first link does not have a triangle before it we can reduce the left padding to make it look consistent with other links*/
.breadcrumb a:first-child {
    padding-left: 46px;
    border-radius: 5px 0 0 5px; /*to match with the parent's radius*/
}
.breadcrumb a:first-child:before {
    left: 14px;
}
.breadcrumb a:last-child {
    border-radius: 0 5px 5px 0; /*this was to prevent glitches on hover*/
    padding-right: 20px;
}
/*hover/active styles*/
.breadcrumb a.active, .breadcrumb a:hover{
    background: #333;
    background: linear-gradient(#333, #000);
}
.breadcrumb a.active:after, .breadcrumb a:hover:after {
    background: #333;
    background: linear-gradient(135deg, #333, #000);
}
/*adding the arrows for the breadcrumbs using rotated pseudo elements*/
.breadcrumb a:after {
    content: '';
    position: absolute;
    top: 0;
    right: -18px; /*half of square's length*/
    /*same dimension as the line-height of .breadcrumb a */
    width: 36px;
    height: 36px;
    /*as you see the rotated square takes a larger height. which makes it tough to position it properly. So we are going to scale it down so that the diagonals become equal to the line-height of the link. We scale it to 70.7% because if square's:
    length = 1; diagonal = (1^2 + 1^2)^0.5 = 1.414 (pythagoras theorem)
    if diagonal required = 1; length = 1/1.414 = 0.707*/
    transform: scale(0.707) rotate(45deg);
    /*we need to prevent the arrows from getting buried under the next link*/
    z-index: 1;
    /*background same as links but the gradient will be rotated to compensate with the transform applied*/
    background: #666;
    background: linear-gradient(135deg, #666, #333);
    /*stylish arrow design using box shadow*/
    box-shadow:
        2px -2px 0 2px rgba(0, 0, 0, 0.4),
        3px -3px 0 2px rgba(255, 255, 255, 0.1);
    /*
        5px - for rounded arrows and
        50px - to prevent hover glitches on the border created using shadows*/
    border-radius: 0 5px 0 50px;
}
/*we dont need an arrow after the last link*/
.breadcrumb a:last-child:after {
    content: none;
}
/*we will use the :before element to show numbers*/
.breadcrumb a:before {
    content: counter(flag);
    counter-increment: flag;
    /*some styles now*/
    border-radius: 100%;
    width: 20px;
    height: 20px;
    line-height: 20px;
    margin: 8px 0;
    position: absolute;
    top: 0;
    left: 30px;
    background: #444;
    background: linear-gradient(#444, #222);
    font-weight: bold;
}
.flat a, .flat a:after {
    background: white;
    color: black;
    transition: all 0.5s;
}
.flat a:before {
    background: white;
    box-shadow: 0 0 0 1px #ccc;
}
.flat a:hover, .flat a.active,
.flat a:hover:after, .flat a.active:after{
    background: #9EEB62;
}

</style>
<!-- a simple div with some links -->
<div class="breadcrumb">
    <a href="
Your Link" class="active">Browse</a>
    <a href="
Your Link">Compare</a>
    <a href="
Your Link">Order Confirmation</a>
    <a href="
Your Link">Checkout</a>
</div>

<br /><br />
<!-- another version - flat style with animated hover effect -->
<div class="breadcrumb flat">
    <a href="
Your Link" class="active">Browse</a>
    <a href="
Your Link">Compare</a>
    <a href="
Your Link">Order Confirmation</a>
    <a href="
Your Link">Checkout</a>
</div>


<!-- Prefixfree -->
<script src="http://thecodeplayer.com/uploads/js/prefixfree-1.0.7.js" type="text/javascript" type="text/javascript"></script>
Penjelasan :
Tambahkan sub menu jika diperlukan,
hapus salah satu kelompok bidang sub menu yang di beri warna jika tidak diperlukan
Sumber : Kode Player
Edited by. Myscript2010

Sitemap Fade Animation

Fungsi sitemap adalah untuk menginformasikan url-url yang berada pada blog agar lebih mudah di crawl dan dijelajahi oleh para tools atau robot search engine dan akan memudahkan pengunjung mencari artikel yang dibutuhkannya. Selain itu sitemap secara tidak langsung akan manambah nilai SEO Optimization. ini adalah sitemap yang berpenampilan cukup menarik untuk di tampilkan dihalaman statis. cara penerapannya sebagai berikut :
Login ke akun blog klik entri halaman baru HTML,
copy kode dibawah ini pastekan kedalam halaman barutersebut dan klik simpan selesai
<style>
#toc-outer {
  font:bold 12px/14px Arial,Sans-Serif;
  line-height:14px !important;
  color:#8FBC8B ;
  text-align:left;
  text-shadow:none;
  background-color:#2F4F4F;
  background-image:-webkit-radial-gradient(50% 0%, cover, #2F4F4F, #2F4F4F);
  background-image:-moz-radial-gradient(50% 0%, cover, #2F4F4F, #2F4F4F);
  background-image:-ms-radial-gradient(50% 0%, cover, #2F4F4F, #2F4F4F);
  background-image:-o-radial-gradient(50% 0%, cover, #2F4F4F, #2F4F4F);
  background-image:radial-gradient(50% 0%, cover, #2F4F4F, #2F4F4F);
  margin:0px auto;
  padding:10px 10px;
  border:1px dashed #696969 ;
  -webkit-box-shadow:
    inset 0px 0px 2px rgba(255,255,255,0.1),
    0px 0px 0px 3px #040D09,
    0px 1px 3px 3px green;
  -moz-box-shadow:
    inset 0px 0px 2px rgba(255,255,255,0.1),
    0px 0px 0px 3px #040D09,
    0px 1px 3px 3px black;
  box-shadow:
    inset 0px 0px 2px rgba(255,255,255,0.1),
    0px 0px 0px 3px #040D09,
    0px 1px 3px 3px black;
  -webkit-border-radius:5px 5px 20px 20px;
  -moz-border-radius:5px 5px 20px 20px;
  border-radius:5px 5px 20px 20px;
  overflow:hidden;
}
#toc-outer a {border:none;}
#results {
  border:1px dotted #fff;
  background-color:#000000;
  background-image:-webkit-repeating-linear-gradient(#2F4F4F 15px, #000000 15px, #2F4F4F 16px, #000000 16px, #2F4F4F 30px);
  background-image:-moz-repeating-linear-gradient(#2F4F4F 15px, #000000 15px, #2F4F4F 16px, #00CED1 16px, #2F4F4F 30px);
  background-image:-ms-repeating-linear-gradient(#000000 15px, #000000 15px, #2F4F4F 16px, #000000 16px, #2F4F4F 30px);
  background-image:-o-repeating-linear-gradient(#2F4F4F 15px, #00CED1 15px, #2F4F4F 16px, #000000 16px, #ffffff 30px);
  background-image:repeating-linear-gradient(#000000 15px, #000000 15px, #EAE8E2 16px, #2F4F4F 16px, #000000 30px);
  -webkit-box-shadow:0px 0px 2px #000000, inset 7px 0px 30px #00CED1;
  -moz-box-shadow:0px 0px 2px #000000, inset 7px 0px 30px #00CED1;
  box-shadow:0px 0px 2px #000000, inset 7px 0px 30px #00CED1;
  position:relative;
}
#results:before {
  content:"";
  border-left:1px dashed #FF69B4;
  width:0px;
  height:100%;
  position:absolute;
  top:0px;
  right:auto;
  bottom:0px;
  left:14px;
}
#loadingscript {
  font:bold 20px Broadway,Serif;
  text-shadow:0px 1px 0px white;
  text-align:center;
  padding:30px 0px;
  text-decoration:blink;
  height:1250px;
}
.itemposts {
  margin:0px auto 0px;
  padding:8px 10px 8px 30px;
  height:auto;
  overflow:hidden;
  display:block;
  -webkit-animation:toc-fade 2s ease;
  -moz-animation:toc-fade 2s ease;
  -ms-animation:toc-fade 2s ease;
  -o-animation:toc-fade 2s ease;
  animation:toc-fade 2s ease;
}
.itemposts h5 {
  margin:0px 0px 0px;
  font:bold 12px/16px Georgia,Serif;
  line-height:16px !important;
  height:16px;
  overflow:hidden;
  font-style:italic;
  color:#044747;
  border:none;
  padding:0px 0px;
  text-shadow:0px 1px 0px white;
  text-transform:none;
}
.itemposts h5 a {
  color:green;
  text-decoration:none;
  text-shadow:0px 1px 0px #47006B;
}
.itemposts h5 a:hover {color:black;}
.itemposts img {
  float:left;
  height:72px;
  width:72px;
  margin:2px 10px 2px 0px;
  padding:0px 0px;
  background-color:#333333;
  border:none !important;
  -webkit-box-shadow:0px 0px 0px 4px #24006B, 0px 0px 3px 4px #fff;
  -moz-box-shadow:0px 0px 0px 4px #24006B, 0px 0px 3px 4px #fff;
  box-shadow:0px 0px 0px 4px #24006B, 0px 0px 3px 4px #fff;
  -webkit-border-radius:47px;
  -moz-border-radius:47px;
  border-radius:47px;
  -webkit-transition:all 1s ease-out;
  -moz-transition:all 1s ease-out;
  -ms-transition:all 1s ease-out;
  -o-transition:all 1s ease-out;
  transition:all 1s ease-out;
}
.itemposts img:hover {
  -webkit-transform:rotate(-720deg);
  -moz-transform:rotate(-720deg);
  -ms-transform:rotate(-720deg);
  -o-transform:rotate(-720deg);
  transform:rotate(-720deg);
}
.itemposts .iteminside {margin:10px 0px 0px;}
.itemposts .itemfoot {
  clear:both;
  padding:5px 10px;
  background-color:#2F4F4F ;
  border-left:2px solid #2F4F4F ;
  margin:10px 0px 0px;
  color:#556B2F;
  overflow:hidden;
}
.itemposts .itemfoot a.itemrmore {
  font-weight:bold;
  color:#D2691E;
  float:right;
  text-decoration:none;
  border-bottom:1px dotted white;
}
.itemposts .itemfoot a.itemrmore:hover {
  color:#1E90FF;
  text-decoration:none;
  border-color:transparent;
}
#itempager {
  background-color: #2F4F4F;
  background-image:-webkit-linear-gradient( #2F4F4F, #333);
  background-image:-moz-linear-gradient( #2F4F4F, #333);
  background-image:-ms-linear-gradient( #2F4F4F, #333);
  background-image:-o-linear-gradient( #2F4F4F, #333);
  background-image:linear-gradient( #2F4F4F, #333);
  padding:30px 0px;
  -webkit-border-radius:0px 0px 10px 10px;
  -moz-border-radius:0px 0px 10px 10px;
  border-radius:0px 0px 10px 10px;
}
#pagination, #totalposts {
  color: #87CEEB;
  font:bold 10px Verdana,Arial,Sans-Serif;
  padding:0px;
  text-align:center;
}
#pagination {
  margin:0px 10px 10px;
  background-color:#2F4F4F;
  background-image:-webkit-linear-gradient(left, #2F4F4F, #8B0000, #2F4F4F);
  background-image:-moz-linear-gradient(left, #2F4F4F, #8B0000, #2F4F4F);
  background-image:-ms-linear-gradient(left, #2F4F4F, #8B0000, #2F4F4F);
  background-image:-o-linear-gradient(left, #2F4F4F, #8B0000, #2F4F4F);
  background-image:linear-gradient(to right, #2F4F4F, #8B0000, #2F4F4F);
  padding:7px 0px;
  border:1px dashed rgba(255,255,255,0.2);
  -webkit-box-shadow:0px 0px 0px 2px #24006B, 0px 2px 1px 3px rgba(0,0,0,0.2);
  -moz-box-shadow:0px 0px 0px 2px 24006B, 0px 2px 1px 3px rgba(0,0,0,0.2);
  box-shadow:0px 0px 0px 2px #24006B, 0px 2px 1px 3px rgba(0,0,0,0.2);
  -webkit-border-radius:1px;
  -moz-border-radius:1px;
  border-radius:1px;
}
#totalposts {
  display:block;
  clear:both;
  margin:0px 0px;
}
#pagination span, #pagination a {
  color:white;
  display:inline;
  margin:0 1px;
  padding:2px 5px;
  text-indent:0px;
  background-color:#A8A90E;
  text-decoration:none;
  border:none;
  -webkit-transition:all 0.26s ease-out;
  -moz-transition:all 0.26s ease-out;
  -ms-transition:all 0.26s ease-out;
  -o-transition:all 0.26s ease-out;
  transition:all 0.26s ease-out;
}
#pagination a:hover {
  background-color:#fff;
  -webkit-transition-duration:0s;
  -moz-transition-duration:0s;
  -ms-transition-duration:0s;
  -o-transition-duration:0s;
  transition-duration:0s;
}
#pagination span.actual {background-color:#2F4F4F;}
#pagination span.hidden {display:none;}
/* Fade animation */
@-webkit-keyframes toc-fade {
  from {-webkit-transform:translateX(-40px);opacity:0;}
  to   {-webkit-transform:translateX(0px);opacity:1;  }
}
@-moz-keyframes toc-fade {
  from {-moz-transform:translateX(-40px);opacity:0;}
  to   {-moz-transform:translateX(0px);opacity:1;}
}
@-ms-keyframes toc-fade {
  from {-ms-transform:translateX(-40px);opacity:0;}
  to   {-ms-transform:translateX(0px);opacity:1;}
}
@-o-keyframes toc-fade {
  from {-o-transform:translateX(-40px);opacity:0;}
  to   {-o-transform:translateX(0px);opacity:1;}
}
@keyframes toc-fade {
  from {transform:translateX(-40px);opacity:0;}
  to   {transform:translateX(0px);opacity:1;}
}
</style>

<script>
var showPostDate   = true,
    showComments   = true,
    idMode         = true,
    sortByLabel    = false,
    labelSorter    = "JQuery",
    loadingText    = "Loading...",
    totalPostLabel = "Jumlah posting:",
    jumpPageLabel  = "Halaman",
    commentsLabel  = "Komentar",
    rmoreText      = "Selengkapnya &#9658;",
    prevText       = "Sebelumnya",
    nextText       = "Berikutnya",
    siteUrl        = "http://myscript2010s.blogspot.co.id",
    postPerPage   = 10,
    numChars       = 150,
    imgBlank       = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfL32ayvnAT1QmpkbAGlPUR57zHRZ6bj1kvAM9pwGABdGd565uzopnmUrReEqCIi9W4chm6BScmt-2YPClipDVKYSS7J3WN4UU8lS1mQvRVXVn5C0ya23yaZH-mN9B4kPONubGdC5WjN0/s1600-r/Mys2010-logo-Blogg.png";
</script><script src="
http://yourjavascript.com/27149461315/sitemap-fade-mys2010.js"rel='stylesheet'/></script>
Penjelasan :
Ganti link yang berwarna orange dengan link sobat
Sumber by. Dte Web Id
Ediited  by. Myscript2010

Sitemap Black Color

Fungsi sitemap adalah untuk menginformasikan url-url yang berada pada blog  agar lebih mudah di crawl dan dijelajahi oleh para tools atau robot search engine dan akan memudahkan pengunjung mencari artikel yang dibutuhkannya. Selain itu, sitemap secara tidak langsung akan manambah nilai SEO Optimization.
Berikut ini adalah sitemap bernuansa hitam untuk di tampilkan dihalaman statis.
langkah penerapannya sama seperti biasa
Login ke akun blog klik entri halaman baru HTML,
copy kode dibawah ini pastekan kedalam halaman baru tersebut dan kliksimpan selesai
<style>
#toc-outer {
  font:bold 12px/12px Arial,Sans-Serif;
  color: #8B4513;
  text-align:left;
  text-shadow:none;
  background-color:#000000;
  overflow:hidden;
  -webkit-box-shadow:10px 1px 2px rgba(0,0,0,0.7);
  -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.7);
  box-shadow:0px 1px 2px rgba(0,0,0,0.7);
}
#toc-outer a {border:none;color:#3582D0;}
#loadingscript {
  padding:0px 0px;
  height:37px;
  text-indent:-9999px;
  color:transparent;
  background:transparent url('data:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfL32ayvnAT1QmpkbAGlPUR57zHRZ6bj1kvAM9pwGABdGd565uzopnmUrReEqCIi9W4chm6BScmt-2YPClipDVKYSS7J3WN4UU8lS1mQvRVXVn5C0ya23yaZH-mN9B4kPONubGdC5WjN0/s1600-r/Mys2010-logo-Blogg.png') no-repeat 50% 50%;
}
no-repeat 50% 50%;
  height:200px;
}
.itemposts, #itempager {
  overflow:hidden;
  padding:0px 10px 7px;
  color:#fff;
  text-shadow:0 1px 1px rgba(0,0,0,0.3);
  border-top:1px solid #fff;
  border-bottom:1px solid #222;
  background-color:#fff;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#800000', endColorstr='#333333');
  background-image:-webkit-linear-gradient( #800000, #333);
  background-image:-moz-linear-gradient( #800000, #333);
  background-image:-o-linear-gradient( #800000, #333);
  background-image:linear-gradient( #800000, #333);
}
.itemposts h5 a {
  color:green;
  text-decoration:none;
  text-shadow:0px 1px 0px #47006B;
}
.itemposts h5 a:hover {color:black;}
.itemposts img {
  float:left;
  height:72px;
  width:72px;
  margin:2px 10px 14px 13px;
  padding:0px 0px;
  background-color:#47006B;
  border:none !important;
  -webkit-box-shadow:0px 0px 0px 4px #2F4F4F , 0px 0px 3px 4px #444;
  -moz-box-shadow:0px 0px 0px 4px #2F4F4F , 0px 0px 3px 4px #444;
  box-shadow:0px 0px 0px 4px #2F4F4F , 0px 0px 3px 4px #2F4F4F ;
  -webkit-border-radius:47px;
  -moz-border-radius:47px;
  border-radius:47px;
  -webkit-transition:all 1s ease-out;
  -moz-transition:all 1s ease-out;
  -ms-transition:all 1s ease-out;
  -o-transition:all 1s ease-out;
  transition:all 1s ease-out;
}
.itemposts img:hover {
  -webkit-transform:rotate(-720deg);
  -moz-transform:rotate(-720deg);
  -ms-transform:rotate(-720deg);
  -o-transform:rotate(-720deg);
  transform:rotate(-720deg);
}
.itemposts .iteminside {margin:10px 0px 0px;}
.itemposts .iteminside {
  padding:10px 0px 10px;
  border-top:1px solid #444;
  border-bottom:1px solid #222;
  overflow:hidden;}
.itemposts .itemfoot {
  clear:both;
  padding:5px 10px;
  color:#e06666;
  background-image:-webkit-linear-gradient(#333, #444, #333, #222);
  background-image:-moz-linear-gradient(#333, #444, #333, #222);
  background-image:-ms-linear-gradient(#333, #444, #333, #222);
  background-image:-o-linear-gradient(#333, #444, #333, #222);
  background-image:linear-gradient(#333, #444, #333, #222);
  border-top:8px solid #444;
  overflow:hidden;
  position:relative;}
.itemposts .itemfoot a.itemrmore {
  font-weight:bold;
  color:red;
  position:absolute;
  top:5px;
  right:10px;}
.itemposts .itemfoot a.itemrmore:hover {color:aqua;}
#itempager {
  background-image:-webkit-linear-gradient(#000, #000, #000, #444);
  background-image:-moz-linear-gradient(#000, #333, #000, #444);
  background-image:-ms-linear-gradient(#000, #333, #000, #444);
  background-image:-o-linear-gradient(#000, #333, #000, #444);
  background-image:linear-gradient(#000, #333, #333, #444);
  padding:5px 7px;}
#pagination, #totalposts {
  text-align:left;
  color:#8b4513;
  margin:10px 10px 10px;
}
#pagination span, #pagination a {
    color: #000000;
    display: inline;
    margin: 0px 1px;
    padding: 2px 5px;
    text-indent: 0px;
    background-color: #00BFFF;
    background-image: linear-gradient(green 0%, #00BFFF 50%, #00BFFF 51%);
    border: 1px solid  #228B22;
    text-decoration: none;
    border-radius: 10px;
}
</style>

<script>
var showPostDate   = true,
    showComments   = true,
    idMode         = true,
    sortByLabel    = false,
    labelSorter    = "JQuery",
    loadingText    = "Loading...",
    totalPostLabel = "Jumlah posting:",
    jumpPageLabel  = "Halaman",
    commentsLabel  = "Komentar",
    rmoreText      = "Selengkapnya &#9658;",
    prevText       = "Sebelumnya",
    nextText       = "Berikutnya",
    siteUrl        = "http://myscript2010s.blogspot.co.id",
    postPerPage   = 10,
    numChars       = 150,
    imgBlank       = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfL32ayvnAT1QmpkbAGlPUR57zHRZ6bj1kvAM9pwGABdGd565uzopnmUrReEqCIi9W4chm6BScmt-2YPClipDVKYSS7J3WN4UU8lS1mQvRVXVn5C0ya23yaZH-mN9B4kPONubGdC5WjN0/s1600-r/Mys2010-logo-Blogg.png";
</script><script src="
http://yourjavascript.com/59451640121/sitemap-black-color-mys2010.js"rel='stylesheet'/></script>
Penjelasan :
Ganti link yang berwarna orange dengan link sobat
Sumber by. Dte Web Id
Ediited  by. Myscript2010



Sitemap Elegan

Fungsi sitemap adalah untuk menginformasikan url-url yang berada pada blog  agar lebih mudah di crawl dan dijelajahi oleh para tools atau robot search engine dan akan memudahkan pengunjung mencari artikel yang dibutuhkannya. Selain itu, sitemap secara tidak langsung akan manambah nilai SEO Optimization. Berikut cara penerapannya :
Login ke akun blog klik entri halaman baru HTML,
copy kode dibawah ini pastekan kedalam halaman baru tersebut dan klik simpan selesai
<style>
#toc-outer {
  font:normal 11px/14px Arial,Sans-Serif;
  color:white;
  text-align:left;
  margin:0px auto;
  background-color:#333;
  border-top:1px solid #666;
  -webkit-box-shadow:0px 1px 5px rgba(0,0,0,0.7);
  -moz-box-shadow:0px 1px 5px rgba(0,0,0,0.7);
  box-shadow:0px 1px 5px rgba(0,0,0,0.7);
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;
  overflow:hidden;
}

#loadingscript {
  font-weight:bold;
  font-size:20px;
  text-align:center;
  padding:30px 0px;
  height:1200px;
  text-decoration:blink;
}

.itemposts {
  margin:0px auto 0px;
  height:auto;
  overflow:hidden;
  display:block;
}

.itemposts h6 {
  margin:5px 5px 0px;
  font:bold 12px/14px Arial,Sans-Serif;
  text-transform:none;
  color:white;
  background-color:#444;
  background-image:-webkit-linear-gradient(#444 0%, #444 50%, #444 51%);
  background-image:-moz-linear-gradient(#444 0%, #444 50%, #444 51%);
  background-image:-ms-linear-gradient(#444 0%, #444 50%, #444 51%);
  background-image:-o-linear-gradient(#444 0%, #444 50%, #444 51%);
  background-image:linear-gradient(#444 0%, #444 50%, #444 51%);
  padding:5px 10px;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;
}

.itemposts h6 a {
  color:white;
  text-decoration:none;
  text-shadow:0px -1px 0px rgba(0,0,0,0.4);
}

.itemposts img {
  float:left;
  height:72px;
  width:72px;
  margin:2px 10px 2px 0px;
  padding:4px;
  background-color:#333;
  background-image:-webkit-linear-gradient(#333, #999, #666);
  background-image:-moz-linear-gradient(#333, #999, #444);
  background-image:-ms-linear-gradient(#333, #999, #444);
  background-image:-o-linear-gradient(#333, #999, #444);
  background-image:linear-gradient(#333, #999, #444);
  border:0px solid green;
  border-right-color:#444;
  border-bottom-color:#444;
  -webkit-box-shadow:0px 0px 3px 1px black;
  -moz-box-shadow:0px 0px 3px 1px black;
  box-shadow:0px 0px 3px 1px black;
  -webkit-border-radius:4px;
  -moz-border-radius:4px;
  border-radius:4px;
}

.itemposts .iteminside {
  margin:10px;
}

.itemposts .itemfoot {
  clear:both;
  padding:5px 10px;
  color:#e06666;
  background-image:-webkit-linear-gradient(#333, #444, #333, #222);
  background-image:-moz-linear-gradient(#333, #444, #333, #222);
  background-image:-ms-linear-gradient(#333, #444, #333, #222);
  background-image:-o-linear-gradient(#333, #444, #333, #222);
  background-image:linear-gradient(#333, #444, #333, #222);
  border-top:8px solid #444;
  overflow:hidden;
  position:relative;}

.itemposts .itemfoot a.itemrmore {
  font-weight:bold;
  color:red;
  position:absolute;
  top:5px;
  right:10px;}

.itemposts .itemfoot a.itemrmore:hover {color:aqua;}
#itempager {
  background-image:-webkit-linear-gradient(#000, #000, #000, #444);
  background-image:-moz-linear-gradient(#000, #333, #000, #444);
  background-image:-ms-linear-gradient(#000, #333, #000, #444);
  background-image:-o-linear-gradient(#000, #333, #000, #444);
  background-image:linear-gradient(#000, #333, #333, #444);
  padding:5px 7px;}

#pagination, #totalposts {
  color:#fff;
  display:block;
  font:bold 10px Verdana,Arial,Sans-Serif;
  margin-bottom:10px;
  text-align:left;
  padding:0;
}

#pagination span, #pagination a {
    color: yellow;
    display: inline;
    margin: 0px 1px;
    padding: 2px 5px;
    text-indent: 0px;
    background-color: #990099;
    background-image: linear-gradient(green 0%, #3161C2 50%, #990099 51%);
    border: 1px solid #fff;
    text-decoration: none;
    border-radius: 10px;
}

#pagination {
  margin:0px 10px 10px;
  background-color:#A10048;
  background-image:-webkit-linear-gradient(left,  #333, #A10048, #333);
  background-image:-moz-linear-gradient(left, #333, #A10048, #333);
  background-image:-ms-linear-gradient(left, #333, #A10048, #333);
  background-image:-o-linear-gradient(left, #333, #A10048, #333);
  background-image:linear-gradient(to right, #333, #A10048, #333);
  padding:7px 0px;
  border:1px dashed rgba(255,255,255,0.2);
  -webkit-box-shadow:0px 0px 0px 2px #24006B, 0px 2px 1px 3px rgba(0,0,0,0.2);
  -moz-box-shadow:0px 0px 0px 2px #A10048, 0px 2px 1px 3px rgba(0,0,0,0.2);
  box-shadow:0px 0px 0px 2px #A10048, 0px 2px 1px 3px rgba(0,0,0,0.2);
  -webkit-border-radius:1px;
  -moz-border-radius:1px;
  border-radius:1px;
}
</style>
<script>
var showPostDate   = true,
    showComments   = true,
    idMode         = true,
    sortByLabel    = false,
    labelSorter    = "JQuery",
    loadingText    = "Loading...",
    totalPostLabel = "Jumlah posting:",
    jumpPageLabel  = "Halaman",
    commentsLabel  = "Komentar",
    rmoreText      = "Selengkapnya ",
    prevText       = "Sebelumnya",
    nextText       = "Berikutnya",
    siteUrl        = "http://myscript2010s.blogspot.co.id",
    postPerPage   = 10,
    numChars       = 150,
    imgBlank       = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfL32ayvnAT1QmpkbAGlPUR57zHRZ6bj1kvAM9pwGABdGd565uzopnmUrReEqCIi9W4chm6BScmt-2YPClipDVKYSS7J3WN4UU8lS1mQvRVXVn5C0ya23yaZH-mN9B4kPONubGdC5WjN0/s1600-r/Mys2010-logo-Blogg.png";
</script><script src="
http://yourjavascript.com/45421136851/sitemap-elegan-mys2010.js
"rel='stylesheet'/>
</script>
Penjelasan :
Ganti link yang berwarna orange dengan link sobat
Sumber by. Dte Web Id
Ediited  by. Myscript2010

Featured posts


Memasang Featured posts
Featured posts atau slider posts berfungsi untuk mendekteksi recent posts blog  bedasarkan label yang
sudah dibuat pada postingan blog dengan tujuan mempermudah pencarian artikel, berikut cara penerapannya :
Login ke akun blog klik tataletak dan klik tambah gadged
copy kode berikut kemudian pastekan kedalam gadged tersebut dan klik simpan selesai
<center>
<div id="headerbox">
Featured Posts</div>
<div id="Sliderpostside">
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript">
</script>
<script src="http://yourjavascript.com/155251110521/featured-post.js"rel='stylesheet'/></script>
<script type='text/javascript'>
//<![CDATA[
SliderPostSide({
blogURL:"http://myscript2010seo.blogspot.co.id/",
MaxPost:8,
/*Slider http://myscript2010seo.blogspot.co.id/*/ idcontaint:"#Sliderpostside",
ImageSize:300,
interval:5000,
autoplay:true,
tagName:false});
//]]>
</script> <link href='http://fonts.googleapis.com/css?family=Oswald:300' rel='stylesheet' type='text/css'/> <style scoped="" type="text/css">
/*Slider http://myscript2010seo.blogspot.co.id/*/ ul.my-sidebar-slider * {
    -moz-box-sizing: border-box;
}
ul.my-sidebar-slider {
    font: 11px Verdana,Geneva,sans-serif;
}
ul.my-sidebar-slider, ul.my-sidebar-slider li {
    list-style: none outside none;
    margin: 0;
    padding: 0;
    position: relative;
}
ul.my-sidebar-slider {
    height: 500px;
    width: 100%;
}
ul.my-sidebar-slider li {
    display: none;
    float: left;
    height: 24.5%;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 100%;
}
ul.my-sidebar-slider li:nth-child(1), ul.my-sidebar-slider li:nth-child(2), ul.my-sidebar-slider li:nth-child(3), ul.my-sidebar-slider li:nth-child(4) {
    display: block;
}
ul.my-sidebar-slider li:nth-child(2) {
    left: 0;
    top: 50%;
}
ul.my-sidebar-slider img {
    border: 0 none;
    height: 100%;
    width: 100%;
}
ul.my-sidebar-slider .overlayx, ul.my-sidebar-slider li {
    transition: all 0.4s ease-in-out 0s;
}
ul.my-sidebar-slider li:nth-child(4) {
    left: 0;
    top: 75%;
    width: 100%;
}
/*Slider http://myscript2010seo.blogspot.co.id/*/ ul.my-sidebar-slider li:nth-child(3) {
    left: 0;
    top: 25%;
}
ul.my-sidebar-slider .overlayx {
    background-color: rgba(0, 0, 0, 0.5);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
}
/*Slider http://myscript2010seo.blogspot.co.id/*/ ul.my-sidebar-slider .overlayx, ul.my-sidebar-slider img {
    border: 4px solid #000;
    border-radius: 3px 3px 3px 3px;
}
ul.my-sidebar-slider .overlayx:hover {
    opacity: 0.1;
}
ul.my-sidebar-slider h4 {
    color: white;
    font-family: Agency FB;
    font-size: 25px;
    font-weight: 100;
    line-height: 1.5em;
    margin: 0;
    padding: 0 10px;
    position: absolute;
    top: 25px;
    width: 100%;
    z-index: 2;
}
ul.my-sidebar-slider .label_text {
    bottom: 10px;
    color: white;
    font-size: 90%;
    left: 10px;
    position: absolute;
    z-index: 2;
}
ul.my-sidebar-slider li:nth-child(2) .autname, ul.my-sidebar-slider li:nth-child(3) .autname {
    display: none;
}
.buttons {
    margin: 5px 0 0;
}
.buttons a {
    display: inline-block;
    height: 25px;
    position: relative;
    text-indent: -9999px;
    width: 15px;
}
.buttons a:before {
    border-color: transparent #000 transparent transparent;
    border-style: solid;
    border-width: 8px 7px;
    content: "";
    height: 0;
    left: 50%;
    margin-left: -10px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
    width: 0;
}
.buttons a.nextx:before {
    border-color: transparent transparent transparent #000;
    margin-left: -3px;
}
.date {
/*Slider http://myscript2010seo.blogspot.co.id/*/     background: none repeat scroll 0 0 rgba(32, 122, 161, 0.84);
    bottom: 93px;
    padding: 8px;
    position: relative;
    right: 6px;
}
#headerbox {
    moz-border-radius: 10px; -webkit-border-radius:  0px; background-color: #008B8B; border-radius:  0px; border: 5px double #333; padding: 4px; t-align: right;
}
</style> </center>
Penjelasan :
Ganti link yang berwarna merah dengan link sobat
All Sources
Edited by. Myscript2010

Blog Archives Manual


Memasang Blog Archives Manual
Blog arsip adalah satu tempat untuk menyimpan file yang berada dihalaman statis, sehingga dapat  mempermudah pembaca menjelajahi keseluruhan isi dari blog.

berikut cara penerapannya
Login ke akun blog klik tata letak dan klik tambah gadged,
copy kode dibawah ini : pastekan kedalam gadged tersebut dan klik simpan selesai
<p align="left">
<div class='widget BlogArchive' id='BlogArchive1'>
<div class='widget-content'>
<div id='ArchiveList'>
<div id='BlogArchive1_ArchiveList'>
<ul class='hierarchy'>
<li class='archivedate expanded'>
<a class='toggle' href='javascript:void(0)'>
<span class='zippy toggle-open' style='color:orange'>&#9660; </span>
</a>
<a class='post-count-link' href='#'>Blog Arsip</a>
<span class='post-count' dir='ltr'></span>
<ul class='hierarchy'>
<li class='archivedate expanded'>
<a class='zippy toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial"> &#9660; </font>
</a>
<span class='post-count' dir='ltr'>Tahun</span>
<span class='zippy toggle-open' style='color:green'>(Posting) </span>
</li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>Januari</a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total</a>
<span class='post-count' dir='ltr'>(0) Posting</span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>Februari </a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting</span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>Maret </a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>April</a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel </a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

 </li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>Mei </a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>Juni </a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>Juli</a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>Agustus </a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>September</a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>Oktober</a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>November</a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<ul><!..limiting archives mys2010 barrier..//></!..limiting></ul>

</a></a></li></ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="red"face="arial">
 &#9658;
  </font></a>
<a class='post-count-link' href=' # ' title='Myscript2010'>Desember</a>
<span class='post-count' dir='ltr'>(2016)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">  &#9660; 
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Jumlah</a>
<span class='post-count' dir='ltr'>(0)</span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>

<font size="2" color="red"face="arial">
&#9658;
</font></a>
<a class='post-count-link' href='#' title='Myscript2010'>Judul Artikel</a>
<span class='post-count' dir='ltr'>(Tampil)</span>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<font size="2" color="blue"face="arial">&#9660; 
</font></a>
<a class='post-count-link' href=' http://Your Link' title='Myscript2010'>Judul 1</a>
<span class='post-count' dir='ltr'> (0) Posting  </span>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660;   
</a>
<a class='post-count-link' href='http://Your Link' title='Myscript2010'>Judul 2</a>
<span class='post-count' dir='ltr'>(0) Posting </span>

</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
&#9660; 
</a>
<a class='post-count-link'#' title='myscript2010'>Total  </a>
<span class='post-count' dir='ltr'>(0) </span>
</li>
</ul>
</li>
</ul>
<ul class='hierarchy'>
<li class='archivedate collapsed'>
<a class='toggle' href='javascript:void(0)'>
<a class='toggle' href='javascript:void(TOTAL)'>

<!..limiting end..//>

</!..limiting></a></a></li>
</ul>

</li></ul></div>
</div>
</div>
</div>

<div id='sidebar-nu Luhur'>
<div class='sidebar section' id='sidebar-nu Handap'></div>
</div>

<div class='clear'> </div>
</p>
Penjelasan :
Edit  Link dan Teks yang diberi warna
Tambahkan Judul postingan sesuai bulan posting
All Sources
Edited by. Myscript2010

Myscript2010

Home Page
 
 

M2010

Copyright © Cibeber Cimahi