Quero enfileirar um arquivo .js no meu tema filho

16

Tentei enfileirar um arquivo .js personalizado no diretório de temas filhos.

No functions.php do meu tema filho, encontro o seguinte código

/* After this. you can override Accessible Zen's pluggable functions or add your own.
 * Remember, do your best to stay accessible! :)
 *
 */
 add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_script( 'custom-script.js', 'js/custom-script.js', array('jquery') );
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( 'parent-style' ) );
}

onde apenas essa parte foi implementada por mim e deve carregar meu custom.script.js da pasta js /

wp_enqueue_script( 'custom-script.js', 'js/custom-script.js', array('jquery') );

Infelizmente isso não acontece, alguém pode ajudar?

* Atualização 2

O código agora se parece com isso e funciona, não funcionou quando adicionei a função à outra add_action. Obrigado a todos pela ajuda! Ainda me pergunto se não há uma maneira de cortar esse código um pouco.

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( 'parent-style' ) );
}

/*add my custom jquery script*/
add_action( 'wp_enqueue_scripts', 'menu_scripts' );
function menu_scripts() {
wp_enqueue_script( 'responsive-menu', get_bloginfo( 'stylesheet_directory' ) . '/js/responsive-menu.js', array( 'jquery' ), '1.0.0' );
wp_enqueue_script(
    'custom-script',
    get_stylesheet_directory_uri() . '/js/custom-script.js',
    array( 'jquery' )
);
        }

Para que serve esta linha?

wp_enqueue_script( 'responsive-menu', get_bloginfo( 'stylesheet_directory' ) . '/js/responsive-menu.js', array( 'jquery' ), '1.0.0' );

Isso é necessário?

MrKainig
fonte
wp_enqueue_script( 'custom-script.js', get_stylesheet_directory_uri() . 'js/custom-script.js', array('jquery') );
Pieter Goosen
@ Pieter Adaptei sua alteração, mas ela ainda não está funcionando. É o que tenho no meu arquivo .js e funciona se eu o colocar diretamente no page.php, por exemplo: <script> if (jQuery) {alert ("a biblioteca jQuery está carregada!"); } else {alert ("a biblioteca jQuery não foi encontrada!"); } </script>
MrKainig
@Pieter Ok eu colocar o código em questão
MrKainig
Remova as tags de script de seu arquivo js
Pieter Goosen

Respostas:

31

Aqui está um exemplo de trabalho:

add_action( 'wp_enqueue_scripts', 'menu_scripts' );
function menu_scripts() {
wp_enqueue_script( 'responsive-menu', get_bloginfo( 'stylesheet_directory' ) . '/js/responsive-menu.js', array( 'jquery' ), '1.0.0' );
wp_enqueue_script(
    'custom-script',
    get_stylesheet_directory_uri() . '/js/custom_script.js',
    array( 'jquery' )
);
        }

Ou assim, que aparentemente carrega mais rápido:

function my_scripts_method() {
    wp_enqueue_script(
        'custom-script',
        get_stylesheet_directory_uri() . '/js/custom_script.js',
        array( 'jquery' )
    );
}

add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

Fonte http://codex.wordpress.org/Function_Reference/wp_enqueue_script

get_template_directory_uri() funcionará apenas em um tema pai.

Brad Dalton
fonte
11
Por que você não usa get_stylesheet_directory_uri()?
Pieter Goosen
Ambos funcionam com base nos meus testes.
Brad Dalton
Eu tentei o primeiro, não funcionou. Você pode postar o blog de código completo (incluindo meus enfileiramentos existentes e em funcionamento)? Porque eu não sei como implementar corretamente o seu código com o que já está na minha functions.php
MrKainig
2
Sim, eles fazem, mas get_stylesheet_directory_uri()é mais rápido :-)
Pieter Goosen
É apenas um exemplo de trabalho. É necessário algum trabalho em seu nome para saber como ele funciona com seu código. Agora você pode refazer seu código para que ele carregue seus scripts no seu tema.
Brad Dalton