Κατά το γενικότερο κύμα αλλαγών που πλήττουν το blog τον τελευταίο καιρό θα έχετε παρατηρήσει πως πολλές από τις εικόνες πλέον δεν ανοίγουν σε νέα σελίδα, αντ' αυτού μεγεθύνονται στην οθόνη σας (στο πραγματικό τους μέγεθος) ενώ το background σκοτεινιάζει για να αφήσει σε πρώτο πλάνο την οθόνη.
Το συγκεκριμένο εφέ πραγματοποιείται με τη χρήση ενός script με το όνομα Lightbox 2. Αυτό που έχετε να κάνετε είναι να κατεβάσετε το script από εδώ και να ανεβάσετε τα αρχεία lightbox.css, builder.js, effects.js, lightbox.js, prototype.js, scriptaculous.js που βρίσκονται στο rar σε κάποιο server (όσοι έχετε λογαριασμό google/blogger μπορείτε να χρησιμοποιήσετε το google pages). Έπειτα θα πρέπει να πάτε στο blogger > Settings > Layout > Edit HTML και να επικολλήσετε ακριβώς πριν το </head> του template που χρησιμοποιείται τα παρακάτω:
*Αλλάζετε το serverpath με το path όπου βρίσκεται το κάθε αρχείο.
Δεν τελειώσαμε ακόμα. Για κάθε εικόνα που ανεβάσατε στο post σας θα πρέπει να της πείτε να ανοίγει με το lightbox. Edit Html λοιπόν στον editor του blogger μέχρι να βρείτε τον παρακάτω κώδικα:
Αντικαταστήστε τον με: rel="lightbox"
(αν χρησιμοποιείται την ενσωματωμένη δυνατότητα του blogger για upload των φωτογραφιών σας (και όχι το flickr π.χ.) υπάρχει ένα μικρό θεματάκι [δεν θα δουλέψει].
Διαβάζοντας των κώδικα θα δείτε κάτι σαν αυτό:
απλά αφαιρέστε το -h.
Το συγκεκριμένο εφέ πραγματοποιείται με τη χρήση ενός script με το όνομα Lightbox 2. Αυτό που έχετε να κάνετε είναι να κατεβάσετε το script από εδώ και να ανεβάσετε τα αρχεία lightbox.css, builder.js, effects.js, lightbox.js, prototype.js, scriptaculous.js που βρίσκονται στο rar σε κάποιο server (όσοι έχετε λογαριασμό google/blogger μπορείτε να χρησιμοποιήσετε το google pages). Έπειτα θα πρέπει να πάτε στο blogger > Settings > Layout > Edit HTML και να επικολλήσετε ακριβώς πριν το </head> του template που χρησιμοποιείται τα παρακάτω:
<link href='http://serverpath.com/lightbox.css' media='screen' rel='stylesheet' type='text/css'/>
<script src='http://serverpath.com/prototype.js' type='text/javascript'/>
<script src='http://serverpath.com/scriptaculous.js?load=effects,builder' type='text/javascript'/>
<script src='http://serverpath.com/lightbox.js' type='text/javascript'/>
*Αλλάζετε το serverpath με το path όπου βρίσκεται το κάθε αρχείο.
Δεν τελειώσαμε ακόμα. Για κάθε εικόνα που ανεβάσατε στο post σας θα πρέπει να της πείτε να ανοίγει με το lightbox. Edit Html λοιπόν στον editor του blogger μέχρι να βρείτε τον παρακάτω κώδικα:
onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"
Αντικαταστήστε τον με: rel="lightbox"
(αν χρησιμοποιείται την ενσωματωμένη δυνατότητα του blogger για upload των φωτογραφιών σας (και όχι το flickr π.χ.) υπάρχει ένα μικρό θεματάκι [δεν θα δουλέψει].
Διαβάζοντας των κώδικα θα δείτε κάτι σαν αυτό:
href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbNxKiYdKTxnppYhJ8x9el4tQKchbsMJiwkLALuUKfUlDNwmOkVmIFqg-eIG9C8zdaI-3AjRiSQEDe-B4e5NhCKVoCg5fh51fDIYsO8brR1hcRzaQub1U3zZD9eTZKAsm6QPG6/s1600-h/800sunflower.jpg"
απλά αφαιρέστε το -h.
Κάντε κλικ στην εικόνα για μεγέθυνση!!
0 comments:
Δημοσίευση σχολίου