Kiedykolwiek osiągnąć tę stronę z wyszukiwarki lub popularnym serwisie społecznym lub zakładki, przyjazne powitanie będzie gościć Państwa i ewentualnie zaproponować kilka innych artykułów na podstawie słów kluczowych wyszukiwania. To dzięki uprzejmości WP Pozdrówcie Box plug-in do WordPress, opracowany przez Thaya Kareeson.
Interfejs administracyjny do tego plug-in jest bardzo intuicyjne i to daje administratorowi kilka opcji, kiedy i jak często pokazują wiadomości. Na przykład, Można ustawić go pokazać pozdrowienia dla tych, którzy przyjeżdżają z Google i maksymalny czas tylko.
Jeśli aktywny, Strona gości jest również w stanie zamknąć okno okolicznościowe ręcznie, a tym samym stanie zastąpić maksymalną ilość czasu określonego w administracji.
Niestety powitanie pozostanie na jej położenie tak długo, jak strona jest widoczna lub dopóki użytkownik nie zamknie go ręcznie. W celu uniknięcia konieczności ręcznego odwiedzających blisko rzeczy, które nie chcą, aby zobaczyć, I zaimplementowana funkcja auto ukryj.
Co robi
Ta dodatkowa funkcja działa bezproblemowo z plug-in. Po przywitaniu wykazano, będzie poczekać kilka sekund, zanim zacznie zanikać. Jeśli użytkownik nie podejmie żadnych działań, powitanie w końcu zniknąć całkowicie i miejsca to stosowane będą regeneracji przesuwając resztę strony na swoim miejscu. Jeśli przed lub w czasie zaniku gości przesuwa kursor myszki nad obszar, wszelkie Fading będą wracały do normy, a użytkownik może kliknąć jeden z linków powitanie może być wyświetlana.
To nie jest w przeciwieństwie do niektórych wiadomości balony przyzwyczailiśmy się do systemu Windows Vista lub Ubuntu — Jeżeli nie jesteś zainteresowany, it'll balon komunikat zniknie bez interakcji.
Jak do jego realizacji
Chodzi raczej kilka drobnych zmian do swojej witryny. Na początek, WP Pozdrówcie Box plug-in powinien być ustawiony na NIE automatycznie wyświetlane powitanie (Usuń zaznaczenie obu “Automatycznie pokazuj zapowiedź na stanowiska / stron”).
PHP Porcja
Teraz musisz edytować WordPress w pliku szablonu(z) gdzie chcesz wyświetlać powitanie. Na przykład z tej strony, Używam motywu header.php plik. Polega ona na wkładaniu odrobinę kodu PHP, po:
Na Państwa uznania, Ci mogą lub nie chcą ująć ją w tych <div></ Div> Oświadczenia i będzie zależało od miejsca zlokalizowania kodu jak i szablon.
CSS Porcja
Można nadal używać stylów CSS łącznie z plug-in (lub własne, jeżeli wdrożono jeden). Jednakże, Jest jedna pozycja, że trzeba będzie zawierać szczegółowe dla programu Microsoft Internet Explorer:
#greet_block {
*background:#fff;
}
Nie trzeba być szczególnie ten kolor (więc może dopasować resztę tematu), ale ważne jest to, że kolor tła jest włączone. Jeśli tam nie ma, Program Internet Explorer nie jakieś dziwne rzeczy na powitanie, gdy jest on na blaknięcie. To znany problem.
Można się tego w swoim arkuszu stylów lub wykorzystanie wykorzystanie motywu arkusza, ogólnie o nazwie style.css.
Część JavaScript
Większość legwork odbywa się poprzez JavaScript i wymaga, że jQuery jest ładowany z tematem. Wiele popularnych tematów, zawiera już ten, ale jeśli twoje nie, wystarczy dodać następującą linię (przed wp_head(); oświadczenie):
<?php wp_enqueue_script('jquery'); ?>
Następnie można utworzyć nowy plik JavaScript lub wykorzystanie istniejącego, który zostanie załadowany z tematem, i zawierać następujący kod:
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);
}
);
});
Ten kod nie został wysoce zoptymalizowany tak będzie Ci łatwiej zrozumieć, co się dzieje i wprowadzać żadnych modyfikacji, jeśli chcesz. Jeśli nie podoba ci z JavaScript w ogóle, następnie część zaraz poGreetbox Autohide komentarz będzie Cię zainteresować. Konkretnie:
var _greeting_box_vars = {
init_timeout: 15000,
timeout: 3000,
block: '#greet_block',
_timer: 0
};
The init_timeout zmienna określa, jak długo pozdrowienia będą widoczne przed rozpoczęciem blaknięcie i użytkownik nie ma poruszyć kursor myszki nad nim. W powyższym przykładzie, to 15 sekund (15000 milisekund). The timeout wynika, że wartość można określić, jak długo pozostaną widoczne powitanie po mysz została nad nim. W powyższym przykładzie jest to 3 sekund.
The blok zmiennej ustalonej ID <div></ Div> część, która zawiera rzeczywistą powitanie. Domyślnie, WP Pozdrówcie Box używa pod nazwą (# greet_block) ale może to być inny, gdyby dokonane jakiekolwiek zmiany ustawień domyślnych.
The _Time nie powinny być zmieniane i jest używana wewnętrznie do śledzenia timeout timer.
Funkcja w skrypcie, jQuery.fn.fadeThenSlide, po prostu znika z pozdrowieniami, a jeśli nie jest już widoczna będzie przesuń go z drogi. Wszystko, co następuje poniżej powitanie zostanie stopniowo przeniósł się na swoim miejscu, więc nie pozostało z dużym obszarze pusty.
Jeśli jesteś realizacji tego skryptu w oddzielnym pliku, Upewnij się, że skrypt będzie wywołany z tematem szablonu. Na przykład, Dodaj do header.php plik:
Po tym wszystkim nie wdrożono, może chcesz włączyć domyślne powitanie, jeśli zostało wyłączone przed. Następnie należy odwiedzić witrynę, aby sprawdzić, czy wszystko działa zgodnie z oczekiwaniami i we właściwym miejscu. Jeśli napotkasz jakiekolwiek problemy, Nie krępuj się pisać komentarz lub Contact Me bezpośrednio.
Podobne posty:
