Blogosys | Blogger, Wordpress Templates, Hacks, Widgets & Webdesign Resources

Blogger,Wordpress and Webdesign Accessories In One Roof

/* Adsense space */

Expand or Collapse ( +/- ) Post Link --> Script, Widget

Written by R N B on 12/09/2008 04:52:00 PM| 12 comments comment | Text Size : [+] | [-] | Bookmark and Share


This hack is just like "Expandable Post Summaries" ( Read More! Hack ) Hack. Read More! hack needs time to load remaining part of the post or page. But from this hack you need no time to load remaining post summary or page.

Here is the +/- Demo Link

Your Remaining Post Summary Here


+/-Get Code for Expand/Collapse Post Link



How to Implement :

1. Login to Blogger Dashboard

2. Go to Layout >> Edit HTML

3. Without Expanding your template search for the code ]]></b:skin>

4. Copy and Paste the following CSS code right above the searched code ( or paste in CSS Section ).




.commenthidden {display:none}
.commentshown {display:inline}


5. Put the following code between <head> and </head>



<script type="text/Javascript">
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }
} </script>


6. When you are writing post paste this following code in the post editor box. Change UNIQUE NAME with some name ( you can give yourname1, yourname2, ..etc ) , letter in red with remaining post summary and letter in blue with title name that you want to show.



<a aiotitle="click to expand" href="javascript:togglecomments('UNIQUE NAME')">+/- Title of the post link</a><div class="commenthidden" id="UNIQUE NAME"><p>Rest of the post summary or text that you need to hide</div>


8. If you want to use this hack often than paste above code in Dashboard >> Settings >> Post Template. By doing this You will see the above code whenever you open your post editor.


If you like this post, don't forget to subscribe to RSS feed or Email.





  • Comments 12 Responses to “ Expand or Collapse ( +/- ) Post Link --> Script, Widget ”


  •  

    i'm considering to use ur trick but will this one working for very very long time?

    and won't die out like the post below?
    http://trick-blog.blogspot.com/2008/02/show-or-hide-your-full-post-in-blogger.html


  •  

    Nothing happen when i click on the +/- link ..... Do you know why??? It's still expanded...


  •  

    Do you know whe do i haveto put the script no 5??
    You said i can put it between head and /head....
    Where exactly do i have to put it? More detail please....
    And is it really that i can change the 'UNIQUE NAME ' with anything???

    I have found the script no 3 and i have to put the script no 4 above script n 3, right???

    Is there anything else ihaveto do??
    because nothing happend..... it didn't work.....


  •  

    @Erie , paste 'Script 5' right above >/head< .........
    you can change 'UNIQUE NAME' with anything but both should be same in 'script 6' for each post.....Choose different 'UNIQUE NAME' for different posts....

    yes you should paste 'script 4' right above the searched 'script 3'......

    give more attention to 'script 6' ......


  •  

    Thank's a lot. At first i found it not easy because i'm beginner. It's work....

    About the push-up button, i don't know what type of image/picture i can change with?
    .jpg or .gif or .png??? Or any type can do??


  •  

    @Erie, i havnt tried different formats.... . try common formats.... .jpg , .gif ... .png .... it will work


  •  

    Nice trick, though this means if i am posting daily 50 posts i will do this trick 50 times !!!!!!!!!!


  •  

    seems it doesnt work , maybe with internet explorer hiding text
    with embed video doesnt work in IE none firefox.


  •  

    Thanks so much! I've tried several others in this is the only one that worked!


  •  

    Testing


  •  

    I changed my template and now script is not working on my blog...what should I do ?


  •  

    @AB .. As you have changed your template, the old XML file has replaced by new one ..so you just need to follow the above steps once again ...ie you have to include above CSS and javascript code in your new template..

Post a Comment

Search Our Blog

Most articles on this site are related to Blogger Templates, Blog design, Tips, Tricks, Hacks, Widgets and Webdesign

Blogger Templates & Hacks Directly in Your Inbox: