Αυτόματο "Διαβάστε περισσότερα..." για τις αναρτήσεις. (Automatic Read More)

Ένα από τα σημαντικότερα Blogger Tricks αλλά και σίγουρα το πιο γνωστό σε όλους τους Bloggers είναι ο διαχωρισμός των αναρτήσεων με τη λειτουργία του "Read More".

Με αυτό τον τρόπο, στην Αρχική Σελίδα δεν φαίνεται όλη η ανάρτηση αλλά μόνο ένα μέρος της.

Έτσι, ένας Blogger μπορεί να προσθέσει περισσότερες αναρτήσεις στην Αρχική του Σελίδα, χωρίς να του "πιάσουν" αρκετό χώρο, και όταν ο επισκέπτης θα πατάει στο "Διαβάστε Περισσότερα", θα τον μεταφέρει στην ανάρτηση που τον ενδιαφέρει.

Ο παραπάνω τρόπος προσφέρει 2 αρκετά σημαντικά πλεονεκτήματα:

1) Δεν χρειάζεται να κόβεις τις αναρτήσεις σου "χειρωνακτικά" αλλά κόβονται αυτόματα.
Δηλαδή μόλις τελειώσεις την ανάρτηση πατάς δημοσίευση και στο κάνει αυτόματα !!!

2) Εσύ ρυθμίζεις στους πόσους χαρακτήρες θέλεις να κόβονται οι αναρτήσεις σου, με αποτέλεσμα όλες οι αναρτήσεις του Blog σου να είναι ομοιόμορφες. (όπως στο βλογκ μου)

Ακολουθήστε τα παρακάτω βήματα με προσοχή !

Κάνε Αποθήκευση Προτύπου για παν ενδεχόμενο

1) Σύνδεση στον Blogger
2) Επεξεργασία HTML
3) Με τη βοήθεια του CTRL+F βρίσκουμε το:

</head>

Αμέσως από πάνω του βάζουμε τον παρακάτω κώδικα:

<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 230;
summary_img = 140;
img_thumb_height = 100;
img_thumb_width = 100;
</script>
<script src='http://freebloggertips.googlecode.com/files/free%20bloggertips.js' type='text/javascript'/>

-------------------------------------------------
Σε αυτό το σημείο μπορείς να αλλάξεις τα παρακάτω νούμερα:

summary_noimg = 430; (είναι το ύψος της ανάρτησης χωρίς την εικόνα)
summary_img = 340; (είναι το ύψος της ανάρτησης με την εικόνα)
img_thumb_height = 100; (το ύψος της εικόνας)
img_thumb_width = 120; (το πλάτος της εικόνας)
--------------------------------------------------

5) Στην συνέχεια βρείτε τον παρακάτω κώδικα HTML:

<data:post.body/>

ΑΝΤΙΚΑΤΑΣΤΗΣΤΕ τον παραπάνω κώδικα με τον παρακάτω:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
              <data:post.body/>
              <b:else/>
              <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 style='padding-top:5px;;float:right;text-align:right;'><a expr:href='data:post.url' rel='bookmark'><b>Read more »</b></a></span>              </b:if>

Το "Read more »" μπορείτε να το αλλάξετε.
Στην θέση του μπορείς να βάλεις κάτι όπως:
Διαβάστε Περισσότερα »
Περισσότερα για αυτό το άρθρο ... κλπ

6) Βρείτε τώρα το </b:skin> και απο πάνω του βάλτε αυτό:

a.readmore {
/* CSS properties go here */
}

7) Αποθηκεύστε το πρότυπο σας