Wanneer jy dit bereik, hierdie webwerf van 'n soekenjin of' n gewilde sosiale of Marken van webtuiste, 'n vriendelike groet verwelkom u en moontlik dui op' n paar ander artikels op grond van jou sleutelwoorde. Dit is danksy die WP Greet Box plug-in vir WordPress, ontwikkel deur Thaya Kareeson.
Die administrasie koppelvlak vir hierdie plug-in is heeltemal intuïtief en dit sal gee die bestuurder van 'n aantal opsies van wanneer en hoe gereeld om te wys die boodskap. Byvoorbeeld, jy kan stel dat dit 'n groet toon aan diegene wat aankom uit Google en vir' n maksimum bedrag van die tyd net.
If enabled, 'n webwerf besoeker is ook in staat om naby die groet boks hand en sodoende in staat te ignoreer die maksimum bedrag van die tyd opgestel in die administrasie.
Helaas die begroeting bly tydens sy set plek so lank as die bladsy sigbaar is, of totdat die gebruiker sluit dit handmatig. Om te verhoed dat die besoekers hoef te handmatig dinge wat hulle nie wil sien nie naby, Ek het geïmplementeer 'n motor versteek funksie.
Wat dit nie
Hierdie bykomende funksie moeiteloos werk met die plug-in. Sodra die groet het getoon dat, dit sal 'n paar sekondes wag voordat dit begin te verdwyn. As die besoeker neem nie enige aksie nie, die groet sal uiteindelik heeltemal verdwyn en die ruimte wat dit gebruik sal word teruggeëis deur in te skuif die res van die webwerf in die plek daarvan. Indien voor of tydens die verbleiking die besoeker beweeg die muis oor die area, enige verbleiking sal na normaal en die gebruiker word teruggestuur kan op enige van die skakels van die groet kan word om te wys.
Dit is nie in teenstelling met sommige van die boodskap ballonne het ons gewoond raak om van Windows Vista of Ubuntu — as jy nie belangstel, Dit sal die boodskap ballon sal verdwyn sonder om jou interaksie.
Hoe om dit te implementeer
Dit behels eerder 'n paar klein veranderings aan jou webwerf. Om te begin met, die WP Greet Box plug-in moet ingestel word om NIE outomaties vertoon 'n groet (Deselekteer beide “Outomaties toon begroeting op poste / bladsye”).
PHP-Portie
Nou moet jy wysig die WordPress tema's lêer sjabloon(met) waar jy wil graag die groet mekaar. Byvoorbeeld met hierdie webwerf, Ek is met behulp van die tema's header.php lêer. Dit behels die inbring van 'n klein bietjie van die PHP-kode as volgende:
By jou diskresie, jy mag of nie mag wil lê dit binne hierdie nie <div></ Div> stellings en dit sal afhang van waar jy soek die kode sowel as jou sjabloon.
CSS Gedeelte
Jy kan voortgaan om die CSS-style gebruik ingesluit met die plug-in (of jou eie, as jy die een toegepas het). Egter, daar is een item wat jy sal moet sluit spesifiek vir Microsoft Internet Explorer:
#greet_block {
*background:#fff;
}
Dit maak nie en veral nie hoef te word van hierdie kleur (sodat dit kan ooreenstem met die res van jou tema), maar die belang is dat 'n agtergrond is ingesluit. As dit nie daar is nie, Internet Explorer sal n paar vreemde dinge doen om die groet terwyl dit verbleiking. Dit is 'n bekende probleem.
Jy mag plaas dit in jou eie style of gebruik maak van die gebruik van die tema's style, oor die algemeen met die naam style.css.
JavaScript-gedeelte
Die meeste van die informatieverzameling word gedoen deur JavaScript en dit vereis dat jQuery is gelaai met jou tema. Baie gewilde temas wat reeds onder hierdie, maar as die uwe nie, eenvoudig voeg die volgende lyn (voordat die wp_head(); stelling):
<?php wp_enqueue_script('jquery'); ?>
Volgende kan jy óf 'n nuwe JavaScript-lêer of die gebruik van' n bestaande een wat met jou tema sal gelaai word, en sluit die volgende kode:
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);
}
);
});
Hierdie kode is nie hoog aangeskryf new sodat dit makliker sal wees vir jou om te verstaan wat daar gebeur en enige veranderinge as jy wil. As jy ongemaklik is met 'n JavaScript in die algemeen, dan is die gedeelte wat direk volg op dieGreetbox autoHide kommentaar sal interessant wees om jou. Spesifiek:
var _greeting_box_vars = {
init_timeout: 15000,
timeout: 3000,
block: '#greet_block',
_timer: 0
};
die init_timeout veranderlike bepaal hoe lank die groet sal sigbaar wees voordat dit begin verbleiking en die besoeker het beweeg sy muis nie meer as dit. In die bogenoemde voorbeeld, Hierdie is ' 15 sekondes (15000 milliseconds). die Time-out waarde wat die volg kan jy presies hoe lank die groet sal bly sigbaar nadat die muis is het meer as dit. In die bogenoemde voorbeeld is dit 3 sekondes.
die blok veranderlike gespesifiseerde die ID van die <div></ Div> afdeling wat is die eintlike groet. By verstek, die WP Greet Box gebruik die voorwaarde naam (# greet_block) maar dit kan anders wees as jy enige veranderinge gemaak het om die standaard instellings.
die _time mag nie verander word nie en word intern gebruik om rekord te hou van die time-out timer.
'N funksie in die script, jQuery.fn.fadeThenSlide, eenvoudig vervaag die groet, en as dit nie meer sigbaar sal dia dit uit die weg geruim. Enigiets wat volg onder die groet sal dan geleidelik verskuif in die plek daarvan, sodat jy nie links met 'n groot leë ruimte.
As jy die uitvoering van hierdie skrif in 'n aparte lêer, Maak seker dat die skrif sal met die tema's sjabloon genoem word. Byvoorbeeld, voeg by die header.php lêer:
Na dit het al geïmplementeer is nie, wil jy dalk die standaard groet aanstuur indien dit was afgeskakel voordat. Dan is jou webwerf te besoek om te kontroleer of alles werk soos verwag en in die korrekte plek. As jy nog in enige kwessies, voel vry om kommentaar te lewer of Kontak My direk.
Related Posts:
