Cara Menghapus Widget yang Terkunci di Blogger

Setelah mengganti template dari template yang satu ke template yang lain, terkadang ditemukan ada beberapa widget atau gadget yang tidak bisa dihapus. Widget ini dapat dikatakan sebagai widget yang terkunci.

Saat kita ingin menghapus sebuah widget, biasanya kita mengeklik tautan “Edit” atau ikon “Obeng dan Tang” pada widget yang dimaksud. Namun, pada jendela konfigurasi widget tersebut tidak ditemukan tombol “Hapus”. Tidak adanya tombol ini tentu membuat kita kesulitan untuk menghapus tersebut.

Tombol “Hapus” ini dapat kita munculkan kembali dengan cara membuka kunci dari widget tersebut. Ada beberapa langkah yang harus dilakukan untuk membukanya. Untuk lebih jelasnya simak caranya di bawah ini.

1. Masuk ke akun Blogger Anda.

2. Tentukan widget yang terkunci yang Anda ingin hapus. Misalnya, salah satu widget yang terkunci adalah widget “Popular Posts”.

3. Masuk ke menu “Tata Letak” kemudian klik tautan “Edit” pada widget tersebut.

4. Maximize jendela konfigurasi widget tersebut.

5. Perhatikan address bar dari jendela konfigurasi, kemudian cari tahu apa nama widget id dari widget yang dimaksud. Dalam contoh ini, widget id dari gadget tersebut adalah PopularPosts1.

Widget id sebuah gadget

6. Copy widget id tersebut.

7. Masuk ke menu “Template” >> “Edit HTML” >> “Lanjutkan”.

8. Tekan tombol “Ctrl + F” atau tombol “F3” untuk memunculkan fitur pencarian cepat browser lalu paste widget id yang dicopy tadi (PopularPosts1).

9. Selanjutnya akan ketemu kode dari widget tersebut yaitu seperti di bawah ini.

<b:widget id="PopularPosts1" locked="true" title="Popular Posts" type="PopularPosts"></b:widget>

10. Perhatikan kode locked="true", kemudian ganti kata "true" dengan kata "false" sehingga hasilnya menjadi seperti di bawah ini.

<b:widget id="PopularPosts1" locked="false" title="Popular Posts" type="PopularPosts"></b:widget>

11. Klik tombol "Simpan template".

12. Masuk lagi ke halaman "Tata Letak".

13. Klik "Edit" pada widget tersebut.

14. Sekarang tombol "Hapus" sudah ada pada jendela konfigurasi widget yang terkunci tadi.

15. Klik tombol "Hapus" untuk menghapus widget tersebut.

Untuk widget-widget yang lainnya caranya kurang lebih adalah seperti di atas. Yang terpenting adalah cari tahu dulu apa widget id-nya atau judul (title) widget yang terkunci kemudian ubah kata "true" menjadi kata "false".

Cara Membuat Daftar Isi Per Label dengan Sroll Box

Untuk membuat daftar isi per label dengan scroll box di sidebar blog, kita dapat menggunakan dua cara. Cara yang pertama adalah dengan membuatnya secara manual. Sedangkan cara yang kedua kita bisa menggunakan sebuah script. Setiap cara memiliki kelebihan dan kekurangannya masing-masing.

Bila kita membuat daftar isi secara manual, maka kita harus memasukkan link dari judul-judul posting satu per satu. Hal ini akan membutuhkan banyak waktu untuk mengerjakannya jika link judul posting yang harus dimasukkan sudah cukup banyak. Namun, dengan cara manual ini tidak begitu memperlambat loading blog.

Sedangkan jika kita menggunakan sebuah script, maka waktu yang diperlukan akan lebih singkat. Namun, pemasangan script ini berpotensi memperlambat loading blog. Script ini saya dapat dari Blog Viky dengan perubahan di bagian scroll box-nya. Dengan script ini kita dapat membuat daftar isi berdasarkan satu label saja atau beberapa label sekaligus. Script ini akan menempatkan posting terbaru pada urutan teratas.

Untuk membuat daftar isi berdasarkan satu label tertentu saja, silakan perhatikan langkah-langkahnya di bawah ini.

1. Setelah Sobat masuk di Blogger, klik Rancangan > Elemen Laman > Tambah Gadget. Kemudian pilih HTML/JavaScript.

2. Berikan judul, lalu copy kode di bawah ini dan paste di Konten.

<div style="overflow:auto; width:auto; height:100px; padding:5px; border:1px solid #e6e4e3;">

<ol>

<script style="text/javascript">

var numposts = 100;

var standardstyling = true;

</script>

<script type='text/javascript' src='http://mr-form.googlecode.com/files/label-post.js'></script>

<ol>

<script src="http://www.klikmunadi.blogspot.com/feeds/posts/default/-/Jejaring%20Sosial?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script>

</ol>

</ol></div>

• width:auto; menunjukkan lebar scroll box akan mengikuti lebar sidebar.
• height:100px; menunjukkan tinggi scroll box setinggi 100 piksel. Silakan diganti angkanya untuk mengubah tingginya.
• border:1px solid #e6e4e3; menunjukkan garis keliling (border) scroll box bergaya solid setebal 1 piksel berwarna #e6e4e3. Silakan disesuaikan dengan keadaan template Sobat.
• <ol> menunjukkan numbered list, kalau ingin menjadi bullet list silakan diganti dengan <ul>.
• Ganti klikmunadi.blogspot.com dengan alamat blog Sobat.
• Ganti Jejaring%20Sosial dengan label yang Sobat inginkan. Penulisan label harus sesuai dengan yang tertera di blog. Perhatikan huruf besar-kecilnya dan spasi diganti dengan %20.

3. Klik tombol SIMPAN.

4. Pindahkan elemen tadi ke tempat yang Sobat inginkan.

5. Klik tombol SIMPAN.

Script di atas hasilnya akan menjadi seperti di bawah ini.

Jika ingin menampilkan lebih dari satu label, silakan ditambahkan script untuk labelnya. Misalnya saya akan menampilkan label Alexa dan Link maka script-nya akan menjadi seperti di bawah ini.

<div style="overflow:auto; width:auto; height:100px; padding:5px; border:1px solid #e6e4e3;">

<ol>

<script style="text/javascript">

var numposts = 100;

var standardstyling = true;

</script>

<script type='text/javascript' src='http://mr-form.googlecode.com/files/label-post.js'></script>

<h3>Alexa</h3>

<ol>

<script src="http://www.klikmunadi.blogspot.com/feeds/posts/default/-/Alexa?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script>

</ol>
<br/>

<h3>Link</h3>

<ol>

<script src="http://www.klikmunadi.blogspot.com/feeds/posts/default/-/Link?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script>

</ol>

</ol></div>

Hasilnya menjadi seperti di bawah ini.

Alexa

Link

Cara di atas merupakan cara yang menggunakan script. Jika Sobat tertarik untuk menggunakan cara manual seperti yang saya terapkan pada blog ini, silakan simak langkah-langkahnya di bawah ini. Sebelum mengikuti cara ini, silakan Sobat memasang widget daftar isi karya Abu Farhan seperti yang terpasang di blog ini.

1. Buka daftar isi blog Sobat.

2. Blok posting-posting dari label mana yang akan di ambil. Misalnya saya mengambil label Jejaring Sosial juga seperti contoh menggunakan script. Setelah diblok, lalu klik kanan dan pilih Lihat Kode Sumber Teks yang Dipilih. (Saya menggunakan Firefox 5.0)

3. Copy semua teks yang muncul di jendela Sumber DOM yang Dipilih.

4. Masuk ke akun Blogger Sobat.

5. Klik Rancangan > Elemen Laman > Tambah Gadget.

6. Pilih HTML/JavaScript.

7. Beri judul, paste kode tadi di Konten. Silakan diedit dan hapus kata-kata yang tidak diperlukan (seperti kata "New" dan lain-lain) sehingga susunannya akan menjadi seperti di bawah ini.

<ol><li><a href="http://klikmunadi.blogspot.com/2011/06/cara-buat-facebook-page-dan-pasang-like.html">Cara Buat Facebook Page dan Pasang Like Box di Blog</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/05/cara-membuat-akun-facebook.html">Cara Membuat Akun Facebook</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/06/cara-membuat-akun-twitter.html">Cara Membuat Akun Twitter</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/06/cara-membuat-akun-di-salingsapacom.html">Cara Membuat Akun di SalingSapa.com</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/07/cara-menghapus-sebuah-halaman-facebook.html">Cara Menghapus Sebuah Halaman Facebook</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/02/salingsapacom-situs-jejaring-sosial.html">Salingsapa.com, Situs Jejaring Sosial Islami</a></li></ol>

8. Kemudian berikan kode untuk scroll box-nya, sehingga hasilnya akan menjadi seperti ini.

<div style="overflow:auto; width:auto; height:100px; padding:5px; border:1px solid #e6e4e3;">

<ol><li><a href="http://klikmunadi.blogspot.com/2011/06/cara-buat-facebook-page-dan-pasang-like.html">Cara Buat Facebook Page dan Pasang Like Box di Blog</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/05/cara-membuat-akun-facebook.html">Cara Membuat Akun Facebook</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/06/cara-membuat-akun-twitter.html">Cara Membuat Akun Twitter</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/06/cara-membuat-akun-di-salingsapacom.html">Cara Membuat Akun di SalingSapa.com</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/07/cara-menghapus-sebuah-halaman-facebook.html">Cara Menghapus Sebuah Halaman Facebook</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/02/salingsapacom-situs-jejaring-sosial.html">Salingsapa.com, Situs Jejaring Sosial Islami</a></li></ol>

</div>

9. Klik tombol SIMPAN.

10. Pindahkan elemen ke tempat yang Sobat inginkan.

11. Klik tombol SIMPAN.

Hasilnya menjadi seperti di bawah ini.

1. Cara Buat Facebook Page dan Pasang Like Box di Blog
2. Cara Membuat Akun Facebook
3. Cara Membuat Akun Twitter
4. Cara Membuat Akun di SalingSapa.com
5. Cara Menghapus Sebuah Halaman Facebook
6. Salingsapa.com, Situs Jejaring Sosial Islami

Cara Membuat Widget Hanya Tampil di Halaman Posting

Bila pada kesempatan sebelumnya saya membahas bagaimana cara membuat widget hanya tampil di homepage. Maka pada kali ini saya akan membahas mengenai cara membuat widget hanya tampil di halaman posting. Jadi, dengan cara ini widget tidak muncul di halaman beranda atau homepage.

Nah, bila ada widget tertentu pada blog Anda yang ingin ditampilkan hanya di halaman posting, silakan ikuti langkah-langkahnya di bawah ini.

1. Masuk ke akun Blogger Anda.

2. Klik Rancangan > Edit HTML.

3. Klik Download Template Lengkap untuk mem-backup template.

4. Beri tanda centang pada Expand Template Widget.

5. Cari kode widget id untuk judul widget yang ingin ditampilkan hanya di halaman posting. Misalnya, untuk widget yang berjudul Arsip Blog kodenya tampak seperti di bawah ini.

<b:widget id='BlogArchive1' locked='false' title='Arsip Blog' type='BlogArchive'>

<b:includable id='main'>

  <b:if cond='data:title'>

    <h2><data:title/></h2>

  </b:if>

  <div class='widget-content'>

  <div id='ArchiveList'>

  <div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>

    <b:if cond='data:style == &quot;HIERARCHY&quot;'>

     <b:include data='data' name='interval'/>

    </b:if>

    <b:if cond='data:style == &quot;FLAT&quot;'>

      <b:include data='data' name='flat'/>

    </b:if>

    <b:if cond='data:style == &quot;MENU&quot;'>

      <b:include data='data' name='menu'/>

    </b:if>

  </div>

  </div>

  <b:include name='quickedit'/>

  </div>

</b:includable>

6. Selanjutnya tambahkan kode <b:if cond='data:blog.pageType == &quot;item&quot;'> di bawah kode <b:includable id='main'> dan kode </b:if> di atas kode </b:includable> sehingga hasilnya akan menjadi seperti di bawah ini.

<b:widget id='BlogArchive1' locked='false' title='Arsip Blog' type='BlogArchive'>

<b:includable id='main'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>

  <b:if cond='data:title'>

    <h2><data:title/></h2>

  </b:if>

  <div class='widget-content'>

  <div id='ArchiveList'>

  <div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>

    <b:if cond='data:style == &quot;HIERARCHY&quot;'>

     <b:include data='data' name='interval'/>

    </b:if>

    <b:if cond='data:style == &quot;FLAT&quot;'>

      <b:include data='data' name='flat'/>

    </b:if>

    <b:if cond='data:style == &quot;MENU&quot;'>

      <b:include data='data' name='menu'/>

    </b:if>

  </div>

  </div>

  <b:include name='quickedit'/>

  </div>

</b:if>

</b:includable>

7. Klik tombol SIMPAN TEMPLATE.

Cara Membuat Widget Hanya Tampil di Homepage

Dalam membuat blog kurang lengkap rasanya bila kita tidak memasang widget-widget pada sidebar blog. Selain dapat mempermanis tampilan blog, widget-widget tersebut juga mempunyai kegunaannya masing-masing. Namun, bila jika widget yang dipasang sudah cukup banyak dapat membuat loading blog terasa berat. Loading blog yang terlalu lama berpotensi untuk ditinggalkan pengunjung sebelum membaca artikel di blog kita.

Nah, ada salah satu trik yang bisa kita lakukan untuk memperingan loading blog saat pengunjung ingin membaca artikel, yakni dengan membuat beberapa widget yang tidak terlalu penting bagi pengunjung hanya tampil di homepage atau halaman beranda. Bagaimana cara melakukannya? Berikut ini cara membuat widget hanya tampil di homepage atau halaman beranda.

1. Masuk ke akun Blogger Anda.

2. Klik Rancangan > Edit HTML.

3. Klik Download Template Lengkap untuk mem-backup template.

4. Beri tanda centang pada Expand Template Widget.

5. Cari kode widget id untuk judul widget yang ingin ditampilkan hanya di homepage. Misalnya, untuk widget yang berjudul Like Klik Munadi kodenya tampak seperti di bawah ini.

<b:widget id='HTML3' locked='false' title='Like Klik Munadi' 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>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
</b:widget>

6. Kemudian tambahkan kode  <b:if cond='data:blog.homepageUrl == data:blog.url'> di bawah kode  <b:includable id='main'> dan kode </b:if> di atas kode </b:includable> sehingga hasilnya akan menjadi seperti di bawah ini.

<b:widget id='HTML3' locked='false' title='Like Klik Munadi' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

7. Klik tombol SIMPAN TEMPLATE.

Cara Membuat Posisi Widget Rata Tengah di Scroll Box

Memasang widget/gadget di sidebar merupakan hal yang biasa dilakukan para blogger. Selain dapat mempercantik tampilan blog, widget tersebut juga bermanfaat baik bagi pengunjung maupun pemilik blog itu sendiri. Widget-widget itu berisikan informasi-informasi mengenai blog tersebut sesuai dengan kegunaannya masing-masing.

Bila widget-widget yang dipasang di sidebar cukup banyak dapat membuat sesak ruangan di sidebar. Salah satu solusi untuk menghemat tempat di sidebar adalah dengan memasang widget-widget tesebut ke dalam scroll box. Lalu, bagaimana caranya agar posisi widget-widget tersebut di scroll box menjadi rata tengah sehingga terlihat rapi dan sedap dipandang mata?

Nah, berikut ini akan dijelaskan cara membuat posisi widget menjadi rata tengah di scroll box. Seperti dibahas pada posting terdahulu bahwa untuk membuat scroll box di sidebar, diperlukan script seperti di bawah ini.

<div style="overflow:auto; width:100%px; height:200px; padding:10px; border:1px solid #999999;">

ISI/ELEMEN KOTAK

</div>

Agar posisi widget menjadi rata tengah, maka script-nya akan terlihat seperti di bawah ini.

<div style="overflow:auto; width:100%px; height:200px; padding:10px; border:1px solid #999999;">
<center>
<script widget 1><br />
<script widget 2><br />
<script widget 3><br />
<script widget 4><br />
<script widget 5><br />
</center>

</div>

• Ganti script widget dengan script widget yang akan dipasang.
• width:100%px; menunjukkan lebar dari kotak yang diinginkan. Ganti sesuai dengan kebutuhan Anda, misalnya 200px atau 300px. Agar lebih mudah menyesuaikan dengan lebar sidebar tentukan saja nilainya dengan 100%px.
• height:200px; menunjukkan tinggi kotak, dapat diubah sesuai keinginan Anda.

Contoh:
Misalnya, saya mempunyai script widget yang akan dipasang di scroll box, yaitu:

• <a href="http://s06.flagcounter.com/more/1xTU"><img src="http://s06.flagcounter.com/count/1xTU/bg=FFFFFF/txt=000000/border=CCCCCC/columns=2/maxflags=248/viewers=0/labels=1/" alt="free counters" border="0"></a>

Sekarang kita akan masukkan script-script di atas ke script untuk membuat scroll box, maka script-nya menjadi seperti di bawah ini.

<div style="overflow:auto; width:100%px; height:200px; padding:10px; border:1px solid #999999;">

<center>

<a href="http://s06.flagcounter.com/more/1xTU"><img src="http://s06.flagcounter.com/count/1xTU/bg=FFFFFF/txt=000000/border=CCCCCC/columns=2/maxflags=248/viewers=0/labels=1/" alt="free counters" border="0"></a><br />

</center>

</div>

Bila diletakkan di sidebar, maka hasilnya akan tampak seperti di bawah ini.

Untuk memasang scroll box di sidebar, berikut ini langkah-langkahnya:

• Masuk ke akun Blogger
• Klik Rancangan > Elemen Laman > Tambah Gadget.
• Kemudian pilih HTML/JavaScript.
• Berikan judul dan isi kolom Konten dengan script scroll box.
• Klik tombol SIMPAN.
• Atur posisi widget ke tempat yang diinginkan.
• Klik tombol SIMPAN.

Mengetengahkan Widget

Menambahkan elemen widget merupakan suatu hal yang biasa dilakukan para pemilik blog untuk mempercantik tampilan blog mereka. Selain mempermanis tampilan blog, widget juga dapat bermanfaat baik bagi para pengunjung maupun pemilik blog itu sendiri. Seperti widget buku tamu misalnya, widget ini dapat menjadi media interaksi antara pengunjung dan pemilik blog. Selain itu masih banyak lagi widget yang dapat dipasang di blog dengan kegunaannya masing-masing.

Untuk memasang widget-widget tersebut di blog bukanlah merupakan suatu hal yang sulit. Bila sudah mendapatkan script dari widget yang dimaksud maka tinggal diletakkan saja di bagian HTML/JavaScript pada sidebar atau di bagian Edit HTML pada postingan. Setelah disimpan atau diterbitkan maka akan terlihat hasilnya.

Setelah terpasang, posisi atau alignment dari widget tersebut menunjukkan selalu berada di sebelah kiri. Bila hal ini dirasa kurang rapi dan ingin menjadikan widget tersebut berada di tengah-tengah, maka ada cara mudah untuk melakukannya. Caranya adalah dengan menambahkan kode <center> di awal script widget dan kode </center> di akhir script widget tersebut.

Di bawah ini adalah script dari sebuah jam untuk di pasang di blog.

<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="0006-yellow.swf";obj.TimeZone="GMT0700";obj.width=200;obj.height=240;obj.wmode="transparent";showClock(obj);</script>

Bila script di atas tidak diberi kode <center> dan </center> maka hasilnya akan seperti di bawah ini.



Sekarang script tersebut ditambah kode <center> di awal dan kode </center> di akhir maka jadinya akan seperti di bawah ini.

<center><script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="0006-yellow.swf";obj.TimeZone="GMT0700";obj.width=200;obj.height=240;obj.wmode="transparent";showClock(obj);</script></center>

Setelah disimpan atau diterbitkan maka hasilnya akan tampak seperti di bawah ini.