Zero Point: Tricks Blogging

Tampilkan postingan dengan label Tricks Blogging. Tampilkan semua postingan

Template Blogger Agar Menjadi Valid XHTML

Written By Unknown on Rabu, 30 Mei 2012 | 03.16

Rabu, 30 Mei 2012

Belajar Bareng Yuk Gimana caranya agar template blogger kita Valid XHTML di W3C. Sebelum melangkah jauh ada yang perlu kita ketahui bersama bahwa Valid XHTML hanya di halaman depan alias di mode Home bukan di Sub Halaman karna kita tahu bahwa widget di Blogger juga bermasalah seperti komentar, image, script iklan yang menggunakan php, jquery, Followers bawaan blogger yang penempatannya tidak benar dan masih banyak lagi.

Sebagai langkah percobaan mari kita gunakan template Minima setelah itu coba buka di New Tab http://validator.w3.org/, ketikkan alamat URL blog sobat di kolom address setelah itu klik tombol Check. setelah terlihat hasil eror "Errors found while checking this document as XHTML 1.0 Transitional!" jangan di tutup dahulu hmmm.. berapa Result error-nya...?? banyak ya...?? kita kurangi satu persatu yuk biar berkurang jumlah errornya.

1. Hapus Widget Penyebab Error
Masuk ke widget element laman hapus Widget Followers, Tenang aja nanti kita buat Widget Followers ini menjadi Valid tapi untuk sekarang silahkan hapus dulu saja, dan jangan lupa rubah juga arsip Blog Menjadi Flat list. Jangan lupa di save dan kembali lagi ke http://validator.w3.org/ yang sudah di berikan url sobat kemudian refresh lihat hasilnya apakah berkurang?

2. Rubah DOCTYPE
Cari kode di bawah ini
<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

Membuat Teks Area Dengan Style Berbeda

Written By Unknown on Senin, 07 Mei 2012 | 21.31

Senin, 07 Mei 2012

Sebelumnya telah dibahas mengenai pembuatan teks area secara default, untuk mengkostumisasi atau memberikan style yang berbeda dan menarik ada beberapa langkah pembuatannya dan tentu saja dengan adanya penambahan kode.

dibawah ini beberapa contoh teks area dengan kostumisasi menarik dengan style yang apik :

1. Teks Area Dengan Background Warna

2. Teks Area Dengan Background Gambar

Background dan ukuran besar kecilnya kolom teks area bisa kalian rubah
Semoga bermanfaat

Read More | komentar

Tricks Blogging

Highlight Teks Area Untuk Blogspot

Teks area merupakan suatu ruang untuk menyimpan teks atau tulisan dengan membentuk area baru. seperti kebiasaan orang, teks area biasanya digunakan untuk menyimpan kode-kode HTML atau teks agar menjadi pembeda dalam penyajian penulisan, untuk jelasnya perhatikan contoh ini.

<div>
<form name="copy">
<div align="center">
<input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Highlight All" /> </div>
<div align="center">
</div>
<div align="center">
<textarea cols="15" name="txt" rows="50" style="height: 60px; width: 350px;" wrap="VIRTUAL">Semoga tulisan yang ada diblog ini bisa bermanfaat untuk para pembacanya dan bisa memberikan tambahan ilmu pengetahuan terutama dalam proses pembuatan teks area, terima kasih</textarea></div>
</form>
</div>

kode tersebut diatas adalah yang membentuk contoh teks area yang menggunakan tombol highlight.

Keterangan Elemen :

* <div align="center"> dan <p align="center"> : merupakan kode untuk mengatur posisi tombol highlight berada pada posisi tengah dan <p align="center"> untuk menempatkan kotak teks area pada posisi tengah, untuk customisasi sendiri bisa dirubah kesebelah kiri atau kanan dengan mengganti kata center dengan left atau right.

* style="height: 50px; width: 300px;" : untuk merubah ukuran panjang dan lebar teks area.

* <input onclick="javascript:this.form.txt.focus();this.form.txt.selec()"> : keterangan ketika tombol highlight di klik, maka seluruh isi akan terpilih atau di blok.

N/B : apabila isi dari teks area panjang sedangkan kotak teks areanya kecil, nantinya teks area akan membentuk tombol scroll secara otomatis.

Untuk penambahan Style Teks Area yang lain, bisa melihat yang ini "Teks Area Dengan Background"

Semoga bermanfaat.

Read More | komentar

Tricks Blogging

Membuat Paragraf Text Indent di Postingan

Pada sebuah buku pasti sobat menjumpai tulisa yang pada paragraf pertamanya menjorok ke dalam. Apakah kita bisa menerapkannaya pada blog kita ? Tentu saja bisa….., seperti pada artikel yang saya buat ini. Pada Blogger maupun wordpress tidak ada seperti ini atau kebanyakan orang menyebutkan namanya Text Indent.

Tak usah kawatir cara membuatnya tidak terlalu susah, kita hanya menambahkan sebuah code Html di postingan kita dan secara otomatis teks yang kita buat pada tulisan pertamanya akan menjorok kedalam seperti pada postingan yang saya buat ini. Yang perlu sobat lakukan hanya mengcopy script Html di bawah ini dan pastekan di postingan sobat. pastikan postingan dalam mode Html apabila salah maka teks tidak akan menjorok ke dalam.

<p class="MsoNormal" style="text-align: justify; text-indent: 0.5in;">Tulis teks sobat disini....</p>

• text-align : peratan pada tulisan.
• text-indent : dalamnya kalimat yang menjorok kedalam.
Anda tidak perlu mengcopy lagi Htmlnya setiap kali anda ingin membuat sebuah paragraf baru sobat tinggal Enter dan secara otomatis akan membentuk sebuah paragraf baru yang menjorok kedalam. Gampang sobat bisa mencobanya.....

Semoga Bermanfaat

Read More | komentar

Tricks Blogging

Cara Mudah Membuat Scroll Pada Blog

Salah satu fungsi daripada membuat scroll adalah untuk menghemat space pada blog kita. Sehingga apabila kita akan membuat label ataupun widget berukuran terlalu besar sidebar blog berukuran terbatas kita bisa mengakalinya dengan membuat scroll box ini. Ok untuk lebih jelasnya kita langsung praktik aja gan..

1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan.
3. Kemudian pilih Edit Element
4. Klik Add Widget dan pilih HTML/Javascript
5. Copas salah satu cara dari kode berikut

Cara 1 :
<div style="width: 395px; height: 400px; background-color: a0ffff; color: 000000; font-family: arial; font-size: 12px; text-align: left; border: 0px solid 00000; overflow: auto; padding: 4px;">Copy paste disini code yang ingin ditampilkan</div>

Cara 2 :
<div class="'rbbox'"><div style="'margin:0;"><Copy paste disini code yang ingin ditampilkan></div></div>

Cara 3 :
<div style="overflow: auto;background-color:#C7DFB5; margin: 0px auto; padding: 5px; height: 200px;width: 94%;text-align: left;"> Copy paste yang ingin ditampilkan </div>

Cara 4 :
<div class="'rbbox'"><div style="'margin:0;"><Copy paste yang ingin ditampilkan></div></div>

Semoga Bermanfaat

Read More | komentar

Zero Point

Template Blogger Agar Menjadi Valid XHTML

Written By Unknown on Rabu, 30 Mei 2012 | 03.16