Post escrito por Yeltsin Lima
Acho isso bastante útil para os leitores: a possibilidade de destacar os termos de pesquisa feitas pelo WordPress, com o jQuery. A dica abaixo foi dada pelo site WP Switch e estou apenas “remontando” o tutorial com minhas palavras. A primeira coisa a ser feita é adicionar o código abaixo na página functions.php (se não possuir, crie).
<?php
function hls_set_query() {
$query = attribute_escape(get_search_query());
if(strlen($query) > 0){
echo '
<script type="text/javascript">
var hls_query = "'.$query.'";
</script>
';
}
}
function hls_init_jquery() {
wp_enqueue_script('jquery');
}
add_action('init', 'hls_init_jquery');
add_action('wp_print_scripts', 'hls_set_query');
?>
Feito isso, copie o outro código no seu header.php antes de fechar a tag </head>.
<style type="text/css" media="screen">
.hls { background: #D3E18A; } /* <- Você pode alterar o estilo aqui */
</style>
<script type="text/javascript">
jQuery.fn.extend({
highlight: function(search, insensitive, hls_class){
var regex = new RegExp("(<[^>]*>)|(\\b" search.replace(/([-.* ?^${}()|[\]\/\\])/g,"\\$1") ")", insensitive ? "ig" : "g");
return this.html(this.html().replace(regex, function(a, b, c){
return (a.charAt(0) == "<") ? a : "<strong class=\"" hsl_class "\">" c "</strong>";
}));
}
});
jQuery(document).ready(function($){
if(typeof(hls_query) != 'undefined'){
$("#post-area").highlight(hls_query, 1, "hls"); // <- Altere a post-area para a ID ou Classe do local em que se encontra os termos que serão destacados
}
});
</script>
Como foi traduzido no código, você precisa alterar o campo post-area para o campo correspondente do seu tema. Se for uma classe, não se esqueça de substituir o # por um .
Você também pode customizar a aparência do termo destacado, na classe .hls. Só cuidado para não deixar “destacado” demais. :-)
Fonte: WP Switch
Curso o primeiro período de Publicidade & Propaganda na Faculdade Integradas Barros Melo (AESO), sou colaborador do Meio Bit e fundador do DicasWP.
Loading ...
Yeltsin, concerta a fonte, você escreveu errado
A fonte está certa :P
Se não quiser usar jquery, pode fazer assim:
$searchQuery = $_GET['s'];
Resultado(s) da busca por: <?php echo ("$searchQuery”); ?>
[]´s