• SANTORINI

    SANTORINI

  • SANTORINI

    SANTORINI

  • ZAKYNTHOS

    ZAKYNTHOS

  • LEYKADA

    LEYKADA

  • KEFALLONIA

    KEFALLONIA

  • KERKYRA

    KERKYRA

  • RODOS

    RODOS

GADGETS FOR BLOGS

YouTube GITHUB CODEBERG Start.me CODEPLY WORDPRESS PASTEBIN.COM JSFIDDLE CODEPEN CODEPEN

SLIDESHOW WITH THUMBNAILS No 8

SLIDESHOW WITH THUMBNAILS
SLIDESHOW WITH THUMBNAILS No 8
Το παρακάτω slideshow μας δείχνει τις εικόνες του στο μέγεθος που θα του ορίσουμε όταν πατήσουμε με το ποντίκι μας πάνω στις μικρογραφίες των εικόνων που εμφανίζονται στο κάτω μέρος του slideshow. Μπορεί να μπεί σαν gadget σε οποιοδήποτε σημείο του blog μας αρκεί να προσαρμόσουμε τις διαστάσεις του.

SLIDESHOW WITH THUMBNAILS No 7

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

SLIDESHOW WITH THUMBNAILS No 6

SLIDESHOW WITH THUMBNAILS
SLIDESHOW WITH THUMBNAILS No 6
Το παρακάτω slideshow με thumbnails έχει διαστάσεις 800px Χ 400px, ξεκινάει αυτόματα να δείχνει τις εικόνες του και έχει και την δυνατότητα να επιλέξουμε τις εικόνες που θέλουμε να δούμε από τις μικρογραφίες των εικόνων που εμφανίζονται κάθετα στο δεξιό μέρος του slideshow. Μπορεί να μπεί σαν gadget σε οποιοδήποτε σημείο του blog μας αρκεί να προσαρμόσουμε τις διαστάσεις του.

SLIDESHOW WITH THUMBNAILS No 5

SLIDESHOW WITH THUMBNAILS
SLIDESHOW WITH THUMBNAILS No 5
Το παρακάτω slideshow με thumbnails ξεκινάει αυτόματα και μας δείχνει τις εικόνες του στο μέγεθος που θα του ορίσουμε, και έχει και την δυνατότητα να επιλέξουμε να δούμε κάποιες εικόνες από τις μικρογραφίες των εικόνων που εμφανίζονται στο κάτω μέρος του slideshow. Μπορεί να μπεί σαν gadget σε οποιοδήποτε σημείο του blog μας αρκεί να προσαρμόσουμε τις διαστάσεις του. Οι διαστάσεις του slideshow μπορούν να αλλάξουν αλλάζοντας τα γαλάζια νούμερα στη 2η και 3η γραμμή του κώδικα.

SLIDESHOW WITH THUMBNAILS No 4

SLIDESHOW WITH THUMBNAILS
SLIDESHOW WITH THUMBNAILS No 4
Το παρακάτω slideshow μας δείχνει τις εικόνες του στο μέγεθος που θα του ορίσουμε όταν πατήσουμε με το ποντίκι μας πάνω στις μικρογραφίες των εικόνων που εμφανίζονται στο κάτω μέρος του slideshow. Είναι πολύ απλό και μπορεί να μπεί σαν gadget σε οποιοδήποτε σημείο του blog μας αρκεί να προσαρμόσουμε τις διαστάσεις του. Οι διαστάσεις του slideshow μπορούν να αλλάξουν αλλάζοντας τα γαλάζια νούμερα στη 2η γραμμή του κώδικα. Οι διαστάσεις των μικρογραφιών των εικόνων αλλάζουν αλλάζοντας το γαλάζιο νούμερο που βρίσκεται αμέσως μετά από το γαλάζιο link των εικόνων.

SLIDESHOW WITH THUMBNAILS No 3

SLIDESHOW WITH THUMBNAILS
SLIDESHOW WITH THUMBNAILS No 3
Το παρακάτω slideshow μας δείχνει τις εικόνες του στο μέγεθος που θα του ορίσουμε όταν περάσουμε το ποντίκι μας πάνω από τις μικρογραφίες των εικόνων που εμφανίζονται στο κάτω μέρος του slideshow. Είναι πολύ απλό και μπορεί να μπεί σαν gadget σε οποιοδήποτε σημείο του blog μας αρκεί να προσαρμόσουμε τις διαστάσεις του. Οι διαστάσεις του slideshow μπορούν να αλλάξουν αλλάζοντας τα γαλάζια νούμερα στη 2η και 3η γραμμή του κώδικα. Οι διαστάσεις των μικρογραφιών των εικόνων αλλάζουν αλλάζοντας τα κίτρινα νούμερα που βρίσκονται αμέσως μετά από τα γαλάζια και πράσινα links των εικόνων.

SLIDESHOW WITH THUMBNAILS No 2

SLIDESHOW WITH THUMBNAILS
SLIDESHOW WITH THUMBNAILS No 2
Το παρακάτω slideshow μας δείχνει τις εικόνες του στο μέγεθος που θα του ορίσουμε όταν πατήσουμε διπλό κλίκ με το ποντίκι μας πάνω στις μικρογραφίες των εικόνων που εμφανίζονται στο κάτω μέρος του slideshow. Είναι πολύ απλό και μπορεί να μπεί σαν gadget σε οποιοδήποτε σημείο του blog μας αρκεί να προσαρμόσουμε τις διαστάσεις του. Οι διαστάσεις του slideshow μπορούν να αλλάξουν αλλάζοντας τα γαλάζια νούμερα στη 4η και 5η γραμμή του κώδικα. Οι διαστάσεις των μικρογραφιών των εικόνων αλλάζουν αλλάζοντας τα κίτρινα νούμερα στη 20η και 21η γραμμή του κώδικα.

SLIDESHOW WITH THUMBNAILS No 1

SLIDESHOW
SLIDESHOW WITH THUMBNAILS No 1
Το παρακάτω slideshow μας δείχνει τις εικόνες του στο μέγεθος που θα του ορίσουμε όταν περάσουμε τον δείκτη του ποντικιού μας πάνω από τις μικρογραφίες των εικόνων που εμφανίζονται στο πάνω μέρος του slideshow. Περιέχει κώδικα css και html και μπορεί να μπεί σαν gadget σε οποιοδήποτε σημείο του blog μας αρκεί να προσαρμόσουμε τις διαστάσεις του. Οι διαστάσεις του slideshow μπορούν να αλλάξουν αλλάζοντας τα γαλάζια νούμερα στη 2η γραμμή του κώδικα. Οι διαστάσεις των μικρογραφιών των εικόνων αλλάζουν αλλάζοντας τα πράσινα νούμερα στη 9η γραμμή του κώδικα. 

ΠΩΣ ΒΑΖΩ FAVICON ΣΤΟ BLOGGER

ΠΩΣ ΒΑΖΩ FAVICON ΣΤΟ BLOGGER
Μπορούμε να αλλάξουμε το εικονίδιο (favicon) του blogger δίπλα από τη διεύθυνση (url) του blog μας με ένα άλλο της αρεσκείας μας το οποίο πρέπει να το έχουμε ανεβάσει σε κάποιο site φιλοξενείας εικόνων π.χ. imgur. Αυτό το εικονίδιο λέγεται favicon και πρέπει να έχει κατάληξη png ή ico και διαστάσεις 16Χ16 ή 32Χ32 pixels. Υπάρχουν πολλά έτοιμα favicons για κάθε θέμα και μπορείτε να τα βρείτε με μια απλή αναζήτηση "free favicons" στις εικόνες google.

ΠΩΣ ΒΑΖΩ ΠΟΛΛΑ WIDGETS ΜΕΣΑ ΣΕ TABS (ΚΑΡΤΕΛΕΣ) No 4

TABS WIDGET 4
ΠΩΣ ΒΑΖΩ ΠΟΛΛΑ WIDGETS ΜΕΣΑ ΣΕ TABS (ΚΑΡΤΕΛΕΣ) No 4
Με τον παρακάτω κώδικα μπορούμε να ενσωματωσουμε sites ή blogs ή έγγραφα ή εικόνες, ή βίντεο μέσα σε καρτέλες (tabs). Ο κώδικας αυτός μπαίνει απλά σαν gadget συνήθως στο υποσέλιδο του blog σας όπου υπάρχει μεγάλο πλάτος. Βάλτε τις δικές σας περιγραφές, αντικαθιστώντας τις δικές μου με τα κίτρινα γράμματα. Μετά διαγράψτε τις δικές μου ενσωματωσεις που βρίσκονται μεταξύ του κώδικα <iframe & </iframe> και βάλτε τις δικές σας.

ΠΩΣ ΒΑΖΩ ΠΟΛΛΑ WIDGETS ΜΕΣΑ ΣΕ TABS (ΚΑΡΤΕΛΕΣ) No 3

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

ΠΩΣ ΒΑΖΩ ΠΟΛΛΑ WIDGETS ΜΕΣΑ ΣΕ TABS (ΚΑΡΤΕΛΕΣ) No 2

TABS WIDGET
ΠΩΣ ΒΑΖΩ ΠΟΛΛΑ WIDGETS ΜΕΣΑ ΣΕ TABS (ΚΑΡΤΕΛΕΣ) No 2
Με τον παρακάτω κώδικα μπορούμε να βάλουμε πολλά widgets μέσα σε καρτέλες (tabs). Ο κώδικας αυτός μπαίνει απλά σαν gadget οπουδήποτε θέλετε, στις πλαϊνές μπάρες, στο υποδέλιδο και μέσα στην ανάρτηση. Βάλτε τους δικούς σας τίτλους στις καρτέλες #tabs-1, #tabs-2, #tabs-3, #tabs-4, αντικαθιστώντας τους δικούς μου με τα κίτρινα γράμματα.

ΠΩΣ ΒΑΖΩ ΠΟΛΛΑ WIDGETS ΜΕΣΑ ΣΕ TABS (ΚΑΡΤΕΛΕΣ) No 1

TABS WIDGET
ΠΩΣ ΒΑΖΩ ΠΟΛΛΑ WIDGETS ΜΕΣΑ ΣΕ TABS (ΚΑΡΤΕΛΕΣ) No 1
Με τον παρακάτω κώδικα μπορούμε να βάλουμε πολλά widgets μέσα σε καρτέλες (tabs). Το πρώτο μέρος του κώδικα από το <style> μέχρι το type='text/javascript'/> πρέπει να το βάλετε μέσα στο πρότυπο και συγκεκριμένα ακριβώς πάνω από την ετικέτα </head>. Το δεύτερο μέρος του κώδικα θα το βάλετε απλά σαν gadget εκεί που θέλετε να εμφανίζεται. 

ΠΡΟΣΦΑΤΕΣ ΑΝΑΡΤΗΣΕΙΣ ΜΕ ΟΡΙΖΟΝΤΙΟ SCROLLING

ΠΡΟΣΦΑΤΕΣ ΑΝΑΡΤΗΣΕΙΣ
ΠΡΟΣΦΑΤΕΣ ΑΝΑΡΤΗΣΕΙΣ ΜΕ ΟΡΙΖΟΝΤΙΟ SCROLLING
Με τον παρακάτω κώδικα μπορείτε να προβάλετε μέχρι και τις 150 τελετυταίες αναρτήσεις του blog σας με εινόνα και περιγραφή σε οριζόντια διαταξη σαν ένα carousel slider αλλά με χειροκίνητο οριζόντιο scrolling. Aντιγράψτε και επικολλήστε τον στην αρχή του υποσέλιδου σαν gadget. Μπορείτε να αλλάξετε το πλάτος και το ύψος στην 2η γραμμή κώδικα εκεί που γράφει width:960px;height:250px;

ΠΩΣ ΒΑΖΩ DIRECT DOWNLOAD BUTTON ΣΤΟ BLOG ΜΟΥ

DOWNLOAD BUTTON
ΠΩΣ ΒΑΖΩ DIRECT DOWNLOAD BUTTON ΣΤΟ BLOG ΜΟΥ
Μπειτε στο dropbox σας, επιλεξτε το αρχείο που θέλετε να κατεβάσετε και κάνετε πάνω του δεξί κλίκ. Πατήστε Copy Dropbox Link, και πάρτε το link που σας δίνει το dropbox και είναι παρόμοιο με το αρχικό πράσινο link που έχω παρακάτω και περιέχει μέσα του το www.dropbox.com το οποίο πρέπει να αντικαταστήσετε με το dl.dropboxusercontent.com που όπως θα δείτε υπάρχει στον κυρίως κώδικα του button.

BODY BACKGROUND SLIDER-7

BODY SLIDER-7
BODY BACKGROUND SLIDER-7
Αυτό το body slider μπορεί να μπεί μέσα σε ένα HTML / JAVASCRIPT gadget κουτάκι που υπάρχει στην διάταξη του blog σας είτε σε πλευρική μπάρα είτε στο υποσέλιδο, αλλά μπορεί επίσης να μπεί και μέσα στον κώδικα HTML του blog σας πρίν την ετικέτα </head>.  Απλά αντιγράψτε και επικολλήστε τον παρακάτω κώδικα σε όποιοδήποτε gadget θέλετε ή μέσα στον κυρίως κώδικα του blog σας αλλάζοντας αν θέλετε τα πράσινα links των εικόνων με τα links των εικόνων της αρεσκείας σας. Αν θέλετε να προσθέσετε περισσότερες είκόνες πρέπει να βάλετε πρώτα τα link τους εντός του <script>.

BODY BACKGROUND SLIDER-6

BODY SLIDER-6BODY BACKGROUND SLIDER-6
Αυτό το body slider μπορεί να μπεί μέσα σε ένα HTML / JAVASCRIPT gadget κουτάκι που υπάρχει στην διάταξη του blog σας είτε σε πλευρική μπάρα είτε στο υποσέλιδο, αλλά μπορεί επίσης να μπεί και μέσα στον κώδικα HTML του blog σας πρίν την ετικέτα </head>.  Απλά αντιγράψτε και επικολλήστε τον παρακάτω κώδικα σε όποιοδήποτε gadget θέλετε ή μέσα στον κυρίως κώδικα του blog σας αλλάζοντας αν θέλετε τα πράσινα links των εικόνων με τα links των εικόνων της αρεσκείας σας. Αν θέλετε να προσθέσετε περισσότερες είκόνες πρέπει να βάλετε πρώτα τα link τους εντός του <script>.

BODY BACKGROUND SLIDER-5

BODY BACKGROUND SLIDER-5
BODY BACKGROUND SLIDER-5
Αυτό το body slider μπορεί να μπεί μέσα σε ένα HTML / JAVASCRIPT gadget κουτάκι που υπάρχει στην διάταξη του blog σας είτε σε πλευρική μπάρα είτε στο υποσέλιδο, αλλά μπορεί επίσης να μπεί και μέσα στον κώδικα HTML του blog σας πρίν την ετικέτα </head>.

BODY BACKGROUND SLIDER-4

BACKGROUND SLIDER
BODY BACKGROUND SLIDER-4
Αυτό το body slider μπορεί να μπεί μέσα σε ένα HTML / JAVASCRIPT gadget κουτάκι που υπάρχει στην διάταξη του blog σας είτε σε πλευρική μπάρα είτε στο υποσέλιδο, αλλά μπορεί επίσης να μπεί και μέσα στον κώδικα HTML του blog σας πρίν την ετικέτα </head>.

BODY BACKGROUND SLIDER-3

BODY SLIDER-3
BODY BACKGROUND SLIDER-3
Αυτό το body background slider μπορεί να μπεί μέσα σε ένα HTML / JAVASCRIPT gadget κουτάκι που υπάρχει στην διάταξη του blog σας είτε σε πλευρική μπάρα είτε στο υποσέλιδο, αλλά μπορεί επίσης να μπεί και μέσα στον κώδικα HTML του blog σας πρίν την ετικέτα </head>.

BODY BACKGROUND SLIDER-2

BACKGROUND SLIDER
BODY BACKGROUND SLIDER-2
Με τον παρακάτω κώδικα μπορείτε να προβάλετε όσες εικόνες θέλετε να εναλλάσονται σαν slides στη θέση του background του ιστολογίου σας. Την ταχύτητα εναλλαγής μπορείτε να την ρυθμίσετε αλλάζοντας το {speed: 400} ενώ το χρόνο που θα παραμένει κάθε φωτογραφία μπορείτε να τον ρυθμίσετε αλλάζοντας το [index]);}, 4000); Μπορείτε να αντικαταστήσετε τα πορτοκαλί links των εικόνων με τα δικά σας link εικόνων,

BODY BACKGROUND SLIDER-1

ΑΛΛΑΓΗ BACKROUND
ΠΩΣ ΝΑ ΑΛΛΑΖΕΙ ΤΟ BLOG ΣΑΣ ΑΥΤΟΜΑΤΑ BACKROUND ΚΑΘΕ ΛΕΠΤΟ
Με τον παρακάτω κώδικα το blog σας θα αλλάζει αυτόματα backround κάθε 1 λεπτό. Δεν υπάρχει ο περιορισμός του blogger για εικόνες μέχρι 300 Kb. Μπορείτε να βάλετε 60 διαφορετικά backround 1 για κάθε λεπτό. Μπορείτε να βάλετε βέβαια και οσα λιγότερα θέλετε αλλάζοντας τα πράσινα νούμερα που αντιστοιχούν στα λεπτά της τρέχουσας ώρας. Αν θέλετε να εμφανίζονται 4 backround την ώρα θα κρατήσετε 4 γραμμές κώδικα και θα αλλάξετε τα λεπτά που θα εμφανίζονται οι εικόνες· π.χ.