안녕하세요. 린치핀소프트 한광희입니다.

이번 포스트는 지난 위젯 제작 포스트에 이어지는 포스트입니다.

위젯(Widget) 제작하기 #1 

이번 포스트에서는 직접 클래스의 메서드를 구현하면서 각 메서드의 매개변수들이 어떠한 데이터를 가지고 있고 어떠한 클래스 메서드를 이용하여야 하는지도 소개해드리겠습니다.

 

<?php

class knowledgeBaseWidget extends WP_Widget{

function __construct(){
parent::__construct(
'lcp_knowbase_widget', // 현재 생성하는 위젯의 ID 값입니다. 
'Linchpinsoft Knowledge Base Count Widget', // 설정 페이지에서 보여지게 되는 위젯의 이름입니다.
array(
'description' => '린치핀소프트에서 제작된 KnowLedgeBase Widget입니다.현재까지 발행된 Posts의 숫자를 카운트하는 위젯입니다.',
//설정페이지에서 보여지게 되는 위젯의 설명글입니다. array('description'= > '설명글')임을 확인하세요!
)
);

}

public function widget($args, $instance){
// $args : 위젯의 타이틀/위젯과 관련된 필터 훅과 연계된 데이터가 $args 매개변수에 저장됩니다.
// $instance : $instance 에서는 Update() 메서드를 통해 저장된 데이터를 가지고 있는 변수입니다. 

?>
<aside id='lcp_knowbaseWidget' style='margin-bottom:2em'>
<div class='row'>
<h1 class="widget-title">Knowledge Base</h1>
<div class='col-xs-12'>
<a href='http://www.linchpinsoft.com/blog'>
<span class='kwb-cnt' style='font-size:2.2em'>0</span> 개<br> 워드프레스 노하우가 공개되어 있습니다!
</a>
</div>
</div>

</aside>
<?php

}


public function update($new_instance, $old_instance){
// $new_instance : 위젯 설정 페이지에서 저장된 새로운 데이터값입니다.
// $old_instance : 현재 저장된 설정 이전에 저장된 데이터값입니다.


$instance = array();
$instance['animate_sec'] = $new_instance['animate_sec'];
$instance['animate_setted'] = $new_instance['animate_setted'];
return $new_instance;
}

public function form($instance){
// $instance : 이전에 저장되어 있는 데이터값입니다.

if( isset($instance['animate_sec'])) $animate_sec = $instance['animate_sec'];
if( isset($instance['animate_setted'])) $animate_setted = $instance['animate_setted'];

?>
<br>
애니메이션 지속 시간 : <input type='text' size='3' id='<?php echo $this->get_field_id('animate_sec');?>' name='<?php echo $this->get_field_name('animate_sec');?>' value='<?php echo $animate_sec;?>' > 초<br><br>
애니메이션 설정 : <input type='checkbox' id='<?php echo $this->get_field_id('animate_setted')?>' name='<?php echo $this->get_field_name('animate_setted');?>' <?php if($animate_setted == 'on') echo 'checked' ?> ><br>
<em>체크하면 위젯의 애니메이션 효과가 추가됩니다!</em>
<br><br>
<?php
// $this->get_field_name('animate_sec')
// $this->get_field_id('animate_sec')
// 메서드를 사용하여 form을 생성하고 있음을 유의하세요.
}

}

function knowledgeBaseWidget_register(){
register_widget('knowledgeBaseWidget');
}

add_action('widgets_init', 'knowledgeBaseWidget_register');


?>

 

위의 소스코드는 위젯을 만들기위한 클래스를 정의한 것입니다. 어떠한 목적과 기능을 제공하는 위젯이 아닌 위젯 제작에 대해서 각 메서드와 매개변수의 역할을 이해하기 위해 테스트로 작성한 위젯입니다.(실제로 위젯을 제작할때는 더 많은 기능과 훅/함수 들을 추가하여 제작할 수 있습니다.)

 

1.widget() 메서드

$args : 위젯의 타이틀/위젯과 관련된 필터 훅과 연계된 데이터가 $args 매개변수에 저장됩니다.
$instance : $instance 에서는 Update() 메서드를 통해 저장된 데이터를 가지고 있는 변수입니다.

실제로 사이드바 영역에 추가된 위젯의 구현 부분으로 $instance 매개변수 등을 참고하여 DB에 저장된 데이터를 활용하여 위젯의 행동과 설정등을 구현합니다.

2.update() 메서드

$new_instance : 위젯 설정 페이지에서 저장된 새로운 데이터값입니다.
$old_instance : 현재 저장된 설정 이전에 저장된 데이터값입니다.

위젯 설정 페이지에서 저장된 데이터를 검증 및 비교하여 저장하는 부분입니다. 최종 저장될 값을 배열(Array)로 반환(Return)하여 줍니다.

여기서는 2종류의 메서드 매개변수가 있는데 이는 현재 저장되는 값과 과거에 저장된 값으로, 비교 또는 검증에 용이합니다.

3.form() 메서드

$instance : 이전에 저장되어 있는 데이터값입니다.

위제 설정에 저장되어야하는 Form 부분을 구현하는 메서드입니다. 이 부분에서는 클래스 메서드로서 꼭 2가지를 사용하여야 합니다.

$this->get_field_name(‘name’)

$this->get_field_id(‘id’)

위 2종류의 메서드 호출시 출력되는 값을 각 Form의 필드(html)의 name값과 id값으로 지정합니다. 각 메서드에서는 올바른 필드의 name/id값을 반환해주기 때문에 form을 구성할 때는 이 함수를 이용하여야 합니다.

(이 부분은 위의 form의 html 구현부분을 확인하시면 쉽게 이해할 수 있습니다.)