Headline
Loading...

Showing posts with label Widget Blog. Show all posts
Showing posts with label Widget Blog. Show all posts

Memasang Jam digital Lengkap di Blog


KKali ini saya akan memberikan tips untuk memasang  Jam, Hari dan Tanggal  yang sangat menarik sederhana untuk diterapkan di blog anda dan di sini tersedia  beberapa pilhan pada menu dan silahkan di lihat dan di pelajari javascriptnya dibawah ini untuk di praktekan, selamat mencoba semoga berhasil

  • Tanggal dengan Javascript:

3 Februari 2016
Kode Javascriptnya:
<script type="text/javascript">
<!--
var months = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];
var date = new Date();
var day = date.getDate();
var month = date.getMonth();
var yy = date.getYear();
var year = (yy < 1000) ? yy + 1900 : yy;
document.write(day + " " + months[month] + " " + year);
//-->
</script>
  •  Hari dan Tanggal :

Rabu, 3 Februari 2016
Kode Javascriptnya:
<script type='text/javascript'>
<!--
var months = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];
var myDays = ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jum&#39;at', 'Sabtu'];
var date = new Date();
var day = date.getDate();
var month = date.getMonth();
var thisDay = date.getDay(),
    thisDay = myDays[thisDay];
var yy = date.getYear();
var year = (yy < 1000) ? yy + 1900 : yy;
document.write(thisDay + ', ' + day + ' ' + months[month] + ' ' + year);
//-->
</script>
  • Jam sekarang (Pasif):

8 : 02
Kodenya Javascriptnya:
<script type="text/javascript">
<!--
var d = new Date();
var curr_hour = d.getHours();
var curr_min = d.getMinutes();
curr_min = curr_min + "";
if (curr_min.length == 1) {
    curr_min = "0" + curr_min;
}
document.write(curr_hour + " : " + curr_min);
//-->
</script>
  • Dengan Format AM/PM

8 : 02 AM
Kode Javascriptnya:
<script type="text/javascript">
<!--
var a_p = "";
var d = new Date();
var curr_hour = d.getHours();
if (curr_hour < 12) {
    a_p = "AM";
} else {
    a_p = "PM";
}
if (curr_hour == 0) {
    curr_hour = 12;
}
if (curr_hour > 12) {
    curr_hour = curr_hour - 12;
}

var curr_min = d.getMinutes();
curr_min = curr_min + "";
if (curr_min.length == 1) {
    curr_min = "0" + curr_min;
}
document.write(curr_hour + " : " + curr_min + " " + a_p);
//-->
</script>
Ratapan

  • Jam Sekarang (Aktif):

09:00:45 AM
Kode Javascriptnya:
<div id="clock">
</div>
<script type="text/javascript">
<!--
function showTime() {
    var a_p = "";
    var today = new Date();
    var curr_hour = today.getHours();
    var curr_minute = today.getMinutes();
    var curr_second = today.getSeconds();
    if (curr_hour < 12) {
        a_p = "AM";
    } else {
        a_p = "PM";
    }
    if (curr_hour == 0) {
        curr_hour = 12;
    }
    if (curr_hour > 12) {
        curr_hour = curr_hour - 12;
    }
    curr_hour = checkTime(curr_hour);
    curr_minute = checkTime(curr_minute);
    curr_second = checkTime(curr_second);
 document.getElementById('clock').innerHTML=curr_hour + ":" + curr_minute + ":" + curr_second + " " + a_p;
    }

function checkTime(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
setInterval(showTime, 500);
//-->
</script>
Semoga bermanfaat.


Membuat Menu Flat UI dengan Efek Flip

    OOrang Selalu tertarik akan sebua blog dengan tampilan menu dropdown atau vertikal dengan sangat menarik di pandang mata, semuanya itu dilakukan hanya karena kreativitas seorang blogger untuk menyajikan kepada para blogger sebuah tampilan inovativ hasil karya sendiri ataupun contekan dari blog tetanggaa, yang terpenting jangan cloning, maka saya tampilkan menu yang agak berbeda dengan blog lain dengan sentuhan CSS untuk itu kita lihat cara membuatnya

    • Silahkan pilih " Tata Letak " pada dasbor blog anda.
    • klik "Add gadget " ( Tambahkan gadget )
    • Setelah muncul halaman gadget silahkan pilih " HTML/JavaScript ".
    • Copy kode didalam spoiler dibawah ini kemudian pastekan di gadget anda.
    • Edit html , save dan lihat hasilnya, semoga bermanfaat...
      
       <style>
      @import url(http://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900);
      @import url(http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css);
      
      nav ul {
        min-width: 600px;
        position: relative;
        display: table;
        margin: 50px auto;
        clear: both;
      }
      
      nav ul li {
        list-style: none;
        float: left;
      }
      
      nav ul li a {
          width: 100px;
          height: 100px;
          float: left;
          margin: 0 10px;
        -webkit-perspective: 600px;
           -moz-perspective: 600px;
            -ms-perspective: 600px;
                perspective: 600px;
      }
      
      nav ul li .front {
        text-align: center;
        -webkit-transform: rotateX(0deg) rotateY(0deg);
           -moz-transform: rotateX(0deg) rotateY(0deg);
            -ms-transform: rotateX(0deg) rotateY(0deg);
             -o-transform: rotateX(0deg) rotateY(0deg);
        -webkit-transition: all 0.5s ease-in-out;
           -moz-transition: all 0.5s ease-in-out;
            -ms-transition: all 0.5s ease-in-out;
             -o-transition: all 0.5s ease-in-out;
                transition: all 0.5s ease-in-out;
        -webkit-backface-visibility: hidden;
           -moz-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
             -o-backface-visibility: hidden;
                backface-visibility: hidden;
        -webkit-transform-style: preserve-3d;
           -moz-transform-style: preserve-3d;
             -o-transform-style: preserve-3d;
                transform-style: preserve-3d;
      }
      
      nav ul li:hover .front {
        -webkit-transform: rotateX(0deg) rotateY(180deg);
           -moz-transform: rotateX(0deg) rotateY(180deg);
            -ms-transform: rotateX(0deg) rotateY(180deg);
             -o-transform: rotateX(0deg) rotateY(180deg);
      }
      
      nav ul li .back {
        position: absolute;
        top: 0;
        width: inherit;
        height: inherit;
        text-align: center;
        z-index: -1;
        -webkit-transform: rotateX(0deg) rotateY(-180deg);
           -moz-transform: rotateX(0deg) rotateY(-180deg);
            -ms-transform: rotateX(0deg) rotateY(-180deg);
             -o-transform: rotateX(0deg) rotateY(-180deg);
        -webkit-transition: all 0.5s ease-in-out;
           -moz-transition: all 0.5s ease-in-out;
            -ms-transition: all 0.5s ease-in-out;
             -o-transition: all 0.5s ease-in-out;
                transition: all 0.5s ease-in-out;
        -webkit-backface-visibility: hidden;
           -moz-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
             -o-backface-visibility: hidden;
                backface-visibility: hidden;
        -webkit-transform-style: preserve-3d;
           -moz-transform-style: preserve-3d;
             -o-transform-style: preserve-3d;
                transform-style: preserve-3d;
      }
      
      nav ul li:hover .back {
        z-index: 1;
        -webkit-transform: rotateX(0deg) rotateY(0deg);
           -moz-transform: rotateX(0deg) rotateY(0deg);
            -ms-transform: rotateX(0deg) rotateY(0deg);
             -o-transform: rotateX(0deg) rotateY(0deg);
      }
      
      nav ul li i {
        line-height: 100px !important;
        color: white;
        vertical-align: middle !important;
      }
      
      nav ul li span {
        font-family: 'Roboto';
        font-size: 20px;
        font-weight: 300;
        line-height: 100px;
        color: white;
        text-transform: lowercase;
        vertical-align: middle;
      }
      
      nav ul li.color-1 .front,
      nav ul li.color-1 .back {
        background-color: #3498db;
      }
      
      nav ul li.color-2 .front,
      nav ul li.color-2 .back {
        background-color: #2ecc71;
      }
      
      nav ul li.color-3 .front,
      nav ul li.color-3 .back {
        background-color: #1abc9c;
      }
      
      nav ul li.color-4 .front,
      nav ul li.color-4 .back {
        background-color: #f39c12;
      }
      
      nav ul li.color-5 .front,
      nav ul li.color-5 .back {
        background-color: #34495e;
      }
      </style>
      <nav>
          <ul class="panel">
              <li class="color-1"> <a href="#">
                      <div class="front">
                          <i class="fa fa-windows fa-4x"></i>
                      </div>
                      <div class="back">
                          <span>HOME</span>
                      </div>
                  </a>
      
              </li>
              <li class="color-2"> <a href="#">
                      <div class="front">
                          <i class="fa fa-bars fa-4x"></i>
                      </div>
                      <div class="back">
                          <span>MENU</span>
                      </div>
                  </a>
      
              </li>
              <li class="color-3"> <a href="#">
                      <div class="front">
                          <i class="fa fa-cogs fa-4x"></i>
                      </div>
                      <div class="back">
                          <span>PORTFOLIO</span>
                      </div>
                  </a>
      
              </li>
              <li class="color-4"> <a href="#">
                      <div class="front">
                          <i class="fa fa-user fa-4x"></i>
                      </div>
                      <div class="back">
                          <span>ABOUT ME</span>
                      </div>
                  </a>
      
              </li>
              <li class="color-5"> <a href="#">
                      <div class="front">
                          <i class="fa fa-envelope-o fa-4x"></i>
                      </div>
                      <div class="back">
                          <span>CONTACT</span>
                      </div>
                  </a>
      
              </li>
          </ul>
      </nav>
      </div>
      Simpan dan Lihat Hasilnya

      Counter Box Pada Widget label Blogger



      • Langkah 1 : Buat widget Label, centang Tampilkan jumlah entri per label.

      • Langkah 2 : Simpan kode ini di atas ]]></b:skin> atau </style>


      #Label1 li a {color: #2c3e50;text-decoration:none;}
      #Label1 li a:hover, #Label2 li a:active, #Label1 li a:focus {color: #20aea6;text-decoration:none;}
      #Label1 li .label-counter {float:right;background-color:#20aea6;color:#fff;line-height:1;margin:2px 0 0;padding:3px 5px;border-radius:2px;text-align: center;font-size:12px;}
      #Label1 li:hover .label-counter {background-color:#255e96;color:white}

      Silahkan atur kembali warna sesuai keinginan sobat.

      CSS di atas tidak mutlak pada #Label1, apabila ada beberapa label pada template sobat silahkan pilih dan edit menjadi#Label2 atau #Label3 dst.

      • Langkah 3 : Pada Label terpilih, cari kode :

      <span dir='ltr'>(<data:label.count/>)</span>

      ganti mejadi

      <span class='label-counter'><data:label.count/></span>

      Pada hasil akhir, apabila jumlah postingan lebih banyak maka akan lebih lebar seperti ini 123 dibanding yang lebih sedikit seperti ini 32. Untuk membuat ukuran yang sama, pada #Label1 li .label-counter tambahkan ukuran fixed :

      width:25px
      silahkan sesuaikan ukuran pixel sesuai selera sobat.
      Efek Rolling Pada Menu Navigasi Blog

      Efek Rolling Pada Menu Navigasi Blog

      EFek Roling atau berputar saat mouse mnyentu bagian yang di inginkan, hal ini memberikan efek yang menarik untuk di pandang oleh sebagiab blogger maka pada menu navigasi terbaru tanpa edit html memukau dengan css yang elegan dan membuat menu navigasi pada blog anda tampil beda untuk itu saya akan sharingkan cara memasang menu navigasi dengan sentuhan CSS

      • Login ke account blog anda
      • Tata Letak---Tambah Gadget Baru
      • Copy dan pastekan di  Html  Javascript baru
      / <style>
      nav a {
        position: relative;
        display: inline-block;
        margin: 15px 25px;
        outline: none;
        color: #fff;
        text-decoration: none;
        text-transform: uppercase;
        letter-spacing: 1px;
        font-weight: 400;
        text-shadow: 0 0 1px rgba(255,255,255,0.3);
        font-size: 1.35em;}
      
      nav a:hover, nav a:focus {outline: none;}
      .cl-effect-1 {position: relative;z-index: 1;}
      .cl-effect-1 a {overflow: hidden;margin: 0 15px;}
      
      .cl-effect-1 a span {
        display: block;
        padding: 10px 20px;
        background: #0f7c67;
        -webkit-transition: -webkit-transform 0.3s;
        -moz-transition: -moz-transform 0.3s;
        transition: transform 0.3s;}
      
      .cl-effect-1 a::before {
        position: absolute;
        top: 0;left: 0;
        z-index: -1;
        padding: 10px 20px;
        width: 100%;
        height: 100%;
        background: #fff;
        color: #0f7c67;
        content: attr(data-hover);
        -webkit-transition: -webkit-transform 0.3s;
        -moz-transition: -moz-transform 0.3s;
        transition: transform 0.3s;
        -webkit-transform: translateX(-25%);}
      
      .cl-effect-1 a:hover span,
      .cl-effect-1 a:focus span {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        transform: translateX(100%);}
      
      .cl-effect-1 a:hover::before,
      .cl-effect-1 a:focus::before {
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        transform: translateX(0%);}
      </style>
      <nav class="cl-effect-1">
      <a href="/" data-hover="Sahabat"><span>Sahabat</span></a>
      <a href="/" data-hover="Blogger"><span>Blogger</span></a>
      <a href="/" data-hover="Tujuh-tujuh"><span>Tujuh-tujuh</span></a>
      </nav>
      </div>
      • Simpan dan Lihat Hasilnya

      Social Network dengan Efek Sliding


      • Login ke dashboard anda
      • Masuk ke "TEMPLATE" lalu klik " Edit HTML "Cari code ]]></b:skin> 
      • Copy Code script CSS dibawah ini, pastekan diatas code ]]></b:skin> tadi atau bila template blog anda memakai </style> silahkan pastekan kode CSSnya tepat diatas </style> template anda.



      *****************************************
      Name : Widget Social Slide
      ******************************************/
      
      #socialbdrssliding a{
      
      font-family: 'Open Sans', Helvetica, Arial, sans-serif;
      
      width: 40px;
      
      transition:width 0.4s;
      
      -webkit-transition:width 0.4s;
      
      -moz-transition:width 0.4s;
      
      overflow: hidden;
      
      }#socialbdrssliding a:hover{
      
      width: 100px;
      
      overflow: hidden;
      
      }#socialbdrssliding {
      
      float: right;
      
      position: relative;
      
      height: 40px;
      
      }#socialbdrssliding ul { margin: 0; }
      
      #socialbdrssliding li,
      
      #socialbdrssliding li a,
      
      #socialbdrssliding li .bdrs-thumb,
      
      #socialbdrssliding li .bdrs-title {
      
      display: block;
      
      position: relative;
      
      width: 40px;
      
      height: 40px;
      
      }#socialbdrssliding li,
      
      #socialbdrssliding li a,
      
      #socialbdrssliding li .bdrs-title {
      
      float: left;
      
      width: auto;
      
      overflow: hidden;
      
      }#socialbdrssliding li a {
      
      width: 40px;
      
      line-height: 40px;
      
      color: #E9E9E9;
      
      font-size: 11px;
      
      font-weight: bold;
      
      text-shadow: 1px 2px 2px #000;
      
      text-decoration: none;
      
      }#socialbdrssliding li .bdrs-thumb { float: left; }
      
      #socialbdrssliding li.bdrs-facebook a { background-color: #3B5998; }
      
      #socialbdrssliding li.bdrs-facebook .bdrs-thumb { background: 
      url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRtsqVk7pY-dhZxF_Nf5Aou9dSDUez_iV8L8GSW0FaXEaQXJRCiUwIWZv5eUghbVqulmeuRoe5JVI4uBSRdBJJee0h7LS5SGiWo5zrPaJFrKHtIPBAhyw7lQD2rxiEHD8co2l6KwVSfpQ/s1600/FACEBOOK.png")
       no-repeat 0 -40px; }
      
      #socialbdrssliding li.bdrs-gplus a { background-color: #d94a39; }
      
      #socialbdrssliding li.bdrs-gplus .bdrs-thumb { background: 
      url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBLIeiohp5uu6lcjUoV2IOpTC2iuma86Vwtv_zG-bOmlCj0-oPY-W8p3x74HJUFtBj0vEnAL_t78mPWWfZn6uxE10g-DL4YvNdxoKve2ue-o2XBoR4NT3efhAz-JGbZRf8S-52L_mMVXk/s1600/googleplus.png")
       no-repeat 0 -40px; }
      
      #socialbdrssliding li.bdrs-twitter a { background-color: #3CF; }
      
      #socialbdrssliding li.bdrs-twitter .bdrs-thumb { background: 
      url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFUsgwXfzK7THAt9SE72Ukf0iRyt8xIM_cTKgDXMnZaA1OkmhN-3aQmOfsZdU1wsgZdlPDu9dGANRkVU8WSoPOgPVXL18jN8g9XvkgkaJ-kofqBtDK2WAO6FKBlsQp9XIOA4iggJOk2tU/s1600/TWITTER.png")
       no-repeat 0 -40px; }
      
      #socialbdrssliding li.bdrs-rss a { background-color: #F88F16; }
      
      #socialbdrssliding li.bdrs-rss .bdrs-thumb { background: 
      url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5QxpLxyxnkHJGossyau-6jolLIIP1OcKkR5x13G2_jn_UAZTP8XtqQWtgRIx9mEJdHBqPKlufssL_QBptyHNrVOMePV7zq0WwxjkCV44syKQSbZBCmk2q8mKXGvzB2BQJE3Z4Q1ym0po/s1600/rssbd.png")
       no-repeat 0 -40px; }
      
      #socialbdrssliding li.bdrs-youtube a { background-color: #BD3518; }
      
      #socialbdrssliding li.bdrs-youtube .bdrs-thumb { background: 
      url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQEdJgKpCBVM_6pKAWCcDObIn4SnRjkab9mBbo7SnSZ0VwIvMRZeloIEH-9K4QWemym-RqtFWfSzPfcFbjCTou3BjH6I6nZOBAz_KoA0sdlNtWKMKaSEOp-cet0xwMh62YRZ7s22VMNZw/s1600/youtube.png")
       no-repeat 0 -40px; }
      
      #socialbdrssliding li.bdrs-facebook a:hover, #socialbdrssliding 
      li.bdrs-youtube  a:hover, #socialbdrssliding li.bdrs-rss a:hover, 
      #socialbdrssliding li.bdrs-twitter a:hover, #socialbdrssliding 
      li.bdrs-gplus a:hover {background-color:#666;}
      /*code CSS end */
      • Setelah anda sudah memasang CSSnya saatnya anda memasang kode htmlnya.
      • Untuk memasang kode htmlnya anda dapat memasangnya dimana saja. Untuk tutorial kali ini saya memasangnya di widget sidebar halaman blog.
      • Silahkan pilih " Tata Letak " pada dasbor blog anda.
      • klik "Add gadget " ( Tambahkan gadget )
      • Setelah muncul halaman gadget silahkan pilih " HTML/JavaScript ".
      • Copy kode didalam spoiler dibawah ini kemudian pastekan di gadget anda.
      • Edit html , save dan lihat hasilnya, semoga bermanfaat...
      !-- BDRS widget social slide code start -->
      
      <div id="socialbdrssliding"><ul><li class="bdrs-gplus"><a href="LINK GPlus "
       target="_blank" rel="nofollow" title="gplus"><div 
      class="bdrs-thumb"></div><div 
      class="bdrs-title">Gplus</div></a></li> 
      
      <li class="bdrs-facebook"><a href="LINK FACEBOOK"
       target="_blank" rel="nofollow" title="facebook"><div 
      class="bdrs-thumb"></div><div 
      class="bdrs-title">Facebook</div></a></li>
      
      <li class="bdrs-twitter"><a href="LINK TWITTER"
       target="_blank" rel="nofollow" title="twitter"><div 
      class="bdrs-thumb"></div><div 
      class="bdrs-title">Twitter</div></a></li>
      
      <li class="bdrs-rss"><a href="LINK RSS"
       target="_blank"  rel="nofollow" title="rss feed"><div 
      class="bdrs-thumb"></div><div 
      class="bdrs-title">RSS</div></a></li> 
      
      <li class="bdrs-youtube"><a href="LINK YOUTUBE"
       target="_blank" rel="nofollow" title="youtube"><div 
      class="bdrs-thumb"></div><div 
      class="bdrs-title">YouTube</div></a></li></ul></div>
      
      <!-- BDRS widget social slide code end -->
      Simpan dan Lihat Hasilnya, Semoga berhasil

      Banner Iklan Dengan CSS


      AAda cara untuk mendapatkan income bagi para blogger dengan cara memberikan ruang bagi jasa pemasangan iklan untuk siapa saja dengan persyaratan-persyaratan tertentu, untuk itu saya akan sharingkan cara memasang banner iklan dengan sentuhan CSS, hal ini untuk memberikan pendapatan tambahan untuk anda tanpa memeras keringat, banyak meliuner berpenghasilan besar berawal dari penasaran iseng membuat ikaln di blog pribadi mereka al hasil rezeki itu datang menghampiri, mari kita coba hal sederhana ini siapa tahu kita juga bisa beruntung

      • Login ke account blog anda
      • Copy dan pastekan di widget Html baru
      
        <div style='padding: 5px; overflow: auto; width: auto; height:200px;border:1px solid #333'>
      <style>
      #kotak-iklan-125x125 {
      margin: 0px;
      padding: 5px;
      text-align: center; }
      #kotak-iklan-125x125 img {
      margin: 0px 8px 4px 0px;
      padding: 3px;
      text-align: center;
      border: 3px solid #c0c0c0;
      -webkit-border-radius:70px;
      -moz-border-radius:70px;
      -o-border-radius:70px;
      border-radius:70px;
      -webkit-transition: all 0.45s ease-out;
      -moz-transition: all 0.45s ease-out;
      -o-transition: all 0.45s ease-out;
      transition: all 0.45s ease-out;
      }
      #kotak-iklan-125x125 img:hover {
      margin: 0px 8px 4px 0px;
      padding: 3px;
      text-align: center;
      border-radius: 3px solid #c33f00;
      -webkit-border-radius:0px;
      -moz-border-radius:0px;
      -o-border-radius:0px;
      border-radius:0px;
      }
      </style>
      
      <div id="kotak-iklan-125x125">
      <a href="http://sanggar-belajar.blogspot.com/2014/02/syarat-pemasangan-iklan.html" target="_blank" ><img alt="banner ads" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyd79fDlM9NuMnqvVUEE8Ionbhj0Apf0dzmotEXL74bM4VehLItGWPeevt7GkgwVSUDbzwQ3xErjvR3BUExnPMMqWMjR-BQpYzQTIQH1UEwIhaqVcOjpGsDaljKGHX09vUeiSl49CN0io/s1600/ad125x125.jpg" border="0" width="75px" height="75px"/></a>
      <a href="http://sanggar-belajar.blogspot.com/2014/02/syarat-pemasangan-iklan.html" target="_blank" ><img alt="banner ads" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyd79fDlM9NuMnqvVUEE8Ionbhj0Apf0dzmotEXL74bM4VehLItGWPeevt7GkgwVSUDbzwQ3xErjvR3BUExnPMMqWMjR-BQpYzQTIQH1UEwIhaqVcOjpGsDaljKGHX09vUeiSl49CN0io/s1600/ad125x125.jpg" border="0" width="75px" height="75px"/></a>
      <a href="http://sanggar-belajar.blogspot.com/2014/02/syarat-pemasangan-iklan.html" target="_blank" ><img alt="banner ads" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyd79fDlM9NuMnqvVUEE8Ionbhj0Apf0dzmotEXL74bM4VehLItGWPeevt7GkgwVSUDbzwQ3xErjvR3BUExnPMMqWMjR-BQpYzQTIQH1UEwIhaqVcOjpGsDaljKGHX09vUeiSl49CN0io/s1600/ad125x125.jpg" border="0" width="75px" height="75px"/></a><a href="http://sanggar-belajar.blogspot.com/2014/02/syarat-pemasangan-iklan.html" target="_blank" ><img alt="banner ads" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyd79fDlM9NuMnqvVUEE8Ionbhj0Apf0dzmotEXL74bM4VehLItGWPeevt7GkgwVSUDbzwQ3xErjvR3BUExnPMMqWMjR-BQpYzQTIQH1UEwIhaqVcOjpGsDaljKGHX09vUeiSl49CN0io/s1600/ad125x125.jpg" border="0" width="75px" height="75px"/></a></div>
      </div>
      
      
      • Simpan dan lihat hasilnya

      Pasang Scroll pada Kategori Blog

      1. Silahkan sobat >>"Masuk/Login" ke Blog sobat.
      2. Pilih >> Menu >> "Template" >> "Edit Html" >> Lanjutkan >> Jangan lupa sobat Centang kotak kecil "Expand Template Widget".
      3. Kemudian Cari kode ]]></b:skin> , Gunakan CTRL + F untuk mempercepat dan memudahkan pencarian.
      4. Langkah yang selanjutnya silahkan sobat Copy/salin semua Kode Html di bawah ini dan Paste/tempel tepatdiatas/sebelum Kode ]]></b:skin> , seperti pada gambar di
      #Label1 .widget-content{
      height:200px;
      width:auto;
      overflow:auto;
      }
      Selamat Mencoba semoga berhasil
      Back to Top