Table of contents and Accordion for Blogger

Bismillah
Allahmdulillah, Alhamdulillah, Alhamdulillah
Usually we have so many posts in our blog and if we used TOC it will be very long. If we have very long TOC, it make visitors difficult to read our posts. To make it easy to read I made modification from previous script Table of Contents for Blogger new style and I used Accordion.
Feature of this script :

1. Accordion effect
2. Show and hide effect
3. CSS 3
4. Automatic add jquery
5. Different color for content
6. Different style for open and close
7. Auto Sort the title
8. Add New!! for 10 newest entry

How to use is very easy. Create Static Page .
Put the script in Html mode

<div style="width: 500px; height: 400px; background-color: ffffff; color: ffff00; font-family: georgia; font-size: 8px; text-align: left; border: 2px dashed 00ff20; overflow: auto; padding: 4px;">&lt;link href=&quot;http://abu-farhan.com/script/acctoc/acc-toc.css&quot; media=&quot;screen&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot;&gt;&lt;/link&gt;
&lt;script src=&quot;http://abu-farhan.com/script/acctoc/daftarisiv2-pack.js&quot;&gt;&lt;/script&gt;
&lt;script src=&quot;http://www.oblo.web.id/feeds/posts/summary?max-results=1000&amp;amp;alt=json-in-script&amp;amp;callback=loadtoc&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot;&gt;
var accToc=true;
&lt;/script&gt;
&lt;script src=&quot;http://abu-farhan.com/script/acctoc/accordion-pack.js&quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt;

</div>

Replace www.oblo.web.id with your blog name

Demo

Below images are how to create page in blogger.