Blog Archive links Collapsed by Default Hack

If you are using the Hierarchy style for your Blog Archive widget then you must have faced the problem of auto expansion of drop-down list of a particular month which is currently in the calendar or to which the opened post belongs. This simple hack solves that problem by making all the nodes in the hierarchy to be collapsed by default(As seen in the above picture ). This can be simply added by the One Click Installer or manually.

Demo

Prerequisites for this to Work
Before you apply this remember that you have to have a Blog Archive Widget present and the Style has to be set to Hierarchy (as shown in picture below )

Applying this to your Blog

To add using One Click Installer Method

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script> if ( $('.archivedate').hasClass('expanded') ) { $('.archivedate').removeClass('expanded'); $('.archivedate').addClass('collapsed'); } </script> <a href="http://www.stylifyyourblog.com" title="Stylify Your Blog" ><img src="http://img1.blogblog.com/img/blank.gif" alt="Blogger Templates" /></a>

Or just add the following Code in your Blog (preferably before the </body> tag in the Edit HTML of the Template tab )

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>  
if ( $('.archivedate').hasClass('expanded') ) 
{ 
 $('.archivedate').removeClass('expanded'); 
$('.archivedate').addClass('collapsed'); 
}
</script>

What this code does
It firstly checks if a element having class name "archivedate" also has a class "expanded" present in it. If this turns out to be true then it removes the "expanded" class and adds a class named "collapsed" .

If you face any problem implementing it in your blog then feel free to ask via comments

Written by Prayag Verma

Find me on Twitter

Email Newsletter

Like what you read here in this post ?
Get new posts delivered straight to your inbox