Mengganti blog template tanpa kehilangan widget
Banyak pengalaman duka tentang sebuah blog yang harus kehilangan penampilan terbaiknya ketika pemilik mencoba untuk mengganti template. Pergantian template oleh sebahagian bloger agaknya menjadi sebuah keharusan, karena ia muncul dari rasa cinta kita kepada blog itu sendiri. Tapi mestikah kita mengorbankan penampilan blog yang sudah ditata sejak lama hanya untuk sebuah ego memiliki blog yang lebih indah. Kita berikan solusinya!
Ada rasa jemu ketika sebuah blog harus tampil monotan sepanjang masa. Apalagi jika pemilik blog sering berkunjung ke blog lain. Hmm...keinginan itu semakin menggebu-gebu. Belum lagi adanya penawaran yang menggiurkan dari penyedia template gratis. Semakin menggiurkan.
Satu pengalaman buruk yang paling umum terjadi ketika dilakukan migrasi template adalah kehilangan widget dan tata letak yang berantakan. Padahal, memasang dan menata widget bukanlah pekerjaan yang mudah, bahkan telah memakan banyak waktu sampai bertahun-tahun. Kini Anda tidak perlu terlalu risau. Tutorial update akan membantu bagaimana cara mempertahankan widget template lama agar tampil kembali pada template baru.
Berikut ini adalah sebuah teknik atau cara berganti template yang tergolong aman dan telah terbukti berhasil :
1. Simpan template asli.
Anda harus menyimpan file XML template asli sebelum melakukan tindakan apapun. Ini sebuah keharusan untuk berjada-jaga bila mana Anda gagal menampilkan template baru, sehingga Anda masih bisa kembali menggunakan template asli.
2. Gunakan teks editor.
Jangan melakukan perubahan kode secara langsung pada saat berada di halaman edit HTML Blogger. Hal ini dapat membuat blog anda menjadi berantakan. Gunakanlah teks editor yang sesuai untuk mengolah file XML, seperti Notepad++Installer.exe . Dapatkan dengan cara download gratis di Notepad++ .
3. Buka file XML template asli dan yang baru pada teks editor.
Buka file XML template asli dan baru pada saat bersamaan. Pusatkan perhatian hanya pada widget. Anda perlu menyalin kode widget dari template asli dan menyisipkan ke yang baru. Anda tidak perlu pusing dengan bentuk kodenya, tetapi yang perlu diketahui adalah dimana kode widget itu berada.
4. Kenali tempat dimana kode-kode terletak
Perhatikan gambar di bawah ini, klik pada gambar untuk melihat lebih jelas.
Perhtikan tag <body> Sebahagian besar kode yang terletak di atas tag ini adalah jenis CSS, yaitu kode untuk mengatur tampilan blog Anda, seperti tampilan jenis huruf dan warna. Jangan merubah, menyalin atau menyisipkan sesuatu di atas atau sebelum tag ini.
Kode yang terletak di bawah tag <body> adalah kode XML utama blog Anda. Bahagian ini adalah tempat mengatur masalah Layout seperti dimana letak header, sidebar dan widget. Bahagian ini juga mengontrol aliran data yang masuk dari Blogger ke dalam blog. Di sinilah semua kode widget blog Anda yang akan di salin dan disisipkan berada.
Seluruh widget yang telah Anda masukkan ke dalam blog adalah merupakan kode yang terletak antara tag <b:widget> ... </b:widget>. Semua tag <b:widget> harus berada di dalam lokasi tag <b:section> ... </b:section> Strukturnya akan terlihat sebagai berikut :
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' showaddelement='no'>
<b:widget id='LinkList1' locked='true' title='Linkbar' type='LinkList'>
...
... some additional codes here ...
...
</b:widget>
<b:widget id='HTML1' .....;
...
</b:widget>
<b:widget id='Image1' .....;
...
</b:widget>
</b:section>
</div>
Contoh di atas adalah bagaimana kode widget ditampilkan dalam file XML template blog Anda. Lokasi utama widget ditandai dengan label div id. Pada contoh di atas lokasinya berada pada div id=sidebar-wrapper. Di bawah div id terdapat tag b:section. Semua widget harus berada dalam tag b:section.
Anda tidak perlu cemas bila merasa tidak begitu memahami apa itu div id atau b:section. Yang terpenting Anda ketahui adalah tag b:widget. Perlu diketahui bahwa Anda dapat memasukkan banyak widget yang Anda inginkan di dalam tag b: section.
Berikut ini adalah contoh sebenarnya dari widget yang tertanam di dalam tag b:section. Lokasinya berada pada sidebar-wrapper. Artinya adalah bahwa widget diletakkan pada salah satu sidebar dalam blog Anda. Jika Anda melihat widget dengan label id=’image1’ menandakan bahwa widgetnya adalah sebuah gambar. Klik pada gambar untuk melihat lebih jelas
Satu hal yang harus dipahami adalah bahwa kode widget selalu dimulai dengan tag <b:widget> dan ditutup dengan tag </b:widget> Dan ketika menyalin dan menyisipkan atau copy/paste harus selalu diingat bahwa widget harus diletakkan antara tag pembuka <b:section>dengan tag penutup </b:section>
Berikut ini adalah sebuah contoh lain. Widget yang ditanam adalah widget yang mengandung Linklist, yaitu widget yang mempunyai tautan ke sebuah alamat. Anda tidak perlu mengetahui kodenya, sebab kita tidak memerlukan perubahan apapun di sini. Klik pada gambar untuk melihat lebih jelas.
5. Copy dan paste widget ke dalam file template baru
Teliti seluruh widget yang ingin dipertahankan dalam blog dengan template baru. Lihat lokasinya pada template lama, yaitu semuanya berada antara tag pembuka <b:widget> dengan tag penutup </b:widget> Copy semua widget yang akan dipertahankan dan paste pada template baru di antara tag <b:section> pada lokasi yang Anda inginkan. Ingat, tag b:widget dan tag b:section harus ditutup dengan benar.
Jika Anda tidak tahu lokasi div id tempat menyisipkan widget tersebut, maka tempatkan saja di sembarang div id, tetapi harus berada dalam sebuah tag b:setion. Ia akan ditampilkan sebagai sebuah widget seperti terlihat pada halaman Layout < Page Element seperti gambar berikut. Untuk mengatur kembali posisinya, Anda tinggal menggeser atau drag dan drop ke lokasi yang diinginkan.
6. Up-load file template baru.
Setelah semua widget telah di copy/paste ke template baru, maka Anda sudah dapat melakukan up-load ke dalam blog Anda.
7. Masuh ada keraguan?
Jika Anda ragu untuk melakukan perubahan dengan cara ini, lakukan terlebih dahulu uji coba pada blog lain. Anda perlu membuat sebuah blog yang khusus digunakan untuk melakukan berbagai uji coba. Jika semua berjalan lancer, maka tidak perlu ragu lagi.
Tutorial Update mengucapkan selamat mencoba!
Ada rasa jemu ketika sebuah blog harus tampil monotan sepanjang masa. Apalagi jika pemilik blog sering berkunjung ke blog lain. Hmm...keinginan itu semakin menggebu-gebu. Belum lagi adanya penawaran yang menggiurkan dari penyedia template gratis. Semakin menggiurkan.
Satu pengalaman buruk yang paling umum terjadi ketika dilakukan migrasi template adalah kehilangan widget dan tata letak yang berantakan. Padahal, memasang dan menata widget bukanlah pekerjaan yang mudah, bahkan telah memakan banyak waktu sampai bertahun-tahun. Kini Anda tidak perlu terlalu risau. Tutorial update akan membantu bagaimana cara mempertahankan widget template lama agar tampil kembali pada template baru.
Berikut ini adalah sebuah teknik atau cara berganti template yang tergolong aman dan telah terbukti berhasil :
1. Simpan template asli.
Anda harus menyimpan file XML template asli sebelum melakukan tindakan apapun. Ini sebuah keharusan untuk berjada-jaga bila mana Anda gagal menampilkan template baru, sehingga Anda masih bisa kembali menggunakan template asli.
2. Gunakan teks editor.
Jangan melakukan perubahan kode secara langsung pada saat berada di halaman edit HTML Blogger. Hal ini dapat membuat blog anda menjadi berantakan. Gunakanlah teks editor yang sesuai untuk mengolah file XML, seperti Notepad++Installer.exe . Dapatkan dengan cara download gratis di Notepad++ .
3. Buka file XML template asli dan yang baru pada teks editor.
Buka file XML template asli dan baru pada saat bersamaan. Pusatkan perhatian hanya pada widget. Anda perlu menyalin kode widget dari template asli dan menyisipkan ke yang baru. Anda tidak perlu pusing dengan bentuk kodenya, tetapi yang perlu diketahui adalah dimana kode widget itu berada.
4. Kenali tempat dimana kode-kode terletak
Perhatikan gambar di bawah ini, klik pada gambar untuk melihat lebih jelas.
Perhtikan tag <body> Sebahagian besar kode yang terletak di atas tag ini adalah jenis CSS, yaitu kode untuk mengatur tampilan blog Anda, seperti tampilan jenis huruf dan warna. Jangan merubah, menyalin atau menyisipkan sesuatu di atas atau sebelum tag ini.
Kode yang terletak di bawah tag <body> adalah kode XML utama blog Anda. Bahagian ini adalah tempat mengatur masalah Layout seperti dimana letak header, sidebar dan widget. Bahagian ini juga mengontrol aliran data yang masuk dari Blogger ke dalam blog. Di sinilah semua kode widget blog Anda yang akan di salin dan disisipkan berada.
Seluruh widget yang telah Anda masukkan ke dalam blog adalah merupakan kode yang terletak antara tag <b:widget> ... </b:widget>. Semua tag <b:widget> harus berada di dalam lokasi tag <b:section> ... </b:section> Strukturnya akan terlihat sebagai berikut :
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' showaddelement='no'>
<b:widget id='LinkList1' locked='true' title='Linkbar' type='LinkList'>
...
... some additional codes here ...
...
</b:widget>
<b:widget id='HTML1' .....;
...
</b:widget>
<b:widget id='Image1' .....;
...
</b:widget>
</b:section>
</div>
Contoh di atas adalah bagaimana kode widget ditampilkan dalam file XML template blog Anda. Lokasi utama widget ditandai dengan label div id. Pada contoh di atas lokasinya berada pada div id=sidebar-wrapper. Di bawah div id terdapat tag b:section. Semua widget harus berada dalam tag b:section.
Anda tidak perlu cemas bila merasa tidak begitu memahami apa itu div id atau b:section. Yang terpenting Anda ketahui adalah tag b:widget. Perlu diketahui bahwa Anda dapat memasukkan banyak widget yang Anda inginkan di dalam tag b: section.
Berikut ini adalah contoh sebenarnya dari widget yang tertanam di dalam tag b:section. Lokasinya berada pada sidebar-wrapper. Artinya adalah bahwa widget diletakkan pada salah satu sidebar dalam blog Anda. Jika Anda melihat widget dengan label id=’image1’ menandakan bahwa widgetnya adalah sebuah gambar. Klik pada gambar untuk melihat lebih jelas
Satu hal yang harus dipahami adalah bahwa kode widget selalu dimulai dengan tag <b:widget> dan ditutup dengan tag </b:widget> Dan ketika menyalin dan menyisipkan atau copy/paste harus selalu diingat bahwa widget harus diletakkan antara tag pembuka <b:section>dengan tag penutup </b:section>
Berikut ini adalah sebuah contoh lain. Widget yang ditanam adalah widget yang mengandung Linklist, yaitu widget yang mempunyai tautan ke sebuah alamat. Anda tidak perlu mengetahui kodenya, sebab kita tidak memerlukan perubahan apapun di sini. Klik pada gambar untuk melihat lebih jelas.
5. Copy dan paste widget ke dalam file template baru
Teliti seluruh widget yang ingin dipertahankan dalam blog dengan template baru. Lihat lokasinya pada template lama, yaitu semuanya berada antara tag pembuka <b:widget> dengan tag penutup </b:widget> Copy semua widget yang akan dipertahankan dan paste pada template baru di antara tag <b:section> pada lokasi yang Anda inginkan. Ingat, tag b:widget dan tag b:section harus ditutup dengan benar.
Jika Anda tidak tahu lokasi div id tempat menyisipkan widget tersebut, maka tempatkan saja di sembarang div id, tetapi harus berada dalam sebuah tag b:setion. Ia akan ditampilkan sebagai sebuah widget seperti terlihat pada halaman Layout < Page Element seperti gambar berikut. Untuk mengatur kembali posisinya, Anda tinggal menggeser atau drag dan drop ke lokasi yang diinginkan.
6. Up-load file template baru.
Setelah semua widget telah di copy/paste ke template baru, maka Anda sudah dapat melakukan up-load ke dalam blog Anda.
7. Masuh ada keraguan?
Jika Anda ragu untuk melakukan perubahan dengan cara ini, lakukan terlebih dahulu uji coba pada blog lain. Anda perlu membuat sebuah blog yang khusus digunakan untuk melakukan berbagai uji coba. Jika semua berjalan lancer, maka tidak perlu ragu lagi.
Tutorial Update mengucapkan selamat mencoba!
3 comments:
terimakasih infonya
masih agak agak bingung sih
tapi nanti aku coba
permisi mas saya mau tanya
tempat biasa saya masang widget tiba2 hilang mas
blogger saya menggunakan 3 kolom tapi tadi saya lihat tiba2 gak ada tempat saya untuk menambah widget gak tau kenapa,..
mohon bantuannya
klo misal di perlukan saya bisa kasih screenshoot nya
terima kasih
terimakasih infonya, artikelnya lengkap dan membantu, tadinya aku bingung widget tag id itu ada dimana he2x..
Post a Comment