Cara Membuat Spoiler

Tips Cara Bikin Spoiler, di dunia KasKus hampir setiap thread menggunakan spoiler untuk menyembunyikan gambar, link atau teks yang panjang ,selain dari itu juga menghemat jumlah teks atau gambar pada halaman blog, agar terlihat rapi dan menghemat loading page...
langsung saja kita praktek'kan. :

Copas kode di bawah ini :

<div><div style="margin: 5px;">
 <div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Judul Spoiler </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 tulisan spoiler...


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


maka hasilnya seperti ini :

Judul Spoiler

isi tulisan spoiler...

Semoga bermanfaat...

READ MORE - Cara Membuat Spoiler

Cara Membuat Read More Otomatis Di Blogspot

Cara membuat Read More otomatis di blogspot ini mungkin sudah banyak, tapi tidak ada salahnya saya tulis disini  sebagai catatan.

If you post an articel to your blog it will displayed on a main page, if you have a long post content, your blog will opened more long time. But it can be tricked with a script to short your post or only abstraction post will dispaled on a main page, and the full post will replaced by "Read More" link. Here's the trick to create "Readmore"

• Login ke blogger, kemudian pilih Layouts --> Edit HTML
• Click  "Expand Widgets Template" checkbox.
• Temukan  kode </head> atau tekan Ctrl + F untuk lebih cepat
• Jika sudah ketemu copy script dibawah ini, kemudian paste atau letakkan diatas kode  </ head>

Script

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 280;
summary_img = 250;
img_thumb_height = 70;
img_thumb_width = 100;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(b,a){if(b.indexOf("<")!=-1){var d=b.split("<");for(var c=0;c<d.length;c++){if(d[c].indexOf(">")!=-1){d[c]=d[c].substring(d[c].indexOf(">")+1,d[c].length)}}b=d.join("")}a=(a<b.length-1)?a:b.length-2;while(b.charAt(a-1)!=" "&&b.indexOf(" ",a)!=-1){a++}b=b.substring(0,a-1);return b+"..."}function createSummaryAndThumb(d){var f=document.getElementById(d);var a="";var b=f.getElementsByTagName("img");var e=summary_noimg;if(b.length>=1){a='<span style="float:left; padding:0px 10px 2px 0px;"><img src="'+b[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var c=a+"<div>"+removeHtmlTag(f.innerHTML,e)+"</div>";f.innerHTML=c};
//]]>
</script>
</b:if>
</b:if>

Kode warna orange berfungsi agar halaman statis tidak ikut terpenggal seperti halaman HOME.

• Kemudian cari lagi kode <data:post.body/>
• Kalau sudah ketemu, ganti kode  <data:post.body/> dengan semua kode dibawah ini

Kode

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script 
type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - 
<data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

• Kalau sudah silahkan Preview dan Save Template

Lihat Hasilnya... somoga berhasil.

READ MORE - Cara Membuat Read More Otomatis Di Blogspot

Cara Menghilangkan Link Underline atau Garis Bawah Link

Cara menghilangkan Link Underline atau garis bawah pada link sebenarnya cukup mudah. sebelumnya saya coba beberapa cara dan tidak berhasil, akhirnya ketemu juga caranya.
cara ini tidak hanya bisa dipakai buat blogspot, tp bisa juga buat wordpress

berikut cara menghilangkan underline link pada blog :

• Login di http://www.blogger.com/
• Masuk ke halaman Layout / Template dan Klik Edit HTML
• Cari kode seperti  ]]></b:skin>
• Copy dan Paste kode dibawah ini tepat diatas kode tersebut

Kode

a:link {text-decoration: none}
a:visited {text-decoration: none}
a:active {text-decoration: none}

• Simpan template

Buka blognya apakah underline linknya sudah hilang ???

READ MORE - Cara Menghilangkan Link Underline atau Garis Bawah Link