Auto Read more για Blogger

Υπάρχουν πολλοί μέθοδοι στο web όπου δείχνουν πως θα βάλουμε την τεχνική του "Διαβάστε περισσότερα!".Πολλές από αυτές μπερδεύουν τους αναγνώστες με σκοπό να κάνουν λάθη.Εγώ θα σας δείξω την πιο γρήγορη,απλή και εύκολη μέθοδο οι οποία θα έχει το ίδιο αποτέλεσμα με όλες τις άλλες!

Λοιπών ας αρχίσουμε!

Βήμα ένα

1. Συνδεθείτε στο blogger account σας.
2. Μπείτε στο blog που θέλετε να βάλετε το auto read more.
3. Πατήστε στη κατηγορία που λέγετε "πρότυπο" 
4. Και τέλος πατήστε στη Επεξεργασία html όπως δείχνω στο βήμα ένα

Βήμα Δύο

• Checkαρουμε την Επέκταση προτύπων γραφικών στοιχείων

Βήμα Τρίτο

Με τη βοήθεια του ctrl+F πάντα, βρίσκετε το </head> και πριν από αυτό, επικολλήστε τον παρακάτω κώδικα:

<script type='text/javascript'>var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}


//]]>
</script>

Στον παραπάνω κώδικα μπορείτε να αλλάξετε τις εξής αριθμητικές μεταβλητές (σε pixels):
summary_noimg = 430; το ύψος της ανάρτησης ΧΩΡΙΣ την εικόνα
summary_img = 340; το ύψος της ανάρτησης ΜΕ την εικόνα
img_thumb_height = 100; το ύψος της εικόνας
img_thumb_width = 120; το πλάτος της εικόνας

Βήμα Τέταρτο

Τώρα βρείτε το <data:post.body/> και αντικαταστήστε αυτόν τον κωδικό με τον παρακάτω:

<b:if cond='data:blog.pageType == &quot;static_page&quot;'><br/>
<data:post.body/>
<b:else/>

<b:if cond='data:blog.pageType != "item"'>

<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");
</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> read more "<data:post.title/>"</a></span>

</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
</b:if>

Το συγκεκριμένο script μαζί με το read more βάζει και τον τίτλο της ανάρτησης,Αν θέλετε να το αφαιρέσετε αυτό απλά διαγράψτε αυτό εδώ:

"<data:post.title/>"

Το read more μπορείτε να το αλλάξετε φυσικά με κάποια εικόνα απλά πρέπει να αντικαταστήσετε το

read more "<data:post.title/>"

Με αυτό εδώ:

<img src="εδώ βάλτε την εικόνα που εσείς θέλετε!" border="0" />

1. Τέλος Πατήστε την Προεπισκόπηση για να δείτε αν λειτουργεί!
2.  Μέτα Αποθήκευση κι είστε έτοιμοι!

Αν σας άρεσε αυτή η ανάρτηση αφιερώστε 5 δευτερόλεπτα ώστε να την κοινωνικοποιήσετε! 

© GaziAggeloStorage
don't copy articles from gaziaggelostorage.blogspot.gr without permission!