remoxp

Haloo Sobat, kali ini saya akan membahas postingan lama tentang "Cara Posting Kode HTML". Mungkin sobat sudah mengetahui, tapi saya yakin ada juga sobat blogger yang belum tahu. Untuk memposting kode html, maka sebelum di posting kode html harus di phrase dulu. Misal kita akan memposting kode html banner kita agar orang bisa meng-copynya dan memasang banner kita di blognya. Eh....ketika ketika posting yang muncul bukan kodenya, tetapi gambar bannernya. Nah....Oleh karena itu kode html harus di phrase terlebih dahulu sebelum di posting.

Cara posting kode html kali ini agak berbeda dengan tutorial sebelumnya. Kalau sebelumnya kita harus membuka website orang lain untuk dapat memphrase kode html, sekarang kita dapat melakukannya di blog forantum ini atau bahkan di blog sobat sendiri. Mudah, cepat dan tidak repot tantunya....Apakah sobat tertarik?

Fitur-fitur yang di sediakan blogger semakin bagus dan beragam. Sebenarnya post edit blogger juga dapat digunakan untuk phrase kode html, tapi kurang efisien dan agak repot. Oleh karena itu, lebih baik gunakan tools phrase kode html di blog forantum ini:



Anda tinggal memasukan kode html, lalu klin tulisan "Convert", Selesai....

Apabila sobat ingin memasang tools phrase html, seperti di blog forantum ini. Sobat bisa menggunakan kode di bawah ini, lalu letakkan di postingan. Selanjutnya klik "Terbitkan".

<script src="http://www.gmodules.com/ig/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/102462998830435293579/post-Code.xml&amp;up_grows=1000&amp;up_conv1=1&amp;up_conv2=1&amp;up_conv3=1&amp;up_conv4=1&amp;up_conv5=1&amp;synd=open&amp;w=320&amp;h=200&amp;title=Post-Code%3A+code+converter&amp;border=%23ffffff%7C0px%2C1px+solid+%23595959%7C0px%2C1px+solid+%23797979%7C0px%2C2px+solid+%23898989&amp;output=js">
</script>
<div style="text-align: left;">
<span style="font-size: xx-small;">Widget By: <a href="http://forantum.blogspot.com/" target="new">Forantum</a></span></div>

Gimana, mudahkan....Sekarang di blog sobat menyediakan fasilitas untuk memphrase kode html ^_^

Free Template Blogger collection template Hot Deals SEO

Sebagai seorang blogger Anda akan sangat sering berurusan dengan HTML atau javaScript. Apalagi sekarang semua memanfaatkannya untuk pengembangan. Youtube misalnya. Anda dapat dengan mudah berbagi video hanya dengan embed code. Sama hal nya dengan pemasangan berbagai widget untuk blog Anda seperti recent comment misalnya. Namun sebelum Anda tambahkan ke blog Anda, mungkin Anda ingin check dulu atau melihat previewnya. Anda bisa melakukannya dengan trik yang sangat mudah. Anda cukup memasukkan HTML atau JavaScript tersebut di address bar Anda dengan diawali data:text/html,

Misal Anda ambil kode dari youtube seperti ini

<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/GIn5qJKU8VM&rel=0&color1=0xb1b1b1&color2=0xcfcfcf&hl=en_GB&feature=player_embedded&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowScriptAccess" value="always"></param><embed src="http://www.youtube.com/v/GIn5qJKU8VM&rel=0&color1=0xb1b1b1&color2=0xcfcfcf&hl=en_GB&feature=player_embedded&fs=1" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="425" height="344"></embed></object>

Masukkan ke address bar dengan diawali sehingga menjadi data:text/html,

data:text/html, <object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/GIn5qJKU8VM&rel=0&color1=0xb1b1b1&color2=0xcfcfcf&hl=en_GB&feature=player_embedded&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowScriptAccess" value="always"></param><embed src="http://www.youtube.com/v/GIn5qJKU8VM&rel=0&color1=0xb1b1b1&color2=0xcfcfcf&hl=en_GB&feature=player_embedded&fs=1" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="425" height="344"></embed></object>

Atau saya ambil contoh lain untuk widget reccent comments
Kodenya adalah seperti ini

<script style="text/javascript" src="http://bloggerhosting.appspot.com/serve/amen24.googlepages.com/showrecentcomments.js">
</script><script style="text/javascript">var numcomments = 5;var showcommentdate = false;var showposttitle = true;var numchars = 100;var standardstyling = true;</script> <script src="http://www.blog-trik-tip.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

Silahkan tulis di address bar dengan diawali data:text/html,
sehingga penulisannya seperti ini

data:text/html, <script style="text/javascript" src="http://bloggerhosting.appspot.com/serve/amen24.googlepages.com/showrecentcomments.js">
</script><script style="text/javascript">var numcomments = 5;var showcommentdate = false;var showposttitle = true;var numchars = 100;var standardstyling = true;</script> <script src="http://www.blog-trik-tip.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

Sekarang jika Anda bimbang untuk menambahkan satu widget ke blog Anda, dengan mudahnya Anda bisa cek terlebih dahulu. Semoga bermanfaat.

Sumber: www.masdoyok.co.cc

Free Template Blogger collection template Hot Deals SEO

Spoiler adalah cara untuk menyembunyikan seluruh atau sebagian isi dari konten blog kita. Spoiler juga bermanfaat agar konten yang berat seperti gambar dalam ukuran besar dan video tidak diload sebelum menekan tombol show. Dengan kata lain spoiler membantu kita mengurangi waktu load konten blog dan memberikan pilih kepada pembaca blog untuk membuka atau tidak isi spoiler



Anda sudah sering lihat Spoiler di kaskus atau forum-forum untuk nyembunyikan gambar, link dan konten lainnya. Spoiler ada dua yaitu untuk forum misalnya kaskus dan satunya lagi untuk dipergunakan di blog/web. Keduanya memiliki kode yang berbeda.

• Spoiler Forum misalnya KASKUS:
[spoiler=judul spoiler]isi spoiler[/spoiler]

Ganti tulisan yang berwarna hijau sesuai judul dan isi spoiler yang anda kehendaki.

• Spoiler untuk blog/web:
Menyembunyikan konten tertentu dari sebuah halaman blog/website diperlukan untuk menghemat space. Ketika visitor ingin melihatnya mereka dapat dengan mudah menampilkannya. Begitupun dalam software forum semacam vBulletin, Spoiler pasti banyak digunakan.

Berikut kode yang bisa digunakan dalam membuat spoiler di blog :

<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Tentang bla..bla.bla.. </span></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"/>
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

isi spoiler...

</div></div></div></div>

Kode HTML diatas akan memberikan hasil seperti dibawah ini:


kalau mengerti html silakan di costumize sendiri  ^-^

Free Template Blogger collection template Hot Deals SEO

Satu hal menarik adalah modifikasi soal link. Memang modifikasi soal link tak pernah habis. Kali ini saya akan memberitahu cara bagaimana membuat sebuah link terbuka tanpa klik. Biasanya tujuan link terbuka begitu ada aksi klik, tetapi dengan script ini hanya dengan menyorotnya saja link sudah terbuka.

Cara untuk membuatnya sangatlah simpel, coba perhatikan dua link di bawah ini


Uhibbukum Fillah™ I Cinta Kepada Allah I Indahnya Cinta Karena Allah

Kodenya:

<a href="http://www.uhibbukumfillah.co.cc/">Uhibbukum Fillah™ I Cinta Kepada Allah I Indahnya Cinta Karena Allah</a>

Ket: link di atas coba Anda sorot saja, maka tidak akan membuka tujuan, harus di klik karena menggunakan kode link biasa

Sementara link berikut

Uhibbukum Fillah™ I Cinta Kepada Allah I Indahnya Cinta Karena Allah

Kodenya:

<a href="http://www.uhibbukumfillah.co.cc/" onMouseover="window.location=this.href">Uhibbukum Fillah™ I Cinta Kepada Allah I Indahnya Cinta Karena Allah</a>

Ket: Cukup Anda sorot saja sudah membuka tujuan link

Semoga simpel tetapi bermanfaat.

Sumber: http://www.masdoyok.co.cc

Karya: Mas Doyok

Share By: Kumpulan Tutorial Blog

Free Template Blogger collection template Hot Deals SEO

Saya akan tutorial singkat tentang cara membuat tulisan menjadi berkedip. Kalau ingat kata berkedip aku jadi ingat sama temanku yang bernama Bayu Rohmat Berkedip...hehehe. Sebenarnya sih nama aslinya Bayu Rohmat Barnadip, tetapi teman temanku biasa memanggilnya seperti itu. Okey, kembali ke...tutorialnya. Sampai mana ya ???. O...ya cara membuat tulisan seperti ini.

Caranya kita tinggal menyisipkan tulisan yang akan dibuat berkedip diantara kedua kode ini:

<blink>

dan

</blink>

Ini contohnya :

tulisan yang akan dibuat berkedip disini

kodenya seperti ini

<blink> tulisan yang akan dibuat berkedip disini</blink>

gampang kan....

Free Template Blogger collection template Hot Deals SEO

Efek marque adalah efek untuk membuat teks seperti berjalan, untuk membuat teks berjalan kita perlu menyisipkan kode HTML. Tulisan yang berjalan ini dapat digunakan untuk menuliskan kata-kata penting di blog karena tulisan ini dapat menarik perhatian pengunjung. Tak hanya itu apabila tulisan yang akan kita tuliskan cukup panjang maka efek marque ini akan sangat menghemat tempat di blog. berikut ini adalah contoh-contoh efek marque, beserta kode HTML nya :

• marque biasa

teks kamu disini



Kode HTML :

<MARQUEE align="center" direction="right" height="200" scrollamount="2" width="30%">


teks kamu disini


</MARQUEE>

• marque dengan getaran

teks kamu disini



Kode HTML :

<MARQUEE align="center" direction="left" height="200" scrollamount="3" width="70%" behavior="alternate">


teks kamu disini


</MARQUEE>

• marquee dengan variasi huruf dan warna latar belakang

Kode HTML :

<div align="left">&ltFONT FACE="georgia" color="White"><B><MARQUEE BGCOLOR="RED" width="70%" scrollamount="3" behavior="alternate">


teks kamu disini


</MARQUEE></b></FONT></div>

• Marque berhenti bila ditunjuk mouse

teks kamu disini



Kode HTML :

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="50%" height="200" align="center">


teks kamu disini


</marquee>

Free Template Blogger collection template Hot Deals SEO