GADGETS FOR BLOGS

Facebook Google plus YouTube Pinterest Tumblr Delicius DIIGO Start.me NETVIBES feedburner

ΠΩΣ ΑΛΛΑΖΩ ΧΡΩΜΑ ΣΤΗΝ SCROLL BAR TOY BLOG ΜΟΥ

SCROLL BAR COLOR
ΠΩΣ ΑΛΛΑΖΩ ΧΡΩΜΑ ΣΤΗΝ SCROLL BAR TOY BLOG ΜΟΥ
Αν θέλετε να ξεχωρίζει καλύτερα η scroll bar στο blog σας μπορείτε να προσθέσετε 5 γραμμές κώδικα μέσα σε ένα gadget ή ακόμα καλύτερα μέσα στο πρότυπο του blog σας και να βάλετε τα χρώματα της αρεσκείας σας, αλλά και να της αλλάξετε και το πάχος. Ο κώδικας μπάνει απλά σαν gadget ή και εντός του προτύπου σας πρίν την ετικέτα ]]></b:skin> την οποία θα την αναζητήσετε με την βοήθεια των πλήκτρων Ctrl+F. Σας έχω και τις 2 περιπτώσεις όποια θέλετε βάλτε. Αν τα χρώματα που έχω χρωματίσει τους 6ψήφιους κωδικούς δεν σας αρέσουν βάλτε τους δικούς σας κωδικούς χρωμάτων.

ΠΩΣ ΑΝΕΒΑΖΩ HTML ΣΕΛΙΔΕΣ ΚΑΙ ΠΑΙΡΝΩ ΤΑ LINK ΤΟΥΣ

HTML PAGE
ΠΩΣ ΑΝΕΒΑΖΩ HTML ΣΕΛΙΔΕΣ ΚΑΙ ΠΑΙΡΝΩ ΤΑ LINK ΤΟΥΣ
Μπορείτε να αποθηκεύσετε μια ή περισσότερες html σελίδες στο codeply.com και να πάρετε τα link τους και να τα μοιράσετε όπου θέλετε. Θα χρειαστεί να κάνετε ένα λογαριασμό στο codeply.com για να γίνει αυτό. Οι σελίδες μπορούν να περιέχουν εκτός από html κώδικα και css, script, iframe και πολλά άλλα. Αφού εισάγετε τους κώδικες σώζετε την σελίδα και παίρνετε ένα μοναδικό σχετικά σύντομο link που σας δίνει το codeply για να το χρησιμοποιήσετε όπου θέλετε. Δείτε το παρακάτω βίντεο για περισσότερες λεπτομέριες.

ΠΙΝΑΚΑΣ ΜΕ ALT CODES SYMBOLS

ALT CODES LIST
ΠΙΝΑΚΑΣ ΜΕ ALT CODES SYMBOLS
Σίγουρα θα έχετε χρειαστεί σε κάποια φάση να είσάγετε κάποιο σύμβολο δίπλα σε έναν αριθμό ή σε κάποια λέξη και δεν θα το βρίσκατε στο πληκτρολόγιο. Όπως για παράδειγμα το σύμβολο των βαθμών Κελσίου δίπλα σε ένα αριθμό ή των μοιρών μιας γωνίας. Δηλαδή να γράψετε 35° C,  ή να εισάγετε στο κείμενό σας μία καρδούλα χωρίς να ψάχνετε μέσα στις γραμματοσειρές, στα ειδικά σύμβολα. 

ΠΟΛΥ ΕΥΚΟΛΟΙ HEX CODES ΧΡΩΜΑΤΩΝ ΓΙΑ ΤΟ BLOG ΣΑΣ No 4.

HEX COLOR CODES
ΠΟΛΥ ΕΥΚΟΛΟΙ HEX CODES ΧΡΩΜΑΤΩΝ ΓΙΑ ΤΟ BLOG ΣΑΣ No 4.
Στον παρακάτω πίνακα μπορείτε να βρείτε εύκολους hexadecimal color codes που θα χρειαστείτε για να δώσετε το δικό σας style στις αναρτήσεις σας, τα gadgets σας και τα κείμενά σας. Αν θέλετε κάποιο ενδιάμεσο χρώμα που δεν υπάρχει στον παρακάτω πίνακα μπορείτε να πάτε στο τέλος και δεξιά αυτού του ιστολογίου όπου υπάρχει ειδικό widget γεννήτρια χρωμάτων και των δεκαεξαδικών κωδικών τους. Οι κωδικοί των παρακάτων πινάκων είναι οι πλέον ευκολότεροι που υπάρχουν. Αποστηθίστε τους να τους θυμάστε εύκολα και να μην ψάχνετε πίνακες.

ΕΥΚΟΛΟΙ HEX & RGB ΚΩΔΙΚΕΣ ΧΡΩΜΑΤΩΝ ΓΙΑ ΤΟ BLOG ΣΑΣ Νο 3

HEX, RGBA CODES
ΕΥΚΟΛΟΙ HEX & RGB ΚΩΔΙΚΕΣ ΧΡΩΜΑΤΩΝ ΓΙΑ ΤΟ BLOG ΣΑΣ.
Στον παρακάτω πίνακα μπορείτε να βρείτε εύκολους hexadecimal color codes και RGB color codes που θα χρειαστείτε για να δώσετε το δικό σας style στις αναρτήσεις σας, τα gadgets σας και τα κείμενά σας. Αν θέλετε κάποιο ενδιάμεσο χρώμα που δεν υπάρχει στον παρακάτω πίνακα μπορείτε να πάτε στο τέλος και δεξιά αυτού του ιστολογίου όπου υπάρχει ειδικό widget γεννήτρια χρωμάτων και των δεκαεξαδικών κωδικών τους. Αποστηθίστε τους πιο εύκολους και αυτούς που δουλεύετε συχνά για να μην ψάχνετε πίνακες.

ΠΩΣ ΦΤΙΑΧΝΩ ΣΕΛΙΔΑ ΑΡΧΕΙΟΘΗΚΗ ΑΝΑΡΤΗΣΕΩΝ No 4

ΣΕΛΙΔΑ ΑΡΧΕΙΟΘΗΚΗ
ΠΩΣ ΦΤΙΑΧΝΩ ΣΕΛΙΔΑ ΑΡΧΕΙΟΘΗΚΗ ΑΝΑΡΤΗΣΕΩΝ No 4
Για να εξοικονομήσετε χώρο και να διώξετε την πτυσόμενη αρχειοθήκη του blogger υπάρχει αυτό το widget που εμφανίζει όλες τις αναρτήσεις σας σε μία σελίδα που μπορείτε να την πείτε ALL MY POSTS ή ARCHIVE PAGE ή όπως αλλιώς θέλετε. Ο κώδικας αυτός εμφανίζει όλες τις αναρτήσεις που έχετε κάνει στο ιστολόγιό σας με την χρονολογική σειρά που τις έχετε κάνει, ανεξαρτήτως αριθμού (μπορεί να τις εμφανίζει όλες δηλαδή).

CAROUSEL SCROLLING VIDEO SLIDER

VIDEO SLIDER
CAROUSEL SCROLLING VIDEO SLIDER
Αυτό είναι ένα carousel scrolling video slider είναι πολύ απλό και ελαφρύ δεν χρειάζεται να φορτώσει jquery και είναι προσαρμόσιμο σε πλάτος, ύψος, αριθμό videos και ταχύτητα κύλισης. Στο πρώτο width:960px; height:200px; αλλάζετε το πλατος και το ύψος του slider στο τρίτο width:200px; height:200px; αλλάζετε το πλάτος και το ύψος των video που βρίσκονται εντός του slider. Αντικαταστήστε τα δικά μου γαλάζια links των video με τα δικά σας. Δείτε το ακριβώς κάτω από εδώ .

MEGA MENU ΜΕ ΠΟΛΥΣΤΗΛΑ ΥΠΟΜΕΝΟΥ ΚΑΙ SOSIAL ICONS

mega menu
MEGA MENU ΜΕ ΠΟΛΥΣΤΗΛΑ ΥΠΟΜΕΝΟΥ ΚΑΙ SOSIAL ICONS.
Το παρακάτω mega menu αποτελείται από έγχρωμα buttons και έγχρωμα υπομενού που περιέχουν links από 1 εώς 5-6 στήλες ανάλογα με το πλάτος ιστολογίου που διαθέτετε. Αντικαταστήστε τα γαλάζια links και τους κίτρινους τίτλους των μενού με δικά σας. Τα χρώματα μπορείτε να τα αλλάξετε αλλάζοντας τον 6ψήφιο αριθμό που βρίσκεται μετά το σύμβολο της δίεσης #. Η θέση των υπομενού αλλάζει εκεί που γράφει position:relative;left:55px; και οι διαστάσεις των υπομενού εκεί που γράφει width:270px;

ACCORDION MENU No 3

ACCORDION MENU
ACCORDION MENU No 3
Αυτό είναι ένα άλλο accordion menu με ένα υπομενού το οποίο ανοίγει και κλείνει το υπομενού του όταν πατήσετε πάνω στο μενού του. Μπαίνει απλά σαν gadget. Το πλάτος του μενού το ρυθμίζετε αλλάζοντας το width: 240px; Την γραματοσειρά και το μέγεθός της τη ρυθμίζετε αλλάζοντας το font:14px arial; και το font:12px arial; Το background και το χρώμα κειμένου του μενού το ρυθμίζετε αλλάζοντας το background: #FF4500; και το color:#FFF; Εννοείται πως πρέπει να βάλετε τα δικά σας link και περιγραφές αντικαθιστώντας τα δικά μου γαλάζια links και τις κίτρινες και πορτοκαλί περιγραφές των τίτλων.

POP UP WINDOW ΜΕ ΠΡΟΤΕΙΝΟΜΕΝΕΣ ΑΝΑΡΤΗΣΕΙΣ

POPUP WINDOW
POP UP WINDOW ΜΕ ΠΡΟΤΕΙΝΟΜΕΝΕΣ ΑΝΑΡΤΗΣΕΙΣ
Με τον παρακάτω κώδικα μπορείτε να βάλετε ένα pop up window σε κάποιες αναρτήσεις του blog σας που να προτείνει στον αναγνώστη να διαβάσει κάποιες άλλες σχετικές αναρτήσεις με αυτήν που διαβάζει εκείνη τη στιγμή. Τον κώδικα αυτόν πρέπει να τον βάλετε στο τέλος του κώδικα HTML της ανάρτησης και αφού έχετε βάλει στην ανάρτηση αυτή απαραιτήτως read more για να μην εκτελείται το script στην αρχική σελίδα σας αλλά μόνο όταν ανοίγει ο αναγνώστης την συγκεκριμένη ανάρτηση.

ΠΤΥΣΟΜΕΝΟ WIDGET

ΠΤΥΣΟΜΕΝΟ WIDGET
ΠΩΣ ΒΑΖΩ ΠΤΥΣΟΜΕΝΟ WIDGET (FLOATING WIDGET)
Με αυτό το πτυσόμενο widget μπορείτε να εξοικονομήσετε χώρο στην πλευρική σας μπάρα ή όπου αλλού θέλήσετε να το βάλετε, γιατί εμφανίζεται αρχικά στο μέγεθος ενός κουμπιού και μόλις το πατήσετε ανοίγει και δείχνει το περιεχόμενό του. Στο συγκεκριμένο ως περιεχόμενο έχω βάλει περίπου 100 radio + tv buttons.

ΑΝΤΙΚΑΤΑΣΤΑΣΗ ΤΟΥ BLOGSPOT.GR ΜΕ ΤΟ BLOGSPOT.COM

REDIRECT TO BLOGSPOT.COM
ΑΝΤΙΚΑΤΑΣΤΑΣΗ ΤΟΥ BLOGSPOT.GR ΜΕ ΤΟ BLOGSPOT.COM
Όλα τα blogs του που είναι φτιαγμένα στο blogger ανακατευθήνονται αυτόματα από την google από blogspot.com σε blogspot.gr ή σε κάποια άλλη κατάληξη χώρας στην οποία έχει φτιαχτεί το blog αυτό. Για να αποφύγετε αυτή την ανακατεύθηνση βάλτε μέσα στο πρότυπο πρίν την ετικέτα </head> το παρακάτω σύντομο script, σώστε το πρότυπό σας και δείτε το αποτέλεσμα.

3D SLIDESHOW WITH CUBES EFFECT

3D SLIDESHOW WITH CUBES EFFECT
Το παρακάτω 3D slideshow έχει κουμπιά πλοήγησης δεξιά και αριστερά του, αλλά δεν ξεκινάει αυτόματα. Οι φωτογραφίες του αλλάζουν με 2 διαφορετικά 3d εφέ σπάζοντας σε κύβους κάθετους και οριζόντιους. Αλλάξτε τα γαλάζια και τα πράσινα link των εικόνων με τα δικά σας link. Το μέγεθος των εικόνων μπορείτε να το προσαρμόσετε αλλάζοντας τα γαλάζια νούμερα που είναι δίπλα από τα πράσινα links των εικόνων. 

PHOTO GALLERY ΜΕ ΠΕΡΙΓΡΑΦΗ ΚΑΙ ΔΙΚΟ ΣΑΣ STYLE

PHOTO GALLERY
PHOTO GALLERY ΜΕ ΠΕΡΙΓΡΑΦΗ ΚΑΙ ΔΙΚΟ ΣΑΣ STYLE
Αυτή είναι μία photo gallery με περιγραφή και δικό της style. Μπορείτε να αλλάξετε το χρώμα του background και του χρώματος κειμένου της περιγραφής αλλάζοντας τους 6ψήφιους κωδικούς χρωμάτων  εκεί που γράφει background και color. Το ίδιο πρέπει να κάνετε και για το περίγραμμα των εικόνων αλλάξτε το border: 1px solid #FBBB22; Οι διαστάσεις των εικόνων ρυθμίζονται εκεί που γράφει width:160px;height:100px; εντός του κώδικα style αλλά και αμέσως μετά τα πράσινα links των εικόνων. 

3D CAROUSEL SLIDESHOW

3D CAROUSEL SLIDER
3D  CAROUSEL SLIDESHOW
Το παρακάτω 3D carousel slideshow έχει την δυνατότητα να εμφανίζει πολλές φωτογραφίες μαζί σε οριζόντια διάταξη, εμφανίζωντας πρώτα την μεσαία φωτογραφία της λίστας και εσεις με τα κουμπιά πλοήγησης μπορείτε να δείτε είτε τις επόμενες είτε τις προηγούμενες. Δεν ξεκινάει αυτόματα δηλαδή. Το μέγεθος των εικόνων μπορείτε να το προσαρμόσετε αλλάζοντας τα γαλάζια νούμερα εκεί που γράφει, width:640px;height:400px

BOOTSTRAP CAROUSEL SLIDESHOW ME NAVIGATION BUTTONS ΚΑΙ ΠΕΡΙΓΡΑΦΗ

CAROUSEL SLIDESHOW
BOOTSTRAP CAROUSEL SLIDESHOW ME NAVIGATION BUTTONS ΚΑΙ ΠΕΡΙΓΡΑΦΗ
Στο παρακάτω slideshow μπορείτε να βάλετε όσες εικόνες θέλετε, σε ότι διαστάσεις θέλετε, και σε κάθε μία από αυτές να εμφανίζεται κάτω αριστερά η περιγραφή που θέλετε. Το συγκεκριμένο slideshow διαθέτει και κουμπιά πλοήγησης για να βλέπετε τις επόμενες ή τις προηγούμενες εικόνες του.

ΜΟΡΦΟΠΟΙΗΣΗ ΗΜΕΡΟΜΗΝΙΑΣ ΚΑΙ ΩΡΑΣ ΑΝΑΡΤΗΣΗΣ

BLOGGER DATE
ΜΟΡΦΟΠΟΙΗΣΗ ΗΜΕΡΟΜΗΝΙΑΣ ΚΑΙ ΩΡΑΣ ΑΝΑΡΤΗΣΗΣ
Μπορείτε να μορφοποιήσετε την ημερομηνία και την ώρα ανάρτησης και να εμφανίζεται σε άλλη θέση, με άλλο χρώμα κειμένου και άλλο χρώμα background. Πηγαίνετε μέσα στην επεξεργασία του προτύπου σας και αναζητήστε με τα πλήκτρα Ctrl+F την ετικέτα h2.date-header ή σε άλλα πρότυπα .date-header και αλλάξτε τα νούμερα του margin: 0 -5px 1px

ΠΩΣ ΔΙΑΜΟΡΦΩΝΩ ΤΟ ΚΟΥΜΠΙ READ MORE

READ MORE BUTTON
ΠΩΣ ΔΙΑΜΟΡΦΩΝΩ ΤΟ ΚΟΥΜΠΙ READ MORE.
Για να μορφοποιήσετε το κουμπί read more πηγαίνετε μέσα στο πρότυπο του blog σας και αναζητήστε με τα κουμπιά Ctrl+F την ετικέτα ]]></b:skin> και πρίν από αυτήν επικολλήστε τις παρακάτω 2 γραμμές κώδικα. Εννοείται ότι μπορείτε να αλλάξετε την γραμματοσειρά και το μέγεθός της εκεί που γράφει font:13px; Arial; και το χρώμα background και περιγράμματος που αλλάξει στην από κάτω γραμμή κώδικα.

ΠΩΣ ΕΝΣΩΜΑΤΩΝΩ ΜΟΥΣΙΚΗ ΑΠΟ ΤΟ OPENDRIVE

OPENDRIVE
ΠΩΣ ΕΝΣΩΜΑΤΩΝΩ ΜΟΥΣΙΚΗ ΑΠΟ ΤΟ OPENDRIVE
Για να έχουμε σε δικό μας χώρο μουσική και να μην εξαρτώμαστε από τρίτους ανεβάζουμε τα μουσικά αρχεία MP3 σε ένα φάκελο στο opendrive.com. Μετά πηγαίνουμε στο μουσικό κομμάτι που θέλουμε να ενσωματώσουμε και στα δεξιά του πατάμε το εικονίδιο «share». Παίρνουμε τον 2ο σύνδεσμο που μας δίνει ο οποίος είναι το direct link και έχει κατάληξη .mp3 Αν το κομμάτι που θα επιλέξουμε έχει ελληνικό ονομα θα βγάζει πολύ μεγάλο link για αυτό καλό είναι τα κομμάτια να τα μετονομάσετε σε greekenglish. Το opedrive λοιπόν μας δίνει ένα direct link το οποίο είναι αυτής της μορφής :

ΠΩΣ ΒΑΖΩ FACEBOOK PHOTO GALLERY WIDGET 2

FACEBOOK PHOTO GALLERY
ΠΩΣ ΒΑΖΩ FACEBOOK PHOTO GALLERY WIDGET
Για να ενσωματώσετε στο blog σας ένα άλμπουμ με φωτογραφίες από το facebook πηγαίνετε στην διεύθυνση http://facebookgalleria.com συνδεθήτε με το facebook προφίλ σας στην εφαρμογή, και εισάγετε στα κουτάκια που θα βρείτε εκεί το link του άλμπουμ και πόσες γραμμές και στήλες θέλετε να έχει η photo gallery καθώς επίσης και το μέγεθος των εικόνων. Μετά πατήστε το τελευταίο κουμπί που γράφει Generate code και θα σας δώσει έναν κώδικα iframe τον οποίο θα τον επικολλήσετε στο HTML της ανάρτησης ή της σελίδας σας στον blogger.

ΠΩΣ ΒΑΖΩ FACEBOOK PHOTO GALLERY WIDGET 1

FACEBOOK PHOTO GALLERY
ΠΩΣ ΒΑΖΩ FACEBOOK PHOTO GALLERY WIDGET
Για να ενσωματώσετε στο blog σας ένα άλμπουμ με φωτογραφίες από το facebook πηγαίνετε στην διεύθυνση https://embedsocial.com/marketing-apps/facebook-gallery-plugin/#freeversion
Και εισάγετε στο κουτάκι που θα βρείτε εκεί το link του άλμπουμ που είναι ανεβασμένο στο προφίλ σας ή στην facebook page σας. Μετά πατήστε το διπλανό κουμπί που γράφει Generate album code και θα σας δώσει έναν κώδικα iframe τον οποίο θα τον επικολλήσετε στο HTML της ανάρτησης ή της σελίδας σας στον blogger

ΠΩΣ ΒΑΖΩ GOOGLE PLUS SLIDESHOW

GOOGLE+ SLIDESHOW
ΠΩΣ ΒΑΖΩ GOOGLE PLUS SLIDESHOW
Μπορείτε να βάλετε ένα google plus slideshow στο blog σας αρκεί να γνωρίζετε το όνομα χρήστη ή το id χρήστη του προφίλ σας ή της σελίδας που έχετε στο google plus. Αυτά βρίσκονται στην γραμμή διεύθυνσης url όταν προβάλετε ένα άλμπουμ που έχετε στο προφίλ σας ή στη σελίδα σας στο google plusΑφού αντιγράψετε αυτά τα 2 id χρήστη και άλμπουμ, πηγαίνετε στη σελίδα

ΑΡΧΕΙΟΘΗΚΗ ΜΕ ΕΙΚΟΝΙΔΙΑ, ΠΕΡΙΓΡΑΦΗ ΚΑΙ PAGE NAVIGATION

ΑΡΧΕΙΟΘΗΚΗ
ΑΡΧΕΙΟΘΗΚΗ ΜΕ ΕΙΚΟΝΙΔΙΑ, ΠΕΡΙΓΡΑΦΗ ΚΑΙ PAGE NAVIGATION
Με τον παρακάτω κώδικα μπορείτε να εμφανίσετε σε μία σελίδα του blogger όλες τις αναρτήσεις του ιστολογίου σας με εικονίδια, περιγραφή και page navigation. Ανοίξτε μία σελίδα του blogger, πατήστε την HTML διάταξη και επικολλήστε μέσα στη σελίδα τον παρακάτω κώδικα. Αυτά που μπορείτε να αλλάξετε είναι :

ΑΥΤΟΜΑΤΗ ΑΡΧΕΙΟΘΗΚΗ ΣΕ ΚΑΡΤΕΛΕΣ

ΑΡΧΕΙΟΘΗΚΗ ΑΝΑΡΤΗΣΕΩΝ
ΑΥΤΟΜΑΤΗ ΑΡΧΕΙΟΘΗΚΗ ΣΕ ΚΑΡΤΕΛΕΣ
Με τον παρακάτω κώδικα μπορείτε να εμφανίσετε σε μία σελίδα του blogger όλες τις αναρτήσεις του ιστολογίου σας ανά κατηγορίες ετικετών μέσα σε καρτέλες με την κάθε μία από αυτές να έχει το δικό της χρώμα background. Ανοίξτε μία σελίδα του blogger, πατήστε την HTML διάταξη και επικολλήστε μέσα στη σελίδα τον παρακάτω κώδικα.

IMAGE CAPTION HOVER EFFECT

CAPTION IMAGE EFFECT
IMAGE CAPTION HOVER EFFECT
Με τον παρακάτω κώδικα μπορείτε να βάλετε εικόνες οι οποίες όταν περνάτε το ποντίκι από πάνω τους θα μετακινούνται στα δεξιά και θα αποκαλύπτεται ένα κείμενο με την περιγραφή τους. Όταν βγάλετε το ποντίκι από πάνω τους τότε το κείμενο της περιγραφής θα καλύπτεται πάλι από την εικόνα. Οι διαστάσεις των συγκεκριμένων εικόνων είναι 314Χ196 και αν θέλετε να τις αλλάξετε πρέπει να το κάνετε σε όλα τα σημεία που θα τις συναντήσετε μέσα στον κώδικα.

TEXT BOX ΜΗΝΥΜΑΤΩΝ ΜΕ ΕΦΕ ΓΡΑΦΟΜΗΧΑΝΗΣ

TEXT EFFECT
TEXT BOX ΜΗΝΥΜΑΤΩΝ ΜΕ ΕΦΕ ΓΡΑΦΟΜΗΧΑΝΗΣ
Με τον παρακάτω κώδικα μπορείτε να βάλετε ένα text box με μηνύματα που θα εμφανίζονται με εφέ γραφομηχανής. Μπορείτε στην 1η γραμμή του κώδικα style να αλλάξετε το χρώμα background, το χρώμα το τύπο και το μέγεθος της γραμματοσειράς και τέλος το πάχος και το χρώμα του περιγράμματος του text box. Εντός του κώδικα texarea  μπορείτε να αλλάξετε τις στήλες (cols=30) και τις γραμμές (rows=10) του text box. Αλλάξτε τις προτάσεις που έχω χρωματίσει με κίτρινα και σομόν γράμματα με τις δικές σας προτάσεις. Οι προτάσεις δεν πρέπει να είναι μεγάλες. Δεν θα λειτουργήσει το gadget με μεγάλες προτάσεις. Δείτε το ακριβώς κάτω από εδώ .

ΠΩΣ ΒΑΖΩ LINKS ΜΕΣΑ ΣΕ TABS (ΚΑΡΤΕΛΕΣ)

TABS WIDGET
ΠΩΣ ΒΑΖΩ LINKS ΜΕΣΑ ΣΕ TABS (ΚΑΡΤΕΛΕΣ)
Με τον παρακάτω κώδικα μπορούμε να βάλουμε links με άλλα sites ή blogs ή έγγραφα ή εικόνες, ή βίντεο μέσα σε καρτέλες (tabs). Ο κώδικας αυτός μπαίνει απλά σαν gadget συνήθως στο υποσέλιδο του blog σας όπου υπάρχει μεγάλο πλάτος. Βάλτε τις δικές σας περιγραφές, αντικαθιστώντας τις δικές μου με τα κίτρινα γράμματα. Μετά διαγράψτε τα δικά μου μώβ link και βάλτε τα δικά σας. Αν θέλετε μπορείτε να αλλάξετε και τα χρώματα των καρτέλων αλλάζωντας τους 6ψήφιους κωδικούς που έχουν μπροστά τους το σύμβολο της δίεσης #.

SHOW / HIDE WIDGET BUTTON

SHOW HIDE BUTTON
SHOW / HIDE WIDGET BUTTON
Ο παρακάτω κώδικας μας επιτρέπει με το πάτημα ενός button να εμφανίζουμε και να κρύβουμε ένα widget κερδίζοντας έτσι χώρο στο blog μας. Εσείς απλά τοποθετήστε ένα κώδικα στη θέση του δικού μου κώδικα iframe και αλλάξτε την περιγραφή του κουμπιού που έχω επισημάνει με κίτρινα γράμματα. Τα υπόλοιπα αφήστε τα ως έχουν. Δείτε το κουμπί σε λειτουργία ακριβώς κάτω από εδώ .

ΠΡΟΣΦΑΤΑ ΣΧΟΛΙΑ ΜΕ AVATAR No 2

ΠΡΟΣΦΑΤΑ ΣΧΟΛΙΑ
ΠΡΟΣΦΑΤΑ ΣΧΟΛΙΑ ΜΕ AVATAR No 2
Με τον παρακάτω κώδικα θα εμφανίζονται τα πιο πρόσφατα σχόλια που έχουν γίνει στο blog σας και δίπλα τους στο αριστερό μέρος θα εμφανίζεται και το avatar αυτού που σχολίασε. Μπορείτε να αλλάξετε το πόσα σχόλια θα εμφανίζονται αλλάζοντας το &max-results=10. Μπορείτε να αλλάξετε το πόσοι χαρακτήρες θα εμφανίζονται στο κάθε σχόλιο αλλάζοντας το characters||250. Το μέγεθος του avatar αλλάζει εκεί που γράφει height: 50px;width: 50px;

SLIDESHOW WITH MOUSE WHEEL SCROLLING

SCROLLING SLIDESHOW
SLIDESHOW WITH MOUSE WHEEL SCROLLING
Το παρακάτω slideshow αλλάζει τις εικόνες του εάν πάμε το ποντίκι μας πάνω από αυτές και κάνουμε scrolling το ροδάκι του ποντικιού μας. Θα χρειαστεί να αλλάξετε τα πράσινα links των εικόνων του με δικές σας εικόνες, οι οποίες πρέπει να έχουν όλες την ίδια διάσταση. Το πρώτο γαλάζιο link αφορά την εικόνα που θα εμφανίζεται πρίν ακόμα κάνετε scrolling με το ροδάκι του ποντικιού σας. Ο κώδικας είναι πολύ απλός και μπαίνε απλά σαν gadget ακόμα και μέσα στον κώδικα html της ανάρτησής σας όπως το έχω βάλει εγώ ακριβώς κάτω από εδώ .

ΚΑΘΕΤΟ CAROUSEL SLIDESHOW No 2

SLIDESHOW CAROUSEL
ΚΑΘΕΤΟ CAROUSEL SLIDESHOW No 2
Το παρακάτω slideshow έχει την δυνατότητα να εμφανίζει πολλές φωτογραφίες μαζί σε κάθετη διάταξη και για κάθε μία εικόνα που παρέρχεται από πάνω εμφανίζεται και μία από κάτω. Επίσης διαθέτει και κουμπιά πλοήγησης. Το μέγεθος των εικόνων μπορείτε να το προσαρμόσετε αλλάζοντας τα γαλάζια νούμερα. Το πόσες εικόνες θα εμφανίζονται ταυτόχρονα στο slideshow το ρυθμίζεται αλλάζοντας το data-cycle-carousel-visible=3. Το πόσο γρήγορα θα εναλλάσονται οι εικόνες του slideshow το ρυθμίζετε αλλάζοντας το data-cycle-timeout=1000. Δείτε το σε λειτουργία ακριβώς κάτω απο εδώ .

ΚΑΘΕΤΟ CAROUSEL SLIDESHOW No 1

SLIDESHOW CAROUSEL
ΚΑΘΕΤΟ CAROUSEL SLIDESHOW No 1
Το παρακάτω carousel slideshow εμφανίζει τις εικόνες του καθέτως αντί οριζοντίως όπως συνήθως. Το πλάτος και το ύψος των εικόνων του είναι 160px; και 100px; αντίστοιχα και αλλάζει στην 4η γραμμή από το τέλος του κώδικα style. Το συνολικό πλάτος και ύψος του slideshow είναι 180px; και 550px; αντίστοιχα και αλλάζει στην 1η  ,11η, και 12η γραμμή του κώδικα styleΟ αριθμός των εικόνων που θα αλλάζουν σε κάθε πέρασμα του slideshow αλλάζει στο 4ο script και είναι χρωματισμένος με κίτρινο χρώμα (itemstodisplay: 4,). 

CAROUSEL SLIDESHOW WITH AUTO MOUSE SCROLLING

SLIDESHOW CAROUSEL
CAROUSEL SLIDESHOW WITH AUTO MOUSE SCROLLING
Αυτό είναι ένα carousel slideshow το οποίο κινείται όταν μετακινήσετε το ποντίκι σας δεξιά ή αριστερά. Το πλάτος του είναι αυτόματο, ενώ το ύψος του μαζί με το εσωτερικό του περίγραμμα είναι 110px και μπορείτε να το αλλάξετε στην πρώτη γραμμή του κώδικα style. Το ύψος μαζί και με τα δύο περιγράμματα (εσωτερικό και εξωτερικό) είναι 120px και μπορείτε να το αλλάξετε στην 7η γραμμή του κώδικα style. Το πλάτος και το ύψος των εικόνων του slideshow είναι 160px και 100px και μπορείτε να το αλλάξετε στη 8η γραμμή του κώδικα style.

ΜΟΡΦΟΠΟΙΗΣΗ ΤΟΥ BLOG PAGER

ΜΟΡΦΟΠΟΙΗΣΗ ΤΟΥ BLOG PAGER
Μπορείτε να αλλάξετε τα χρώματα background του blog pager και των links του, προσθέτωντας 3-4 γραμμές κώδικα στην ενότητα Posts που βρίσκεται πρίν την ετικέτα ]]></b:skin> Αναζητήστε με τα πλήκτρα Ctrl+F την ετικέτα #blog-pager και όταν μεταφερθήτε σε αυτήν σβήστε την και στη θέση της αντιγράψτε τις παρακάτω 4 γραμμές κώδικα.

SLIDESHOW WITH TUMBNAILS No 7

SLIDESHOW WITH THUMBNAILS
SLIDESHOW WITH TUMBNAILS No 7
Το παρακάτω slideshow μας δείχνει τις εικόνες του στο μέγεθος που θα του ορίσουμε όταν πατήσουμε με το ποντίκι μας πάνω στις μικρογραφίες των εικόνων που εμφανίζονται στο κάτω μέρος του slideshow. Είναι πολύ απλό και μπορεί να μπεί σαν gadget σε οποιοδήποτε σημείο του blog μας αρκεί να προσαρμόσουμε τις διαστάσεις του. Οι διαστάσεις του slideshow μπορούν να αλλάξουν αλλάζοντας το width:960px; στη 2η γραμμή του κώδικα και το height:600px; στη 3η γραμμή του κώδικα.

ΠΟΥ ΝΑ ΑΝΕΒΑΣΩ ΔΩΡΕΑΝ ΤΙΣ ΦΩΤΟΓΡΑΦΙΕΣ ΜΟΥ

FREE IMAGE HOSTING
50 FREE IMAGE HOSTING SITES
Παρακάτω έχω συγκεντρώσει 55 image hosting sites που μπορείτε να ανεβάσετε δωρεάν τις φωτογραφίες σας. Θα πρέπει να κοιτάξετε πόσο χώρο δίνουν δωρεάν, αν έχουν την δυνατότητα ενσωμάτωσης slideshow και photo gallery, αν μπορούν να δεχτουν, εκτός από εικόνες και βίντεο. Σημαντικό είναι επίσης να μπορούν να σας παρέχουν ιδιωτικά και δημόσια links των άλμπουμ και των εικόνων αυτών μεμονομένα. Κάντε κλίκ στο link του site θα ανοίξει για να το δείτε σε νέα καρτέλα.