How to Create Automatic Thumbnail and Read More Function for Blogger

There is the simple way to customize your blog with automatic thumbnail and read more on the content. The steps are as below:

1. Login to blogger.com dashboard.
2. Go to Edit HTML and Expand Widget Templates
3. Find below code

    <data:post.body/>
    

4. Replace <data:post.body/> with below code.

    <p><script type='text/javascript'>
    summary_noimg = 430;
    summary_img = 340;
    img_thumb_height = 100;
    img_thumb_width = 120;
    </script>
    <script src='http://blogergadgets.googlecode.com/files/excerpt.js' type='text/javascript'/>
    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
    <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
    <span class='rmlink' style='float:right'><a expr:href='data:post.url'>Read more</a></span>
    </b:if>
    <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if></p>
    

5. Click Save.

Leave a Reply

Your email address will not be published. Required fields are marked *

SiteGround.com

A world leading hosting company that provides fully-managed innovative and secure solutions, suitable for hosting small to medium-sized websites

Built on the best available technologies combined with Google Cloud for strong redundancy and application availability. Backed by skilled experts to address web security threats, a devops team to create advanced custom security solutions, and 24/7 sysadmins to watch over the platform. This powerful, hands-on approach makes your sites faster, safer, and easier to manage. Starting from only $3.95/mo.

TRY FREE

* up to 30 days money back guarantee