Δευτέρα 16 Ιανουαρίου 2012

6 ΑΡΙΘΜΟΣ ΣΧΟΛΙΩΝ ΔΙΠΛΑ ΑΠΟ ΤΟΝ ΤΙΤΛΟ

Πώς θα σας φαινόνταν δίπλα στο τίτλο των αναρτήσεων σας να εμφανιζόταν ο αριθμός των σχολίων μέσα σε ένα συννεφάκι?Αυτό θα δείξουμε σε αυτή την ανάρτηση...Τα βήματα είνια απλά...ΠΑΜΕ
►Σχεδίαση►Επεξεργασία HTML►Τσεκάρουμε Επέκταση Προτύπων Γραφικών στοιχείων

  • Ψάχνουμε(ctrl-f) το επόμενο...
<h3 class='post-title entry-title'>

....και αμέσως κάτω απο αυτό επικολλήστε τον κωδικό

<!--COMMENT-BUBBLES-STARTS--><b:if cond='data:post.allowComments'>
<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>
</b:if><!--COMMENT-BUBBLES-STOPS-->


  • Τώρα βρείτε την φράση.... 
</head>
....και πάνω απο αυτήν επικολλήστε
<!--COMMENT-BUBBLES-STARTS--><style type='text/css'>
.comment-bubble {
float: right;

background: url(url-image) no-repeat;
width: 45px;
height: 50px;

font-size: 8px;
margin-top: 0px;
margin-right: -14px;
text-align: center;
}
</style><!--COMMENT-BUBBLES-STOPS-->

Αυτά που έχω επισημάνει με άλλο χρώμα είναι αυτά που πρέπει να αλλάξετε.Μπορείτε να κάνετε αναζήτηση στο internet και να βρείτε comments bubbles,θα βρείτε αρκετά και εδώ(FINDICONS/COMMENT CLOUD) ,κάνετε copy image location  και επικόλληση στο url-image.Στην συνέχεια μένει να προσαρμόσετε το ύψος και το πλάτος,να βάλετε ίδιο με τα (px) της εικόνας σας.Κάθε φορά που θα αλλάζετε κάτι θα πατάτε προεπισκόπηση για τυχόν λάθη πρίν την αποθήκευση.
ΑΠΟΘΗΚΕΥΣΗ ΠΡΟΤΥΠΟΥ!






ΑΝ ΣΑΣ ΑΡΕΣΕ ΤΟ ΑΡΘΡΟ ΒΑΘΜΟΛΟΓΗΣΤΕ Ή ΑΦΗΣΤΕ ΤΟ ΣΧΟΛΙΟ ΣΑΣ!!!

6 σχόλια:

evaggelos evaggelou είπε...

Κατ΄αρχήν συγχαρητήρια για το blog, Το βρήκα τυχαία και βλέπω πολλά και ενδιαφέροντα θέματα, θα ήθελα να ρωτήσω επειδή έχω και εγώ στο blog μου κάτι παρόμοιο όμως θα ήθελα το συννεφάκι με τα σχόλια να έχει τόσο μικρή διάμετρο όπως ακριβώς το βλέπω εδώ, έχω δοκιμάσει να βάλω μικρότερες εικόνες ΄΄συνεφάκια΄΄ όμως οι αριθμοί που εμφανίζουν τον αριθμό σχολίων είναι μεγαλύτεροι απ΄ότι η εικόνα, πρέπει να αλλάξω κάτι στον κώδικα για να γίνει όπως το περιγράφεις εδώ;

Σ΄ευχαριστώ..

http://www.lovefortechnology.net/

Blog ActDesign είπε...

Καλησπέρα Vaggeli.Αυτό που θα αλλάξεις στον παραπάνω κωδικό είναι width: 45px;
height: 50px;...Θα βάλεις ακριβώς τα px που είναι το εικονίδιο σου..Πιστεύω να βοήθησα.Πές μου αν λύθηκε το πρόβλημα !

evaggelos evaggelou είπε...

Σε ευχαριστώ για την απάντηση, όμως παρ΄όλα αυτά ενώ η εικόνα που ανεβάζω για τα σχόλια είναι ακριβώς όπως τη θέλω η γραμματοσειρά που εμφανίζει τον αριθμό των σχολίων εξακολουθεί να είναι μεγάλη

δες για παράδειγμα εδώ στην φωτό :

http://dl.dropbox.com/u/3475149/Pictures%20Sharing/test.png

μήπως να αφαιρέσω τελείως τον κώδικα και να βάλω το δικο σου;

Blog ActDesign είπε...

Προτείνω πρώτα να αλλάξεις στον κωδικό το εξής:
font-size: 8px;

Μείωσε τα px και πάτα προεπισκόπηση να δείς αν διορθώθηκε.Αυτός ο κωδικός αφορά το μέγεθος της γραμματοσειράς.Πιστεύω τώρα να βρέθηκε η λύση.

evaggelos evaggelou είπε...

Έφτιαξα κάτι πολύ καλύτερο από αυτό που είχα,όμως το μέγεθος της γραμματοσειράς και να το μειώσω δεν έχει καμία επίδραση, απ΄ότι παρατήρησα τον κώδικα COMMENT-BUBBLES-STARTS τον βρίσκω σε τρία σημεία, δηλαδή εκτός από τα βήματα που περιγράφεις στο πρότυπό μου υπάρχει και εδώ : http://dl.dropbox.com/u/3475149/Pictures%20Sharing/test1.png

Προφανώς υπάρχει κάποιο λάθος στο πρότυπο μου ως προς αυτό το σημείο.

Δεν πειράζει δε θα σκάσω και όλας μια χαρά είναι τώρα.Σε ευχαριστώ για τις συμβουλές σου.

kwnnie είπε...

Γεια σου.
Θα ήθελα να σε ρωτήσω,για να βάλουμε αυτούς τους κωδικούς πως πάμε;
Δε βρίσκω την Επέκταση Προτύπων Γραφικών στοιχείων.
Ευχαριστώ εκ των προτέρων
Καλά Χριστούγεννα:)

Αναγνώστες

ShareThis

Για να λαμβάνετε όλες τις ενημερώσεις μέσω Facebook.Απλά κάντε κλίκ στο like button και γίνετε μέλη

Powered By | Useful Gadgets



 

Powered By Software Review