Cara membuat Daftar Link Sahabat

 

 Kali ini saya akan membahas tentang Cara Membuat Daftar Link Teman Keren Berbackground Dengan Scroll juga

=> Saya akan terangkan sedikit tentang cara yg saya pake ini.Cara yg saya paki ini bisa juga untuk nama Komunitas sobat blogger contohnya kayak gambar di samping nah fitur ini juga bisa di tambahkan bacground image sob.

Langsung aja caranya yah sobb:::

1. Agan pastinya harus masuk blogger kan
2. Pilih Tata Letak >Pilih> HTML/JavaScript
3. Masukan Script di bawah ini :

<div class="widgetSystem"><div class="nama">BLOGGER PURWOKERTO</div><div class="kulit"><li>

<a href=" http://hafiz-24.blogspot.com/" target="”_blank”">Hafiz - 24™</a></li><li>

<style type="text/css">.widgetSystem {    width: 69%;    padding: 5px;    background: #000000 url(http://bloggerbanyumas.net/about-us/selamat-datang/blogger-banyumas-logo_transparent_255/) no-repeat;    margin: 5px auto;    border: 1px solid #EE9304;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    border-radius: 5px;    webkit-box-shadow: 0 0 1px 1px #EE9304;    moz-box-shadow: 0 0 1px 1px #EE9304;    box-shadow: 0 0 1px 1px #EE9304    }.widgetSystem .nama {    text-align: center;    font-size: 1.5em;    background: #b80000;    background: rgba(255, 0, 0, 1);    padding:5px;    color: #fff;    font-family: "Comic Sans MS", Arial, sans serif;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    border-radius: 5px    }.widgetSystem .kulit {    background: #555555;    background: rgba(55, 22, 10, 0.1);    height: 180px;    overflow: auto;    margin-top: 5px;    border: 1px solid #000;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    border-radius: 5px    }.widgetSystem a {    text-decoration: none;    margin: 5px;    background: #A2A2A2A2;    background: rgba(5, 1, 3, 0.2);    padding: 5px;    display: block;    color: #fff;    text-transform: uppercase;    font-size: 12px;    font-weight: bold;    font-family: "Tw Cen MT", Arial, sans serif;    -webkit-transition: all 0.5s ease 0s;    -moz-transition: all 0.5s ease 0s;    -o-transition: all 0.5s ease 0s;    transition: all 0.5s ease 0s    }.widgetSystem a:hover {    background: #000000;    color: #0000CD    }.widgetSystem li {    list-style: none;    color: #CCC;    margin: 5px    }</style></div></div>

_________________________________
NB:
warna hijau di ganti Title yg anda inginkan
warna ungu di ganti dengan url & titelnya yg anda inginkan
warna merah di ganti dengan url background sobat (gambar)

1. Save / Simpan