Sunday, January 14, 2018

How to create auto Read More link in blogspot without Javascript

Do the following steps:

1. Login to blogspot and go to template >> edit html.

2. Now Press (ctrl+f) to find code: ]]></b:skin>
    Now copy and paste the following code before this line of this code: ]]></b:skin>

.thumbnail-post {
  width:240px;
  height:156px;
  float:left;
  margin:0px 10px 0px 0px;
}



3. Again Press (ctrl+f) to find code:  <data:post.body/>
    Now replace with that small code with the following bellow code:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:post.firstImageUrl'>
    <a expr:href='data:post.url'><img class='thumbnail-post' expr:src='data:post.firstImageUrl' expr:title='data:post.title'/></a>
    <b:else/>
    <a expr:href='data:post.url'><img class='thumbnail-post' expr:title='data:post.title' src='http://lh4.googleusercontent.com/-fHGHc3h53Kg/VuDiQ0lcLwI/AAAAAAAAAFU/-tvh_a0Az6c/w600-h450-no/cantik.jpg'/></a>
    </b:if>
    <div class='post-snippet'>
    <data:post.snippet/>
    </div>
    <div class='rm-button-wrap'>
    <a class='button' expr:href='data:post.url'>Baca Selengkapnya</a>
    </div>
    </b:if>
    </b:if>
     
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <data:post.body/>
    </b:if>
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
    <data:post.body/>
    </b:if>


Red color : change with your image

***

No comments:

Post a Comment

Featured Post

How To Change Width & Height of Blogger's Top Menu Bar