Πώς να προσθέσετε σχετικά άρθρα κάτω από τις δημοσιεύσεις σας στο Blog σας

Όπως θα έχετε δει και εσείς, στα περισσότερα blogs κάτω από κάθε δημοσίευση υπάρχουν μερικά σχετικά άρθρα, με μικρογραφίες.

Ο κυριότερος λόγος να έχετε κάτι τέτοιο και στο δικό σας blog, είναι διότι μπορείτε να δείξετε στον αναγνώστη κάτι σχετικό, και έτσι να περάσει αρκετά περισσότερη ώρα στο blog σας, κάτι που μόνο θετικά αποτελέσματα μπορεί να φέρει σε εσάς.

Για όσους δεν έχουν καμία εξοικείωση με την επεξεργασία του κώδικα, υπάρχει πάντα η εύκολη και γρήγορη λύση, που μας την προσφέρει η σελίδα LinkWithin.

Για όσους πάλι θέλουν κάτι πιο παραμετροποιήσιμο, δείτε πόσο εύκολα μπορείτε να το προσθέσετε μόνοι σας, αλλάζοντας οτιδήποτε δεν σας αρέσει.

Από το αριστερό μενού του Blogger επιλέγουμε το [Πρότυπο] και [επεξεργασία HTML]

Καλό είναι πάντα για παν ενδεχόμενο, να κρατάμε αντίγραφα ασφαλείας. Για να το κάνουμε αυτό, πριν πατήσουμε [Επεξεργασία HTML] επιλέγουμε πάνω δεξιά [Δημιουργία αντιγράφου ασφαλείας / Επαναφορά] και μετά [λήψη πλήρους προτύπου].

Είμαστε λοιπόν στην Επεξεργασία HTML. Βάζουμε "τικ" στο κουτάκι στο επάνω μέρος του παραθύρου που λέει [Επέκταση προτύπων γραφικών στοιχείων].

Στην συνέχεια κάνουμε αναζήτηση ( CTRL + F ) για το παρακάτω:

</head>

Και αμέσως ΠΡΙΝ από αυτό κάνουμε επικόλληση τον παρακάτω κώδικα:

<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts  a:hover {
background-color:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvEHZMN7GrcNh14F0NuCqPAaVWcYNuzEoUsW-zXnbhL43rBFUw_vzg0DRNhBdlbTvsv3jqU2x1hmI_1zPdTJiS-NMr-o4CE8_VdpP-r3v4pjp3cx2Hcy6MeKDehzS2R0zUyF8Qzd5F6EQ/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://bloggergadgets.googlecode.com/files/related_posts_with_thumbnails_min.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

Στην συνέχεια κάντε πάλι αναζήτηση ( CTRL + F ) για ένα από τα παρακάτω. (Ένα από τα δύο θα υπάρχει στο blog σας, απλά είναι διαφορετικό σε κάποια τροποποιημένα πρότυπα.)

1. <div class='post-footer-line post-footer-line-1'>
2. <p class='post-footer-line post-footer-line-1'>

Μόλις το βρείτε, κάντε επικόλληση ακριβώς από κάτω, αυτόν τον κώδικα:

<!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html'><img style="border: 0" alt="Related Posts Widget For Blogger with Thumbnails" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a><a href='http://bloggertemplates.bloggerplugins.org/' ><img style="border: 0" alt="Blogger Templates" src="http://image.bloggerplugins.org/blogger-templates.png" /></a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->

Σημείωσεις

• Για να αλλάξετε τον τίτλο που θα φένεται πάνω από τα σχετικά άρθρα, βρείτε παραπάνω και επεξεργαστείτε αυτό το κομμάτι κώδικα:

var relatedpoststitle="Related Posts";

• Για να αλλάξετε τον αριθμό από σχετικά άρθρα που θα εμφανίζοντε, βρείτε και αλλάξτε τον παρακάτω κώδικα

var maxresults=5;

• Αν θέλετε τα σχετικά άρθρα να εμφανίζοντε σε όλες τις σελίδες, και όχι μόνο κάτω από τα άρθρα σας, βρείτε και διαγράψτε τις 4 γραμμές κώδικα που ξεκινούν με <!--Remove-->

• Σε περίπτωση που σε κάποιους δεν δουλέψει από την αρχή το script, βρείτε και αντικαταστήστε αυτό:

http://blogergadgets.googlecode.com/files/related-posts-for-blogger.js

με αυτό:

http://bloggergadgets.googlecode.com/files/related_posts_compressed.js

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

Πηγή

Παρόμοια άρθρα:

• http://helplogger.blogspot.gr/2012/03/how-to-add-related-posts-widget-to.html
• http://www.spiceupyourblog.com/2010/12/related-posts-thumbnails-below-posts.html