wp_add_inline_script sem dependência

Navegue suas respostas
4

Eu tenho um snippet de javascript que quero injetar no rodapé da página. É um código de acompanhamento, digamos semelhante ao Google Analytics. Não tem dependências, é um snippet independente.

Eu posso fazer algo assim 

function render_tracking_code(){
    wp_enqueue_script( 'depends-js', 'https://rdiv.com/dummy.js', array(), '0.01', true );
    wp_add_inline_script( 'depends-js', 'aWholeBunchOfJavascriptCode' );
}
add_action( 'wp_enqueue_scripts', 'render_tracking_code' );

Parece um pouco estúpido (dummy.js é um arquivo em branco), mas funciona. Existe uma maneira de pular a dependência?

    
por jimlongo 23.03.2018 / 22:45

3 respostas

4

Ao usar wp_add_inline_script() , WP_Scripts::print_inline_script() será usado para gerar scripts embutidos. Por design, print_inline_script() requer uma dependência válida, $handle .

Como não há dependência neste caso, wp_add_inline_script() não é a ferramenta certa para o trabalho. Em vez de criar um arquivo de dependência falso (e uma solicitação HTTP indesejável adicional), use wp_head ou wp_footer para gerar o script in-line: 

add_action( 'wp_head', 'wpse_add_inline_script' );
function wpse_add_inline_script() {
  echo '<script>' . PHP_EOL;

  // aWholeBunchOfJavascriptCode

  echo '</script>' . PHP_EOL;
}

Geralmente, o JavaScript deve ser adicionado a um arquivo .js e enfileirado usando wp_enqueue_script() no gancho wp_enqueue_scripts . Os dados podem ser disponibilizados para o script usando wp_localize_script() . Às vezes, ainda pode ser necessário adicionar um script inline.

    
por Dave Romsey 23.03.2018 / 23:37
1

wp_add_inline_style() - sem dependência

O wp_add_inline_style() pode ser usado sem uma dependência de arquivo de origem.

Veja um exemplo da @Flix: 

wp_register_style( 'dummy-handle', false );
wp_enqueue_style( 'dummy-handle' );
wp_add_inline_style( 'dummy-handle', '* { color: red; }' );

onde iríamos enganchar isso na ação wp_enqueue_scripts .

wp_add_inline_script() - sem dependência

De acordo com o ticket # 43565 , semelhante será suportado para wp_add_inline_script() na versão 4.9.9 : 

wp_register_script( 'dummy-handle-header', '' );
wp_enqueue_script( 'dummy-handle-header' );
wp_add_inline_script( 'dummy-handle-header', 'console.log( "header" );' );

que exibirá o seguinte no cabeçalho , ou seja, entre as tags <head>...</head> : 

<script type='text/javascript'>
console.log( "header" );
</script>

Para exibi-lo no rodapé : 

wp_register_script( 'dummy-handle-footer', '', [], '', true );
wp_enqueue_script( 'dummy-handle-footer'  );
wp_add_inline_script( 'dummy-handle-footer', 'console.log( "footer" );' );

O padrão do argumento $position input em wp_add_inline_script() é 'after' . O valor 'before' imprime acima de 'after' .

    
por birgire 13.08.2018 / 11:41
0

Uma maneira de fazer isso é criar uma função que ecoa seu script dentro de uma tag <script> e conectá-lo ao wp_print_footer_scripts ação. Você deve tomar cuidado para escapar de qualquer coisa que você não controla estritamente, mas isso é um método geralmente seguro e fácil de outra forma.

Por exemplo: 

add_action( 'wp_print_footer_scripts', function () { 
    ?>
    <script>
        (function myFunction() { 
            /* your code here */
        })();
    </script>
<?php 
} );
    
por Morgan Estes 13.04.2018 / 06:03

Tags

Executando vários sites WordPress no mesmo núcleo / plugins? Tipo de taxonomia de tipo de postagem personalizada de consulta com base na página