WordPress 관리 테이블 사용자 정의: 시작하기

WordPress를 사용하는 모든 사람은 페이지 및 게시물과 같은 모든 핵심 개요 영역에 나타나는 WordPress 관리 테이블에 익숙할 것입니다. WordPress 전체에서 이러한 유형의 테이블에 동일한 형식이 사용되므로 이러한 테이블 사용에 빠르게 익숙해집니다. 그러나 WordPress 관리 테이블을 수정하고 표시된 정보를 변경하거나 고유한 추가 열을 추가할 수 있다는 것을 알고 계셨습니까?

이 기사에서는 이를 수행하는 방법을 설명합니다. 시작하자!

후크

관리 테이블 데이터를 표시하기 위해 WordPress는 WP_List_Table 내장 클래스를 확장합니다. WP_List_Table 클래스는 wp-admin/includes/class-wp-list-table.php 파일에 private 클래스로 도입되었습니다. 비공개 클래스는 개발자가 아닌 다른 핵심 클래스 및 기능에서만 사용하기 위해 비공개로 명명됩니다.

WordPress는 관리자 테이블을 변경할 수 있는 기능을 제공합니다. 테이블 열을 조작하려면 WordPress가 wp-admin/includes/class-wp-posts-list-table.php 파일에서 제공하는 필터 후크 중 하나를 사용해야 합니다.

이 파일에서 WP_Posts_List_Table 클래스는 WP_List_Table 클래스를 확장하고 게시물 유형에 따라 관리 테이블을 채우기 위해 속성과 메서드를 재정의합니다. 게시물 테이블에는 manage_posts_columns 후크를, 페이지에는 manage_pages_columns 를, 사용자 정의 게시물 유형 테이블의 열을 조작하려는 경우 manage_{$post_type}_posts_columns 를 사용할 수 있습니다.

테이블 데이터에 기본적으로 사용되는 열도 이 파일에 설명되어 있습니다. 616행 주위에 $posts_columns 배열이 도입되고 다음 열이 추가됩니다.

• 일괄 작업에 대한 'cb' 확인란 열
• 게시물 '제목' 열
• 게시물 작성자의 '작성자' 열
• 게시물이 속한 카테고리의 '카테고리' 열
• 게시물의 '태그' 열
• '댓글' 열
• 게시된 '날짜' 열

관리 테이블에 사용자 정의 열 추가

테이블에 사용자 정의 열을 추가하는 것은 개발자가 자주 수행해야 하는 작업입니다. 또한 열을 정렬할 수 있어 콘텐츠를 구성할 때도 매우 편리합니다. 게시물, 페이지 및 사용자 지정 게시물 유형에 대해 사용자 지정 열이 구현되는 방법과 이러한 사용자 지정 열을 정렬 가능하게 만드는 방법을 보여줍니다.

게시물 목록 테이블

예를 들어 게시물이 마지막으로 수정된 시간을 설명하는 열을 추가하는 방법을 살펴보겠습니다. 이것은 특히 게시물이 많은 블로그를 운영하고 각 게시물이 마지막으로 업데이트된 시간을 확인할 수 있기를 원하는 경우 매우 유용한 기능이 될 수 있습니다. 이것이 어떻게 구현되는지 봅시다.

시작하려면 열 헤더 이름 배열에 새 열 이름을 추가해야 합니다. class-wp-posts-list-table.php 파일의 663행을 자세히 살펴보겠습니다.

 if ( 'page' === $post_type ) { $posts_columns = apply_filters( 'manage_pages_columns', $posts_columns ); } else { $posts_columns = apply_filters( 'manage_posts_columns', $posts_columns, $post_type ); }

코드의 이 부분에서 우리는 게시물 목록 테이블을 변경하기를 원하기 때문에 manage_posts_columns 필터를 사용해야 합니다(자세한 내용은 여기 참조). 열 헤더의 배열에 열 이름을 추가하려면 활성 테마의 functions.php 파일을 편집하고 다음 코드를 삽입합니다.

 add_filter('manage_posts_columns','add_custom_columns'); function add_custom_columns( $columns ) { $columns['last_modified'] = 'Last modified'; return $columns; }

이제 관리자 게시물 목록 페이지를 새로 고치면 추가 열을 볼 수 있습니다. 이 단계에서는 이 열에 데이터가 없습니다.

다음 단계에서는 열에 표시할 콘텐츠를 WordPress에 알려야 합니다. 이를 위해 열 출력을 담당하는 column_default 공개 함수의 일부인 manage_posts_columns 작업을 사용합니다. 이 작업은 게시물과 같이 계층적이지 않은 게시물 유형에만 해당하며 1258행에서 찾을 수 있습니다.

여기서 내용을 채우기 위해 실제로 수행할 작업은 모든 사용자 정의 열에 대해 switch 문을 실행하고 헤더 이름이 'last_modified'이므로(위의 초기 단계에서 등록한 대로) 내용을 에코합니다. 내용을 반영하기 위해 WordPress 내장 get_post_field 함수를 사용하고 데이터베이스의 wp_posts 테이블에서 열이 될 수 있는 원하는 필드를 반환합니다. 실패의 경우 빈 문자열을 반환합니다.

따라서 functions.php 파일에 아래 코드를 추가합니다.

 add_action( 'manage_posts_custom_column','custom_columns_content', 10, 2 ); function custom_columns_content ( $column_id, $post_id ) { switch( $column_id ) { case 'last_modified': echo get_post_field('post_modified', $post_id); break; } }

페이지를 다시 한 번 새로고침하면 이것이 예상대로 작동하는지 확인할 수 있습니다.

최초 게시 이후에 수정된 적이 없는 두 번째 게시물의 '최종 수정' 값은 게시 날짜와 동일합니다.

페이지 목록 테이블

페이지 목록 테이블에서 동일한 작업을 수행하기 위해 열 헤더 이름 배열에 동일한 방식으로 열 이름을 추가합니다. 이번에는 아래와 같이 manage_pages_columns 후크를 사용한다는 차이점이 있습니다.

 add_filter('manage_pages_columns','add_custom_page_columns'); function add_custom_page_columns( $columns ) { $columns['last_modified'] = 'Last modified'; return $columns; }

다음으로 이전에 사용한 manage_posts_custom_column 대신 manage_pages_custom_column 후크를 사용하여 콘텐츠를 추가합니다.

 add_action( 'manage_pages_custom_column','custom_columns_content', 10, 2 ); function custom_columns_content ( $column_id, $post_id ) { switch( $column_id ) { case 'last_modified': echo get_post_field('post_modified', $post_id); break; } }

위의 코드를 functions.php 파일에 삽입한 후 관리 영역의 Pages Admin 테이블을 방문하여 예상대로 작동하는지 확인할 수 있습니다. 여기에서 'Last Modified' 열이 표시되어야 합니다.

사용자 정의 포스트 유형 테이블

먼저 functions.php 파일에 아래 코드를 삽입하여 사용자 정의 게시물 유형을 생성합니다.

 function my_custom_post_type() { register_post_type( 'mycpt', array( 'labels' => array( 'name' => __( 'Custom Post Types' ), 'singular_name' => __( 'Custom Post Type' ) ), 'public' => true, 'has_archive' => true, 'rewrite' => array('slug' => 'mycpt'), 'show_in_rest' => true, ) ); } add_action( 'init', 'my_custom_post_type' );

관리 메뉴에서 'Custom Post Type'이라는 새 항목이 추가되었음을 알 수 있습니다.

사용자 정의 게시물 유형이 생성되는 방법을 모르고 더 자세히 알고 싶다면 사용자 정의 게시물 유형 생성에 대한 관련 기사를 확인하십시오.

이제 Custom Post Type 설정이 콘텐츠와 함께 새 열 머리글을 추가하는 것으로 진행됩니다. 앞서 언급했듯이 CPT(Custom Post Type)의 경우 manage_{$post_type}_posts_columns 를 사용하여 사용자 정의 열을 추가해야 합니다.

{$post_type} 은 이 경우 'mycpt'인 register_post_type() 함수의 첫 번째 인수와 동일해야 합니다.

따라서 열 헤더를 추가하기 위해 functions.php 파일에서 사용할 코드는 다음과 같습니다.

 add_filter( 'manage_mycpt_posts_columns','add_mycpt_custom_columns'); function add_mycpt_custom_columns( $columns ) { $columns['last_modified'] = 'Last modified'; return $columns; }

열 내용을 채우려면 다음을 수행합니다.

 add_action( 'manage_mycpt_posts_custom_column','fill_mycpt_posts_custom_column'); function fill_mycpt_posts_custom_column( $column_id, $post_id ) { switch( $column_id ) { case 'last_modified': echo get_post_field('post_modified', $post_id); break; } }

결과는 다음과 같아야 합니다.

열을 정렬 가능하게 만들기

열을 정렬 가능하게 만들려면 정렬할 수 있는 사용자 지정 열을 정의해야 합니다. 이를 수행하기 위해 콜백 함수와 함께 manage_edit-{post-type}_sortable_columns 필터를 사용합니다.

따라서 각 포스트 유형의 경우 동일한 코드를 추가합니다(물론 고유한 함수 이름 포함).

게시물의 경우:

 add_filter( 'manage_edit-post_sortable_columns', 'sortable_post_columns' ); function sortable_post_columns( $columns ) { $columns['last_modified'] = 'Last modified'; return $columns; }

페이지의 경우:

 add_filter( 'manage_edit-page_sortable_columns', 'sortable_page_columns' ); function sortable_page_columns( $columns ) { $columns['last_modified'] = 'Last modified'; return $columns; }

사용자 정의 게시물 유형(mycpt):

 add_filter( 'manage_edit-mycpt_sortable_columns', 'sortable_mycpt_posts_columns' ); function sortable_mycpt_posts_columns( $columns ) { $columns['last_modified'] = 'Last modified'; return $columns; }

이제 관리 테이블 중 하나를 방문하면 사용자 정의 열의 헤더가 링크로 표시되는 것을 볼 수 있습니다. 이것을 클릭하면 수정된 날짜별로 정렬됩니다.

열에 대한 정렬 비활성화

열에 대한 정렬 기능을 제거하려면 배열에서 제거하기만 하면 됩니다. 예를 들어 'date' 열에 대해 이 작업을 수행하려면 unset($columns['date']) 코드 줄을 추가합니다. 이것은 다음과 같이 보일 것입니다:

게시물의 경우:

 add_filter( 'manage_edit-post_sortable_columns', 'sortable_post_columns' ); function sortable_post_columns( $columns ) { $columns['last_modified'] = 'Last modified'; unset($columns['date']); return $columns; }

페이지의 경우:

 add_filter( 'manage_edit-page_sortable_columns', 'sortable_page_columns' ); function sortable_page_columns( $columns ) { $columns['last_modified'] = 'Last modified'; unset($columns['date']); return $columns; }

사용자 정의 게시물 유형(mycpt):

 add_filter( 'manage_edit-mycpt_sortable_columns', 'sortable_mycpt_posts_columns' ); function sortable_mycpt_posts_columns( $columns ) { $columns['last_modified'] = 'Last modified'; unset($columns['date']); return $columns; }

이제 적절한 테이블을 방문하면 날짜 레이블을 더 이상 클릭할 수 없음을 알 수 있습니다(따라서 해당 열은 더 이상 정렬할 수 없음).

이 시점에서 WordPress 개발자를 종종 혼동시키는 세부 사항을 강조 표시할 가치가 있습니다. Posts, Pages 및 Custom Posts에 사용된 후크를 보여주는 아래 표를 살펴보세요.

열 정렬에 사용하는 후크가 실제로 패턴을 따르지 않는다는 것을 눈치채셨을 것입니다. 각각 manage_posts_sortable_columns , manage_pages_sortable_columns 및 manage_mycpt_posts_sortable_columns 일 것으로 예상할 수 있습니다. 불행히도 이것은 잘못된 이름의 문제일 뿐입니다. 그럼에도 불구하고 이와 같은 요약 표를 쉽게 기억할 수 있도록 유지하는 것은 매우 유용합니다.

열 너비 변경

열 너비를 조정하기 위해 CSS 또는 JS를 포함하는 모든 관리 페이지의 헤드 섹션에서 WordPress가 제공하고 실행하는 admin_head 작업 후크를 사용합니다.

예를 들어 functions.php 파일에 아래 코드를 입력해 보십시오.

 add_action('admin_head', 'my_column_width'); function my_column_width() { echo '<style type="text/css">'; echo '.table-view-list.posts .column-title { width:120px !important; overflow:hidden }'; echo '</style>'; }

여기서는 모든 admin 테이블에 공통인 title 컬럼의 .column-title 클래스와 .table-view-list.posts 클래스를 사용하였다. 결합하면 CSS가 게시물 목록 테이블에만 적용됩니다.

다른 관리 화면(예: 페이지)에 대해서도 동일한 작업을 수행하기 위해 대신 table-view-list.pages 를 사용합니다.

결론

WordPress Admin Tables 열을 조작할 때 많은 가능성이 있습니다. 향후 기사에서는 몇 가지 더 많은 예를 살펴보고 Admin 테이블을 최대한 활용하는 데 사용할 수 있는 몇 가지 유용한 트릭을 제공할 것입니다!