Καλησπέρα, σε αυτή την ανάρτηση θα ασχοληθούμε ξανά με τα σχόλια σας. Πιο αναλυτικά στο προηγούμενο Tip για τα σχόλια σας είχαμε δείξει για το πως μπορείτε να κάνατε πιο όμορφα, σε αυτό το Tip θα σας δείξουμε πως μπορείτε να αριθμήσετε τα σχόλια σας. Με αυτόν τον τρόπο θα ξέρετε ακριβώς σε ποιο σχόλιο είσαστε ή ακόμα και σε ποιο υποσχόλιο (απάντηση ενός σχόλιου). Ελπίζουμε όπως πάντα να σας αρέσει, επίσης είναι εύκολο και δεν θα σας πάρει καθόλου χρόνο για την τοποθέτηση του (Το Video Tutorial βρίσκεται πάντα στο τέλος της ανάρτησης).
1) Πρώτα, συνδεθείτε στο λογαριασμό σας Blogger.
2) Κάντε κλικ στο Σχεδίαση. και επιλέξτε Επεξεργασία HTML.
Προσοχή:
Πριν ξεκινήσουμε:
- Πρέπει να είστε προσεκτικοί κατά την αλλαγή του προτύπου σας.
- Πριν κάνετε οποιαδήποτε αλλαγή, αποθηκεύστε το πρότυπο σας σε ασφαλή μέρος (Στον υπολογιστή σας).
]]></b:skin>
4) Αντιγράψτε και επικολλήστε τον παρακάτω κώδικα ακριβώς πάνω από το ]]></b:skin>.
.comment-thread ol {
counter-reset: countcomments;
}
.comment-thread li:before {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizGfsDKa4h_UmZVVXxpDKizC6N9MF-MeGiz3Ox3oKmaPrz_WW_uykLBlBdb3Njpk4pRhqBehBve8LGMYS8esMv6928DlLGB-oW7FJHfkFmfMRBynPTn1ONW5jEZtqjOjW1kXWbqNAXr8nb/s1600/comment+bubble2.png") no-repeat scroll 0 0 transparent;
color: #000;
content: counter(countcomments, decimal);
counter-increment: countcomments;
float: right;
font-size: 30px;
height: 50px;
margin-left: 10px;
margin-top: 0px;
padding-left: 16px;
padding-top: 0px;
width: 50px;
}
.comment-thread ol ol {
counter-reset: contrebasse;
}
.comment-thread li li:before {
color: #000;
content: counter(countcomments, decimal) "." counter(contrebasse, lower-alpha);
counter-increment: contrebasse;
float: right;
font-size: 23px;
margin-top: 0px;
padding-left: 8px;
padding-top: 4px;
}
counter-reset: countcomments;
}
.comment-thread li:before {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizGfsDKa4h_UmZVVXxpDKizC6N9MF-MeGiz3Ox3oKmaPrz_WW_uykLBlBdb3Njpk4pRhqBehBve8LGMYS8esMv6928DlLGB-oW7FJHfkFmfMRBynPTn1ONW5jEZtqjOjW1kXWbqNAXr8nb/s1600/comment+bubble2.png") no-repeat scroll 0 0 transparent;
color: #000;
content: counter(countcomments, decimal);
counter-increment: countcomments;
float: right;
font-size: 30px;
height: 50px;
margin-left: 10px;
margin-top: 0px;
padding-left: 16px;
padding-top: 0px;
width: 50px;
}
.comment-thread ol ol {
counter-reset: contrebasse;
}
.comment-thread li li:before {
color: #000;
content: counter(countcomments, decimal) "." counter(contrebasse, lower-alpha);
counter-increment: contrebasse;
float: right;
font-size: 23px;
margin-top: 0px;
padding-left: 8px;
padding-top: 4px;
}
-Αποθηκεύσετε το πρότυπο.
Μπορείτε να αλλάξετε τα κόκκινα γράμματα, τα μπλε γράμματα και τα πράσινα γράμματα.
Τα κόκκινα γράμματα ειναι το λινκ των εικονιδιων, οπου υαπρχουν πισω απο τους αριθμους.
Τα μπλε γράμματα είναι το μέγεθος και "διεύθυνση" των αριθμών, δηλαδή πρέπει να δώσετε μεγάλη προσοχή όταν τα επεξεργάζεστε, αλλά και χρειάζεται να τα επεξεργαστείτε για να ρυθμίσετε το που ακριβώς θέλετε τους αριθμούς.
Τα πράσινα γράμματα είναι οι κώδικες από τα χρώματα των αριθμών.
Κώδικες χρωμάτων μπορείτε να βρείτε σε αυτήν την σελίδα: www.color-hex.com
Και αυτό ήταν, τώρα μπορείτε τώρα να χαρείτε τα καινούργια αριθμημένα σχόλια σας.
Σημιώσεις:
Μπορείτε να αλλάξετε τα κόκκινα γράμματα, τα μπλε γράμματα και τα πράσινα γράμματα.
Τα κόκκινα γράμματα ειναι το λινκ των εικονιδιων, οπου υαπρχουν πισω απο τους αριθμους.
Τα μπλε γράμματα είναι το μέγεθος και "διεύθυνση" των αριθμών, δηλαδή πρέπει να δώσετε μεγάλη προσοχή όταν τα επεξεργάζεστε, αλλά και χρειάζεται να τα επεξεργαστείτε για να ρυθμίσετε το που ακριβώς θέλετε τους αριθμούς.
Τα πράσινα γράμματα είναι οι κώδικες από τα χρώματα των αριθμών.
Κώδικες χρωμάτων μπορείτε να βρείτε σε αυτήν την σελίδα: www.color-hex.com
- Για το Demo ειναι το παρακατω βιντεο:
- Για ότι πρόβλημα υπάρξει μην διστάσετε να επικοινωνήστε μαζί μας μεσώ του
κουμπιού "Επικοινωνία" που θα βρείτε πάνω πάνω.
-Άμα σας αρέσουν οι αναρτήσεις μας παρακαλώ προωθήστε την ιστοσελίδα μας ή πατήστε το κουμπί παρακολούθηση στα δεξιά.
Ευχαριστούμε.
Πηγη κωδικα: helplogger
0 σχόλια:
Δημοσίευση σχολίου