Isso acontece pois seu tema carregou a biblioteca jquery depois de executar seu código: Para adicionar um script no wordpress você precisa usar a função add_action('wp_enqueue_scripts' , 'function_name')
.
O exemplo abaixo mostra como fazer isso utilizando apenas vanilla.js(javascript). Se caso você precisa utilizar jquery terás que registrar a biblioteca com a função wp_enqueue_script()
.
Observe que estou executando o script apenas nas páginas e posts:
is_single() && is_page()
.
Você pode tirar esse trecho porém seu script ira executar em todas as rotas do site.
Adicione isso ao functions.php
do tema:
Apenas com vanila.js:
if (! function_exists('mudar_span')){
/**
* Muda o conteúdo da tag span com a classe .label-new
*/
function mudar_span(){
if (is_single() && is_page()) {
?>
<script>
function ready (fn) {
if (document.attachEvent ? document.readyState === "complete" : document.readyState !== "loading")
{
return fn();
}
else{
return document.addEventListener('DOMContentLoaded', fn);
}
}
ready(function () {
el = document.querySelectorAll('.label-new span');
for (let n = 0; n < el.length; n++) {
el[n].innerHTML = 'Novo !';
}
})
</script>
<?php
}
}
}
add_action('wp_enqueue_scripts' , 'mudar_span' );
Para poder usar o jquery precisas certificar que ele está sendo incluído no cabeçalho:
Usando o jquery:
wp_enqueue_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js', array('jquery'), '', false);
O ultimo atributo false
determina o carregamento do script
no head
do site. Caso for true
o script
é carregado no footer
.
Agora você pode registrar o script:
if (! function_exists('mudar_span_jquery')){
/**
* Muda o conteúdo da tag span com a classe .label-new
*/
function mudar_span_jquery(){
if (is_single() && is_page()) {
?>
<script>
$(document).ready(function(){
$(".label-new").html("Novo!");
});
</script>
<?php
}
}
}
add_action('wp_enqueue_scripts' , 'mudar_span_jquery' );
window.onload = function(){ $(".label-new").html("Novo!"); }