플러그인이나 테마에 JavaScript를 포함하여 올바른 방법-Word누르다-php.cn

WordPress 테마 및 플러그인에 JavaScript 코드를 효율적으로로드하십시오 키 포인트

WordPress 플러그인 또는 테마에 JavaScript 코드를 포함시킬 때 생성 된 페이지의 불필요한 팽창을 피하기 위해 신중하게 수행하십시오. 동일한 파일을 여러 번 삽입하지 않으려면 함수를 사용할 수 있습니다. 함수에는 스크립트 이름과 스크립트 URL이라는 두 가지 매개 변수가 필요합니다. 또한 스크립트가 포함 된 방법에 대한 더 나은 제어를 위해 세 가지 추가 매개 변수를 허용 할 수 있습니다.

함수는 스크립트를 포함하는 방법을 나타내는 데 사용되지만 실제로 포함되지는 않습니다. 이 기능은 다른 플러그인이 등록 된 스크립트를 사용할 수 있으므로 종속성을 관리하는 데 매우 유용합니다.

스크립트는 어디에서나 등록해서는 안됩니다. 대신, 개발자는 스크립트가 필요한시기 또는 위치를 생각하고 필요한 경우에만 스크립트를 포함시키기 위해 작업/필터 API 또는 WordPress 기능을 사용해야합니다.

wp_enqueue_script() 함수는 동일한 스크립트에 두 번 포함되지 않으며 헤더 또는 바닥 글에 올바르게 포함되도록합니다. 그러나 특정 시간 또는 위치에 스크립트가 필요한 경우

호출은 올바른 기능에 배치되어야합니다.

wp_enqueue_script() 현재 WordPress.org에는 33,000 개가 넘는 플러그인과 2,600 개의 테마가 있으며이 플랫폼에없는 테마와 플러그인을 추가 할 수도 있습니다. 그들은 다양한 작업을 수행 할 수 있으며 종종 JavaScript를 사용하여 일부 기능을 제공합니다.

기본적으로 테마 나 플러그인에 JavaScript 코드를 포함시키는 것은 어렵지 않습니다. WordPress는 HTML 파일 만 생성하므로 스크립트 태그를 사용하여 코드를 직접 포함 시키거나 SRC 속성이있는 파일에 링크하는 것은 충분합니다. 당신이 그것을 혼자서 개발한다면, 세상에서 고립 된. wp_register_script() 그러나 그것은 사실이 아닙니다. WordPress를 사용하는 사용자는 플러그인이나 테마와 공존하는 플러그인 또는 테마를 설치할 수 있으며 이러한 도구의 개발자는 JavaScript를 사용할 수도 있습니다. 또한 WordPress 자체는 JavaScript를 사용하고 있습니다. 문제는 모든 사람이 마음대로 스크립트를 포함하면 생성 된 페이지가 불필요한 부풀어 오른다는 것입니다.

질문

예제는 명확 해지고, 내가 익숙한 예를 사용하겠습니다 : 내 자신.

나는 사용자가 포스트에 파노라마 이미지를 추가 할 수있는 WP Photo Sphere 플러그인을 개발했습니다. 이를 위해서는 다른 JavaScript 파일이 필요합니다. 파노라마를 표시하기위한 라이브러리 및 파노라마를 표시하기위한 특정 태그를 검색하기위한 파일. 또한이 마지막 스크립트에서 jQuery를 사용하므로 포함해야합니다. wp_enqueue_script() 사용자가 신경 쓰지 않으면이 세 스크립트를 웹 사이트의 모든 페이지에 삽입 할 수 있습니다. 즉, 페이지가 필요하지 않은 경우에도 방문자 가이 파일을 다운로드해야합니다. wp_enqueue_script() 현재, 문제는 이미 심각하지만 jQuery를 고려하면 문제가 더 커집니다. 이 라이브러리를 사용하는 두 개의 플러그인 에이 동작이 있으면 어떻게해야합니까? 사용자는 쓸모없는 파일을 다운로드 할뿐만 아니라 두 번 다운로드합니다!

페이지가 무겁을수록로드 시간이 길어질 수 있습니다. 로드 시간이 너무 길어있는 웹 사이트는로드 속도가 빠른 웹 사이트보다 방문이 적습니다. 플러그인이나 테마가 너무 길어지면 사용되지 않습니다. 이것은 의심 할 여지없이 도구를 최적화하기위한 강력한 원동력입니다.

피할 수없는 스크립트 삽입 함수

동일한 파일을 반복적으로 삽입하는 문제를 피하기 위해 WordPress는 훌륭한 기능을 제공합니다. 이 기능은 스크립트를 삽입하려면 가장 친한 친구 여야합니다.

이름에서 알 수 있듯이이 함수는 스크립트를 큐에 추가하고 올바른 시간에 헤더 또는 바닥 글에 포함하므로 페이지 중간에 스크립트 태그가 추가되지 않습니다. 단독으로 사용하면 기능에는 스크립트 이름과 스크립트 URL이라는 두 가지 매개 변수가 필요합니다. 예를 들어, 플러그인이 요구하는 스크립트를 포함하려면이 줄을 기본 파일에 추가합니다 (아래의 올바른 방법이 표시됩니다).

그러나 세 가지 추가 매개 변수는 스크립트가 포함 된 방법, 특히 마지막 부울 매개 변수를 더 잘 제어 할 수 있습니다. 기본적 으로이 부울 값은 허위로 설정되고 스크립트가 헤드 태그에 포함됩니다. TRUE로서 스크립트가 바닥 글래에 포함됩니다.

네 번째 매개 변수는 스크립트의 다른 버전을 만들 때 유용합니다. 버전 번호가 포함 된 문자열이며 URL의 끝에 추가됩니다. 버전 번호를 추가하면 방문자가 캐시에 관계없이 올바른 스크립트의 스크립트를 얻을 수 있습니다. wp_enqueue_script() 세 번째 매개 변수는 스크립트의 종속성을 표시 할 수 있기 때문에 가장 흥미로운 매개 변수 중 하나입니다. 예를 들어, 스크립트에 jQuery 라이브러리가 필요한 경우이 매개 변수를 사용할 수 있습니다.

보시다시피, 종속성이 하나만 있더라도 배열에 종속성이 표시되어야합니다. 이 배열에서 표시하는 이름은 두 번째 함수로 등록 된 스크립트의 이름입니다.

두 번째 함수는 첫 번째 함수와 정확히 동일하게 사용됩니다. 스크립트 이름, URL, 종속성, 버전 번호 및 바닥 글에 포함되어야하는지 여부를 나타냅니다. 마지막 세 매개 변수는 선택 사항이지만 다른 매개 변수가 필요합니다.

wp_enqueue_script() 등록 스크립트에는 포함되지 않습니다. 스크립트를 포함시키기 위해

기능을 사용해야하지만 사용은 단순화됩니다. 스크립트의 이름 만 표시하면됩니다.

wp_enqueue_script('test', plugin_dir_url(__FILE__) . 'test.js');

로그인 후 복사

당신은

가 모든 작업을 수행 할 수 있기 때문에 얼마나 유용한 지 궁금 할 것입니다. 이 기능은 스크립트가 포함되어야하는 방법을 나타내는 데 사용되지만 필요하지 않은 경우 포함되지 않습니다.

예제가 더 명확하므로 두 개의 JavaScript 파일을 포함해야한다고 상상해보십시오. 첫 번째 파일은 라이브러리이며 두 번째 파일은이 라이브러리를 사용하여 무언가를 수행합니다. 라이브러리는 jQuery가 제대로 작동하도록 요구하므로 다음과 같이 등록합니다.

<,>이 시점에서 라이브러리가 포함되어 있지 않지만 기본 파일을 포함하려면이 라이브러리를 포함시켜야합니다. 우리는이를 종속성으로 표시합니다.

wp_enqueue_script('test', plugin_dir_url(__FILE__) . 'test.js');

로그인 후 복사

모든 마법의 힘이 나타났습니다. myfile.js 파일이 포함되어 있지만 mylib.js 파일이 작동해야합니다. 이것이 종속성이 작동하는 것이므로이 파일이 포함됩니다. 하지만! mylib.js 파일에는 jQuery가 필요하므로 jQuery도 포함됩니다. 코드 줄에는 세 가지 파일이 포함되어 있습니다.

그러나 이것이

기능의 유일한 장점은 아닙니다. 스크립트를 등록하면 다른 플러그인이 사용할 수 있습니다. 따라서 일부 플러그인을 정의하는 다양한 플러그인을 만들려면 다른 라이브러리를 정의하면 다른 플러그인이 포함시킬 수 있습니다.

<🎜 🎜> 함수의 가장 큰 장점은 동일한 스크립트를 두 번 포함하지 않는다는 것입니다. 예를 들어, 두 파일 모두 jQuery가 필요하다고 상상해보십시오.이 파일은이를 종속성으로 표시하고 WordPress는 첫 번째 파일이 포함될 때 라이브러리를 포함합니다. 그런 다음 두 번째 스크립트를 포함시킬 시간이 있습니다. WordPress는 jQuery를 종속성으로 취급하지만 라이브러리에는 이미 포함되어 있으므로 다시 포함 할 필요가 없습니다. WordPress는 그렇게하지 않습니다. wp_register_script() 이름이 다른 URL을 가진 두 개의 스크립트를 사용하려고 할 때도 동일한 동작이 발생합니다. 다음 예에서 WordPress는 파일 만 한 번만 포함합니다.

<:> 그러나 참고 :이 동작은 제한되어 있습니다. 버전 번호가 하나 이상의 <🎜 콜에 표시되면 버전 번호가 동일하더라도 스크립트는 두 번 포함됩니다. 다음 예제는 이전 예제와 동일하지만 파일을 두 번 포함합니다. wp_enqueue_script()

즉, 일반적으로 다른 이름으로 동일한 스크립트를 등록 할 이유가 없습니다. 그러나 상황을 명확히해야합니다.

보시다시피,이 두 기능은 종속성을 관리하는 가장 좋은 방법입니다. 등록하면 WordPress는 나머지를 자동으로 처리합니다.

우리는 "<🎜 🎜> jQuery <🎜 🎜>"이라는 이름을 사용하여 jQuery를 우리 자신의 파일에 포함시키고 싶지만 등록하지 않았다는 것을 나타냅니다. 이 이름은 WordPress에 의해 등록됩니다 : CMS를 다운로드하면 jQuery가 포함되어 있습니다.

wp_enqueue_script('test', plugin_dir_url(__FILE__) . 'test.js', array('jquery'));

로그인 후 복사

이 라이브러리만이 유일한 것은 아닙니다.이 페이지에서 WordPress 등록을위한 모든 스크립트를 찾을 수 있습니다. 직접 또는 종속성을 통해 등록 할 수 있으며 파일을 제공 할 필요가 없어서이 스크립트를 사용하는 모든 플러그인 또는 테마는 동일한 파일을 사용합니다.이 예에서는 다른 플러그인이 jQuery를 사용하는 경우 라이브러리가 라이브러리를 사용합니다. 한 번만 포함됩니다.

wp_enqueue_script() <<> 어디에서나 스크립트를 등록하지 마십시오!

<<> <🎜 🎜>

wp_register_script('test', plugin_dir_url(__FILE__) . 'test.js', array('jquery'), '1.0', true);

로그인 후 복사

함수는 동일한 스크립트에 두 번 포함되지 않으며 헤더 또는 바닥 글에 올바르게 포함되도록합니다. 그러나 표시된 페이지에 스크립트가 필요하지 않으면 어떻게해야합니까?

ACTION/FILTER API <🎜

사용 사용 컨텐츠 편집기에 미디어 버튼을 추가하는 예를 들어보십시오. JavaScript 파일은 사용자가 편집기에있을 때만 필요합니다. 실제로, 평균 방문자가 기사를 읽을 때, 그들은이 스크립트가 필요하지 않습니다. 그것을 포함하여 쓸모없고 페이지를 더 무겁게 만듭니다.

그래서 스크립트를 페이지에 포함시키고 싶을 때 다음 질문을 스스로에게 물어보십시오.이 스크립트가 언제 필요합니까? 물론,이 질문에 대한 답은 스크립트의 기능에 따라 다릅니다.

그러나이 답을 찾으면 해당 조치를 찾으십시오. WordPress Codex는 사용 가능한 작업 목록을 제공하므로 여기에서 검색 한 작업을 찾을 수 있습니다. 찾았 어? 훌륭하게, 플러그인의 기본 파일 또는 테마의 functions.php 파일에 스크립트를 등록하는 새 기능을 만듭니다.

그런 다음, 행동이 트리거되면 실행하십시오 :

예를 들어, 미디어 버튼을 추가하려면

wp_enqueue_script('test', plugin_dir_url(__FILE__) . 'test.js');

로그인 후 복사

액션을 사용합니다.

위의 링크 된 참조 에서이 조치를 검색하려고하면 아무것도 찾지 못할 수 있습니다.이 줄을 작성할 때

가 나열되지 않습니다. 이 목록은 철저하지는 않지만 좋은 출발점입니다.

wp_enqueue_script('test', plugin_dir_url(__FILE__) . 'test.js', array('jquery'));

로그인 후 복사

올바른 조치를 찾을 수 없다면 비슷한 동작으로 다른 행동을 찾을 수 있거나 필터에서 검색을 시도해야 할 수도 있습니다.

WordPress 기능 사용 기능! wp_enqueue_media 일반적으로 플러그인은 작업/필터 API와 함께 완전히 사용할 수없는 특정 이유로 작성됩니다. 예를 들어, 플러그인은 기사에서 특정 요소를 수정할 수 있지만 모든 요소는 아닙니다. 짧은 코드는 전형적인 예입니다.

플러그인에 바로가 코드를 대체하는 코드로 사용되는 일부 스크립트가 필요하다고 가정합니다. 짧은 코드를 정확하게 찾을 수있는 조치 나 필터가 없습니다. 그러나 단축 코드가 발견되었는지 확인하고 스크립트가 필요한지 확인할 수있는 장소가 있습니다.

wp_register_script('test', plugin_dir_url(__FILE__) . 'test.js', array('jquery'), '1.0', true);

로그인 후 복사

이 장소는 단축 코드를 찾을 때마다 WordPress가 호출하는 콜백 함수입니다. 이 콜백 함수에서

> 전화가 필요하지 않으면 스크립트가 포함되지 않습니다. wp_enqueue_media 그러나 단축 코드가 두 번 이상 발견되면 어떻게됩니까? 대답은 간단합니다. 아무 일도 일어나지 않을 것입니다.

실제로 동일한 스크립트를 사용하여

함수를 두 번 호출하십시오.이 스크립트에는 한 번만 포함 되므로이 기능은 매우 좋은 도구입니다.

따라서이 호출을 콜백 함수 또는 플러그인 또는 테마의 다른 부분에 삽입 할 수 있습니다. 스크립트가 필요한지 확인할 수 있습니다. 여러 번 필요한 경우에도 한 번만 포함됩니다.

가 호출되는 위치에 따라 WordPress에게 헤드 태그에 포함하도록 요청하기에는 너무 늦을 수 있습니다. 유일한 옵션은 바닥 글입니다. 어떤 이유로 스크립트가 헤드 태그에 있어야하는 경우 고려하십시오.

지금 질문이있을 수 있습니다 : 언제 너무 늦었습니까?

각 주제는 두 가지 특정 함수를 사용해야합니다. 전자가 호출되면 WordPress는 헤드 태그에 필요한 모든 줄을 자동으로 추가합니다. 헤드 태그에 스크립트를 포함하도록 요청하면 호출 할 때 포함됩니다. 이 포함을 요청하면 스크립트가 헤드 태그에 포함되지 않습니다.

그러나 WordPress는 똑똑하지만 스크립트는 여전히 포함됩니다. 함수가 호출 될 때 바닥 글에서 검색 할 수 있으며 여기에 포함되어야하는 스크립트가 포함되어있을 때. wp_head() 따라서 답을 얻으십시오. 스크립트를 헤드 태그에 절대적으로 포함시키고 싶다면 wp_footer() 호출 전에 포함을 요청하십시오. 신체 태그가 끝나기 전에 wp_head() 호출은 문서 끝에 있어야합니다. wp_head() 결론

귀하의 스크립트는 플러그인이나 테마가 특정 위치에서 수행하는 작업에 유용하지만, 필요하지 않은 페이지에 포함 시키면 해당 페이지가 불필요하게 무겁게 만듭니다. wp_footer() WordPress는 스크립트를 올바르게 포함시킬 수있는 다양한 도구를 제공합니다. 이 도구를 사용하려면 필요한 유일한 질문은 다음과 같습니다. 언제 또는 어디에 필요한가? 나머지는 답변에 따라 다릅니다. 동작이나 필터를 찾거나

호출을 올바른 함수에 넣 거나이 기능의 기능을 사용 하거나이 모든 것을 결합하십시오.

여기에 제공된 테스트 플러그인에서 위에서 설명한 몇 가지 예를 검색 할 수 있습니다. 스크립트와 "라이브러리"를 등록하고 다른 쓸모없는 스크립트를 사용하는 짧은 코드를 만듭니다. wp_head() 플러그인 또는 주제에 JavaScript를 포함하는 것에 대한 FAQS (FAQS) wp_head() wp_footer() WordPress 테마 또는 플러그인에 JavaScript를 포함시키는 가장 좋은 방법은 무엇입니까?

WordPress 테마 또는 플러그인에 JavaScript를 포함시키는 가장 좋은 방법은 함수를 사용하는 것입니다. 이 기능을 사용하면 테마 나 플러그인 파일을 직접 편집하지 않고 WordPress 테마 또는 플러그인에 JavaScript 파일을 포함시킬 수 있습니다. 또한 스크립트가 올바른 순서로로드되어 잠재적 충돌이나 오류를 방지합니다. 내 WordPress 기사 나 페이지에 직접 JavaScript를 추가 할 수 있습니까?

예, WordPress 기사 나 페이지에 직접 JavaScript를 추가 할 수 있습니다. 그러나 스크립트로드 순서에 문제가 발생할 수 있으며 다른 스크립트와 충돌 할 수 있으므로 권장하지 않습니다. 대신,

함수를 사용하여 스크립트를 포함하는 것이 좋습니다.

스크립트를 등록 할 때 종속성을 지정하여 JavaScript 파일이 올바른 순서로로드 될 수 있습니다. 함수를 사용하면 스크립트가 의존하는 스크립트를 지정하여 올바른 순서로로드되도록합니다.

예, WordPress 테마의 functions.php 파일에 JavaScript를 포함시킬 수 있습니다. 그러나 스크립트를 포함시키기 위해 wp_enqueue_script() 함수를 사용하는 것이 좋습니다. 이를 통해 스크립트가 올바른 순서로로드되어 다른 스크립트와의 잠재적 충돌을 방지합니다.

내 JavaScript 파일과 다른 스크립트 간의 충돌을 방지하는 방법은 무엇입니까? 함수를 사용하여 스크립트를 포함시켜 JavaScript 파일과 다른 스크립트 간의 충돌을 방지 할 수 있습니다. 이 기능을 사용하면 스크립트가 올바른 순서로로드되어 다른 스크립트와의 잠재적 충돌을 방지합니다.

기능을 사용하여 외부 JavaScript 파일을 포함 할 수 있습니까? wp_enqueue_script()

예, 함수를 사용하여 외부 JavaScript 파일을 포함시킬 수 있습니다. 함수를 호출 할 때 외부 스크립트의 URL을 두 번째 매개 변수로 제공하면됩니다.

WordPress 플러그인에 JavaScript를 포함시키는 방법은 무엇입니까?

함수를 사용하여 WordPress 플러그인에 JavaScript를 포함시킬 수 있습니다. 이 기능을 사용하면 플러그인 파일을 직접 편집하지 않고 플러그인에 JavaScript 파일을 포함시킬 수 있습니다. 또한 스크립트가 올바른 순서로로드되어 잠재적 충돌이나 오류를 방지합니다.

기능을 사용하여 여러 자바 스크립트 파일을 포함 할 수 있습니까? wp_enqueue_script()

예, 함수를 사용하여 여러 자바 스크립트 파일을 포함 할 수 있습니다. 포함하려는 각 스크립트에 대해 함수를 한 번만 호출하면됩니다.

내 JavaScript 파일이 특정 페이지에서만로드되는지 확인하는 방법은 무엇입니까? wp_enqueue_script() 등록 기능에서 조건부 태그를 사용하여 JavaScript 파일이 특정 페이지에만로드되어 있는지 확인할 수 있습니다. 예를 들어,

wp_enqueue_script() WordPress 하위 테마에 JavaScript를 포함시킬 수 있습니까?

예, WordPress 하위 테마에 JavaScript를 포함시킬 수 있습니다. Child 테마의 functions.php 파일에서 함수를 사용하여 스크립트를 포함시킬 수 있습니다. 이를 통해 스크립트가 올바른 순서로로드되어 다른 스크립트와의 잠재적 충돌을 방지합니다.

이 응답은 원래 텍스트의 크게 다시 작성되고 개선 된 버전을 제공하여 명확성, 흐름 및 가독성을 향상시키는 동시에 핵심 의미를 유지합니다. 또한 더 나은 사용자 경험을 위해보다 적절한 제목과 서식을 사용합니다. 이미지 URL은 변경되지 않은 상태로 유지됩니다

위 내용은 플러그인이나 테마에 JavaScript를 포함하여 올바른 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!