Προσθήκη του QueryLoader (‘LazyLoad’) Script στο Blogger

Καλησπέρα στους αναγνώστες του bloggertips.gr.

Σήμερα θα σας δείξω πως μπορείτε να προσθέσετε στο blog σας το QueryLoader, ένα script το οποίο θα εμφανίζεται με το που μπαίνει κάποιος στο blog σας και δε θα φεύγει μέχρι να φορτώσει τελείως όλο το blog.
Δηλαδή, αντί να βλέπουν οι αναγνώστες σας να φορτώνει το ένα gadget μετά το άλλο, θα βλέπουν όλο το blog αφού φορτώσει το QueryLoader (ιδιαίτερα αν το blog σας είναι λιγάκι "βαρύ", αυτό το script μπορεί να φανεί ιδιαίτερα χρήσιμο).
Για να καταλάβετε τι εννοώ, κάντε κλικ εδώ.

Πάμε να δούμε τώρα πως θα το προσθέσουμε στο blog μας.

Διαδικασία:

1. Σύνδεση στο λογαριασμό blogger
2. Σχεδίαση
3. Επεξεργασία HTML
4. Με Ctrl + F αναζητούμε το </head> και ακριβώς πριν από αυτό επικολλούμε τον παρακάτω κώδικα:

<script src='http://code.jquery.com/jquery-1.5.min.js' type='text/javascript'/>
<script src='http://blogger-loader.googlecode.com/files/queryLoaderpre.js' type='text/javascript'/>

5. Με Ctrl + F αναζητούμε το </body> και ακριβώς πριν από αυτό επικολλούμε τον παρακάτω κώδικα:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<script>
QueryLoader.selectorPreload = &quot;body&quot;;
QueryLoader.init();
</script>
</b:if>

*Αν θέλετε να εμφανίζεται το συγκεκριμένο script μόνο στην αρχική σελίδα, αφήστε τον κώδικα όπως είναι.
Αν όμως θέλετε να εμφανίζεται σε όλες τις σελίδες του blog σας, σβήστε τις σειρές του παραπάνω κώδικα που έχω επισημάνει με bold (δηλαδή την πρώτη και την τελευταία σειρά του παραπάνω κώδικα).

6. Με Ctrl + F αναζητούμε το ]]></b:skin> και ακριβώς πριν από αυτό επικολλούμε τον παρακάτω κώδικα:

.QOverlay {
background-color: #000000;
z-index: 9999;
}

.QLoader {
background-color: #CCCCCC;
height: 1px;
}

.QAmt {
color:#FF530D;
font-size:50px;
font-weight:bold;
line-height:50px;
height:50px;
width:100px;
margin:-60px 0 0 -50px;
}

7. Αποθήκευση προτύπου και είμαστε έτοιμοι!

Προσοχή!
Αν υπάρχουν scripts ή files στο blog σας που έχουν πρόβλημα στο να φορτώσουν και δε φορτώνουν ουσιαστικά ποτέ, φαινόμενο που εμφανίζεται αρκετά συχνά, είναι λογικό και επόμενο να μην τελειώσει το "φόρτωμα" του QueryLoader ποτέ, με αποτέλεσμα να μην ανοίγει το blog σας.
Δοκιμάστε το και αν τα πάει καλά την πρώτη φορά, δεν υπάρχει πρόβλημα (εκτός βέβαια αν προσθέσετε scripts που δε φορτώνουν ποτέ στο μέλλον).


Πηγές: http://www.allblogtools.com/tricks-and-hacks/adding-queryloader-lazyload-script-for-blogger-and-customize-it/ + http://www.gayadesign.com/

Copyrights: http://www.bloggertips.gr/

Post by Secra from Web in Greece