Gadget HTML memang bermasalah ketika harus mengalami lintas template. Mungkin Anda sering mengalami,
backup template Anda, namun ketika dipasang di blog lain template tidak se normal yang Anda duga. Banyak gadget hilang atau berantakan.
Nah, biasanya ini terjadi pada gadget-gadget HTML (Gadget yang ditambahkan melalui tata letak, Add gadget > HTML gadget.)
1. Bisakah Mempertahankan Isi Gadget HTML? Beberapa kali melakukan percobaan tetap saja saya kehilangan isi pada gadget HTML, ketika
backup-an
template digunakan di blog yang lain. Yang bertahan hanyalah
title gadget, sementara isinya hilang atau berpindah acak ke kolom gadget HTML yang lain. Ini menjawab pertanyaan mengapa ketika Anda menggunakan template-template
super custom bergaya
magazine atau
news dari
simplex misalnya, maka para penyedia template akan melengkapinya dengan tutorial manual pengisian gadget-gadget HTML.
Intinya isi gadget HTML tidak bisa bertahan, jadi jika Anda ingin
back-up template, untuk gadget-gadget HTML sebaiknya di
back-up manual. Dengan cara pergi ke tata letak > Edit gadget HTML yang Anda inginkan, kemudian copy dan save isi gadget tersebut ke notepad, ms word atau program lainnya.
2. CSS Tertentu Untuk Gadget HTML Gadget-gadget HTML memiliki id
HTML1,
HTML2,
HTML3 dan seterusnya. Misalkan Anda meletakkan gadget HTML di sidebar, maka Anda dapat melakukan kustomisasi
CSS khusus pada gadget HTML tertentu agar berebeda dengan gadget-gadget lain di sidebar. (Gadget-gadget pada sidebar akan mengikuti CSS sidebar, misalkan title akan otomatis mengikut CSS
.sidebar h2, isi akan mengikuti
.sidebar .widget dan lain-lain)
Nah, untuk membuat CSS tertentu Anda bisa menambahkan CSS
selector #HTML1 atau #HTML2 atau #HTML3 dan seterusnya. Letakkan di atas
]]></b:skin>.
Contoh penulisannya sebagai berikut:
#HTML1 {font-size: 12 px; background: #fff} #HTML1 h2 {font-family: Arial} Untuk mengetahui ID Widget silahkan baca:
Cara Mudah Mengetahui ID Widget 3. Mempertahankan CSS Gadget HTML Selanjutnya, pertanyaannya adalah bagaimana mempertahankan CSS dari gadget HTML?.
Misal kita membuat CSS untuk gadget
HTML1 pada blog A, kemudian kita backup/download template kita. Template tadi ingin kita terapkan di blog yang lain, misal blog B. Padahal di blog B sudah ada gadget
HTML1-nya. Ini berarti bisa terjadi tabrakan dua gadget
HTML1.
Karena hal ini, maka otomatis gadget HTML1 pada template backup-an ketika dipasang di blog B akan berubah menjadi HTML2. Padahal seperti kita tahu CSS-nya menggunakan selector
#HTML1. Alhasil, CSS selector salah sasaran akan mengatur gadget HTML1 yang asli ada di blog B, padahal yang kita inginkan CSS tersebut mengatur HTML1 pada template
back-up yang knii sudah berganti
id menjadi HTML2.
Permasalahan seperti ini tidak akan kita temukan jika kita tidak akan menggunakan template editan kita untuk banyak blog. Untuk mengatur Gadget HTML tertentu, cukup gunakan cara seperti pada poin nomer 2.
Namun, jika kita ingin membagikan template editan kita kepada
umum atau akan digunakan untuk beberapa blog kita, maka gunakan pengaturan CSS seperti berikut:
Pada Kolom Edit HTML Template, gadget HTML akan berbentuk kode seperti berikut:
<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget> - Tidak usah mengedit ID gadget HTML1
- Untuk pengaturan judul gadget HTML, ubahlah '
title' menjadi id unik terserah Anda, misalkan 'toptabview'. Berarti baris title menjadi:
<h2 class='toptabview'><data:title/></h2>. - Untuk pengaturan gadget HTMl, seperti background gadget dll, ubahlah '
widget-contet' menjadi id unik misalkan 'toptabview'. Berarti baris widget-content menjadi:
<div class='toptabview'> - Terakhir tambahkan CSS dengan format:
.toptabview h2 {font-size:.......;} .toptabview {background:...;} Dengan cara tersebut, meski id gadget HTML berubah, maka CSS tidak akan salah sasaran. Hanya berbagi pengetahuan, jika Anda mengetahui lebih, tolong di share ya di kolom komentar...
NB: Jiak belum mengenal CSS, bisa dipelajari di:
Belajar CSS.
Info Article
Backup Gadget HTML Blogger - Blog Konsultasi 
