RSS

ΠΡΟΣΘΗΚΗ ΔΙΑΧΩΡΙΣΤΙΚΗΣ ΓΡΑΜΜΗΣ ΑΝΑΜΕΣΑ ΣΤΑ ΣΧΟΛΙΑ

03 Απρ.

Πολλές φορές όταν διαβάζουμε τα σχόλια σε ένα blog μπερδευόμαστε, ιδιαίτερα όταν είμαστε κουρασμένοι και όταν το template του blog είναι μονόχρωμο όπως τα minima templates του blogspot. Μπορούμε να βάλουμε μια διαχωριστική γραμμή ανάμεσα στα σχόλια έτσι ώστε να ξεχωρίζουν ευκολότερα που αρχίζουν και που τελειώνουν. Η όλη διαδικασία κρατάει λίγα λεπτά.
Μπαίνουμε στο λογαριασμό μας και από τον πανόπτη πάμε διάταξη και επεξεργασία HTML. Πριν προχωρήσουμε παίρνουμε ένα αντίγραφο ασφαλείας (back up) του template μας για κάθε ενδεχόμενο. Μετά πατάμε Control και F (Ctrl+F) για να ανοίξει το ψαχτήρι στο κάτω μέρος της σελίδας. Πληκτρολογήστε: #comments-block .comment-footer { όσοι χρησιμοποιείτε minima templates και όσοι δε χρησιμοποιείτε minima πληκτρολογείστε .comment-footer {. Αυτόματα θα εμφανιστεί τονισμένο με χρώμα το κομμάτι του κώδικα που βάλαμε στο ψαχτήρι μας. Στην αμέσως επόμενη σειρά κάνουμε αντιγραφή επικόλληση (copy – paste) αυτό: border-bottom:1px dotted $bordercolor; Εμφανίζει μια λεπτή γραμμή ανάμεσα στα σχόλια. Αν δεν ικανοποιείστε από το αποτέλεσμα αντικαταστήστε το με αυτό: border-bottom:2px solid #736AFF; (προσωπικά το προτιμώ). Αυτό το κομμάτι του κώδικα κάνει τη γραμμή πιο έντονη και μπορείτε να αλλάξετε το χρώμα της απλά αλλάζοντας τον κωδικό χρώματος που είναι με κόκκινο χρώμα. Για το πως βρίσκουμε τους κωδικούς του κάθε χρώματος κάντε κλικ εδώ ή ψάξτε στο internet για color generators.
Αν η διαχωριστική γραμμή φαίνεται να είναι πολύ κοντά ή πολύ μακριά από το σχόλιο τότε βρείτε το παρακάτω κομμάτι του κώδικα ή αν δεν υπάρχει προσθέστε το εσείς: padding:0 0 1px 0; όπως βλέπετε έχει τέσσερις τιμές. Η πρώτη είναι για κενό από πάνω, η δεύτερη για κενό από δεξιά, η τρίτη για κενό από κάτω και η τέταρτη για κενό από αριστερά. Για παράδειγμα το 1px σημαίνει ότι αυξήσαμε το κενό από κάτω. Αλλάζοντας τις τιμές αλλάζει και η θέση της διαχωριστικής γραμμής. Πάντως δεν είναι απαραίτητο αυτό το τελευταίο για να δουλέψει το trick. Πατήστε αποθήκευση (save) και μπείτε στο blog σας για να δείτε τα αποτελέσματα. Καλή επιτυχία! 🙂

Advertisements
 
Σχολιάστε

Posted by στο Απρίλιος 3, 2009 in BLOG, BLOGGER, BLOGSPOT, BORDERS, TEMPLATE, TUTORIALS

 

Σχολιάστε

Εισάγετε τα παρακάτω στοιχεία ή επιλέξτε ένα εικονίδιο για να συνδεθείτε:

Λογότυπο WordPress.com

Σχολιάζετε χρησιμοποιώντας τον λογαριασμό WordPress.com. Αποσύνδεση / Αλλαγή )

Φωτογραφία Twitter

Σχολιάζετε χρησιμοποιώντας τον λογαριασμό Twitter. Αποσύνδεση / Αλλαγή )

Φωτογραφία Facebook

Σχολιάζετε χρησιμοποιώντας τον λογαριασμό Facebook. Αποσύνδεση / Αλλαγή )

Φωτογραφία Google+

Σχολιάζετε χρησιμοποιώντας τον λογαριασμό Google+. Αποσύνδεση / Αλλαγή )

Σύνδεση με %s

 
Αρέσει σε %d bloggers: