• 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
Εμφάνιση αναρτήσεων με ετικέτα SOSIAL BUTTONS. Εμφάνιση όλων των αναρτήσεων
Εμφάνιση αναρτήσεων με ετικέτα SOSIAL BUTTONS. Εμφάνιση όλων των αναρτήσεων

BUTTONS ΜΕ ΕΝΣΩΜΑΤΩΣΕΙΣ ΠΟΥ ΑΝΟΙΓΟΥΝ ΣΕ POPUP WINDOWS

BUTTONS
BUTTONS ΜΕ ΕΝΣΩΜΑΤΩΣΕΙΣ ΠΟΥ ΑΝΟΙΓΟΥΝ ΣΕ POPUP WINDOWS
Παρακάτω θα βρείτε πάνω από 20 buttons που περιέχουν ενσωματώσεις και ανοίγουν σε popup windows. Μπορείτε να τα βάλετε μέσα σε ένα gadget της πλευρικής μπάρας του blogger ή σε ένα gadget του υποσέλιδου, αλλά ακόμα και μέσα στον κώδικα html μίας ανάρτησης ή μίας σελίδας. Κάθε παράγραφος από τον παρακάτω κώδικα είναι και ένα button που ανοίγει σε ένα popup window. Μπορείτε να αντιγράψετε όλες τις παραγράφους ή όσες σας ενδιαφέρουν ή επιλεκτικά να τροποποιήσετε τα links τους και να οδηγούν σε δικές σας ενωματώσεις ή ιστοσελίδες.

TV ICONS ΠΟΥ ΑΝΟΙΓΟΥΝ ΣΕ POP UP WINDOW

TV CHANNELS
TV ICONS ΠΟΥ ΑΝΟΙΓΟΥΝ ΣΕ POP UP WINDOW
Τα TV icons που βλέπετε παρακάτω ανοίγουν σε popup window και έχουν τίτλο μέσα στον κώδικα ώστε παιρνώντας το ποντίκι πάνω απο τα εικονίδια εμφανίζεται το όνομα του καναλιού. Κάθε παράγραφος κώδικα αφορά και ένα κανάλι μπορείτε να προσθέσετε όσα κανάλια θέλετε με τον ίδιο τρόπο αλλάζοντας απλά το url του καναλιού το url του εικονιδίου και τον τίτλο του καναλιού.

ΠΩΣ ΒΑΖΩ SKYPE CALL ME BUTTON ΣΤΟ BLOG ΜΟΥ

SKYPE BUTTON
ΠΩΣ ΒΑΖΩ SKYPE CALL ME BUTTON ΣΤΟ BLOG ΜΟΥ
Για να βάλετε στο blog σας ένα skype call me button θα χρειαστήτε μία γραμμή κώδικα και ένα εικονίδιο που θα πρέπει να ανεβάσετε ή στο blogger ή σε κάποιο άλλο site που θα σας δώσει ένα απευθείας link για το εικονίδιο αυτό. Αν όμως σας αρέσει αυτό που έχω ανεβάσει ήδη δεν χρειάζεται να αναζητήσετε άλλο.

ANIMATED SCROLLING MESSAGE BOX

SCROLLING MESSAGE BOX
ANIMATED SCROLLING MESSAGE BOX
Με τον παρακάτω κώδικα μπορείτε να βάλετε ένα animated scrolling message box με ένα μήνυμα και κάποιο link που να παραπέμπει σε κάποιο άρθρο ή οπουδήποτε αλλού. Καλό θα ήταν ο κώδικας να μπέι στο τέλος του κώδικα HTML της ανάρτησής σας και αφού έχετε βάλει στην ανάρτηση αυτή απαραιτήτως read more για να μην εκτελείται ο κώδικας στην αρχική σελίδα σας αλλά μόνο όταν ανοίγει ο αναγνώστης την συγκεκριμένη ανάρτηση. Ο 1ος κώδικας είναι για ανοιχτόχρωμα blog και ο 2ος για σκουρόχρωμα blog. Δείτε πως φαίνεται το animated scrolling message box στο κάτω μέρος αυτής της ανάρτησης.

ANIMATED BUTTONS

ANIMATED BUTTONS
ANIMATED BUTTONS
Με τον παρακάτω κώδικα μπορείτε να βάλετε animated buttons στο blog σας. Μπορείτε να  αλλάξετε τα χρώματα των buttons αλλάζοντας τον κωδικό χρώματος που έχει μπροστάτου το σύμβολο της δίεσης # καθώς και τα εξωτερικά και εσωτερικά περιθώρια αλλάζοντας τα margin και τα padding του κάθε button. Εννοείται πως πρέπει να αλλάξετε και τα πράσινα links των buttons με τα δικά σας links.

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

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

ΠΩΣ ΒΑΖΩ FOLLOW SOSIAL BUTTONS

FOLLOW SOSIAL ICONS
ΠΩΣ ΒΑΖΩ FOLLOW SOSIAL BUTTONS
Πηγαίνουμε στην διάταξη του blog μας και πατάμε προσθήκη gadget σε όποια μπάρα δεξιά ή αριστερά, πάνω ή κάτω θέλουμε να βάλουμε τα sosial buttons. Μετά επίλέγουμε το gadget HTML/JAVASCRIPT και επικολλάμε τον παρακάτω κώδικα. Μπορείτε να μην επιλέξετε όλα τα εικονίδια αλλά μόνο αυτά που σας ενδιαφέρουν και να αλλάξετε τα links τους έτσι ώστε να οδηγούν απευθείας στο προφίλ σας.

RADIO ICONS ΠΟΥ ΑΝΟΙΓΟΥΝ ΣΕ POP UP WINDOW

RADIO BUTTONS
RADIO ICONS ΠΟΥ ΑΝΟΙΓΟΥΝ ΣΕ POP UP WINDOW
Τα radio icons που βλέπετε παρακάτω ανοίγουν σε popup window και έχουν τίτλο μέσα στον κώδικα ώστε παιρνώντας το ποντίκι πάνω απο τα εικονίδια εμφανίζεται το όνομα του σταθμού. Κάθε παράγραφος κώδικα αφορά και ένα σταθμό μπορείτε να προσθέσετε όσους σταθμούς θέλετε με τον ίδιο τρόπο αλλάζοντας απλά το url του σταθμού το url του εικονιδίου και τον τίτλο του σταθμου. Τα εικονίδια θα εμφανίζονται όπως τα βλέπετε ακριβώς κάτω από εδώ. Ο κώδικας που ακολουθεί μπορεί να αντιγραφεί είτε σε σελίδα είτε μέσα σε κάποιο gadget box του blogger. 

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

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

SHOW / HIDE WIDGET BUTTON

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

POPUP WINDOWS ΜΕ ΚΕΙΜΕΝΟ, ΕΙΚΟΝΕΣ ΚΑΙ ΒΙΝΤΕΟ

POPUP WINDOW
POPUP WINDOWS ΜΕ ΚΕΙΜΕΝΟ, ΕΙΚΟΝΕΣ ΚΑΙ ΒΙΝΤΕΟ
Με τον παρακάτω κώδικα μπορείτε να πατάτε ένα button και να ανοίγει ένα popup window το οποίο μπορεί να περιέχει κείμενο, εικόνες και βίντεο και θα κλείνει με close X. Οι διαστάσεις των popup windows αλλάζουν εάν αλλάξετε το .popup {width:auto;height:auto; Τα πράσινα links των εικόνων και των βίντεο αλλάξτε τα με τα δικά σας links.

WELLCOME POPUP MESSAGE BOX

WELLCOME-BOX
WELLCOME POPUP MESSAGE BOX
Με τον παρακάτω κώδικα μπορείτε να βάλετε ένα wellcome popup message box στο blog σας, το οποίο θα εμφανίζεται μόνο στους νέους επισκέπτες του ιστολογίου σας και όχι κάθε φορά που αλλάζετε σελίδα. Ο κώδικας αυτός μπαίνει απλά σαν gadget αλλά καλό θα ήταν την πρώτη γραμμή του κώδικα να την βάλετε μέσα στο πρότυπο πρίν την ετικέτα </head>. Τα χρώματα αλλάζουν αν αλλάξετε τον 6ψήφιο κωδικό χρώματος που προηγήται το σύμβολο της δίεσης #

ΠΩΣ ΒΑΖΩ NEWSLETTER POP UP BOX

NEWSLETTER BOX
ΠΩΣ ΒΑΖΩ NEWSLETTER POP UP BOX
Με τον παρακάτω κώδικα θα εμφανίζεται στο blog σας ένα newsletter pop up box και θα ζητάει από τον αναγνώστη να εγγραφτεί στο newsletter σας. Αν ο αναγνώστης δεν επιθυμεί υπάρχει ένα κουμπί Χ πάνω δεξιά στο pop up box το οποίο κλείνει αμέσως το κουτί. Μπορείτε να αλλάξετε τις κίτρινες περιγραφές και τα πορτοκαλί μηνύματα με άλλα δικά σας και οποσδήποτε μην ξεχάσετε να αλλάξετε το δικό μου feedburner id με τα πράσινα γράμματα με το δικό σας.
Ο κώδικας αυτός μπαίνει απλά σαν gadget σε οποιοδήποτε κουτάκι gadget θέλετε.

ΠΩΣ ΒΑΖΩ EMAIL BUTTON ΣΤΟ BLOG MOY

EMAIL BUTTON
ΠΩΣ ΒΑΖΩ EMAIL BUTTON ΣΤΟ BLOG MOY
Με τον παρακάτω κώδικα μπορούμε να βάλουμε ένα email button στο blog μας έτσι ώστε να μπορεί κάποιος να μας στέλνει αυτόματα email χωρίς να πληκρολογεί ή να ψάχνει να βρεί το email μας στις επαφές του. Αρκεί να αντικαταστήσετε το xxxxxxx@gmail.com του παρακάτω κώδικα με το δικό σας πραγματικό email. Αν θέλετε μπορείτε να αλλάξετε και το χρώμα background του κουμπιού καθώς και το χρώμα κειμένου με την γραμματοσειρά αλλάζοντας τα background:#A11111; color:#FFFFFF; font: 13px Arial;

ΠΩΣ ΒΑΖΩ BUTTONS Ή ΕΙΚΟΝΙΔΙΑ ΣΤΟ BLOG ΜΟΥ (15 ΚΩΔΙΚΕΣ)

ICONS BUTTONS
ΠΩΣ ΒΑΖΩ BUTTONS Ή ΕΙΚΟΝΙΔΙΑ ΣΤΟ BLOG ΜΟΥ (15 ΚΩΔΙΚΕΣ)
Παρακάτω θα βρείτε 15 διαφορετικούς κώδικες για να βάλετε buttons ή εικονίδια στο blog σας. Κάθε κώδικας είναι διαφορετικός ως προς τον τρόπο που ανοίγει το button ή το εικονίδιο, την θέση του και κάποια εφέ ημιδιαφάνειας. Τα buttons και τα εικονίδια αυτά μπορούν να μπούν το ένα δίπλα στο άλλο σε οριζόντια ή σε κάθετη διάταξη και να αποτελέσουν ένα έγχρωμο μενού από buttons ή εικονίδια. Όπως π.χ. το έγχρωμο μενού με buttons που περιγράφω στην ανάρτηση. ΚΑΘΕΤΟ ΚΑΙ ΟΡΙΖΟΝΤΙΟ ΜΕΝΟΥ ΜΕ ΕΓΧΡΩΜΑ BUTTONS

ΠΩΣ ΒΑΖΩ FLOATING SOSIAL FOLLOW BUTTONS

FOLLOW BUTTONS
ΠΩΣ ΒΑΖΩ FLOATING SOSIAL FOLLOW BUTTONS
Με τον παρακάτω κώδικα μπορείτε να βάλετε στο ιστολόγιό σας κάθετα floating sosial follow buttons. Τα κουμπιά αυτά θα εμφανίζονται στο πάνω δεξιό μέρος του ιστολογίου σας σε κάθετη διάταξη, δηλ. το ένα κάτω από το άλλο. Έχουν διαστάσεις 40Χ40 οι οποίες αν θέλετε μπορούν να γίνουν και 35Χ35 ή 30Χ30 για να μην πέφτουν πάνω στη δεξιά πλευρική μπάρα. Το ίδιο ισχύει και για το πτυσόμενο button που ανοίγει όταν περνάτε το ποντίκι σας πάνω από τα buttonsΑυτό έχει διαστάσεις 120Χ40 και μπορείτε να τις αλλάξετε αναλογικά πάντα με τo ύψος των τετράγωνων buttons σε 35Χ105 ή 30X90. 

ΠΩΣ ΒΑΖΩ SCROLL TOP & SCROLL BOTTOM BUTTONS

BACK TO TOP
ΠΩΣ ΒΑΖΩ SCROLL TOP & SCROLL BOTTOM BUTTONS
Με τους παρακάτω κώδικες μπορείτε να βάλετε 2 κουμπιά scroll top & scroll bottom στο blog σας και πάτώντας τα να μεταφέρεστε αυτόματα στην κορυφή ή στο τέλος του ιστολογίου σας χωρίς να χρειάζετε να κάνετε scrolling με το ροδάκι του mouse σας. Είναι 2 διαφορετικοί κώδικες βάλτε όποιον σας αρέσει και δουλεύει καλύτερα στο blog σας. Την πρώτη γραμμή που περιέχει το javascript query αρχείο μπορείτε να την παραλέιψετε εάν υπάρχει ήδη στο ιστολόγιό σας από κάποιον άλλο κώδικα. Τα χρώματα των κουμπιών αλλάζουν εκεί του υπάρχει το σύμβολο της δίεσης #. Τις εικόνες των κουμπιών κατεβάστε τες και να ανεβάστε τες σε λεύκωμα του google+.

ΠΩΣ ΒΑΖΩ ΔΙΑΦΗΜΙΣΤΙΚΟ POP UP WINDOW

POP UP WINDOW
ΠΩΣ ΒΑΖΩ ΔΙΑΦΗΜΙΣΤΙΚΟ POP UP WINDOW
Με τον παρακάτω κώδικα μπορούμε να βάλουμε ένα διαφημιστικό pop up window το οποίο μπορεί να περιέχει μέσα του τίτλους με links, κείμενο, φωτογραφίες ή βίντεο ή όποιοδήποτε άλλο widget θέλουμε. Μπαίνει απλά σαν gadget ή μπαίνει στο τέλος του κώδικα της ανάρτησης για να μην βγαίνει σε όλες τις σελίδες αλλά στοχευμένα σε συγκεκριμένη ανάρτηση. Μπορείτε να αλλάξετε τους τίτλους και τις περιγραφές με τα κίτρινα και τα πορτοκαλί γράμματα τα links με τα πράσινα γράμματα και τα links των εικόνων με τα μώβ γράμματα. Οι διαστάσεις μπορούν να αλλάξουν και είναι χρωματιμένες με γαλάζιο χρώμα.

ΕΓΧΡΩΜΑ BUTTONS ΜΕ LINKS

BUTTONS WITH STYLE
ΕΓΧΡΩΜΑ BUTTONS ΜΕ LINKS
Με τον παρακάτω κώδικα μπορούμε να δώσουμε στυλ στα links μας να τα κάνουμε έγχρωμα με στρογγυλεμένες άκρες, περίγραμμα και να αλλάζουν χρώμα ότν περνάμε το ποντίκι από πάνω τους. Ο κώδικας αυτός μπαίνει απλά σαν gadget οπουδήποτε θέλετε να εμφανίζονται τα links. Καλό θα ήταν όμως το πρώτο μέρος του κώδικα από το <style> μέχρι το </style> να μπεί μέσα στο πρότυπο πρίν την γραμμή ]]></b:skin> για να μην τον ξαναβάζετε μέσα σε κάθε gadget σε περίπτωση που θα βάλετε τα links σε 2 ή περισσότερα gadget μέσα στο ιστολόγιό σας, αλλά να βάζετε μόνο το 2ο μέρος του κώδικα.

ΠΩΣ ΑΛΛΑΖΩ ΤΟ ΣΤΥΛ ΤΩΝ ΕΤΙΚΕΤΩΝ ΤΟΥ BLOGGER

ΕΤΙΚΕΤΕΣ BLOGGER
ΠΩΣ ΑΛΛΑΖΩ ΤΟ ΣΤΥΛ ΤΩΝ ΕΤΙΚΕΤΩΝ ΤΟΥ BLOGGER
Για να αλλάξουμε το στυλ των ετικετών του blogger θα χρειαστεί να επικολλήσουμε μέσα στο πρότυπο μας τον παρακάτω σύντομο κώδικα. Πρέπει να τον επικολλήσουμε συγκεκριμένα πάνω ακριβώς από την γνωστή γραμμή κώδικα ]]></b:skin> την οποία θα την αναζητήσετε μέσα από το πλαίσιο αναζήτησης που εμφανίζεται πατώντας τα πλήκτρα Ctrl + F στο πάνω δεξιό μέρος και εντός του πλαισίου του προτύπου σας. Τα χρώματα ρυθμίζονται αλλάζοντας τους κωδικούς των χρωμάτων που ακολουθούν το σύμβολο #.