Home / blogging /

Tips Editing Template Blogspot

Kang Andre
blogging
17 Februari 2012
Belum ada komentar
Tips editing Template Blogspot terinspirasi dari banyak kasus beberapa blogger khususnya pemula gagal mengedit kode/script template blogspot yang akhirnya membuat tampilan blog nya tampak "hancur". Banyak alasan blogger ingin mengubah template blogspot, mulai ingin tampilan blognya berbeda dengan yang lain sampai supaya template seofriendly. Tema-tema blogspot yang siap download pun bertebaran di internet baik yang gratis maupun berbayar serta tutorial tentang editing tempalate blogspot banyak diulas.

editing template blogspot
Blogspot
Blogspot ber-platform HTML-XML yang sedikit berbeda dengan mesin web lain seperti PHP, ASP, dll. Namun template blogspot juga mendukung tampilan CSS dan Javascript. Blogpot memberikan kebebasan penggunanya melakukan editing template blogspot dengan adanya fitur edit template HTML agar tampilan dan fungsi sesuai dengan keinginannya. Kita dapat dengan bebas melakukan perubahan, modifikasi, mendesain ulang, menambahkan fitur dari pihak ketiga dan lain-lain. Fitur edit HTML Blogspot bisa diakses melalui dashboard > design/rancangan > edit HTML. 


Tips editing Template Blogspot 

Sebelum melakukan editing template blogspot sebaiknya memahami elemen dasar template blogspot yang pada dasarnya hampir sama dengan elemen dasar website HTML lain. Hanya saja template blogspot menggunakan hanya 1 file XML untuk semua elemen halaman blog mulai dari head, body sampai CSS sehingga file terlihat panjang dan mempersulit editing bagi yang belum terbiasa. Berbeda dengan PHP yang dapat dipisah antara file head, body, css, dsb.

Elemen penting pada template Blogspot yaitu:
  1. HTML tag, diawali dengan <html> dan diakhiri dengan </html> berfungsi untuk menandakan keseluruhan halaman. 
  2. Head tag, diawali dengan <head> dan diakhiri dengan </head> merupakan bagian dari keseluruhan head halaman, di dalamnya terdapat pengaturan-pengaturan tema, termasuk tampilan (CSS). 
  3. Body tag, diawali dengan <body> dan diakhiri dengan </body> merupakan isi dari halaman website/blog yang akan ditampilkan ke pengunjung, di dalamnya terdapat isi halaman website, termasuk widget yang menjadi bagian dari isi halaman. 
  4. CSS, berada pada bagian head, terletak diantara <b:skin> <![CDATA[ dan ]]></b:skin>. Merupakan elemen pengatur tampilan halaman untuk warna, font, posisi, lebar luas, dan masih banyak lagi. 
  5. Javascript. Javascript merupakan elemen yang berisi perintah-perintah tertentu. Ada dua jenis javascript internal berada dalam template dan eksternal berada host/url lain.  Letak javascript relatif tergantung jenisnya.
  • Catatan: Khusus tag-tag XML, untuk template Blogspot dan HTML editor setelah tahun 2007, selalu diakhiri dengan /, Misal: <data:post.body/>. 

 Tips editing Template Blogspot berikut merupakan dasar dalam melakukan editing Template HTML agar hasilnya sesuai dengan yang diinginkan. Semoga sedikit membantu. 
  • Biasakanlah mem-backup template yang sudah ada terlebih dahulu sebelum melakukan editing. Jika ada kesalahan dapat dengan mudah mengembalikan template seperti semula. 
  • Kalau perlu Centang "expand widget templates" jika tidak bagian-bagian body yang mengandung widget tersebut akan "disembunyikan" oleh Blogspot karena memang untuk tujuan keamanan. 
  • Untuk mempermudah mengubah isi script/kode, gunakan text editor notepad, wordpad atau yang lainnya. Copy semua script template yang ada kemudian paste ke editor teks. Setelah melakukan pengeditan script dan memastikan semuanya benar, masukkan kembali script tersebut ke template HTML. 
  • Apabila mengedit langsung ke template HTML agar lebih mudah dan cepat mencari kode tertentu gunakan fitur pencarian browser tekan Ctrl + F (atau F3). Setelah kotak pencarian muncul masukkan kode yang ingin dicari lalu tekan enter. 
  • Kadang pencarian tidak mendapatkan hasil (melalui Crt+F). Kemungkinan lupa mencentang "expand widget templates" atau kode tersebut di apit oleh tag paragraf: <p> dan </p>, sehingga tidak ketemu. Agar lebih mudah jangan sertakan tanda < dan /> dalam kotak pencarian (Ctrl + F), misal jangan menuliskan <data:post.body/> cukup gunakan data:post.body saja. 
  • Perhatikan dan pastikan semua bagian script/kode sudah ter-copy dengan benar ketika menyalin (copy) script/kode dari halaman tutorial yang anda baca. Jangan ada bagian lain yang ikut ter-copy selain script. Perhatikan juga, penulisan karakter kode sangat sensitif, kesalahan penulisan, kurang titik, koma, dll. bisa mengakibatkan kode tidak berfungsi. 
  • Ini kesalahan yang sering terjadi. Perhatikan benar-benar petunjuk tutorial dengan cermat. Perhatikan juga dengan kata atau istilah di bawah/setelah dan di atas/sebelum serta diganti. Letakkan kode baru tersebut benar-benar di bawah/setelah atau di atas/sebelum kode yang telah dicari/ditemukan atau kode tersebut memang harus diganti dengan kode baru. 
Misalkan: Letakkan kode <b:include data='posts' name='breadcrumb'/> dibawah/setelah kode <b:include data='top' name='status-message'/>, maka kode <b:include data='posts' name='breadcrumb'/> diletakkan benar-benar disamping atau dibawah kode <b:include data='top' name='status-message'/>. Penulisan kode diurut ke bawah untuk memudahkan membaca atau mengedit, namun oleh brower kode tersebut tetap dibaca dari kiri ke kanan. 
Jadi hasilnya adalah:
<b:include data='top' name='status-message'/>
<b:include data='posts' name='breadcrumb'/>
atau,
<b:include data='top' name='status-message'/> <b:include data='posts' name='breadcrumb'/> 
  • Kadang kita menemukan pesan Error 500, meskipun kode serta penempatanya sudah benar menurut petunjuk halaman tutorial. Misalkan: Template Anda tidak dapat diparse karena tidak well-formed. Harap pastikan bahwa semua elemen XML ditutup dengan benar.  Pesan error XML: The element type "html" must be terminated by the matching end-tag "</html>". Kemungkinan kode yang dicopy dari halaman tutorial yang anda baca, salah penulisan kode atau tidak sesuai dengan tipe template blogspot, untuk itu cari dan coba kode yang sejenis dari blog lain. Atau anda dapat mencari dan memperbaiki kode tersebut. Kalau kode salah atau elemen XML tidak dapat dieksekusi, segera bersihkan edit dan template akan kembali ke sebelumnya (sebelum ada error).
  • Pada kasus tertentu, terutama untuk pengeditan halaman depan (homepage) gunakan fitur preview/pratinjau untuk melihat hasilnya. Jika sudah benar atau sesuai yang diinginkan, baru lah disimpan. 

Yang paling penting, berani dan terus belajar serta trial and error adalah pelajaran terbaik untuk dapat mengembangkan dan membiasakan diri dengan template blogspot. Dengan sering editing template blogspot nantinya dapat membuat template sesuai dengan keinginan sendiri serta dapat di-share ke blogger lain (ditunggu hasilnya). 

Disarikan dari beberapa sumber





0 komentar:

Posting Komentar

Semua komentar dimoderasi. Maaf jika komentar tidak ditampilkan atau dibalas.