.jpg)
Σε αυτήν την ανάρτηση, επεξηγώ πώς να βάζετε Scrolling text οπουδήποτε στο blog σας, με την εντολή: marquee, είτε στις μπάρες του blog (sidebars) είτε στις αναρτήσεις μέσα (blog posts).
Άλλος ένας τρόπος να τραβήξετε την προσοχή των αναγνωστών σας σε κάτι που θέλετε να δούν, είναι και το να χρησιμοποιήσετε scrolling text. Μα μην το παρακάνετε, να το χρησιμοποιείτε με φειδώ. Ειδικότερα αν το blog σας έχει 'πολύ' κείμενο, τότε αντί να βοηθάει, μπερδεύει και αποσπά την προσοχή των αναγνωστών σας περισσότερο απο όσο θα έπρεπε. Μπορείτε να χρησιμοποιήσετε scroll bars για να ενημερώσετε τους επισκέπτες σας, ποιά θα είναι τα επόμενα updates σας, τα δημοφιλέστερα posts σας, διαφημίσεις κ.λ.π.
Σήμερα θα σας εξηγήσω πώς να βάζετε κι εσείς (όσοι δεν γνωρίζετε φυσικά ακόμη), πώς να βάζετε διάφορα 'είδη' απο scrolling text στο blog σας, πάμε λοιπόν:
Τοποθετώντας απλό scrolling text:
Ο κώδικας για το απλό scrolling text, με κίνηση απο δεξιά πρός τα αριστερά
Το αποτέλεσμα θα είναι:
Παράδειγμα 1ο:
code to simple scrolling text
Εάν θέλετε να είναι πιο έντονη η 'παρουσία' του, δοκιμάστε αυτό:
Τοποθετήστε background χρώμα στο κείμενο,
Παράδειγμα 2ο:
Κώδικας απλού scrolling κειμένου
Μπορείτε να αλλάξετε ανάλογα με τις προτιμήσεις σας, το background χρώμα, αλλάζοντας απλώς το hexadecimal code(#99ccff).
Πατήστε εδώ για να δείτε κώδικες απο διαφορετικά χρώματα.
Δείτε μερικές παραλλαγές στην φορά κίνησης των γραμμάτων:
Όπως καταλάβατε, οι απο πάνω παραλαγές, δίνουν την εντολή στο κείμενο, σε ποιά κατεύθυνση να κάνει scroll.
Χρησιμοποιείστε τον παρακάτω κώδικα:
Και ορίστε μερικά παραδείγματα:
Για scroll στην (δεξιά) 'right' κατεύθυνση:
Παράδειγμα 3ο:
Κώδικας απλού scrolling κειμένου
Παράδειγμα 4ο:
Για scroll σε 'up' κατεύθυνση:
Κώδικας απλού scrolling κειμένου
Παράδειγμα 5ο:
"πάνω-ή-κάτω":(Αλάζουμε απλά τον hexadecimal κώδικα, για να έχουμε διαφορετικό χρώμα)
Κώδικας απλού scrolling κειμένου
μερικές ακόμη παραλαγές της εντολής:
Μπορείτε να χρησιμοποιήσετε το attribute 'alternate'
Να ο κώδικας για να το κάνετε:
Παράδειγμα 6ο:
Κώδικας απλού scrolling κειμένου
Μπορείτε επίσης να ρυθμίσετε την ταχύτητα που θα κινείται το κείμενο με αυτήν την απλή εντολή:
Όσο πιο μικρό το νούμερο στο 'scrollamount', τόσο μικρότερη και η ταχύτητα.
Ο html κώδικας γι αυτό είναι:
Παράδειγμα 7ο:(για scrollamout =2)
Κώδικας απλού scrolling κειμένου
Παράδειγμα 8ο:(για scrollamount=5)
Κώδικας απλού scrolling κειμένου
Σταμάτημα κειμένου, όταν το mouse είναι επάνω (over) απο το text: Είναι πολύ χρήσιμο, όταν ο αναγνώστης θέλει να διαβάσει ένα κινούμενο κείμενο, να μπορεί να το σταματάει με το ποντίκι του, Ειδικότερα αν η ταχύτητα του κειμένου είναι μεγάλη, οπότε, θα βάλει το ποντίκι πάνω στο κείμενο και θα το σταματήσει:
Να ο κώδικας για να το πετύχετε:
Παράδειγμα 9ο:
Κώδικας απλού scrolling κειμένου
(βάλτε το mouse πάνω απο το text να το δοκιμάσετε)
Αλλάζοντας το text colour:
Ο κώδικας για την αλλαγή στο text colour:( Τοποθετήστε τον πρίν το marquee tag)
Οπότε ο κώδικας δείχνει έτσι:
Παράδειγμα 10:
Κώδικας απλού scrolling κειμένου
Και τώρα ένας απο τους πιο ενδιαφέροντες και πιο χρήσιμους, το πώς να βάλετε 'hyperlinks' μέσα σε ένα scrolling text.
Hyperlink σημαίνει σύνδεσμός (link) που όταν τον πατάμε (click) οδηγούμαστε σε άλλη τοποθεσία/σελίδα(site).
Ελάτε να σας δείξω πως να βάζετε hyperlinks σε scrolling text:
Τοποθετώντας hyperlinks(που θα ανοίγουν στο ίδιο παράθυρο):
Ορίστε ο κώδικας:
ΠΡΟΣΟΧΗ:Αντικαταστήστε τα Link#1,Link#2,Link#3 μαζί με το κείμενο και τα url#1,url#2 και url#3 με τις στοχευμένες (target) διευθύνσεις (url addresses).
Να ένα παράδειγμα:
Το αποτέλεσμα θα φαίνεται έτσι:
Το blog του ΑΑΤΟΝ Δείτε τους πρώτους 100 Twitters στην Ελλάδα Στατιστική στο blog σας
Εάν θέλετε όμως να ανοίγουν τα Links σε new window, ορίστε ο κώδικας:
Αυτό ήταν! Τώρα, μπορείτε κι εσείς να βάλετε κινούμενο κείμενο στο blogger sidebar, σε blog post, κι όπου αλλού θέλετε.
Για την τοποθέτησή του στο sidebar, κάντε sign in στο blogger account σας >κάντε click στο 'add a page element' > και επικολήστε (paste) τον κώδικα στο html/javascript και κάντε save τις αλλαγές όπως δείχνει και η παρακάτω εικόνα
Και κατόπιν..
Εάν βρείτε κάπου δυσκολίες, κάντε τις ερωτήσεις σας στα σχόλια.
Άλλος ένας τρόπος να τραβήξετε την προσοχή των αναγνωστών σας σε κάτι που θέλετε να δούν, είναι και το να χρησιμοποιήσετε scrolling text. Μα μην το παρακάνετε, να το χρησιμοποιείτε με φειδώ. Ειδικότερα αν το blog σας έχει 'πολύ' κείμενο, τότε αντί να βοηθάει, μπερδεύει και αποσπά την προσοχή των αναγνωστών σας περισσότερο απο όσο θα έπρεπε. Μπορείτε να χρησιμοποιήσετε scroll bars για να ενημερώσετε τους επισκέπτες σας, ποιά θα είναι τα επόμενα updates σας, τα δημοφιλέστερα posts σας, διαφημίσεις κ.λ.π.
Σήμερα θα σας εξηγήσω πώς να βάζετε κι εσείς (όσοι δεν γνωρίζετε φυσικά ακόμη), πώς να βάζετε διάφορα 'είδη' απο scrolling text στο blog σας, πάμε λοιπόν:
Τοποθετώντας απλό scrolling text:
Ο κώδικας για το απλό scrolling text, με κίνηση απο δεξιά πρός τα αριστερά
Το αποτέλεσμα θα είναι:
Παράδειγμα 1ο:
code to simple scrolling text
Εάν θέλετε να είναι πιο έντονη η 'παρουσία' του, δοκιμάστε αυτό:
Τοποθετήστε background χρώμα στο κείμενο,
Παράδειγμα 2ο:
Κώδικας απλού scrolling κειμένου
Μπορείτε να αλλάξετε ανάλογα με τις προτιμήσεις σας, το background χρώμα, αλλάζοντας απλώς το hexadecimal code(#99ccff).
Πατήστε εδώ για να δείτε κώδικες απο διαφορετικά χρώματα.
Δείτε μερικές παραλλαγές στην φορά κίνησης των γραμμάτων:
| direction="left" direction="right" direction="up" direction="down" |
Όπως καταλάβατε, οι απο πάνω παραλαγές, δίνουν την εντολή στο κείμενο, σε ποιά κατεύθυνση να κάνει scroll.
Χρησιμοποιείστε τον παρακάτω κώδικα:
Και ορίστε μερικά παραδείγματα:
Για scroll στην (δεξιά) 'right' κατεύθυνση:
Παράδειγμα 3ο:
Κώδικας απλού scrolling κειμένου
Παράδειγμα 4ο:
Για scroll σε 'up' κατεύθυνση:
Κώδικας απλού scrolling κειμένου
Παράδειγμα 5ο:
"πάνω-ή-κάτω":(Αλάζουμε απλά τον hexadecimal κώδικα, για να έχουμε διαφορετικό χρώμα)
Κώδικας απλού scrolling κειμένου
μερικές ακόμη παραλαγές της εντολής:
Μπορείτε να χρησιμοποιήσετε το attribute 'alternate'
Να ο κώδικας για να το κάνετε:
Παράδειγμα 6ο:
Κώδικας απλού scrolling κειμένου
Μπορείτε επίσης να ρυθμίσετε την ταχύτητα που θα κινείται το κείμενο με αυτήν την απλή εντολή:
Όσο πιο μικρό το νούμερο στο 'scrollamount', τόσο μικρότερη και η ταχύτητα.
Ο html κώδικας γι αυτό είναι:
Παράδειγμα 7ο:(για scrollamout =2)
Κώδικας απλού scrolling κειμένου
Παράδειγμα 8ο:(για scrollamount=5)
Κώδικας απλού scrolling κειμένου
Σταμάτημα κειμένου, όταν το mouse είναι επάνω (over) απο το text: Είναι πολύ χρήσιμο, όταν ο αναγνώστης θέλει να διαβάσει ένα κινούμενο κείμενο, να μπορεί να το σταματάει με το ποντίκι του, Ειδικότερα αν η ταχύτητα του κειμένου είναι μεγάλη, οπότε, θα βάλει το ποντίκι πάνω στο κείμενο και θα το σταματήσει:
Να ο κώδικας για να το πετύχετε:
Παράδειγμα 9ο:
Κώδικας απλού scrolling κειμένου
(βάλτε το mouse πάνω απο το text να το δοκιμάσετε)
Αλλάζοντας το text colour:
Ο κώδικας για την αλλαγή στο text colour:( Τοποθετήστε τον πρίν το marquee tag)
Οπότε ο κώδικας δείχνει έτσι:
Παράδειγμα 10:
Κώδικας απλού scrolling κειμένου
Και τώρα ένας απο τους πιο ενδιαφέροντες και πιο χρήσιμους, το πώς να βάλετε 'hyperlinks' μέσα σε ένα scrolling text.
Hyperlink σημαίνει σύνδεσμός (link) που όταν τον πατάμε (click) οδηγούμαστε σε άλλη τοποθεσία/σελίδα(site).
Ελάτε να σας δείξω πως να βάζετε hyperlinks σε scrolling text:
Τοποθετώντας hyperlinks(που θα ανοίγουν στο ίδιο παράθυρο):
Ορίστε ο κώδικας:
ΠΡΟΣΟΧΗ:Αντικαταστήστε τα Link#1,Link#2,Link#3 μαζί με το κείμενο και τα url#1,url#2 και url#3 με τις στοχευμένες (target) διευθύνσεις (url addresses).
Να ένα παράδειγμα:
Το αποτέλεσμα θα φαίνεται έτσι:
Το blog του ΑΑΤΟΝ Δείτε τους πρώτους 100 Twitters στην Ελλάδα Στατιστική στο blog σας
Εάν θέλετε όμως να ανοίγουν τα Links σε new window, ορίστε ο κώδικας:
Αυτό ήταν! Τώρα, μπορείτε κι εσείς να βάλετε κινούμενο κείμενο στο blogger sidebar, σε blog post, κι όπου αλλού θέλετε.
Για την τοποθέτησή του στο sidebar, κάντε sign in στο blogger account σας >κάντε click στο 'add a page element' > και επικολήστε (paste) τον κώδικα στο html/javascript και κάντε save τις αλλαγές όπως δείχνει και η παρακάτω εικόνα
Και κατόπιν.. 
Εάν βρείτε κάπου δυσκολίες, κάντε τις ερωτήσεις σας στα σχόλια.
Δεν υπάρχουν σχόλια:
Δημοσίευση σχολίου