RSS

월간 보관물: 2월 2013

관리자 페이지에 메타박스 만들기

이전에 포스트 타입(register_post_type() 호출)을 이용해 커스텀 포스트를 생성해 보았다. 이번에는 이 포스트의 메타 데이터를 등록/변경할 수 있는 메뉴를 만들어 확장해 보자.

먼저 사용할 메타 데이터를 정의하자. $jhp_meta_box 메타 데이터에 포스트 레벨과 멤버 접근 권한 메뉴를 추가한다. 콤보를 통해 포스트의 상.중.하 중요도를 지정하고 체크박스는 회원/비회원 공개 여부를 결정하게 된다.

$jhp_meta_box = array(
 'id' => 'jhp_meta_box',
 'title' => 'Level Configuration',
 'context' => 'side',
 'priority' => 'low',
 'fields' => array (
 array(
 'name' => 'Level',
 'id' => 'levelselection',
 'type' => 'select',
 'desc' => 'Choose the level of the post',
 'options' => array('High','Medium','Low')
 ),
 array(
 'name' => 'Member Only',
 'id' => 'memberOnly',
 'type' => 'checkbox',
 'desc' => 'Member Only?'
 )
 )
);

메타 박스를 관리자 페이지에 추가하자. add_action의 admin_menu 액션훅을 호출하여 메뉴를 등록한다. 메뉴가 생성되면 jhp_render_meta_box() 함수가 콜백되어 관리자 메타 박스 화면이 만들어진다.

function howdy_add_meta_boxes() {
$hn_meta_box['context'], $hn_meta_box['priority']);
 global $jhp_meta_box;
 add_meta_box($jhp_meta_box['id'],$jhp_meta_box['title'],'jhp_render_meta_box', 'howdynotices',$jhp_meta_box['context'],$jhp_meta_box['priority']);
}

렌더링 페이지 만드는 함수는 다음과 같다. 콤보와 체크박스의 값을 비교해 화면에 나타낸다.

function jhp_render_meta_box() {
 global $jhp_meta_box, $post;
 
 echo '<input type="hidden" name="jhp_meta_box" value="', wp_create_nonce(basename(__FILE__)), '" />';
 echo '<table class="form-table">';
 foreach ($jhp_meta_box['fields'] as $field) {
 $meta = get_post_meta($post->ID, $field['id'], true);
 echo '<tr>';
 echo '<td>', $field['desc'], '</td>';
 echo '<td>';
 switch ($field['type']) {
 case 'select':
 echo '<select name="', $field['id'], '" id="', $field['id'], '">';
 foreach ($field['options'] as $option) {
 echo '<option', $meta == $option ? ' selected="selected"' : '', '>', $option, '</option>';
 }echo '</select>';
 break;
 case 'checkbox' :
 echo '<input type="checkbox" value="1" name="', $field['id'], '" id="', $field['id'], '"', $meta ? ' checked="checked"' : '', ' />';
 break;
 }
 echo '</td>';
 echo '</tr>';
 }
 echo '</table>';
}

메타 박스가 포스트 오른쪽에 나타났다. 메타 데이터의 레벨 및 접근 권한을 변경해 갱신해 보자.

metat1

메타 데이터의 저장 및 변경을 위한 코드도 필요하다. add_action의 save_post 훅을 이용해 메타 박스 저장 함수를 호출한다.

function jhp_save_meta_data($post_id) {
 global $jhp_meta_box;
 
 if (!isset($_POST['jhp_meta_box']) || !wp_verify_nonce($_POST['jhp_meta_box'], basename(__FILE__))) {
 return $post_id; 
 }
 
 if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
 return $post_id;
 }
 if ('page' == $_POST['post_type']) {
 if (!current_user_can('edit_page', $post_id)) {
 return $post_id;
 }
 } elseif (!current_user_can('edit_page', $post_id)) {
 return $post_id;
 }
 foreach ($jhp_meta_box['fields'] as $field) {
 if(isset($_POST[$field['id']])) {
 $old = get_post_meta($post_id, $field['id'], true);
 $data = $_POST[$field['id']];
 
 if (($data || $data == 0) && $data != $old) {
 update_post_meta($post_id, $field['id'], $data); 
 } elseif ('' == $data && $old) {
 delete_post_meta($post_id, $field['id'], $old);
 }
 } else {
 delete_post_meta($post_id, $field['id']);
 }
 }
}

메타 데이타는 wp_postmeta테이블에 저장된다. wp_posts 테이블과는 post_id를 키로 연결된다.

meta2

 
 

태그:

최상위 메뉴 생성하기

사용자가 직접 만든 관리자 메뉴를 추가해 보자.

add_menu_page() 함수를 호출하면 간단하게 탑 메뉴가 생성된다. 기본 제공되는 워드프레스 메뉴와 같은 레벨로 등록된다. 위치를 지정하지 않으면 제일 아래쪽에 붙고, 위치값을 주면 원하는 곳에 생성할 수 있다.

    add_menu_page( $page_title, $menu_title, $capability, $menu_slug, $function, $icon_url, $position );

$function 인자에 콜백 함수를 지정해서 세부 설정 페이지를 구성할 수 있따. 메뉴가 호출되면서 콜백함수가 호출되는 식이다. $position으로 탑 메뉴 위치를 조정한다. 기존 설정된 것과 중복되지 않도록 주의해야 하는데, 가능하면 정수형보다는 소수점을 주면 중복을 최소화 할 수 있다. 예를 들어 Posts와 Media 사이에 추가하고 싶으면 6.3 값을 준다. 정수가 아닌 decimal형태로 주는 게 좋다.

 2 Dashboard
 4 Separator
 5 Posts
 10 Media
 15 Links
 20 Pages
 25 Comments
 59 Separator
 60 Appearance
 65 Plugins
 70 Users
 75 Tools
 80 Settings
 99 Separator

탑 메뉴에 하위 메뉴를 추가하려면 add_submenu_page()를 호출한다. 상위 메뉴와의 연관성을 위해 부모명을 입력해 주면 된다. 서브메뉴의 설정 페이지 역시 $function에 정의하여 콜백 처리하면 된다.

    add_submenu_page( $parent_slug, $page_title, $menu_title, $capability, $menu_slug, $function );

관리자메뉴

 

 
 

태그: ,

관리자 메뉴 생성 총정리

워드프레스는 편리하고 유연한 관리자 메뉴를 제공한다. 유연하다는 표현은 사용자가 관리자 메뉴를 간단하게 추가할 수 있기 때문이다. 보통 플러그인을 하나 추가할 때마다 관리자 메뉴가 추가된다.

관리자 메뉴를 추가하는 방법은 크게 세 가지다. 일반적으로 최상위 또는 기존 메뉴의 하위메뉴 형태로 생성한다. 그리고 기존 포스트 타입을 이용하는 방법이 있다. 포스트 타입을 이용할 때는 정해진 템플릿의 값을 정의해야 한다. 메뉴의 순서는 함수의 인자값을 통해 바꿀 수 있다.

  • 최상위 레벨에 메뉴 추가 : add_menu_page() 호출
  • 기존 메뉴의 하위에 추가 : add_submenu_page() 호출
  • 포스트 타입 이용 : register_post_type() 호출

관리 메뉴를 클릭했을 때 나타나는 설정 페이지도 세 가지 형태다. 완전하게 새로운 페이지를 생성하거나 워드프레스에서 기본 제공한 관리자 페이지에 섹션을 구성하거나 포스트 타입이 제공하는 템플릿을 이용하는 것이다.

  • 새로운 설정 페이지 생성 : add_menu_page() / add_submenu_page()의 콜백 함수를 정의
  • 기존 설정 페이지에 추가 : add_settings_section() 이용
  • 포스트 타입 템플릿 이용 : register_post_type() 인자로 정의된 레이블과 템플릿 이용

사용자 메뉴가 생성되었으면 그 설정페이지를 구성해야 한다. 거기에 사용되는 사용자 필드의 값을 저장하거나 불러올 수 있어야 한다.

  • 별도의 옵션으로 등록하여 사용 : add_option(), update_option(), get_option(), delete_option()
  • 기존 설정 페이지 옵션값으로 등록하여 사용 : add_settings_field(), register_setting()
 
 

태그: , , ,

인사말 플러그인 기능 개선(포스팅 이용)

플러그인 관리자 페이지 등록을 통해 인사말 목록을 관리할 수 있게 되었다. 처음 소스코드에 랜덤하게 인사말을 가져오는 방식에서 데이터베이스를 쿼리하는 방식으로 변경해 보자.

1. 테마 화면에 인사말과 사용자명 나타내기

function hello_all() {

       global $current_user;

       query_posts(‘orderby=rand&post_type=howdynotices’);

       if (have_posts()){

           the_post();

             $rtngreeting = get_the_title();

       }

       $chosen = $rtngreeting.’ ‘.$current_user->display_name;

       echo “<p id=’greeting’>$chosen</p>”;

}

add_action(‘wp_head’, ‘hello_all’);

query_posts의 인자로 “orderby=rand”과 “post_type=howdynotices'”를 전달한다. 포스트 타입이 howdynotices인 랜덤 포스트를 추출해 가져온다.

$chosen 변수에는 포스트에서 가져온 타이틀(인사말)과 현 사용자 이름($current_user->display_name)이 담겨 출력된다. 출력을 좀 더 보기 좋게 만들기 위해 css를 추가했다.

2. css 코드

function hn_greeting_css() {

       $x = is_rtl() ? ‘left’ : ‘right’;

       echo

       <style type=’text/css’>

       #greeting {

       float: $x;

       padding-$x: 155px;

       padding-top: 5px;

       margin: 0;

       font-size: 15px;

       color:red;

}

</style>

“;

}

add_action(‘wp_head’, ‘hn_greeting_css’ );

3. 결과 화면

p4오른쪽 위에 인사말(Happy New Year)과 사용자 이름(admin)이 보인다. 페이지가 갱신될 때마다 랜덤하게 인사말이 변경된다.

 
 

태그: ,

관리자 메뉴에 플러그인 추가하기

플러그인의 관리자 페이지가 반드시 필요한 건 아니다. 하지만, 메타 데이터가 있을 때는 만드는 게 좋다. 그렇지 아니면 데이터베이스를 직접 갱신해야 하는 경우도 생길 수 있다. 상당히 귀찮다.

관리자 페이지 등록을 위해서는 생성한 플러그인을 워드프레스에 등록하고 활성화하는 작업이 필요하다. 플러그인을 등록하면 아래와 같이 해당 목록이 나타난다. 이를 활성화하면 사이트에서 바로 사용할 수 있다. 여기서는 직접 만든 Howdy Notices 플러그인 “활성화” 메뉴를 이용한다.

[플러그인 관리 페이지] 

p1

HowdyNotices 메뉴가 왼쪽에 추가되었다. 이 플러그인 관련 포스트 및 메타 테이터 설정이 가능하다.

[관리자 페이지에 플러그인 추가]p2

소스코드를 보면 관리 페이지 등록을 위해서는 register_post_type()과 이를 호출할 액션훅이 필요하다는 걸 알 수 있다.

// 플러그인이 활성화 될 때 플러그인을 등록하는 함수를 호출한다.
add_action('init', 'Howdy_create_notices');

Howdy_create_notices()에서 관리자 화면에 보일 메뉴명을 배열로 등록하고 register_post_type()을 호출하면 모든 준비가 끝난다. 나머지 기반 구조(포스트 등록 화면, 변경, 삭제, 메타 데이터 관련 편집화면 …)는 워드프레스에서 기본으로 제공한다. 기존 템플릿 페이지를 호출하기 때문에 별도 등록용 페이지를 만들 필요가 없다.

function Howdy_create_notices() {
    $labels = array(
     'name' => _x( 'HowdyNotices', 'post type general name' ), // Tip: _x('') is used for localization
    'singular_name' => _x( 'HowdyNotice', 'post type singular name' ),
    'add_new' => _x( 'Add New', 'Notice' ),
    'add_new_item' => __( 'Add New Notice' ),
    'edit_item' => __( 'Edit Notice' ),
    'new_item' => __( 'New Notice' ),
    'view_item' => __( 'View Notice' ),
    'search_items' => __( 'Search Notices' ),
    'not_found' => __( 'No Notices found' ),
    'not_found_in_trash' => __( 'No Notices found in Trash' ),
    'parent_item_colon' => ''
    );
    $notice_args = array(
    'labels' => $labels,
    'singular_label' => __('Notice', 'simple-notices'),
    'public' => true,
    'show_ui' => true,
    'capability_type' => 'post',
    'hierarchical' => false,
    'rewrite' => false,
    'supports' => array('title', 'editor'),
    );
    register_post_type('howdynotices', $notice_args);
}

 

 

[Howdy Notices 관리자 페이지]
p3

 
 

태그: , ,

처음으로 만든 워드프레스 플러그인

초보 프로그래밍의 첫 시작을 알리는 “Hello World!”처럼 아주 단순한 플러그인을 만들어 보았다. 물론, 레퍼런스는 있다.^^ 워드프레스에 기본으로 포함된 Hello Dolly을 참고했다.

주요기능은

  1. 인사말을 랜덤하게 추출
  2. 현재 사용자 추출
  3. 테마 페이지 갱신 시 “인사말” + “현 사용자 이름” 출력 (테마 우측 상단)

사용한 액션훅은 wp_head 이다. 훅 이름을 변경하면 다양한 위치나 상태에서 액션을 취할 수 있다. 만약 wp_footer면 페이지 하단에 뿌려진다.

add_action( 'wp_head', 'hello_there' );

액션훅이 발생하면 hello_there 함수가 호출된다.

function hello_there() {
    global $current_user; 
    $chosen = getGreeting().$current_user->display_name; 
    echo "<p id='greeting'>$chosen</p>";
}

hello_there() 함수는 getGreeting()을 호출하여 인사말 목록을 랜덤으로 선택해 반환하고, 사용자 이름을 붙여서 화면에 출력한다.

function getGreeting() {
    $greetings = "Hello~
    Hi!
    Nice to meet you!
    Thank you!
    Thanks!
    Good Morning!
    Good Afternoon!
    Good Evening!
    Good Night~~";

    $greetings = explode( "\n", $greetings );
    return wptexturize( $greetings[ mt_rand( 0, count( $greetings ) - 1 ) ] );
}

글자를 꾸미기 위해 css 함수와 액션훅을 추가했다.

add_action( 'wp_head', 'greeting_css' );
function greeting_css() {
     // This makes sure that the positioning is also good for right-to-left languages
     $x = is_rtl() ? 'left' : 'right';
    echo "
     <style type='text/css'>
       #greeting {
       float: $x;
       padding-$x: 155px;
       padding-top: 5px;
       margin: 0;
       font-size: 15px;
       color:red;
      }
    </style>
    ";
}

[플러그인 실행 화면] : 우측 상단에 인사말과 사용자 이름 출력

wpplugin2

 
 

태그: ,

워드프레스 후킹에 대해 알아보자(액션훅과 필터훅)

워드프레스의 기능을 확장하는 데 반드시 필요한 것이 후킹이다. 후킹(hooking)이란 운영체제나 애플리케이션 등에서 발생하는 함수 호출, 메시지, 이벤트 등을 중간에 바꾸거나 가로채는 명령, 방법, 기술이나 행위를 말한다.

워드프레스에서 후킹은 프로그래밍의 이벤트 처리와 비슷하다. 어떤 이벤트에 대해 미리 정의된 함수를 호출하듯, 워드프레스의 액션에 대해 임의의 함수를 호출하여 요건을 처리한다.

후킹에는 액션훅과 필터훅이 있다. 차이점은 실행 시점과 용도에 있다. 액션훅은 워드프레스 내부의 이벤트가 발생할 때 실행된다. 예를 들면 새글이 등록되거나 댓글이 달릴 때 이를 후킹 하여 임의의 함수를 호출한다. 반면에 필터훅은 DB에 저장하거나 화면에 출력하기 전에 콘텐츠 내용을 변경할 때 사용된다. 포스트나 페이지 내용을 가져와서 화면 출력 전에 콘텐츠를 변경할 수 있다.

  • 액션훅 : 워드프레스 이벤트 발생 시
  • 필터훅 : 매체에 저장하거나 화면 출력하기 전 콘텐츠 변경

[ 액션훅 예제  ]

function new_email_comment() {
    wp_mail('me@example.net', 'The subject', '<p>The <em>HTML</em> message</p>');
}

add_action('comment_post','new_email_comment');

댓글이 달리면 new_email_comment() 함수를 호출하여 메일을 발송한다. 자주 사용하는 액션훅은 다음과 같다.

  • publish_post : 새로운 포스트가 발행될 때
  • create_category : 새로운 카테고리가 생성될 때
  • switch_theme : 테마를 변경할 때

더 자세한 정보는 codex 사이트를 참조해야 한다. 너무 많다.

 

[ 필터훅 예제 ]

function replace_content($content) {
    $content = str_ireplace('ABC','CBA',$content);
    return $content
}
add_filter('the_content','replace_content');

콘텐츠가 화면에 출력되기 전, 더 정확히 the_post() 함수를 처리하는 중에 호출되어 문자열을 변경한다. 원천 데이터(DB)는 변경하지 않으며 화면 출력만 바뀐다.

자주 사용되는 필터훅은

  • the_content 포스트나 페이지의 콘텐츠가 출력될 때
  • the_title 포스트나 페이지의 제목이 출력될 때
  • comment_text 댓글이 출력될 때
  • wp_title 페이지 제목이 출력될 때

더 자세한 정보는 역시 codex 사이트를 참조한다.

 

 
 

태그: ,