Wednesday, 23 January 2013

Cara Membuat Halaman Bloglist Statis

Bloglist Widget pada Blogspot adalah sebuah widget yang sangat berguna untuk saling bertukar link antara sesama blogger. Dengan beragam pilihan tampilan yang menarik dan link dofollow tentunya widget ini sangat banyk digunakan oleh blogger untuk keperluan bertukar backlink.

Namun adakalanya penggunaan widget ini dapat memberikan efek negatif pada blog, seperti:
  1. memberatkan loading blog apabila setiap link menggunakan "enable image", 
  2. merusak tampilan blog apabila banyak link berjajar secara vertikal dari atas ke bawah (cara seperti ini dapat diantisipasi dengan menggunakan css; yaitu dengan meletakkan kode .blog-list-container{height:250px;overflow:auto} diatas ]]></b:skin>),
  3. dan merusak posisi blog dalam serp apabila jumlah link dalam bloglist terlalu banyak; sebaiknya jumlah link dalam sebuah halaman blog tidak lebih dari 100 links*.
Dengan meletakkan Widget Bloglist pada sebuah Halaman Statis, maka banyak hal yang didapatkan dan meminimalisir efek negatif tersebut :)

Wallpaper Kreatif
source: http://madnesslab.deviantart.com/art/Be-Creative-Wallpaper-89392128


Cara Membuat Widget Bloglist Pada Halaman Static Blogspot

Langkah Pertama:
Buatlah sebuah halaman kosong dan jangan tuliskan apapun didalamnya, serta non-aktifkan kotak komentar.

Create Blank Static Page In Blogger - Fauzi Blog


Langkah Kedua:
Setting Layout dan letakkan Bloglist Widget dibawah Posting Blog

Layout Setting In Blogspot - Fauzi Blog
 


Langkah Ketiga:
Edit HTML Template, Expand Widget Templates dan kemudian - CTRL+F BlogList1


Langkah Keempat:
Arahkan BlogList1 hanya pada halaman kosong yang telah dibuat sebelumnya.

Letakkan  Blogspot Conditional Tags Url

<b:if cond='data:blog.url == &quot;http://fau2i.blogspot.com/p/blog-list.html&quot;'>

dibawah

<b:includable id='main'>

Dan tutup kondisi itu dengan

</b:if>

diatas

</b:includable>

<b:widget id='BlogList1' locked='false' title='' type='BlogList'>
<b:includable id='main'>
<b:if cond='data:blog.url == &quot;http://fau2i.blogspot.com/p/blog-list.html&quot;'>
<style>
.blog-list-container img{float:left;margin:10px}
.blog-list-container li{border:1px solid #dedede;box-shadow:0 1px 2px rgba(0,0,0,.3);margin:10px 0}
.blog-list-container .item-content{line-height:2em}
#main-wrapper{width:100%}
#sidebar-wrapper{display:none}
</style>
.......................
.......................
.......................
.......................
.......................
.......................
.......................
.......................
</b:if>
</b:includable>
</b:widget>

Langkah Kelima:

Jika berhasil, maka akan menjadi seperti Halaman Blog List ini :D

Fauzi Blog Blog List Page


Langkah Keenam:

Selamat Mencoba :D

No comments:

Post a Comment