의존성이없는 wp_add_inline

11

페이지 바닥 글에 삽입하려는 자바 스크립트 스 니펫이 있습니다. Google 애널리틱스와 유사한 추적 코드입니다. 의존성이 없으며 독립형 스 니펫입니다.

이런 식으로 할 수 있습니다

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' );

약간 어리석은 것처럼 보이지만 (dummy.js는 빈 파일입니다) 작동합니다. 의존성을 건너 뛸 수있는 방법이 있습니까?

javascript wp-enqueue-script

— 짐 롱고
소스

13

`wp_add_inline_style()` -의존하지 않고

은 wp_add_inline_style()소스 파일 의존성없이 사용할 수 있습니다.

@Flix 의 예 는 다음과 같습니다 .

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

우리는 이것을 wp_enqueue_scripts행동에 연결시킬 것 입니다.

`wp_add_inline_script()` -의존하지 않고

티켓 # 43565 에 따르면 비슷한 wp_add_inline_script()버전 이 지원됩니다 (댓글의 확인을 위해 @MarcioDuarte, @ dev101 및 @DaveRomsey 덕분에).~~4.9.9~~ 5.0

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

헤더에 다음과 같이 <head>...</head>태그 사이에 표시됩니다.

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

에 표시하려면 바닥 글 :

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

$position입력 인수 의 기본값은 wp_add_inline_script()입니다 'after'. 'before'값 이상으로 인쇄 'after'.

— 처녀
소스

wp_add_inline_script()없는 의존성이 여전히 4.9.9 고려되고, 반드시이 추가됩니다 것을 의미하지 않는다. 따라서이 기능을 사용하기 전에 확인을 기다리는 것이 좋습니다.

— Marcio Duarte

1

우리는 WP 5.0 기준 으로 진행하는 것이 좋습니다 .

— Dave Romsey

누군가가 여기에서 내 의견을 삭제했습니다 (비 지르의 답변이 실제로 WP 5.0 이상에서 작동한다는 것을 확인했습니다). 한 달 후 실제로이 코드가 다시 필요했고, googled,이 답변을 찾았고 한 눈에 훑어 보았습니다. 내 의견을 찾지 못했습니다. 다른 결과에. 한 시간 후, 나는 여기에 돌아와서 이것이 내가 찾던 답이라는 것을 깨달았습니다! 중재자에게 : 유용한 의견을 삭제하지 마십시오. 다른 사람을위한 것이 아니라 향후 참조 및 미리 알림뿐만 아니라 ME도 제공합니다. 감사합니다.

— dev101

불행히도 나는 버전 4.9.x를 고수해야합니다.

— Lucas Vendramini

5

업데이트 : WordPress는 v5.0에서 의존하지 않고 인라인 스크립트 및 스타일 추가를 지원합니다. 구현에 대해서는 @birgire의 답변을 참조하십시오 .

사용하는 경우 wp_add_inline_script(), WP_Scripts::print_inline_script()궁극적으로 출력 인라인 스크립트에 사용됩니다. 의도적 print_inline_script()으로 유효한 종속성이 필요합니다 $handle.

이 경우 종속성이 없으므로 wp_add_inline_script()작업에 적합한 도구가 아닙니다. 대신 가짜 종속성 파일 (바람직하지 않은 추가 HTTP 요청)를 작성, 사용 wp_head또는 wp_footer출력 인라인 스크립트 :

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

  // aWholeBunchOfJavascriptCode

  echo '</script>' . PHP_EOL;
}

일반적으로 JavaScript는 .js파일에 추가 wp_enqueue_script()하고 wp_enqueue_scripts후크를 사용하여 큐에 넣어야합니다 . 를 사용하여 스크립트에 데이터를 제공 할 수 있습니다 wp_localize_script(). 때로는 스크립트 인라인을 추가해야 할 수도 있습니다.

— 데이브 롬지
소스

0

이를 수행하는 한 가지 방법은 <script>태그 내부에서 스크립트를 에코하는 함수를 작성 하여 wp_print_footer_scripts조치에 연결하는 것 입니다. 엄격히 통제하지 않는 것은 피해야하지만, 그렇지 않으면 일반적으로 안전하고 쉬운 방법입니다.

예를 들면 다음과 같습니다.

add_action( 'wp_print_footer_scripts', function () { 
    ?>
    <script>
        (function myFunction() { 
            /* your code here */
        })();
    </script>
<?php 
} );

— 모건 에스티 스
소스

의존성이없는 wp_add_inline_script

wp_add_inline_style() -의존하지 않고

wp_add_inline_script() -의존하지 않고

`wp_add_inline_style()` -의존하지 않고

`wp_add_inline_script()` -의존하지 않고