Δευτέρα 25 Μαΐου 2009

Print this post

ΑΥΞΟΜΕΙΩΣΗ ΜΕΓΕΘΟΥΣ ΑΝΑΡΤΗΣΕΩΝ

Καλημέρα και καλή εβδομάδα. Σήμερα έχω να μοιραστώ μαζί σας ένα καταπληκτικό widget. Τι κάνει αυτό το widget; Όπως βλέπετε στα δεξιά έχουμε μια εικόνα η οποία απεικονίζει Α- και A+. Πατώντας συνεχώς το Α+ αυξάνεται το μέγεθος της γραμματοσειράς που απαρτίζει την ανάρτηση. Πατώντας το Α- συνεχώς τα γράμματα μικραίνουν συνεπώς και η ανάρτηση. Είναι ένα χρήσιμο εργαλείο για πολλούς αναγνώστες που έχουν κάποιο πρόβλημα με την όραση τους. Το βρήκα στο bloghacktips.blogspot.com και η προσθήκη του είναι πανεύκολη.
Μπείτε στο λογαριασμό του blogspot σας και από εκεί πάτε πανόπτης, διάταξη, προσθήκη gadget και HTML/JavaScript (Layout>Add a Gadget>HTML/JavaScript). Κάντε αντιγραφή - επικόλληση (copy - paste) τον παρακάτω κώδικα και πατήστε αποθήκευση (save).

<script language="JavaScript" src="http://bloghacktips.googlepages.com/font.js"></script><div class="central" style="width: 80; height: 19"><span style="font-family:Arial;"><b><br /><br /><a href="javascript:decreaseFontSize();">A-</a><span style="font-size: 200%"> <a href="javascript:increaseFontSize();">A+</a></span></b></span></div><a href="http://bloghacktips.blogspot.com/2009/04/font-size-is-always-problem-for-blogger.html"><span style="font-size: 70%"></span></a>

UPDATE: Επειδή κάποιοι συνάντησαν δυσκολίες με το συγκεκριμένο trick θα αναφέρω άλλους δυο τρόπους για το πως θα επιτευχθεί η αυξομείωση των fonts στο blog.
Αν θέλετε να έχετε κουμπί αυξομείωσης όπως το παρακάτω screenshot:

βάλτε τον παρακάτω κώδικα όπως κάθε άλλο gadget:

Change Text Size<br/> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='.5em'"><span >+</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='1em'"><span >+</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='1.5em'"><span >+</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='2em'"><span >+</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='2.5em'"><span >+</span></a>

Αν θέλετε τα κουμπιά αυξομείωσης να δείχνουν όπως το παρακάτω screenshot:

βάλτε τον παρακάτω κώδικα όπως κάθε άλλο gadget:

Change Text Size<br/>
<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='.5em'"><span >Small</span></a>
<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='1em'"><span >Medium</span></a>
<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='1.5em'"><span >Large</span></a>
<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='2em'"><span >Larger</span></a>
<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='2.5em'"><span >Largest</span></a>

7 σχόλια:

  1. καλημέρα. ΠΟλύ καλό.
    Προσπάθησα να φτιάξω και το Tag cloud αλλά δεν εμφανίζονταν στη σελίδα του blog. Κρίμα και είναι πολύ όμορφο.
    Νίκος

    ΑπάντησηΔιαγραφή
  2. @Νίκος Εφόσον δουλεύουν σ' εμένα σίγουρα θα δουλέψουν και σ' εσένα. Προσπάθησε λιγάκι. Όσο για το Tag cloud Θα εμφανίζει τα tags από τις αναρτήσεις που θα κάνεις μετά την προσθήκη του και πρόσεξε το χρώμα των γραμμάτων να μην είναι μαύρο όπως το χρώμα του template σου.

    ΑπάντησηΔιαγραφή
  3. τελειο και χρησιμο, (οπως ολα οσα δημοσιευεις)...
    εχω φτασει στο σημειο να φτιαχνω συνεχεια νεα
    blogs για να εφαρμοζω τις καινουργιες αναρτησεις σου, αμα δεν χωρανε στα προηγουμενα sites μου...
    ευχαριστω ρε jimmy !!!!

    ΑπάντησηΔιαγραφή
  4. @pan de lees Πόσα ιστολόγια έφτιαξες μέχρι στιγμής; Μπορείς να φτιάξεις ένα blog όπου εκεί θα τεστάρεις ότι θέλεις και θα πειραματίζεσαι.

    ΑπάντησηΔιαγραφή

back to top