GADGETS FOR BLOGS

Facebook Google plus YouTube Pinterest Tumblr DIIGO Start.me feedburner

ΠΩΣ ΒΑΖΩ SLIDESHOW ΜΕ ALBUMS ΤΟΥ PICASA No 1

PICASA SLIDESHOW
ΠΩΣ ΒΑΖΩ SLIDESHOW ΜΕ ALBUMS ΤΟΥ PICASA No 1
Με τον παρακάτω κώδικα μπορούμε να βάλουμε στο blog μας ένα slideshow από το picasa ή το google+ χωρίς κουμπιά πλοήγησης αλλά σε ότι διαστάσεις θέλουμε είναι πλήρως προσαρμόσιμο και χωρίς το ενοχλητικό περίγραμα των 40px που έχει το slideshow που δίνει η picasa. Την διαστάση την ρυθμίζετε αλλάζοντας το imgmax: 800, τον χρόνο εναλλαγής των εικόνων τον ρυθμίζετε αλλάζοντας το time: 4000, τον αριθμό των εικόνων που θα εμφανίζονται τον ρυθμίζετε αλλάζοντας το maxresults: 100, την περιγραφή της κάθε εικόνας μπορείτε να την εμφανίσετε αλλάζοντας το caption: false, σε caption: true, το link προς το άλμπουμ το ενεργοποιήτε αλλάζοντας το albumlink: false σε albumlink: true. 
Μην ξεχάσετε να αλλάξετε τον πράσινο id του χρήστη picasa και το κίτρινο albumid του άλμπουμ picasa που θέλετε να ενσωματώσετε στο slideshow σας. To user-id θα το βρείτε στην γραμμή διεύθυνσης όταν προβάλετε την αρχική σελίδα του προφίλ σας στο picasa. Το album-id θα το βρείτε προβάλοντας ένα album του picasa και πατώντας στο μέσον της δεξιάς πλευρικής μπάρας του picasa τον σύνδεσμο με μπλέ γράμματα που γράφει RSS. Μόλις το πατήσετε θα εμφανιστεί στην γραμμή διεύθυνσης και ο αριθμός id χρήστη και ο αριμθός id του album picasa. Αντιγράψτε τον και αντικαταστήστε αυτόν με τα κίτρινα νούμερα. Μετά αντιγράφετε όλον τον κώδικα σε όποιο σημείο του blog σας θέλετε ακόμα και μέσα σε μία σελίδα ή ανάρτηση. Δείτε παρακάτω από τον κώδικα πως θα φαίνεται το picasa slideshow.

<style>
.googleslides {padding:3px;overflow:hidden;}
.googleslide  {display:none;position:relative;}
.googleslide a:link {text-decoration:none;}
.googleslide img {min-width:inherit;max-width:inherit;}
.googleslide .caption {padding: 5px 5px 5px 10px; }
.googleslide .captionWrapper {background-color:#000000;color:white;opacity:0.6;
filter:alpha(opacity=60);height:30px;padding:0;bottom:4px;overflow:none;position:absolute;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="http://yourjavascript.com/86412219536/picasa-slideshow-1.js" type="text/javascript"></script>
<div id='slides'></div>
<script>
$('#slides').googleslides({userid:'101745641470758574647', albumid:'5968355009445977585',
imgmax: 800, time: 4000, fadespeed: 400, maxresults: 100, random: false, caption: false, albumlink: false});
</script>

Δεν υπάρχουν σχόλια:

Δημοσίευση σχολίου

► Γράψτε το σχόλιό σας στο λευκό κουτί και αν θέλετε να ειδοποιηθήτε για την απάντηση τσεκάρετε το κουτάκι "Να λαμβάνω ειδοποιήσεις".

Σημείωση: Μόνο ένα μέλος αυτού του ιστολογίου μπορεί να αναρτήσει σχόλιο.