Hack "Read more" automatic and images


Hack "Read more" automatic and imagesI was looking for this hack, the request of a client -DB products and services found in and Templates for you , dear blog friend missing and Golden. 
This is a hack that summarizes the posts of the home page (home) and also automatically displays a small image ( thumbnail ) on the left side of the post. 
First of all, I recommend that you install this hack on a test blog, or if you want to install directly on the blog, do before a backup template . 

How to put the hack with images Read More 

Among the Blogger dashboard, click design and then edit in HTML. 
Check the box to expand Widget Templates and search for: 

<div class='post-body entry-content'>
<data:post.body/>

Replace the line <data:post.body/> by:
 

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<div expr:id='"summary" data:post.id' style='display:none;'> <data:post.body/> + </ div>
<script type='text/javascript'> createSummaryAndThumb ("summary <data:post.id/>") </ script>
<div style="clear:both" align='right' class='rmlink'> <a expr:href='data:post.url'> Read more »» </ a> </ div>
</ B: if> </ b: if>
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/> </ b: if>
<b:if cond='data:blog.pageType == "static_page"'> <data:post.body/>
</ B: if>


WARNING:
 For those who use my templates that come with another hack "read more" and / or break the jump from Blogger, the path is another.
 Search for: 

<b:if cond='data:blog.pageType == "item"'>
<style> # fullpost {display: inline;} </ style>
<p> <data:post.body/> </ p>
<b:else/>
<style> # fullpost {display: none;} </ style>
<p> <data:post.body/> </ p>
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url "#more"'> <data:post.jumpText/> + </ a>
</ Div>
</ B: if>
<span id='showlink'>
<a expr:href='data:post.url'> Continue reading >> </ a>
</ Span>
<script type='text/javascript'>
checkFull ("post-" + "<data:post.id/>");
</ Script>
</ B: if>
<div style='clear: both;'/> <! - clear for photos floats ->


Replace it by:
 

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<div expr:id='"summary" data:post.id' style='display:none;'> <data:post.body/> + </ div>
<script type='text/javascript'> createSummaryAndThumb ("summary <data:post.id/>") </ script>
<div style="clear:both" align='right' class='rmlink'> <a expr:href='data:post.url'> Read more »» </ a> </ div>
</ B: if> </ b: if>
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/> </ b: if>
<b:if cond='data:blog.pageType == "static_page"'> <data:post.body/>
</ B: if>
<div style='clear: both;'/> <! - clear for photos floats ->

Now go in the CSS template and before the closing]]> </ b: skin> Paste this code:
 

. {Rmlink
font-size: 100%;
float: right;
margin-right: 30px;
margin-top: 10px;
font-weight: bold;}
. Rmlink a {
font-style: normal;
font-weight: bold;
font-variant: small-caps;
font-family: Arial, Sans-Serif;
color: # 24618e; / * Link color * /}
. Rmlink a: visited {color: # 649dc7;} / * Link color after clicked * /
. Rmlink a: hover {color: red;} / * Link color when mousing over * /

Then look for the tag </ head> and paste this code on top of her other:
 





Reference sources 


Hiding the footer of the post on the homepage 

To hide the date and footer of posts on the home page, look for: 

]]> </ B: skin>

Paste the following code after this tag:
 

<b:if cond='data:blog.pageType == "index"'>
<style type='text/css'>. post-footer {display: none;} </ style>
</ B: if>
<b:if cond='data:blog.pageType == "index"'>
<style type='text/css'> h2.date-header {display: none;} </ style>
</ B: if>


To better understand the conditional Blogger, go to:
 
This last tip worked on Minimum Template and in my templates, but may not work for others, since the name of the selectors (. H2.date and post-footer-header), can vary from one model to another. 
Displaying only the text 
If you want to show only the text on the home and not the pictures, look for: 

<style type="text/css">
. Thumbnailimg IMG {
max-width: 150px;
width: expression (this.width> 150? 150: true);
max-height: 120px;
height: expression (this.height> 120? 120: true);
}
. {Thumbnailimg
float: left;
padding: 10px 0px 0px 5px;
}

Replace the whole section up by this:
 

<style type="text/css">
. Thumbnailimg IMG {
max-width: 150px;
width: expression (this.width> 150? 150: true);
max-height: 120px;
height: expression (this.height> 120? 120: true);
display: none:
}
. {Thumbnailimg
float: left;
padding: 10px 0px 0px 0px;
}

3 comments:

  1. Thanks for this!
    Could you maybe post ninja saga hack, to show us how to cheat ninja saga ?
    Thanks :P

    ReplyDelete
  2. Nice post friend , i really appreciate your work.it will be nice if you can hack FarmVille 2 Hack

    ReplyDelete
  3. I just love reading your posts <3 :D
    Also check and see how to do top eleven hack and use top eleven token hack.
    Visit top eleven cheat to get real
    top eleven football manager hack and more top eleven cheats!
    Best regards!

    ReplyDelete