2/11/11

,

How to Make Spoiler in Blogspot (Blogger)

Spoiler is usually used to reduce or shorten the code, post, or any writing not to be too filled pages.

Spoiler can be used in the bloggers, not only in use in the forum. making easy, just copy and paste the code below, then replace the words "YOUR CONTENT" so now the article look cleaner.


Example :

Your Title :

Your Text or Image Link

If you want to insert a picture, make sure to change the float to center

Example :

Your Title :


Spoiler Code (just copy paste this code for your blog)
<div style="margin: 5px 20px 20px;"><div class="smallfont" style="margin-bottom: 2px;">Your Title : <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><br /><div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;background: #f5f5f5 none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: rgb(127, 69, 0); line-height: 1.5em;"><div style="display:none;">Your Text or Image Link<br /></div></div></div>



Related Posts

3 comments:

  1. Thank you so much this was very helpful!

    ReplyDelete
  2. This is exactly what I was searching for! Thank you so much! :) Wonderful work!

    ReplyDelete
  3. for me the link of the img is appearing instead of the image

    ReplyDelete