개발천재

워드프레스 Hook 이해하기 본문

워드프레스

워드프레스 Hook 이해하기

세리블리 2025. 4. 2. 08:57
반응형

Hook이란?

Hook(훅) 은 워드프레스가 특정 이벤트를 실행할 때, 추가 기능을 연결(Attach)할 수 있도록 해주는 기능이다. 워드프레스의 기능을 확장하거나 수정하게 해준다. 워드프레스에서 행동이나 필터링을 추가하거나 수정하는데 사용된다.

 

WordPress Hook은 사이트 기능을 확장하거나 수정하는 데 중요한 역할을 한다. Action Hooks는 특정 시점에 동작을 실행하고, Filter Hooks는 데이터를 수정하는 데 사용된다. 이 두 가지를 활용하면 워드프레스를 원하는 대로 커스터마이즈 할 수 있다.

- 코어(Core) 파일을 직접 수정하지 않고도 기능을 추가하거나 변경 가능
- 테마, 플러그인 개발에 필수적인 개념
- 액션(Action)과 필터(Filter) 두 가지 Hook이 있음

 

 


 

Action Hook과 Filter Hook

Action Hook (액션 훅)

워드프레스의 특정 이벤트가 발생할 때 추가 기능을 실행할 때 사용한다. 예를 들어 페이지가 로드될 때, 사용자가 로그인할 때, 글이 저장될 때 등에 사용한다.

 

아래의 코드는 사이트가 로드될 때 실행하는 액션, wp_loaded라는 액션 훅을 사용해서, 사이트가 로드될 때 메시지를 출력하는 예시이다.

function my_custom_function() {
    echo "사이트가 로드되었습니다!";
}
add_action('wp_loaded', 'my_custom_function');

 

 

Filter Hook (필터 훅)

데이터를 변경(수정)할 때 사용한다. 예를 들어 게시글 제목을 변경, 사용자 입력값을 필터링, 콘텐츠를 수정할 때 사용한다.

아래의 예제는 게시글 제목을 변경하는 필터, the_title이라는 필터 훅을 사용해서, 모든 게시글 제목 앞에 🔥을 추가하는 코드이다. 

function change_post_title($title) {
    return "🔥 " . $title; // 제목 앞에 🔥 추가
}
add_filter('the_title', 'change_post_title');

 

 

액션(Action) vs 필터(Filter) 차이

액션(Action) 훅은 특정 이벤트(예: 페이지 로드, 사용자 로그인)가 발생할 때 새로운 기능을 실행하는 데 사용되며, 데이터 반환이 필요하지 않아 주로 부가적인 작업(예: 이메일 전송, 로그 기록)에 활용된다.

반면, 필터(Filter) 훅은 기존 데이터를 변경하는 데 사용되며 반드시 값을 반환해야 하므로, 게시글 제목 수정, 콘텐츠 필터링 등 데이터 가공에 적합하다. 즉, 액션은 "새로운 동작을 추가"하고, 필터는 "기존 데이터를 수정"하는 역할을 한다.

  액션(Action) 필터(Filter)
역할 특정 시점에 새로운 기능 추가 기존 데이터를 변경
매개변수 데이터 반환 필요 없음 반드시 값을 반환해야 함
예제 사용자가 로그인할 때 이메일 전송 게시글 제목을 변경

 

 


 

Hook 사용법

Action Hook (액션 훅) 사용법

액션 훅은 특정 이벤트가 발생할 때 추가적인 작업을 실행할 때 사용된다. 예를 들어, 페이지가 로드될 때, 사용자 로그인 시, 글이 게시될 때 등이다.

add_action(훅이름, 실행할 함수, 우선순위, 매개변수);

 

  • 훅이름: 사용할 액션 훅 (예: wp_head, wp_footer)
  • 실행할 함수: 호출할 함수 이름
  • 우선순위: 훅이 여러 번 호출될 때 실행 순서를 결정 (기본값은 10)
  • 매개변수: 호출할 함수에 전달할 인자 (기본값은 1)

 

액션 훅 사용 예제

  • wp_head 액션 훅 사용 (헤드에 코드 삽입)

워드프레스의 <head> 태그 부분에 메타 태그나 외부 스크립트를 삽입할 때 사용. wp_head 훅을 사용하여 HTML <head>에 메타 태그를 추가.

function add_meta_tag_to_head() {
    echo '<meta name="author" content="Your Name">';
}
add_action('wp_head', 'add_meta_tag_to_head');

 

 

 

  • wp_footer 액션 훅 사용 (푸터에 스크립트 삽입)

사이트의 푸터에 자바스크립트 파일을 삽입하고 싶을 때 사용. wp_footer 훅을 사용하여 사이트의 푸터에 자바스크립트 파일을 삽입.

function add_custom_footer_script() {
    echo '<script src="https://example.com/script.js"></script>';
}
add_action('wp_footer', 'add_custom_footer_script');

 

 

 

Filter Hook (필터 훅) 사용법

필터 훅은 데이터를 수정할 때 사용된다. 예를 들어, 게시글 제목을 변경하거나, 콘텐츠를 필터링할 때 사용한다.

add_filter(훅이름, 수정할 함수, 우선순위, 매개변수);

 

- 훅이름: 사용할 필터 훅 (예: the_content, the_title)
- 수정할 함수: 데이터를 수정할 함수 이름
- 우선순위: 여러 번 필터링할 때 실행 순서를 결정 (기본값은 10)
- 매개변수: 수정할 데이터 (기본값은 1)


필터 훅 사용 예제

  • the_content 필터 훅 사용 (게시글 내용 수정)

the_content 필터 훅은 게시글의 내용을 수정하거나 추가하는 데 사용한다.

the_content 필터 훅을 사용하여 게시글 내용에 "이 글은 매우 중요합니다!" 메시지를 추가하는 예제이다.

function modify_content($content) {
    if (is_single()) {
        $content .= '<p>이 글은 매우 중요합니다!</p>';
    }
    return $content;
}
add_filter('the_content', 'modify_content');

 

 

  • the_title 필터 훅 사용 (게시글 제목 수정)

the_title 필터 훅은 게시글 제목을 수정하고 싶을 때 사용한다.

the_title 필터 훅을 사용하여 게시글 제목 앞에 "🔥"을 추가하는 예제이다.

function modify_title($title) {
    if (is_single()) {
        $title = '🔥 ' . $title; // 제목 앞에 "🔥" 추가
    }
    return $title;
}
add_filter('the_title', 'modify_title');

 

 

Custom Hook 만들기

워드프레스에서는 자체적인 hook을 만들 수 있다. 이를 통해 플러그인이나 테마에서 다른 개발자가 기능을 확장할 수 있게 할 수 있다.

 

예시: 커스텀 액션 훅

function my_custom_action_function() {
    echo '이곳에 추가하고 싶은 내용';
}
add_action('my_custom_hook', 'my_custom_action_function');

// 커스텀 훅 실행
do_action('my_custom_hook');

 

 

예시: 커스텀 필터 훅

function my_custom_filter_function($content) {
    return $content . ' - 추가된 내용';
}
add_filter('my_custom_filter', 'my_custom_filter_function');

// 필터 훅 적용
$content = apply_filters('my_custom_filter', '원본 내용');
echo $content;  // 출력: 원본 내용 - 추가된 내용

 

 

주요 내장 Hook 예시
- init: 워드프레스가 초기화될 때 실행되는 훅.
- wp_enqueue_scripts: CSS와 자바스크립트 파일을 추가할 때 사용.
- save_post: 게시물이 저장될 때 실행되는 훅.
- wp_head: HTML <head> 태그 안에 내용을 추가할 때 사용.
- wp_login: 사용자가 로그인할 때 실행되는 훅.

반응형