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?


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.


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
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.