Cara Meletakan Widget di Sudut Blog

Salam sukses selalu buat sobat semua, Belajar Komputer Melalui Internet saat ini akan sedikit membahas tentang Cara Meletakan Widget di Sudut Blog dan semoga artikel ini bermanfaat.


Cara Meletakan Widget di Sudut Blog ini merupakan salah satu trik untuk meringankan loading dan sekaligus memperindah tampilan blog. kenapa saya katakan untuk meringankan loading? karena dengan cara ini kita bisa menyimpan kode widget tersebut berada dalam akhir tag body tepatnya diatas kode </body>, sehingga pemanggilan widget tersebut akan dilakukan setelah keseluruhan isi dalam blog tersebut dimuat. namun bila ingin dimuat secara normal bisa kita letakan didalam Tambah gadget HTML/javascript juga. widget ini akan selalu nampak di sudut blog sehingga diusahakan meletakannya pada ruang yang tidak akan mengganggu isi blog.

Berikut kode untuk Cara Meletakan Widget di Sudut Blog;
<div style="position: fixed; bottom:0; right: 0;">
------- Kode widget disini--------------------
</div>
Penjelasan :
Sobat perhatikan kode yang berwarna kuning, itu merupakan kode posisi widget yang akan selalu kelihatan atau tidak akan mengikuti scroll.
Perhatikan kode warna merah, itu letak widget dan sobat bisa menggantinya dengan kode berikut;
  • bottom:0; right:0 berarti ada di Sudut bawah sebelah kanan
  • bottom:0; left:0 berarti ada di Sudut bawah sebelah kiri
  • top:0; right:0 berarti ada di Sudut atas sebelah kanan
  • top:0; left:0 berarti ada di Sudut atas sebelah kiri
Sebagai contoh untuk meletakan widget Histats disudut bawah sebelah kiri :
<div style="position: fixed; bottom:0; left: 0;">
<script type='text/javascript'>document.write(unescape(&quot;%3Cscript src=%27http://s10.histats.com/js15.js%27 type=%27text/javascript%27%3E%3C/script%3E&quot;));</script>
<a href='/' target='_blank' title='counter'><script type='text/javascript'>try{Histats.start(1,1924664,4,604,110,55,&quot;00011111&quot;);Histats.track_hits()}catch(err){};</script></a>
</div>
Untuk penyimpanan kode ini bisa sobat letakan pada tambah gadget HTML/javascript pada halaman tata letak atau untuk memaksimalkan loading sobat bisa letakan kode tersebut tepat diatas kode </body>, namun untuk peletakan di atas kode </body> beberapa widget harus di parse terlebih dahulu. buat parse kode silahkan DISINI
Bila sobat tidak mau repot dengan cara pemasangan diatas kode </body> maka sobat usahakan saja peletakan kode pada tambah gadget HTML/javascript berada paling bawah sekali atau pada bagian footer.

Tips lain Cara Meletakan Widget di Sudut Blog, untuk pemasangan widget lebih dari satu maka saya sarankan menggunakan kode tabel sehingga hasil yang diharapkan akan maksimal dan sekaligus juga kita tidak usah mengatus posisi berulang. contoh:

Untuk menderetkan dari atas kebawah:
<table style='position: fixed; bottom: 0px; left: 0px;'>
<tr><td>
----Kode widget 1 disini-----
----Kode widget 2 disini-----
----Kode widget 3 disini-----
</td></tr>
</table>

Untuk menderetkan dari kiri ke kanan:
<table style='position: fixed; bottom: 0px; left: 0px;'>
<tr><td>
----Kode widget 1 disini-----
</td></tr>
<tr><td>
----Kode widget 2 disini-----
</td></tr>
<tr><td>
----Kode widget 3 disini-----
</td></tr>
</table>
Demikian cara  Meletakan Widget di Sudut Blog, buat sobat yang mau mencoba semoga berhasil. sobat bisa meletakan widget apa saja dengan cara ini, sobat mau meletakan tulisan atau gambar juga bisa.atau sobat mau membuat widget dengan show/hide baca di Cara Membuat Box show/hide untuk widget

Mungkin sampai disini dulu Belajar Komputer Melalui Internet tentang Cara Meletakan Widget di Sudut Blog kali ini, semoga bermanfaat bagi Anda.

DAPATKAN ARTIKEL VIA EMAIL

Masukan Alamat Email Sobat:

Delivered
feedburner

Dipublish oleh : Abdul Kohar - Jatinangor Rating 5 Belajar Komputer Melalui Internet, Updated at: 10:46

8 komentar :

  1. mohon maaf buat Lukist, sobat memasukan URL pada nama sobat salah sehingga terpaksa komentar sobat saya hapus karena ini akan menjadikan brokenlink di blog saya.... sobat menuliskan URL http://eastjavavlogs.blogspot.com/

    BalasHapus
  2. Wahh,,, sangat bermanfaat ini sobb,,, senang rasanya karna ada tanggapan dr koment saya sebelumnya,, thx sobbb..

    BalasHapus
  3. templatenya bagus kang, jadi pengen juga template ini

    BalasHapus
  4. contohnya seperti yang ada di blog ini ya/?? paling pojok sebelah kanan bawah itu mas??

    BalasHapus
  5. sob.. infox utk show/hide kotak komentar ya.....

    BalasHapus
Silahkan Tinggalkan jejak sobat, bila mau menggunakan emotion silahkan klik emotionnya kemudian copy dengan ctrl+c dan paste kodenya didalam kotak komentar...

close
GUESTBOOK
Google PageRank Checker Powered by  MyPagerank.Net
backlink
Dashboard
| Copyright © 2012 |
| Belajar Komputer Melalui Internet |
| Desain by: Abdul Kohar | Powered by: Blogger |