Γεια σας, παρακάτω σας έχω γράψει ένα καλό τρικάκι που μπορείτε να προσθέσετε στο blog σας εύκολα και γρήγορα...
Υπάρχουν πολλά blogs που έχουν περισσότερους από έναν συγγραφέα .
Έτσι σκέφτηκα να δημιουργήσω ένα " πεδίο " κάτω από τις αναρτήσεις όπου μπορεί να μπει μια φωτογραφία και μια σύντομη περιγραφή κείμενου του συγγραφέα που έγραψε το κείμενο του κάθε blog.
Ο κωδικός αυτός αναπτύχθηκε για να χρησιμοποιηθεί σε blogs με περισσότερους από έναν συγγραφέα. Έτσι ώστε η περιγραφή αυτή του συγγραφέα να εμφανίζεται κάτω από τις αναρτήσεις που έγραψε.
Όλα αυτά αυτόματα χωρίς να χρειαστεί να τροποποιήσετε τίποτα στις αναρτήσεις .
1ο Βήμα : Κάνετε Login στο λογαριασμό του Blogger σας , Πηγαίνετε Διάταξη -> Επεξεργασία HTML και πατήστε στο κουτάκι Επέκταση προτύπων γραφικών στοιχείων .
2ο Βήμα : Πατήστε Ctrl + f και ψάξτε στο πρότυπό σας για την ετικέτα:
3ο Βήμα : Κολλήστε ακριβώς ΑΠΟ ΠΑΝΩ τον παρακάτω κώδικα :
Ο κώδικας CSS παραπάνω είναι τα χαρακτηριστικά του Author Box . Αν γνωρίζετε αρκετά για να αλλάξετε τις πιο βασικές CSS, όπως η αλλαγή των χρωμάτων και μεγεθών. Απλά αλλάξετε το στυλ με προσοχή και κατόπιν προσαρμόστε το widget.
4ο Βήμα : Ψάξτε (Ctrl + f) στο πρότυπό σας για τον κώδικα :
5ο Βήμα : Κολλήστε ακριβώς ΑΠΟ ΚΑΤΩ τον παρακάτω κώδικα :
<div id='post-footer-autor'>
<div id='autor-img'>
<img src='URL ΤΗΣ ΕΙΚΟΝΑΣ' style='width: 50px;height: 50px; border: 2px solid #b3b3b3; padding: 0; margin: 0;'/>
</div>
<div id='autor-box'>
<p>
ΠΕΡΙΓΡΑΦΗ ΤΟΥ ΣΥΓΓΡΑΦΕΑ ΕΔΩ
</p>
</div>
</div>
</b:if>
Αυτούς του κώδικες που έχω γράψει με κίτρινο είναι για το αν θέλετε να φαίνεται και στην αρχική ή μόνο στη σελίδα στης ανάρτησης(έτσι όπως είναι τώρα δεν θα φαίνεται στην αρχική, άμα θέλετε να φαίνεται και στην αρχική διαγράψτε τους κώδικες).
Ο παραπάνω κώδικας κάνει αναφορά σε έναν συγγραφέα!
Για να θέσουμε διαφορετικούς συγγραφείς απλά αντιγράψετε και επικολλήστε τον κώδικα πολλές φορές ακριβώς πάνω από τον πρώτο κώδικα , τόσες όσους συγγραφείς έχει το blog και απλά κάντε τις εξής αλλαγές:
Κάντε Προεπισκοηση πρώτα και αν είναι όλα εντάξει Αποθηκεύετε το πρότυπό σας και επαναλάβετε τη δοκιμή αν χρειαστεί .
Καλή επιτυχία σε όλους !!!
Υπάρχουν πολλά blogs που έχουν περισσότερους από έναν συγγραφέα .
Έτσι σκέφτηκα να δημιουργήσω ένα " πεδίο " κάτω από τις αναρτήσεις όπου μπορεί να μπει μια φωτογραφία και μια σύντομη περιγραφή κείμενου του συγγραφέα που έγραψε το κείμενο του κάθε blog.
Ο κωδικός αυτός αναπτύχθηκε για να χρησιμοποιηθεί σε blogs με περισσότερους από έναν συγγραφέα. Έτσι ώστε η περιγραφή αυτή του συγγραφέα να εμφανίζεται κάτω από τις αναρτήσεις που έγραψε.
Όλα αυτά αυτόματα χωρίς να χρειαστεί να τροποποιήσετε τίποτα στις αναρτήσεις .
1ο Βήμα : Κάνετε Login στο λογαριασμό του Blogger σας , Πηγαίνετε Διάταξη -> Επεξεργασία HTML και πατήστε στο κουτάκι Επέκταση προτύπων γραφικών στοιχείων .
2ο Βήμα : Πατήστε Ctrl + f και ψάξτε στο πρότυπό σας για την ετικέτα:
]]></b:skin>
3ο Βήμα : Κολλήστε ακριβώς ΑΠΟ ΠΑΝΩ τον παρακάτω κώδικα :
#post-footer-autor {
width: 90%;
height: 67px;
background: #e6e6e6;
border:3px solid #b3b3b3;
margin: 8px 0px 8px 0px;
font-family: 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif;
}
#autor-img { /* Avatar */
width: 54px;
height: 54px;
background: #fff;
float: left;
margin: 7px;
}
#autor-box {
padding-right: 5px;
margin: 0px;
}
#autor-box p{ / * Style text description * /
font-size: 12px;
padding: 10px;
margin: 0;
text-align: justify;
text-transform: normal;
color: #666666;
}
#autor-box a{ / * Style linked text * /
color: #000fcc;
text-decoration:none;
}
#autor-box a:hover {
color:#7780ee;
text-decoration:underline;
}
width: 90%;
height: 67px;
background: #e6e6e6;
border:3px solid #b3b3b3;
margin: 8px 0px 8px 0px;
font-family: 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif;
}
#autor-img { /* Avatar */
width: 54px;
height: 54px;
background: #fff;
float: left;
margin: 7px;
}
#autor-box {
padding-right: 5px;
margin: 0px;
}
#autor-box p{ / * Style text description * /
font-size: 12px;
padding: 10px;
margin: 0;
text-align: justify;
text-transform: normal;
color: #666666;
}
#autor-box a{ / * Style linked text * /
color: #000fcc;
text-decoration:none;
}
#autor-box a:hover {
color:#7780ee;
text-decoration:underline;
}
Ο κώδικας CSS παραπάνω είναι τα χαρακτηριστικά του Author Box . Αν γνωρίζετε αρκετά για να αλλάξετε τις πιο βασικές CSS, όπως η αλλαγή των χρωμάτων και μεγεθών. Απλά αλλάξετε το στυλ με προσοχή και κατόπιν προσαρμόστε το widget.
4ο Βήμα : Ψάξτε (Ctrl + f) στο πρότυπό σας για τον κώδικα :
<div class="post-footer">
η για το
<div id="post-footer">
η για το
<data:post.body/> (αν είναι πολλά, λογικά είναι το τελευταίο) και (με την προϋπόθεση ότι μετά/ακριβώς δίπλα από το <data:post.body/> δεν θα υπάρχει κάποιος άλλος κώδικας).
η για το
<div id="post-footer">
η για το
<data:post.body/> (αν είναι πολλά, λογικά είναι το τελευταίο) και (με την προϋπόθεση ότι μετά/ακριβώς δίπλα από το <data:post.body/> δεν θα υπάρχει κάποιος άλλος κώδικας).
5ο Βήμα : Κολλήστε ακριβώς ΑΠΟ ΚΑΤΩ τον παρακάτω κώδικα :
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.author == "ΟΝΟΜΑΣΙΑ ΤΟΥ ΣΥΓΓΡΑΦΕΑ"'><div id='post-footer-autor'>
<div id='autor-img'>
<img src='URL ΤΗΣ ΕΙΚΟΝΑΣ' style='width: 50px;height: 50px; border: 2px solid #b3b3b3; padding: 0; margin: 0;'/>
</div>
<div id='autor-box'>
<p>
ΠΕΡΙΓΡΑΦΗ ΤΟΥ ΣΥΓΓΡΑΦΕΑ ΕΔΩ
</p>
</div>
</div>
</b:if>
</b:if>
Αυτούς του κώδικες που έχω γράψει με κίτρινο είναι για το αν θέλετε να φαίνεται και στην αρχική ή μόνο στη σελίδα στης ανάρτησης(έτσι όπως είναι τώρα δεν θα φαίνεται στην αρχική, άμα θέλετε να φαίνεται και στην αρχική διαγράψτε τους κώδικες).
Ο παραπάνω κώδικας κάνει αναφορά σε έναν συγγραφέα!
Για να θέσουμε διαφορετικούς συγγραφείς απλά αντιγράψετε και επικολλήστε τον κώδικα πολλές φορές ακριβώς πάνω από τον πρώτο κώδικα , τόσες όσους συγγραφείς έχει το blog και απλά κάντε τις εξής αλλαγές:
- ΟΝΟΜΑΣΙΑ ΤΟΥ ΣΥΓΓΡΑΦΕΑ -> Βάλτε το ακριβές όνομα του συγγραφέα, το ίδιο όνομα χρήστη που χρησιμοποιείται στο λογαριασμό για να δημοσιεύσετε τις αναρτήσεις . Το όνομα πρέπει να είναι ακριβώς ίδιο αλλιώς ο κωδικός δεν θα λειτουργήσει σωστά.
Παράδειγμα: Στο blog μου χρησιμοποιώ για να συνδεθώ στο blog μου και να δημοσιεύσω ανάρτηση το όνομα: Ilias. Έτσι θα βάλω το : Ilias . Αν ήταν Admin Θα έπρεπε να βάλω το Admin, Αν ήταν iks-Team.com .Θα έπρεπε να βάλω το iks-Team.com .
- URL ΤΗΣ ΕΙΚΟΝΑΣ -> Τοποθετήστε το σύνδεσμο εικόνας που χρησιμοποιείται ως avatar . Υπενθυμίζοντας ότι το link θα πρέπει να έχει μια άμεση διαδρομή προς την εικόνα με μέγεθος 50px Χ 50px . Μην ξεχνάτε το http://
- ΠΕΡΙΓΡΑΦΗ ΤΟΥ ΣΥΓΓΡΑΦΕΑ ΕΔΩ -> Βάλτε το κείμενο της περιγραφής του συγγραφέα .Μπορείτε να γράψετε οτι θέλετε εσείς . Κάντε την δοκιμή, ώστε το κείμενο να μην περάσει το όριο των πεδίων του widget.
Χρησιμοποιήστε αν θέλετε και τις συνδέσεις που θέλετε στο πλαίσιο της περιγραφής.
ΣΗΜΑΝΤΙΚΟ : Εάν το blog σας έχει περισσότερους από έναν συγγραφέα, επικολλήστε τον κώδικα ακριβώς πάνω από τον πρώτο κώδικα όσο συχνά απαιτείται και κάντε την επεξεργασία τους, έτσι ώστε ο κάθε συγγραφέας έχει τον κωδικό του.
Κάντε Προεπισκοηση πρώτα και αν είναι όλα εντάξει Αποθηκεύετε το πρότυπό σας και επαναλάβετε τη δοκιμή αν χρειαστεί .
Καλή επιτυχία σε όλους !!!