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

FLOATING TEXT BOX OPENS WITH MOUSEOVER

FLOATING TEXT BOX
FLOATING TEXT BOX OPENS WITH MOUSEOVER.
Με τον παρακάτω κώδικα μπορείτε να βαλετε ένα floating text box στην πλαϊνή μπάρα. Το text box μπορεί να περιέχει και linkls όπως παρακάτω. Μπορείτε να αλλάξετε τις διαστάσεις του πλάτους αλλάζοντας το width="720" που βρίσκεται στη 3η γραμμή του κώδικα και τα πράσιν link των αναρτήσεων με τα δικά σας link. Δείτε πως λειτουργεί στο παρακάτω demo .

3D ANIMATED TEXT

3D ANIMATED TEXT
Με τον παρακάτω κώδικα μπορούμε να εμφανίσουμε ένα animated 3d κείμενο στο blog μας. Αντιγράψτε τον παρακάτω κώδικα στο τέλος του κώδικα html μιας οποιαδήποτε ανάρτησης ή σελίδας του blogger και θα εμφανιστεί το 3d κείμενο ψηλά και στο κέντρο της ανάρτησης σαν μια 3d animated επικεφαλίδα, ενώ το υπόλοιπο μέρος της ανάρτησης θα είναι ορατό και προσβάσιμο από τους αναγνώστες δείτε το demo στον παρακάτω σύνδεσμο.

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

ΚΕΙΜΕΝΟ ΠΟΥ ΑΝΑΒΟΣΒΗΝΕΙ ΚΑΙ ΑΥΞΟΜΕΙΩΝΕΤΑΙ.
Με τον παρακάτω απλό κώδικα html και css μπορείτε να κάνετε ένα κείμενο να αλλάζει χρώματα και να αυξομειώνεται. Μπορείτε επίσης μέσα σε αυτό το κείμενο να βάλετε και link. Αντιγράψτε τον κώδικα σε ένα gadget της πλευρικής σας μπάρας αφού αλλάξετε το κείμενο και το link που έχω βάλει με τα δικά σας. Μπορείτε να το δείτε σε λειτουργία ακριβώς κάτω από τον κώδικα.

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

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

ΠΡΟΒΟΛΗ TEXT BOX ΑΠΟ ΑΝΑΠΤΥΣΟΜΕΝΟ ΜΕΝΟΥ

TEXT BOX
ΠΡΟΒΟΛΗ TEXT BOX ΑΠΟ ΑΝΑΠΤΥΣΟΜΕΝΟ ΜΕΝΟΥ
Με τον παρακάτω κώδικα μπορείτε να προβάλετε πολλά text boxes επιλέγοντας κάθε φορά να εμφανίζεται ένα από τις επιλογές ενός αναπτυσόμενου μενου που βρίκεται πάνω από το text box. Αντικαταστήστε τις κίτρινες επιλογές του αναπτυσόμενου μενού με τις δικές σας επιλογές. Αντικαταστήστε και το κείμενο που αντιστοιχεί για την κάθε επιλογή με το δικό σας κειμενο. Αλλάξτε τα χρώματα της μπάρας των επιλογών και του background του text box αλλάζοντας τον 6ψηφιο αριθμό χρωματος του οποίου προηγείται το σύμβολο της δίεσης #.

ΑΝΑΔΥΟΜΕΝΟ TEXT BOX ΜΕ ΕΙΚΟΝΑ ΠΟΥ ΑΝΟΙΓΕΙ ΜΕ MOUSEOVER

TEXT BOX
ΑΝΑΔΥΟΜΕΝΟ TEXT BOX ΜΕ ΕΙΚΟΝΑ ΠΟΥ ΑΝΟΙΓΕΙ ΜΕ MOUSEOVER
Το παρακάτω text box ανοίγει σε όποια θέση του ιστολογίου σας θέλετε περνώντας το ποντίκι πάνω από τα έγχρωμα buttons. Η θέση του text box αλλάζει εκεί που γράφει position:fixed; top:31px;left:0px; και οι διαστάσεις του text box εκεί που γράφει width:480px; height:auto; Αντικαταστήστε τους κίτρινους τίτλους και τα πράσιναlinks των εικόνων με τα δικά σας. Τα χρώματα μπορείτε να τα αλλάξετε αλλάζοντας τον 6ψήφιο αριθμό που βρίσκεται μετά το σύμβολο της δίεσης #. Ο κώδικας μπορεί να μπεί απλά σαν gadget ή ακόμα και μέσα στο html της ανάρτησής σας όπως τον έχω βάλει εγώ ακριβώς κάτω από εδώ.

ΑΝΑΔΥΟΜΕΝΟ TEXT BOX ΠΟΥ ΑΝΟΙΓΕΙ ME BUTTON

FLOATING TEXT BOX
ΑΝΑΔΥΟΜΕΝΟ TEXT BOX ΠΟΥ ΑΝΟΙΓΕΙ ME BUTTON
Το παρακάτω text box ανοίγει σε όποια στατική θέση του ιστολογίου σας θέλετε πατώντας πάνω σε ένα button. Η θέση του text box αλλάζει εκεί που γράφει position:fixed; top:0px;left:0px; και οι διαστάσεις του text box εκεί που γράφει width:490px; height:auto; Αντικαταστήστε τους κίτρινους τίτλους με τους δικούς σας. Τα χρώματα μπορείτε να τα αλλάξετε αλλάζοντας τον 6ψήφιο αριθμό που βρίσκεται μετά το σύμβολο της δίεσης #. Ο κώδικας μπορεί να μπεί απλά σαν gadget ή ακόμα και μέσα στο html της ανάρτησής σας.

TEXT BOXES ΜΕ KEIMENO, ΕΙΚΟΝΕΣ, ΒΙΝΤΕΟ ΚΑΙ BUTTONS No 2

TEXT BOXES ΜΕ KEIMENO, ΕΙΚΟΝΕΣ, ΒΙΝΤΕΟ ΚΑΙ BUTTONS No 2
Με τον παρακάτω κώδικα μπορείτε να βάλετε text boxes μέσα στην ανάρτησή σας τα οποία μπορούν να περιέχουν ταυτοχρόνως κείμενο, εικόνες, βίντεο και buttons με links. Κάθε κουτί μπορεί να έχει το δικό του χρώμα background. Οι διαστάσεις των κουτιών αλλάζουν εάν αλλάξετε το width:210px; και το height:210px;

TEXT BOXES ΜΕ KEIMENO, ΕΙΚΟΝΕΣ, ΒΙΝΤΕΟ ΚΑΙ BUTTONS No 1

TEXT BOXES
TEXT BOXES ΜΕ KEIMENO, ΕΙΚΟΝΕΣ, ΒΙΝΤΕΟ ΚΑΙ BUTTONS No 1
Με τον παρακάτω κώδικα μπορείτε να βάλετε text boxes μέσα στην ανάρτησή σας τα οποία μπορούν να περιέχουν ταυτοχρόνως κείμενο, εικόνες, βίντεο και buttons με links. Οι διαστάσεις των κουτιών αλλάζουν εάν αλλάξετε το width:200px; και το height:200px; Τα μώβ και τα πράσινα links των εικόνων και των βίντεο αλλάξτε τα με τα δικά σας links. Τα χρώματα αλλάξουν εάν αλλάξετε τον 6ψήφιο κωδικό χρώματος που ακόλουθεί μετά το σύμβολο της δίεσης #. Αλλάξτε και τις περιγραφές του έχω χρωματίσει με κίτρινα και πορτοκαλί γράμματα.

ΚΟΥΤΙ ΠΕΡΙΓΡΑΦΗΣ ΟΤΑΝ ΠΕΡΝΑΤΕ ΤΟ MOUSE ΠΑΝΩ ΑΠΟ ΜΙΑ ΛΕΞΗ

DISCRIPTION-BOX
ΚΟΥΤΙ ΠΕΡΙΓΡΑΦΗΣ ΟΤΑΝ ΠΕΡΝΑΤΕ ΤΟ MOUSE ΠΑΝΩ ΑΠΟ ΜΙΑ ΛΕΞΗ
Αν θέλετε να δώσετε κάποιες επεξηγήσεις με ένα discriprion box ή με μία εικόνα ή με ένα pop up window για κάποια λέξη ή φράση που περιέχεται μέσα στην ανάρτησή σας θα πρέπει να βάλετε δύο κομμάτια κώδικα μέσα στην ανάρτησή σας. Ένα στο τέλος της ανάρτησης (το style) και ένα αμέσως πρίν την λέξη ή φράση που θέλετε να δώσετε την επεξήγηση ή την προβολή της εικόνας ή την παραπομπή σε link με άνοιγμα pop up window.

ΠΩΣ ΒΑΖΩ ΠΕΡΙΓΡΑΦΗ ΠΑΝΩ ΑΠΟ ΜΙΑ ΛΕΞΗ Ή ΦΡΑΣΗ ΤΗΣ ΑΝΑΡΤΗΣΗΣ ΜΟΥ

DISCRIPTION BOX
ΠΩΣ ΒΑΖΩ ΠΕΡΙΓΡΑΦΗ ΠΑΝΩ ΑΠΟ ΜΙΑ ΛΕΞΗ Ή ΦΡΑΣΗ ΤΗΣ ΑΝΑΡΤΗΣΗΣ ΜΟΥ
Για να βγαίνει μια περιγραφή σαν μικρό text box παιρνώντας το ποντίκι μας πάνω από μία λέξη ή φράση που βρίσκεται μέσα στην ανάρτησή μας πρέπει να παρεμβάλουμε ένα σύντομο κώδικα πρίν από αυτήν. Αν υποθέσουμε ότι η φράση μας είναι «Δείτε την καλύτερη παραλία της Λευκάδας παρακάτω» και θέλουμε πάνω από αυτήν να βγαίνει ένα μικρό text box και να γράφει «Πόρτο Κατσίκι Λευκάδα» τότε πρέπει να προσθέσουμε πρίν αρχίσει η φράση αυτή τον εξής κώδικα HTML :

ΠΩΣ ΒΑΖΩ ΠΙΝΑΚΑ ΜΕΣΑ ΣΕ ΜΙΑ ΑΝΑΡΤΗΣΗ

ΠΙΝΑΚΑΣ
ΠΩΣ ΒΑΖΩ ΠΙΝΑΚΑ ΜΕΣΑ ΣΕ ΜΙΑ ΑΝΑΡΤΗΣΗ
Με τον παρακάτω κώδικα μπορούμε να βάλουμε ένα πίνακα μέσα στην ανάρτησή μας. Ο πίνακας αυτός μπορεί να έχει όσες στήλες και γραμμές θέλουμε. Οι τίτλοι των στηλών είναι χρωματισμένοι με έντονο κίτρινο χρώμα. Αμέσως μετά ακολουθεί το περιεχόμενο των γραμμών του πίνακα που είναι χρωματισμένο με πορτοκαλί χρώμα. Μπορείτε αν θέλετε να αφαιρέσετε όσες στήλες ή γραμμες θέλετε. Για να αφαιρέσετε μία γραμμή διαγράψτε όλην την ενότητα που βρίσκεται μεταξύ του <tr> και του </tr> μαζί με αυτά.

ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 4

TEXT BOX
ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 4
Με τον παρακάτω κώδικα μπορούμε να βάλουμε ένα ή περισσότερα κουτία κειμένου μέσα στην ανάρτησή μας σε επιθυμητές διαστάσεις, με ξεχωριστό background και χρώμα κειμένου. Επίσης μπορούμε αυτά τα κουτιά να τα βάλουμε το ένα δίπλα στο άλλο. Ανοίξτε μια νέα ανάρτηση και πατήστε το κουμπί HTML για να δείτε τον κώδικα της ανάρτησης. Σβήστε τις 2 ή 3 γραμμές κώδικα που μπορεί να περιέχει η ανάρτηση και επικολλήστε τον παρακάτω κώδικα αφού αντικαταστήσετε τις πορτοκαλί επικεφαλίδες των θεμάτων που θα περιέχουν τα κουτιά κειμένου με τις δικές σας επικεφαλίδες.

ΠΩΣ ΒΑΖΩ ΚΕΙΜΕΝΟ ΜΕ CLICKABLE ΕΙΚΟΝΑ ΣΤΗΝ ΠΛΑΪΝΗ ΜΠΑΡΑ

TEXT BOX
ΠΩΣ ΒΑΖΩ ΚΕΙΜΕΝΟ ΜΕ CLICKABLE ΕΙΚΟΝΑ ΣΤΗΝ ΠΛΑΪΝΗ ΜΠΑΡΑ
Για να βάλετε στην πλαϊνή σας μπάρα ένα κείμενο με μία εικόνα η οποία θα είναι clickable αντιγράψτε τον παρακάτω κώδικα και αλλάξτε το πράσινο link το οποίο πατώντας στην εικόνα ο αναγνώστης θα οδηγείται στο σχετικό άρθρο που θέλετε. Επίσης αλλάξτε το μώβ link της εικόνας του άρθρου καθώς και τις διαστάσεις της εικόνας εκεί που γράφει width="80" height="55". Ακόμα μπορείτε να αλλάξετε και την αποστάση margin-right: 4px; Αν θέλετε το κείμενό σας να έχει άλλο χρώμα background και περίγραμμα βάλτε τον 2ο κώδικα που έχει το ανάλογο style. Απλά μην ξεχάσετε αν τον επαναλάβετε να αλλάξετε το #box16 με άλλο νούμερο για να μην συμπίπτει ο κώδικας και σας βγαίζει το ίδιο background.

ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 3

ΤΕΧΤ ΒΟΧ
ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 3
Με τον παρακάτω κώδικα μπορούμε να βάλουμε ένα ή περισσότερα κουτία κειμένου μέσα στην ανάρτησή μας με scroll bar, πλαίσιο, επιθυμητές διαστάσεις, ξεχωριστό background και χρώμα κειμένου αλλά δεν μπορούμε να βάλουμε 2 ή περισσότερα τέτοια κουτιά κειμένου το ένα δίπλα στο άλλο. Ανοίξτε μια νέα ανάρτηση και πατήστε το κουμπί HTML για να δείτε τον κώδικα της ανάρτησης. Σβήστε τις 2 ή 3 γραμμές κώδικα που μπορεί να περιέχει η ανάρτηση και επικολλήστε τους παρακάτω 4 ξεχωριστούς κώδικες όχι όλους αλλά αυτούς που θέλετε και ταιριάζουν στο ιστολόγιό σας.

ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 2

ΤΕΧΤ ΒΟΧ
ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 2
Με τον παρακάτω κώδικα μπορούμε να βάλουμε ένα ή περισσότερα κουτία κειμένου μέσα στην ανάρτησή μας με πλαίσιο, σε επιθυμητές διαστάσεις, με ξεχωριστό background και χρώμα κειμένου. Επίσης μπορούμε αυτά τα κουτιά να τα βάλουμε το ένα δίπλα στο άλλο. Ανοίξτε μια νέα ανάρτηση και πατήστε το κουμπί HTML για να δείτε τον κώδικα της ανάρτησης. Σβήστε τις 2 ή 3 γραμμές κώδικα που μπορεί να περιέχει η ανάρτηση και επικολλήστε τον παρακάτω κώδικα όχι όλον αν δεν θέλετε όλα τα κουτιά αλλά επιλεκτικά όποια κουτιά θέλετε και ταιριάζουν στο ιστολόγιό σας.

ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 1

TEXTBOX
ΠΩΣ ΒΑΖΩ TEXT BOX ΜΕΣΑ ΣΤΗΝ ΑΝΑΡΤΗΣΗ Νο 1
Με τον παρακάτω κώδικα μπορούμε να βάλουμε ένα ή περισσότερα κουτιά κειμένου μέσα στην ανάρτησή μας με πλαίσιο, σε επιθυμιτές διαστάσεις, με ξεχωριστό background και χρώμα κειμένου. Μπορούμε επίσης να τα βάλουμε το ένα δίπλα στο άλλο. Ανοίξτε μια νέα ανάρτηση και πατήστε το κουμπί HTML για να δείτε τον κώδικα της ανάρτησης. Σβήστε τις 2 ή 3 γραμμές κώδικα που μπορεί να περιέχει η ανάρτηση και επικολλήστε τον παρακάτω κώδικα.