Cara Membuat Blogroll Super Keren Di Blog Buat Pemula

Cara Membuat Blogroll Super Keren Di Blog Buat Pemula

Cara Membuat Blogroll Super Keren Di Blog Buat Pemula

Cara Membuat Blogroll Tukar Link - cara membuat blogroll di blog keren, berbagai cara dilakukan para blogger untuk mendapatkan backlink untuk blognya dan salah satu cara yang bisa digunakan yaitu dengan tukar link dengan blog lain dengan menggunakan blogroll.Tetapi tahukah Anda apa itu blogroll? blogroll adalah daftar link blog eksternal yang dipasang dalam suatu blog, fungsinya selain untuk tukar link juga dapat meningkatkan pagerank karena backlink yang didapatkan.
Cara Membuat Blogroll Super Keren Di Blog Buat Pemula
Selain itu, dengan tukar link dengan blog lain juga dapat mempererat rasa silaturahmi antar blogger, memperkenalkan blog Anda di blog lain, dan bisa menambah visitor blog.Untuk mendapat backlink yang berkualitas, lebih baik Anda bertukar link dengan blog yang mempunyai pagerank tinggi. Karena akan menambah kemungkinan pagerank blog yang Anda miliki akan naik.

Blogroll biasanya ditaruh di sidebar atau di artikel blog, dan untuk membuat blogroll hanya dibutuhkan sedikit kode html sederhana, disini saya siapkan blogroll dengan link tidak terbuka tab baru dan terbuka tab baru, Anda hanya tinggal mengganti alamat yang dituju dengan url .

Cara memuat Blogroll Super Keren Di Blog
1. Masuk ke dasboard blogger.
2. Menuju ke menu Layout.
3. Pilih HTML/Javascript, lalu paste kode berikut pada area HTML.
Lalu masukkan kode berikut:
 Blogroll normal (tidak terbuka tab baru)
 <div style="overflow:auto;width:170px;height:100px;"><ul>
    <li><a href="Alamat Yang Dituju">Judul Blog </a></li>
    <li><a href="Alamat Yang Dituju">Judul Blog </a></li>
    <li><a href="Alamat Yang Dituju">Judul Blog </a></li></ul></div>
Blogroll terbuka tab baru
masukkan kode berikut:
<div style="overflow:auto;width:170px;height:100px;">
<ul>
<li><a href="Alamat Yang Dituju" target="new">Judul Blog</a></li>
<li><a href="Alamat Yang Dituju" target="new">Judul Blog </a></li>
<li><a href="Alamat Yang Dituju" target="new">Judul Blog </a></li>
</ul>
</div>
Blogroll banner atau gambar
masukkan kode berikut:
<div style="overflow:auto;width:170px;height:100px;">
<ul>
<li><a href="Alamat Yang Dituju" target="new"><img src="Url Gambar" height="150" width="200"/></a></li>
<li><a href="Alamat Yang Dituju" target="new"><img src="Url Gambar" height="150" width="200"/></a></li>
</ul>
</div>
Atau Tukar Link Yang Lainnya
<div class="widgetSystem"><div class="nama">Link Sahabat</div><div class="kulit"><a href="Url Blog">Titel</a><a href="Url Blog">Titel</a><a href="Url Blog">Titel</a><a href="Url Blog">Titel</a></div></div><style type="text/css">.widgetSystem {    width: 95%;    padding: 5px;    background: #DDD url(link gambar) no-repeat;    margin: 5px auto;    border: 1px solid #fff;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    border-radius: 5px;    -webkit-box-shadow: 0 0 1px 1px #fff;    -moz-box-shadow: 0 0 1px 1px #fff;    box-shadow: 0 0 1px 1px #fff    }.widgetSystem .nama {    text-align: center;    font-size: 1.5em;    background: #FF0000;    background: rgba(153, 153, 153, 0.6);    padding:5px;    color: #FFF;    font-family: "Times new roman", Arial, sans serif;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    border-radits: 5px    }.widgetSystem .kulit {    background: #FFFFFF;    background: rgba(153, 153, 153, 0.5);    height: 250px;    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: #C71585;    background: rgba(153, 153, 153, 0.7);    padding: 5px;    display: block;    color: #BBB;    text-transform: uppercase;    font-size: 12px;    font-weight: bold;    font-family: "Arial", 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: #1E90FF;    color: #0000CD    }.widgetSystem li {    list-style: none;    color: #CCC;    margin: 5px    }</style>

Keterangan :
  1. Ganti URL BLOG dengan URL blog yang ingin dimasukkan dalam dalam blogroll. Ganti JUDUL LINK sesuai keinginan.
  2. Untuk direction adalah untuk mode pergerakan scroll. Pada mode ini adalah mode blogroll bergerak ke atas. Untuk menggantinya dengan pergerakan ke bawah, ganti kode up dengan kode down. Bisa pula mode bergerak horizontal ke kiri menggunakan kode left dan right untuk bergerak ke kanan.
  3. Untuk height atau tinggi widget juga bisa diatur sendiri.
  4. Catatan, untuk mode bergerak ke bawah atau down, maka kode <br /> dihilangkan.
  5. Akhiri dengan Save. Dan lihat hasilnya akan seperti pada blog sample ini.
Demikian turorial seputar widget blogroll atau blog list yang bisa saya bagikan. Semoga bermanfaat dan selamat mencoba.
#update
Buka Komentar

No comments

Terimakasih untuk semua sahabat yang sudah mampir di blog sederhana ini