Welcome To My Blog , please follow this blog , comment to make this blog better than before , thanks for visit this blog

Jumat, 14 Januari 2011

Cara mengatur letak widget Dan gadget pada blog

Kok kalau saya pasang widget dan gadget seperti Gambar, Cbox, Calender, Jam, Text, Animasi, eh posisinya kok selalu kekiri?
Intinya,gimana si caranya mengatur posisi widget.? Misal gambarnya mau di taruh di tengah,kiri atau kanan.? Oh itu mah gampang,berikut caranya:




Untuk mengatur posisi widget dan gadget. kalian dapat menggunakan script ini:
Untuk WordPress umumnya menggunakan kode ini:
<div align=”center”>script code kalian</div>
Untuk Blogspot menggunakan kode ini:
<center>script code kalian</center>
Keterangan: Text yang berwarna merah adalah kode perintah, sedangkan text yang dicetak tebal adalah tempat dimana kalian memasukkan code widget,berikut contohnya:

1.Center

<div align=”center“>
<img width=”70″ src=”http://tbn1.google.com/images?q=tbn:bWdJxf-EZIm-rM:http://www.setimes.com/cocoon/setimes/images/2006/09/11/NATASAphoto1.jpg” height=”70″>
</div>
Tampilan pada browser akan menempatkan widget/image di tengah(center)

2.Left

<div align=”left“>
<img width=”70″ src=”http://tbn1.google.com/images?q=tbn:bWdJxf-EZIm-rM:http://www.setimes.com/cocoon/setimes/images/2006/09/11/NATASAphoto1.jpg” height=”70″>
</div>
Tampilan pada browser akan menempatkan widget/image di kiri(left)

3.Right

<div align=”right“>
<img width=”70″ src=”http://tbn1.google.com/images?q=tbn:bWdJxf-EZIm-rM:http://www.setimes.com/cocoon/setimes/images/2006/09/11/NATASAphoto1.jpg” height=”70″>

</div>
Tampilan pada browser akan menempatkan widget/image di right(kanan)
Seperti yang saya katakan tadi,kalian dapat mengatur posisi widget anda seperti calender,jam,gambar,video,cbox,dsb.(Sebaiknya gunakan Firefox untuk tampilan yang lebih baik).
Read More...

Cara menyembunyikan judul widget di blog

Beberapa waktu lalu Blogger mengeluarkan kebijakan baru, dimana setiap menambah/membuat widget di sidebar blogspot harus menyertakan judul alias pada kotak judul tidak boleh dikosongkan dan jika dikosongkan maka akan keluar pesan error.


 
Nah jika Anda tidak menginginkan judul widget tampil di sidebar blog, caranya cukup mudah dan setidaknya ada 2 (dua) cara untuk menyembunyikan atau menghilangkan judul widget tersebut.


Berikut ini 2 (dua)
Cara Menyembunyikan Judul Widget di Blogspot yaitu:
  1. Menghapus Kode Perintah yang berfungsi untuk menampilkan judul widget;
  2. Membuat/Menambah Kode CSS agar judul widget tidak ditampilkan;


Cara Menghapus Kode Perintah yang berfungsi untuk menampilkan judul widget, sebagai berikut:
  1. Login ke Blogspot => klik Rancangan/Design => pilih Edit HTML, kasih centang pada kotak Expand Template Widget;
  2. Cari Judul Widget yang akan disembunyikan, misalnya "LINK BANNER SAHABAT", lalu perhatikan kode-kode yang menyertainya, contohnya seperti ini:
    <b:widget id='HTML4' locked='false' title='LINK BANNER SAHABAT' type='HTML'>
    <b:includable id='main'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>

    </b:if>
  3. Hapuslah kode yang ini: <h2 class='title'><data:title/></h2>;
  4. Simpan/Save Template, selesai.


Jika Anda tidak ingin menghapus kode perintah, maka Anda bisa menggunakan cara kedua yaitu Membuat/Menambah Kode Css, sebagai berikut:
  1. Login ke Blogspot => klik Rancangan/Design => pilih Edit HTML, kasih centang pada kotak Expand Template Widget;
  2. Cari Widget ID untuk judul widget yang akan disembunyikan, misalnya Widget ID untuk "LINK BANNER SAHABAT" ini adalah HTML4. Coba perhatikan sekali lagi struktur kode di bawah ini:
    <b:widget id=' HTML4' locked='false' title='LINK BANNER SAHABAT'
  3. Selanjutnya cari kode ]]></b:skin>, lalu diatasnya tambahkan Kode Css seperti ini:
    #HTML4 .title {display:none}

    Keterangan:
    Jika Anda ingin menyembunyikan judul widget lebih dari satu, Anda tinggal menambahkan Widget ID dari judul widget dimaksud di depan kode .title {display:none} dipisahkan dengan koma (,) contohnya seperti ini:
    #HTML4 .title, #HTML5 .title, #HTML6 .title {display:none}
  4. Simpan/Save Template, selesai dan lihat hasilnya.


Read More...