Refresh otomatis pada blog

Kebetulan kakak saya adalah seorang programmer, disalah satu operator seluler di Indonesia, nah kebetulan juga saya pas ngacak-ngacak kamarnya nemu kumpulan kliping HTML-an ketika kakak saya masih kuliah, salah satunya adalah membuat halaman web refresh otomatis. Kegunaan refresh otomatis ini apabila ada pengunjung yang nongkrong di blog sobat akan selalu update dengan isi blog sobat, jadi bisa tahu kalau blog yang di tongkronginnya akan keluar post terbaru atau update dari sobat. Mau tahu caranya?


Langkah-langkah membuat refresh otomatis pada blog :
1. Seperti biasa, login ke Blogspot, kalau sudah login masuk ke Tata Letak > Edit HTML
Perhatian! Jangan lupa untuk membackup template sobat, klik DownLoad Full Template!
2. Masukkan kode HTML ini di bawah <head> :

<meta CONTENT='120' HTTP-EQUIV='refresh'/>

And then, jangan lupa simpan hasil pekerjaan sobat.
angka yang berwarna merah adalah kurun waktu yang diinginkan untuk merefresh halaman dalam satuan detik, bisa di ubah sesuai kehendak.
Saran saya jangan telalu cepat merefresh halaman sobat karena apabila loadingnya belum selesai akan loading lagi sesuai dengan nilai waktu yang diberikan sobat.

Ok, sampai di sini pembelajaran HTML-annya , kalau memang ada ilmu HTML-an lainnya akan saya sampaikan ke sobat blogger. Happy blogging and tetap menjalankan ibadah puasa jangan sampai kaga soalnya wajib!!! (wew, ko malah dakwah-red).

post signature

Membuat read more sesuai dengan judul postingan

Bagi sobat blogger pastinya sudah tidak asing lagi dengan istilah read more atau baca lebih lengkap, bagi yang sudah menerapkan read more di blognya bisa menggunakan blogger trick ini, tapi kalau belum ya pasang dulu bro :p ,banyak tutorial blog yang mengajarkan bagaimana cara membuat readmore ini, contohnya blog ini , itu, dan ini juga. Bagi yang belum menerapkan silahkan ke blog tutor tersebut, tapi kalau sudah pasang read more di blog sobat bisa melanjutkan blogger trick ini. Nih saya kasih screenshot biar sobat tahu maksud postingan ini.
Screenshot:

Tertarik ingin membuatnya?

Langkah-langkah membuat read more sesuai dengan judul postingannya :
1. Seperti biasa, login ke Blogspot, kalau sudah login masuk ke Tata Letak > Edit HTML

Perhatian! Jangan lupa untuk membackup template sobat, klik DownLoad Full Template!
2. Setelah itu centang tanda Expand Template Widget , kalau sudah cari kode di bawah ini :

<a expr:href='data:post.url'>Read more.....</a>


Setelah ketemu ganti dengan kode ini :

<a expr:href='data:post.url'>Read more.....&#8220;<data:post.title/>&#8221;</a>



Perhatian!! membuat readmore banyak sekali tutorial yang beredar, kalau tidak menemukan kode di atas cari dengan menekan Ctrl + F ketikkan keyword "Read more" , atau "Selengkapnya" , atau apabila sudah di modifikasi oleh sobat silahkan cari keyword yang menunjukkan kode read more itu sendiri.
Intinya adalah memasukkan kode ini :
&#8220;<data:post.title/>&#8221;

Di depan kata versi read more yang sobat gunakan.
Kalau masih belum jelas silahkan YM saya, atau tinggalkan komentar insya Allah saya bisa membantu sobat. OK, sobat happy blogging dan selamat menunaikan ibadah puasa.

Membuat dropcap (2)

Sehabis sahur dengan kondisi masih kenyang langsung membuat blogger trik :p , sesuai dengan judulnya kali ini saya akan memposting bagaimana membuar drop cap atau hurup di awal kalimat menjadi besar seperti huruf di majalah/koran, tetapi kali ini berbeda metode dengan versi sebelumnya, jika belum baca versi membuat drop cap sebelumnya silahkan klik di sini, perbedaannya terletak bagaimana cara mempostingnya. Kalau mau lihat syle drop cap seperti di bawah ini :

Versi 1 :
T


Versi 2 :
T




Mau tahu perbedaannya ?

Sebenarnya pada versi sebelumnya, ukuran drop cap nya bisa di ubah baik itu besar font,style ataupun tinggi fontnya. Tetapi cara mempostingnya saja yang berbeda. Untuk mengetahui perbedaannya silahkan masukkan kode di bawah ini sebelum tag ini ]]</b:skin> :

.post caps {
float:left;
color: #3F3F3F;
font-size:100px;
line-height:80px;
padding-top:1px;
padding-right:5px;
}

Kalau sudah selesai save hasil pekerjaan sobat.
Sekarang tinggal mempraktekkannya, apabila ingin memakai drop cap versi 2 ini, sobat hanya tinggal masukkan kode ini di dalam Edit HTML/compose mode sebagai contoh penggunaannya:

<caps>L</caps>orem ipsum dolor sit amet, consectetuer jquery rules! elit, sed diam nonummy nibh euismod tincidunt ut laoreLorem ipsum dolor sit amet, consectetuer jquery rules! elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam et dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut jquery rules! ex ea commodo consequat
Maka hasilnya seperti di bawah ini :
Lorem ipsum dolor sit amet, consectetuer jquery rules! elit, sed diam nonummy nibh euismod tincidunt ut laoreLorem ipsum dolor sit amet, consectetuer jquery rules! elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam et dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut jquery rules! ex ea commodo consequat
Yups, perbedaan hanya bagaimana cara mempostingnya, kalau sebelumnya dengan memakai kode ini :
<span class="dropcap"> </span>


Sekarang memakai kode ini :
<caps> </caps>

Kembali ke sobat mau menggunakan metode mana, menurut saya yang simple-simple aja ya gak? Ok, sobat blogger karena sudah masuk adzan subuh saya mau sholat dulu, selamat menunaikan ibadah puasa bagi yang menjalankannya and happy blogging :D .

post signature