How To Create Expandable Post Summaries
1.Log in to your dashboard--> desing- -> Edit HTML
2.Click on "Expand Widget Templates"
3.Scroll down to where you see </head> tag.
4.Copy and Paste below code immediately before </head> tag.
<script language='javascript' src='http://pwam.googlecode.com/files/jquery-1.2.3.pack.js' type='text/javascript'/> <script language='javascript' src='http://pwam.googlecode.com/files/jquery.expander.js' type='text/javascript'/> <script type='text/javascript'> $(document).ready(function() { $('.excerpt').expander({ slicePoint: 280, // default is 100 expandText: '[...]', // default is 'read more...' }); }); </script>
5.Again, Scroll down to where you see this.
<div class='post-body entry-content'> <data:post.body/> <div style='clear: both;'/> <!-- clear for photos floats --> </div>
6.Replace above code with the following code.
<b:if cond='data:blog.pageType != "item"'> <div class='excerpt post-body entry-content'> <data:post.body/> <div style='clear: both;'/> <!-- clear for photos floats --> </div> <b:else/> <div class='post-body entry-content'> <data:post.body/> <div style='clear: both;'/> <!-- clear for photos floats --> </div> </b:if>
7.Click on "Save Templates" You are done.
No comments:
Post a Comment