Latest Blog News: Διαβάζετε πάντα και τα ΣΧΟΛΙΑ των αναρτήσεων!

Περιγραφή συγγραφέως ( Author Box) στο τέλος των αναρτήσεων


Print Friendly and PDFPrintPrint Friendly and PDFPDF

Γεια σας, παρακάτω σας έχω γράψει ένα καλό τρικάκι που μπορείτε να προσθέσετε στο 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;
}

Ο κώδικας CSS παραπάνω είναι τα χαρακτηριστικά του Author Box . Αν γνωρίζετε αρκετά για να αλλάξετε τις πιο βασικές CSS, όπως η αλλαγή των χρωμάτων και μεγεθών. Απλά αλλάξετε το στυλ με προσοχή και κατόπιν προσαρμόστε το widget.

4ο Βήμα :  Ψάξτε  (Ctrl + f)  στο πρότυπό σας  για τον κώδικα :

<div class="post-footer">
η για το
<div id="post-footer">
η για το  
<data:post.body/> (αν είναι πολλά, λογικά είναι το τελευταίο) και (με την προϋπόθεση ότι μετά/ακριβώς δίπλα από το <data:post.body/> δεν θα υπάρχει κάποιος άλλος κώδικας).

5ο Βήμα :  Κολλήστε ακριβώς ΑΠΟ ΚΑΤΩ τον παρακάτω κώδικα :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:post.author == &quot;ΟΝΟΜΑΣΙΑ ΤΟΥ ΣΥΓΓΡΑΦΕΑ&quot;'>
<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 σας έχει περισσότερους από έναν συγγραφέα, επικολλήστε τον κώδικα ακριβώς πάνω από τον πρώτο κώδικα   όσο συχνά απαιτείται και κάντε την  επεξεργασία τους, έτσι ώστε ο κάθε συγγραφέας έχει τον κωδικό του.

 Κάντε Προεπισκοηση πρώτα και αν είναι όλα εντάξει Αποθηκεύετε το πρότυπό σας  και επαναλάβετε τη δοκιμή αν χρειαστεί .
Καλή επιτυχία σε όλους !!!

Stumble
Delicious
Technorati
Twitter
Facebook

14 comments:

Euzonas είπε...

Awesome...! Thanks a lot...!!!!

Jeronimo είπε...

Καλησπέρα φίλε μου το έκανα όπως είπες αλλα δεν έγινε τίποτα, εκτός αν γίνει απο τις απο εδω και πέρα αναρτίσεις μου και οχι στις προηγούμενες, οσο για το όνομα έβαλα αυτο που κάνω το LOG IN οχι το ψευδόνυμο μου

iks-Team είπε...

Τι εννοείς δεν έγινε τίποτα...
γίνε ποιο συγκεκριμένος(δεν βρήκες κάποιον κώδικα, τα βρήκες όλα αλλά απλώς δεν φαίνεται ή .....)?

Jeronimo είπε...

εβαλα τους κωδικες κανονικα αλλαξα οτι ηταν να αλλαξω απο αυτα που ειχες βαλει να αλλξουμε, πατησα αποθηκευση αλλα δν ειδα να εχει το κειμενακι που εγραψα ουτε την φωτο μου, λογικα στο κατω μερος καθε ανρτησης μου θα εβλεπα να ειχε την φωτο ενα κειμενακι ε?

Jeronimo είπε...

εκει που λες ονομασια Συγραφεα τι πρεπει να βαλω το Jeronimo ή αυτο που βαζω για να κανω log in στο blogger/home ?

iks-Team είπε...

Δοκίμασε να βάλεις το όνομα που έχεις όταν βάζεις αναρτήσεις.
π.χ. Jeronimo

περιμένω νέα σου!!:):):)

Euzonas είπε...

Καλησπέρα...
Εμένα εμφανίζεται στο πάνω μέρος της ανάρτησης...κάνω κάτι λάθος...?

Jeronimo είπε...

Καλησπέρα σου έστειλα mail οκ

iks-Team είπε...

@EuzonasΓια ξαναπροσπάθησε μία γιατί άλλαξα τον κώδικα. Πιστεύω να λειτουργεί σωστά τώρα! Και σου τονίζω ότι για όνομα συγγραφέα πρέπει να βάλεις αυτό που έχεις στο Blogger(Euzonas).

iks-Team είπε...

@JeronimoJeronimo δεν έλαβα κάποιο email από εσένα... Πάντως διάβασε αυτά που έγραψα και στον Euzona και πιστεύω ότι δεν θα χρειαστεί να μου στείλεις email.

Euzonas είπε...

Thanks ... Ola goodd !! Sry for greeklish... y ubuntu dont have greek... ;'(!

alterMode είπε...

Oute kai se mena egine kati. :/
An sundeontai kai oi duo admins apo to idio account tote tha prepei na mbei to koino name tous h' ginetai kai ksexwrista?


sry gia ta greeklish,alla opws kai o prohgumenos xrhsimopoiw ubuntu ;)

xiao είπε...

Romantic pink is a tender pretty girl can best embody the links of london color; the stars also began to become followers of and romanticpink, aroused a sweet and romantic agitation. See below nine groups pink star.

iks-Team.com είπε...

alterMode αν μπαίνετε και οι δυο διαχειριστές από τον ίδιο λογαριασμό πρέπει μπει το όνομα του λογαριασμού, δηλαδή το όνομα του προφίλ στο blogger που είναι διαχειριστής στο blog και λογικά είναι το alterMode.

Δημοσίευση σχολίου

Παρακαλούμε τους φίλους αναγνώστες:

ΟΧΙ SPAM,
ΟΧΙ GREEKLISH,
ΟΧΙ ΠΡΟΣΒΛΗΤΙΚΑ ΣΧΟΛΙΑ

Παρακαλώ το σχόλιό σας να είναι σχετικό με την παραπάνω ανάρτηση.
Γενικές απορίες μόνο στη σελίδα μας στο facebook.

 
© Copyright 2009-14 bloggertips.gr | All rights reserved. | Επικοινωνία | LK Magazine v2 from Lasantha | Πίσω στην ΚΟΡΥΦΗ | | Subscribe in a reader (Google,Yahoo κα)

* free blogger tips,tricks,gadgets,widgets,templates,themes,help,hacks,design,domains,xml,html,blogspot.gr *