Langsung ke konten utama

Tips cara edit HTML Bloger

cara edit temlate html

Blogger adalah layanan blog gratis yang memberikan kebebasan bagi user untuk mengedit tampilan dan fungsi blognya. Secara mendasar, Blogger berplatform HTML/XML dengan didukung pengaturan tampilan CSS dan fungsi-fungsi javascript.

Kita mengenal adanya fitur edit template HTML blog dimana kita dapat dengan bebas melakukan modifikasi, desain ulang, hack, penambahan fitur dari pihak ketiga (third party) berupa widget, dan lain-lain.
*Fitur edit HTML Blogger diakses melalui dashboard > design/rancangan > edit HTML.

Tips ini untuk memberi masukan dan ide dalam melakukan editing Template HTML agar hasilnya sesuai dengan yang diinginkan.

Memahami elemen dasar dari template blogger sangat penting, ada lima elemen penting pada template Blogger yang hampir sama dengan elemen dasar web HTML pada umumnya:
·         HTML/XML tag
 Yang menandakan bagian dari keseluruhan halaman, diawali dengan <html> dan diakhiri dengan </html>. Khusus untuk tag-tag XML, untuk template Blogger dan HTML editor setelah tahun 2007, selalu diakhiri dengan ( / ), contoh: <data:post.body/>.
·         Head tag,
Merupakan bagian dari keseluruhan head halaman, di dalamnya terdapat aturan-aturan yang mengatur banyak hal, termasuk tampilan (CSS), diawali dengan <head> dan diakhiri dengan </head>.
·         Body tag
Merupakan isi dari halaman web/blog, di dalamnya terdapat konten/isi inti halaman, termasuk pula widget-widget yang menjadi bagian dari isi halaman, diawali dengan <body> dan diakhiri dengan </body>.
·         CSS
Elemen pengatur tampilan halaman, baik dari segi warna, font, posisi, lebar luas, dan masih banyak lagi. Letaknya diantara <b:skin><![CDATA[ dan ]]></b:skin> dan berada pada bagian head. Pada beberapa kasus kode CSS juga dimasukkan tepat di atas </head> sebagai aturan tambahan.
·         Javascript
Merupakan elemen yang sebenarnya mengandung software (web widget) yang berisi perintah-perintah tertentu. Biasanya digunakan untuk memasukkan elemen tambahan seperti popular post, auto readmore, dan sebagainya. Ada dua jenis javascript yang dapat digunakan: internal, yang diupload dan di-host langsung di Blogger, dan eksternal, yang diupload dan dihosting di sever lain. Letaknya relatif, tergantung jenisnya. Untuk yang berjenis widget biasanya ada di dalam body.

Biasakan back up template terlebih dahulu sebelum editing, klik "Backup Full Template" di atas kotak "Edit HTML". Jika ada kesalahan dan anda tidak tahu script mana yang harus dibenahi, anda dapat dengan mudah mengupload file back-up template dan mengembalikan seperti semula.

Ketika meng-copy script dari halaman tutorial yang anda baca, pastikan semua bagian script sudah tercopy atau jangan ada bagian selain dari script yang ikut ter-copy.

Jika harus mengubah isi script/kode, misalnya mengganti url blog/feed, value, dan lain-lain, salin/paste terlebih dahulu kode/script tersebut ke editor semacam notepad, wordpad, word. Setelah melakukan pengubahan script dan memastikan semuanya beres, baru masukkan script tersebut ke template HTML.

 Agar lebih mudah dan cepat mencari kode tertentu seperti yang diminta di dalam tutorial, gunakan fitur pencarian browser, tekan Ctrl + F, setelah kotak pencarian muncul masukkan kode yang ingin dicari dan tekan next (enter).
Perhatikan benar-benar istilah di bawah/setelah serta di atas/sebelum, itu berarti letakkan kode benar-benar setelah atau sebelum kode yang dicari. Kode-kode dibaca oleh browser dari kiri ke kanan sebagai urutan. Atas bawah hanya digunakan untuk memberi kenyamanan dalam mengurutkan. Bagi browser, dia tetap dibaca dari kiri ke kanan. Contoh:
<b:include data='top' name='status-message'/><data:adStart/>
Kita lihat di situ ada 2 tag bersisian, jika harus memasukkan tag/kode baru <b:include data='posts' name='breadcrumb'/> di bawah/setelah <b:include data='top' name='status-message'/>, itu berarti anda harus meletakkan benar-benar setelahnya, sehingga<data:adStart/> harus digeser posisinya, atau kode/tag baru disisipkan di antara keduanya, jadinya: 

<b:include data='top' name='status-message'/>
<b:include data='posts' name='breadcrumb'/> 
<data:adStart/>
atau,
<b:include data='top' name='status-message'/><b:include data='posts' name='breadcrumb'/><data:adStart/>

Jika memang masih belum yakin dan terbiasa, buatlah blog baru yang fungsinya untuk eksperimen dan uji coba script (trial and error). Anda bisa dengan bebas melakukan uji coba tanpa ada ketakutan template blog anda rusak. Agar hasilnya akurat, gunakan jenis template yang sama seperti blog anda.

Khusus untuk hack/script tertentu di mana tampilannya bisa langsung dilihat di homepage/beranda (misalnya: memasang readmore atau background), setelah memasukkan script dan selesai meng-edit, jangan langsung di-save dulu. Gunakan/klik fitur preview/pratinjau untuk melihat hasilnya. Jika sudah beres dan sesuai yang diinginkan, baru lah di-save.

Pada beberapa template, ada yang bagian tertentunya di apit oleh tag paragraf: <p> dan </p>, sehingga ketika bagian tertentu tersebut dicari, seolah tidak ketemu. Jika template anda berjenis seperti ini, jangan menyerah terlebih dahulu.
Contoh:
Ketika harus mencari <data:post.body/>, dan tidak ketemu, maka ada kemungkinan tag paragraf mengapitnya (<p><data:post.body/></p>), atau ada beberapa kondisi lain (misalnya, anda lupa mencentang "expand widget templates"). Agar lebih mudah lagi, jangan sertakan < dan /> ketika mencari (Ctrl + F), cukup gunakan data:post.body saja.

Sekiranya tips di atas cukup lengkap untuk menjadi tips dan petunjuk agar lancar dan aman dalam mengedit template HTML bloger anda
Selanjutnya, sobat Blogger dapat mengembangkan dan membiasakan diri dengan template dan template editor Blogger serta melakukan editing.
Selamat mencoba.

Sumber (http://buka-rahasia.blogspot.com)

Komentar

Postingan populer dari blog ini

AIR KEABADIAN

MENELUSURI AIR ABADI Kali ini kita akan mencari tahu kebenaran tentang air abadi..ada berbagai fersi cerita atau dongeng yang bisa kita rangkum Bisa saja ini hanya sebuah cerita atau kiasan dan air abadi bukanlah kenyataan seperti air yang kita bayangkan.. Tapi bagaimana jika air itu benar- benar ada... Bukan sekedar kiasan atau dongeng.. Tapi benar-benar air yang memberikan umur panjang. Kita awali dari kisah raja Zulkarnain dan Nabi Khaidir. Saya merangkum semua kisah panjang dari berbagai fersi yang beredar dan mengambil yang penting saja sebagai informasi. Dikisahkan pada zaman Raja Iskandar  Zulkarnaen seorang  raja penguasa wilayah barat dan timur. Pada tahun 322 SM Raja Iskandar Zulkarnain mengadakan perjalanan untuk mengelilingi bumi ditemani oleh Malikat Rofi’il. Malaikat Rofi’il memberitahu kepada Raja Iskandar Zulkarnain bahwa sesungguhnya Allah telah menciptakan sumber mata air yang suci, jika seseorang meminum air dari mata air itu maka ia akan kekal h...

Menyelami Kebenaran Dari Sungai Bawah Laut

۞ وَهُوَ الَّذِي مَرَجَ الْبَحْرَيْنِ هَٰذَا عَذْبٌ فُرَاتٌ وَهَٰذَا مِلْحٌ أُجَاجٌ وَجَعَلَ بَيْنَهُمَا بَرْزَخًا وَحِجْرًا مَحْجُورًا Dan Dialah yang membiarkan dua laut yang mengalir (berdampingan); yang ini tawar lagi segar dan yang lain asin lagi pahit; dan Dia jadikan antara keduanya dinding dan batas yang menghalangi.   PHOTOGRAPHY Cenote Angelita: An Underwater River Photographed by Anatoly Beloshchin. Banyak blog lokal yang kemudian menurunkan informasi yang salah mengenai Cousteau. Hal pertama yang perlu diluruskan bahwa penemuan sungai bawah laut di Cenote Angelita baru-baru ini bukanlah oleh kelompok Cousteau Foundation.  Jacques-Yves Cousteau adalah perwira di AL Perancis, oseanografer, dan peneliti serta anggota  Académie française. Bersama Emile Gagnan ia bertanggung jawab membuka mata manusia pada dunia bawah air. Wikipedia Lahir:  11 Juni 1910,  Saint-André-de-Cubzac, Peranci Meninggal:  25 Juni 1997,  Paris, Pe...