Kedykoľvek sa dostanete túto webovú stránku z vyhľadávača, alebo populárne sociálne alebo bookmarking website, priateľský pozdrav vás privíta a prípadne navrhnúť niekoľko ďalších článkov na základe vyhľadávania kľúčových slov. To je zdvorilosť WP Pozdraviľ Box plug-in pre WordPress, developed by Thaya Kareeson.
Administračné rozhranie pre tento plug-in je pomerne intuitívne a umožnia správcovi viacero možností, kedy a ako často sa zobrazí správa. Napríklad, môžete nastaviť, aby mohla pozdrav tým, ktorí prichádzajú zo spoločnosti Google a maximálna doba, len.
Ak je povolené, Návštevník internetových stránok je tiež schopný uzavrieť pozdrav polia ručne a tým potlačiť maximálna doba stanovená v podaní.
Bohužiaľ pozdrav zostane na svojom mieste nastaviť tak dlho, ako je stránka je viditeľná alebo kým používateľ ukončí ju ručne. Aby sa predišlo návštevníci museli ručne zatvoriť veci, ktoré si neželajú vidieť, Som sa vykonáva automaticky skryť funkcie.
Čo to robí
Táto dodatočná funkcia funguje bez problémov s plug-in. Akonáhle pozdrav bolo preukázané,, bude čakať niekoľko sekúnd pred tým, ako začne miznúť. Ak sa návštevník neprijme žiadne opatrenia, pozdrav nakoniec zmizne úplne a priestor je používať, budú kultivovaná posuvnými zvyšok stránky, na ktorého mieste. Ak je pred alebo počas vyblednutiu návštevník pohybuje myšou nad plochou, akejkoľvek vyblednutiu sa vráti do normálu a používateľ môže na ktorýkoľvek z odkazov pozdrav môže byť zobrazené.
Nie je to na rozdiel od niektorých správ balóny sme si zvykli na Windows Vista alebo Ubuntu — Ak vás nezaujíma, to bude správa balón bude slabnúť, bez toho by vaše interakcie.
Ako sa na jej vykonanie
Zahŕňa niekoľko pomerne malé zmeny na vašich webových stránkach. Ak chcete začať s, WP Pozdravte Box plug-in by mala byť nastavená na NIE automaticky zobrazí pozdrav (Odznačte obaja “Automaticky zobrazí pozdrav správy na miesta / Stránky”).
PHP Porcie
Teraz je potreba upraviť WordPress tému aktu šablóny(S) , Kde chcete zobraziť pozdrav. Napríklad sa tohto webu, Ja som za používanie daného tému header.php súbor. To zahŕňa vkladanie kúsoček kódu PHP, ako tieto:
Podľa vášho uváženia, Vám môže alebo nemusí chcieť, uzavrite ho v týchto <div></ Div> vyhlásenia a bude záležať na tom, kde môžete nájsť kód, rovnako ako šablóny.
CSS Porcie
Môžete pokračovať v používaní štýlov CSS súčasťou plug-in (alebo váš vlastný, ak ste implementoval aj jeden). Avšak, je tu jeden záznam, ktorý bude musieť obsahovať konkrétne pre Microsoft Internet Explorer:
#greet_block {
*background:#fff;
}
To nie je osobitne potrebné túto farbu (tak to môže zápas zvyšok tému), , Ale dôležité je, že farba pozadia je zahrnuté. Ak tomu tak nie je tam, Internet Explorer bude robiť nejaké divné veci pozdrav, zatiaľ čo je vyblednutiu. Je to známy problém.
Môžete to vo vašom vlastnom štýle, alebo využiť použitie daného téme štýlov, všeobecne pomenované style.css.
JavaScript diel
Väčšina terénny výskum sa vykonáva JavaScript, a to si vyžaduje, aby jQuery je naložený s témou. Veľa populárnych tém, ktoré už obsahujú túto, ale ak vás nebude, jednoducho pridajte nasledujúci riadok (Pred wp_head(); vyhlásenie):
<?php wp_enqueue_script('jquery'); ?>
Ďalej môžete buď vytvoriť nový súbor JavaScript, alebo použite už existujúcu, ktorá bude naložené s vašou témou, a musí obsahovať nasledujúci kód:
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);
}
);
});
Tento kód nebol vysoko optimalizované tak to bude pre vás jednoduchšie pochopiť, čo sa deje, a akokoľvek meniť, ak si prajete. Ak sa vám vadí JavaScript všeobecne, potom časť ihneď poGreetbox Autohide komentár bude zaujímať. Konkrétne:
var _greeting_box_vars = {
init_timeout: 15000,
timeout: 3000,
block: '#greet_block',
_timer: 0
};
The init_timeout premenná určuje, ako dlho bude viditeľná pozdrav pred tým, ako začne vyblednutiu a návštevník nemá pohnúť myšou cez to. vo vyššie uvedenom príklade, to je 15 sekúnd (15000 milisekundy). The timeout hodnoty vyplýva, že môžete určiť, ako dlho zostane pozdrav viditeľné po myši bol nad ním. Vo vyššie uvedenom príklade je to 3 sekúnd.
The blok premenné špecifikované ID <div></ Div> oddiel, ktorý obsahuje aktuálny pozdrav. V predvolenom nastavení, WP Pozdraviľ Box používa názov stanovený (# Greet_block) ale to môže byť inak, keby ste urobili akékoľvek zmeny predvoleného nastavenia.
The _time by sa nemali meniť a je vnútorne používa pre sledovanie časového vypínača.
Funkcia v skripte, jQuery.fn.fadeThenSlide, jednoducho miznú pozdrav, a ak to nie je vidieť, že sa bude šmýkať z cesty. Čokoľvek, čo nasleduje nižšie pozdrav potom bude postupne presunutý na svojom mieste, takže nie ste vľavo s veľkou prázdnu plochu.
Ak ste tento skript, ktorým sa vykonáva v samostatnom súbore, uistite sa, že skript sa zavolá s témou v template. Napríklad, pridajte do header.php súbor:
Potom, čo to bolo všetkých realizovaných, budete priať, aby predvolené pozdrav, ak bola zdravotne postihnutých pred. Potom navštívi vaše webové stránky skontrolujte, či všetko funguje, ako sa očakávalo, a na správne miesto. Ak narazíte na akékoľvek problémy, kľudne písať komentár, alebo Kontaktujte ma priamo.
Súvisiace príspevky:
