Κάθε φορά που την επίτευξη αυτού του δικτυακού τόπου από μια μηχανή αναζήτησης ή ένα δημοφιλές κοινωνικό ή bookmarking website, ένα φιλικό χαιρετισμό θα σας καλωσορίσει και, ενδεχομένως, προτείνει μερικά άλλα άρθρα με βάση τις λέξεις-κλειδιά αναζήτησης. Αυτή είναι η ευγένεια WP χαιρετίσω Box plug-in για WordPress, αναπτύχθηκε από Thaya Kareeson.
Η διεπαφή διοίκηση για αυτό το plug-in είναι αρκετά διαισθητικό και θα δώσει ο διαχειριστής μια σειρά από επιλογές για το πότε και πόσο συχνά για να δείτε το μήνυμα. Για παράδειγμα, μπορείτε να ρυθμίσετε ώστε να δείξει ένα χαιρετισμό σε εκείνους που φθάνουν από το Google και για μέγιστο χρονικό διάστημα που μόνο.
Αν ενεργοποιηθεί, έναν ιστότοπο επισκέπτης είναι επίσης σε θέση να κλείσει το παράθυρο χαιρετισμό με το χέρι και έτσι είναι σε θέση να παρακάμψετε το μέγιστο ποσό που καθορίζεται στη διοίκηση.
Δυστυχώς το χαιρετισμό θα παραμείνει στη θέση που για όσο καιρό η σελίδα είναι ορατή ή μέχρι ο χρήστης να κλείσει το χέρι. Για να αποφευχθούν οι επισκέπτες έχουν να κλείσει με το χέρι τα πράγματα που δεν επιθυμούν να δουν, Έχω εφαρμόσει ένα αυτόματο απόκρυψη χαρακτηριστικό.
Αυτό που κάνει
Αυτό το πρόσθετο χαρακτηριστικό συνεργάζεται άψογα με το plug-in. Μόλις το χαιρετισμό έχει αποδειχθεί, θα περιμένετε λίγα δευτερόλεπτα πριν αρχίσει να εξασθενίζει μακριά. Εάν ο επισκέπτης δεν προβαίνουν σε καμία ενέργεια, το χαιρετισμό τελικά θα εξαφανιστούν τελείως και ο χώρος που θα χρησιμοποιείται θα είναι ποιοτική αποκατάσταση σύροντας το υπόλοιπο της ιστοσελίδας στη θέση του. Εάν, πριν ή κατά τη διάρκεια ξεθώριασμα ο επισκέπτης μετακινεί το ποντίκι πάνω από την περιοχή, κάθε ξεθώριασμα θα επιστρέψει στα φυσιολογικά επίπεδα και ο χρήστης μπορεί να κάνει κλικ σε οποιαδήποτε από τις επιλογές του χαιρετισμό θα μπορούσε να δείχνει.
Δεν είναι σε αντίθεση με ορισμένες από τις μηνύματος μπαλόνια που έχουμε συνηθίσει από τα Windows Vista ή το Ubuntu — Εάν δεν είστε ενδιαφέρει, αυτό θα το μπαλόνι μήνυμα θα μαραζώσει δεν αλληλεπίδραση σας.
Πώς να την εφαρμόσουν
Πρόκειται για ένα μάλλον μερικές μικρές αλλαγές στην ιστοσελίδα σας. Να αρχίσει με, η WP χαιρετίσω Box plug-in θα πρέπει να ρυθμιστεί σε ΔΕΝ αυτόματα εμφανίσει ένα χαιρετισμό (Uncheck τόσο “Αυτόματα δείχνουν χαιρετισμό μήνυμα σε θέσεις / Σελίδες”).
PHP Portion
Τώρα πρέπει να επεξεργαστείτε το αρχείο του WordPress θέμα του προτύπου(με) όπου θέλετε να εμφανιστεί το χαιρετισμό. Για παράδειγμα, με αυτή την ιστοσελίδα, Είμαι χρησιμοποιώντας το θέμα του header.php αρχείο. Αφορά την προσθήκη ένα μικρό κομμάτι του κώδικα PHP ως εξής:
Κατά την κρίση σας, μπορείτε ή δεν θέλετε να το βάλετε μέσα στο πλαίσιο αυτών <div></ Div> καταστάσεις και αυτό θα εξαρτηθεί από όπου θα εντοπίσετε τον κώδικα, καθώς και το πρότυπό σας.
CSS Portion
Μπορείτε να συνεχίσετε να χρησιμοποιείτε το φύλλο στυλ CSS που περιλαμβάνονται με το plug-in (ή τη δική σας εάν έχετε εφαρμόσει ένα). Ωστόσο, υπάρχει μία θέση που θα πρέπει να περιλαμβάνουν ειδικές για τον Microsoft Internet Explorer:
#greet_block {
*background:#fff;
}
Δεν πρέπει κυρίως να είναι αυτό το χρώμα (ώστε να μπορεί να ταιριάζει με το υπόλοιπο του θέματος σας), αλλά το σημαντικό είναι ότι ένα χρώμα φόντου περιλαμβάνεται. Αν αυτό δεν είναι εκεί, Ο Internet Explorer θα κάνει κάποια περίεργα πράγματα για τον χαιρετισμό, ενώ είναι ξεθώριασμα. Είναι ένα γνωστό θέμα.
Μπορείτε να τοποθετήσετε στον δικό του στυλ σας ή να χρησιμοποιήσετε τη χρήση stylesheet το θέμα του, γενικά ονομάζεται style.css.
JavaScript Μερίδιο
Τα περισσότερα από τα legwork γίνεται με JavaScript και αυτό απαιτεί jQuery είναι φορτωμένο με το θέμα σας. Πολλά δημοφιλή θέματα που έχουν ήδη συμπεριλάβει την παρούσα, Αν η δική σας, αλλά δεν, απλώς προσθέστε την ακόλουθη γραμμή (πριν την wp_head(); δήλωση):
<?php wp_enqueue_script('jquery'); ?>
Επόμενη μπορείτε είτε να δημιουργήσετε ένα νέο αρχείο JavaScript ή χρησιμοποιήστε ένα ήδη υπάρχον που θα φορτωθεί με το θέμα σας, και να περιλαμβάνουν τα ακόλουθα κώδικα:
jQuery(document).ready(function( $ ){
/* Greetbox Autohide */
var _greeting_box_vars = {
init_timeout: 15000,
timeout: 3000,
block: '#greet_block',
_timer: 0
};
jQuery.fn.fadeThenSlide = function() {
return this.fadeTo(4500, 0).slideUp(500);
};
if (!$(_greeting_box_vars.block).css("display") !== "none") {
_greeting_box_vars._timer = setTimeout("jQuery(function($){$('"+_greeting_box_vars.block+"').fadeThenSlide()});", _greeting_box_vars.init_timeout);
}
$(_greeting_box_vars.block).hover(
function () {
if ($(this).css("opacity") !== "0") {
// It's not sliding yet, so give the user a chance to extend his period.
clearTimeout(_greeting_box_vars._timer);
$(_greeting_box_vars.block).stop().stop().fadeTo(300,1);
}
},
function () {
_greeting_box_vars._timer = setTimeout("jQuery(function($){$('"+_greeting_box_vars.block+"').fadeThenSlide()});", _greeting_box_vars.timeout);
}
);
});
Αυτός ο κώδικας δεν έχει βελτιστοποιηθεί πολύ έτσι θα είναι ευκολότερο για σας να καταλάβουν τι συμβαίνει και να κάνετε οποιεσδήποτε τροποποιήσεις, εάν το επιθυμείτε. Αν νιώθετε άβολα με τη JavaScript στον γενικό, τότε το μέρος αμέσως μετά τηνGreetbox Autohide σχόλιο θα είναι ενδιαφέρον να σας. ειδικώς:
var _greeting_box_vars = {
init_timeout: 15000,
timeout: 3000,
block: '#greet_block',
_timer: 0
};
Το init_timeout μεταβλητή καθορίζει το χρονικό διάστημα το χαιρετισμό θα είναι ορατή πριν να ξεκινήσει το ξεθώριασμα και ο επισκέπτης δεν έχει κινηθεί το ποντίκι πάνω από το. Στο παραπάνω παράδειγμα, αυτό 15 δευτερόλεπτα (15000 χιλιοστά). Το timeout αξία που ακολουθεί μπορείτε να καθορίσετε το χρονικό διάστημα το χαιρετισμό θα παραμείνουν ορατά μετά το ποντίκι έχει πάνω από το. Στο παραπάνω παράδειγμα αυτό είναι 3 δευτερόλεπτα.
Το block μεταβλητή ορίζεται το αναγνωριστικό της <div></ Div> τμήμα που περιέχει το πραγματικό χαιρετισμό. Εξ ορισμού, η WP χαιρετίσω Box χρησιμοποιεί το όνομα που (# greet_block) αλλά αυτό μπορεί να είναι διαφορετική αν έχετε προβεί σε τροποποιήσεις στις προεπιλεγμένες ρυθμίσεις.
Το _time Δεν πρέπει να αλλάξει και να χρησιμοποιείται εσωτερικά για να παρακολουθείτε το χρονόμετρο timeout.
Μια λειτουργία στο σενάριο, jQuery.fn.fadeThenSlide, απλά σβήνει το χαιρετισμό και αν δεν είναι πλέον ορατή θα διαφανειών από το δρόμο. Ό, τι ακολουθεί κάτω από τον χαιρετισμό στη συνέχεια θα μεταφέρονται σταδιακά στη θέση της, ώστε να μην μένουν με ένα μεγάλο κενό χώρο.
Εάν υλοποίηση αυτού του script σε ένα ξεχωριστό αρχείο, βεβαιωθείτε ότι το script θα καλείται με το θέμα του προτύπου. Για παράδειγμα, προσθέσετε στη header.php αρχείο:
Μετά από αυτό έχει τεθεί σε εφαρμογή όλα τα, ίσως θελήσετε να ενεργοποιήσετε την προεπιλεγμένη χαιρετισμό αν ήταν πριν από άτομα με ειδικές ανάγκες. Τότε επισκεφτείτε την ιστοσελίδα σας για να ελέγξετε αν όλα λειτουργούν όπως αναμένεται και στη σωστή θέση. Αν πέσετε σε τυχόν προβλήματα, αισθανθείτε ελεύθερος να ταχυδρομήσει ένα σχόλιο, ή Επικοινωνήστε μαζί μου άμεσα.
Σχετικές θέσεις:
