Tersedia Paket Liburan Hubungi Kami www.wisatabahari-sumbar.com PIN 52988E44 LINE: Wisatabaharisumbar

cars

Minggu, 19 Februari 2012

Langkah - Langkah Edit Template Blogspot

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 serta akhirnya menimbulkan frustrasi untuk meneruskan editingnya. Banyak alasan blogger ingin mengubah template blogspot, mulai ingin tampilan blognya berbeda dengan yang lain sampai agar supaya seofiendly. Tema-tema blogspot yang siap download pun bertebaran di internet baik yang gratis maupun berbayar serta tutorial tentang editing tempalate blogspot banyak diulas.

logo-blogspot
Blogspot
Blogspot ber-platform HTML-XML yang sedikit berbeda dengan mesin blog lain yang menggunakan PHP, 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.

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 sebagai dasar tampilan template. 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 kata/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 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 bisa ke samping atau 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'/>
  • 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
Share:

0 komentar:

Posting Komentar

Deri Afhan Gusmanto. Diberdayakan oleh Blogger.

we are social

latest tweets

flickr photos

random posts

grids

About us

recent posts

random posts

three columns

like us on facebook

Unordered List

Text Widget

Support