ایجاد ابزارک (widget) در وردپرس

ابزارک ها در وردپرس امکان نمایش اطلاعات در بخش های معینی از قالب وب سایت (موقعیت های ابزارک ها) را فراهم می آورند. وردپرس از کلاس WP_Widget برای ایجاد و مدیریت ابزارک ها استفاده می کند. این کلاس دارای چهار متد مهم سازنده، form، update و widget می باشد که در ایجاد ابزارک از آنها استفاده می کنیم.

پس از تعریف کلاس ویجت مورد نظر از طریق هوک اکشن widgets_init و تابع register_widget باید این کلاس را برای نمایش در خروجی به ثبت برسانیم. برای درک بهتر موضوع به مثال زیر توجه کنید.

مثال:

<?php
add_action("widgets_init", function () { register_widget("bmpt_display_text"); });

class bmpt_display_text extends WP_Widget
{
    public function __construct() {
        parent::__construct("bmpt_displaytext", "Display Text Widget",
            array("description" => "A simple widget to show a message"));

    }
//widget setting form
    public function form($instance) {
   $title=$instance["title"];
   $message = $instance["message"];
    $titleId = $this->get_field_id("title");
    $titleName = $this->get_field_name("title");
    echo '<p><label for="'.$titleId.'">Title:</label><br>';
    echo '<input id="'.$titleId.'" type="text" name="'.$titleName.'" value="'.$title.'"></p>';

    $msgId = $this->get_field_id("message");
    $msgName = $this->get_field_name("message");
    echo '<p><label for="'.$msgId.'">Message:</label><br>';
    echo '<input id="'.$msgId.'" type="text" name="'.$msgName.'" value="'.$message.'"></p>';

  }
//save widget parameters
public function update($newInstance, $oldInstance) {
        $instance = $oldInstance;
        $instance['title'] = strip_tags( $newInstance['title'] );
        $instance['message'] = strip_tags( $newInstance['message'] );

return $instance;
}
//display the widget
public function widget($args, $instance) {  

$title=$instance["title"];
$message =$instance["message"];

  echo $args['before_widget'];
  if(!empty($title))
  {	echo $args['before_title'];
    echo $title;
  	echo $args['after_title'];
  }

  if(!empty($message))
  {	
    echo ‘<p>’.$message.’</p>’;
  	
  }

echo $args['after_widget'];

}
 }//end class   
?>

در این مثال پیش از آغاز کلاس ویجت، در اکشن بدون نام widget_inits با استفاده از register_widget کلاس ویجت را ثبت کردیم. این تابع نام کلاس ویجت مورد نظر را به عنوان پارامتر ورودی می پذیرد. در هنگام تعریف کلاس ویجت باید به این نکته توجه داشته باشید که حتما از کلاس والد WP_Widget ارث برده شود. در درون کلاس ویجت ما از چهار متد متفاوت استفاده کردیم: سازنده کلاس، متد form، متد update و متد widget.

در متد سازنده کلاس پارامتر اول آیدی ویجت مورد نظر، پارامتر دوم عنوان ویجت و پارامتر سوم که به صورت آرایه است توصیف ویژگی ویجت مقداردهی شده است.

متد form نمایش دهنده فرم تنظیماتی است که برای ویجت در نظر گرفته می شود. معمولا ویجت ها با توجه به مقادیر و تنظیماتی که در این قسمت تعیین می گردد، خروجی مورد نظر را ایجاد می کنند. این تابع دارای یک پارامتر ورودی می باشد که آرایه ای از مقادیر فرم تنظیمات ویجت است و از طریق نام هر المان می توانید به مقدار آن دسترسی یابید. توابع get_field_id و get_field_name نیز به ترتیب آیدی و نام فیلد مورد نظر را بر می گرداند.

متد update برای ذخیره سازی مقادیر فیلدهای فرم ویجت استفاده می شود. این تابع دو پارامتر ورودی می پذیرد. پارامتر اول آرایه مقادیر جدید فیلدهای ارسالی توسط کاربر و پارامتر دوم آرایه ای حاوی مقادیر قبلی این فیلد ها است. کنترل و تصفیه مقادیر ارسالی در این تابع صورت می پذیرد.

متد widget برای نمایش خروجی مورد نظر در وب سایت استفاده می شود. این تابع دو پارامتر ورودی می پذیرد. پارامتر اول شامل آرگومان های خاص ویجت و پارامتر دوم آرایه مقادیر فیلدهای تنظیمات ویجت است. در این مثال در بخش تنظیمات دو فیلد متنی برای عنوان و پیام ویجت تعریف کردیم که پس از ذخیره سازی این مقادیر در خروجی ویجت به نمایش در می آید.

ایجاد ابزارک برای داشبورد مدیریت

وردپرس امکان ایجاد ویجت برای داشبورد مدیریت سایت را نیز فراهم کرده است. برای ایجاد ویجت داشبورد می توان از تابع wp_add_dashboard_widget استفاده کرد. این تابع پنج پارامتر ورودی می پذیرد که دو پارامتر آخر اختیاری است. پارامتر اول آیدی css که به div ویجت اضافه می شود. پارامتر دوم نام ویجت و پارامتر سوم نام تابعی که برای نمایش محتوای ویجت فراخوانده می شود و پارامتر چهارم نام تابعی که برای مدیریت و ذخیره سازی فیلدهای تنظیمات ویجت باید فراخوانده شود و پارامتر آخر آرایه ای که به عنوان آرگومان ویجت به تابع فراخوان ارسال می شود. برای ایجاد ویجت داشبورد، تابع wp_add_dashboard_widget باید در اکشن هوک wp_dashboard_setup فراخوانده شود.

مثال:

< ?php
add_action( 'wp_dashboard_setup', 'bmpt_dashboard_example_widgets' );
             
function bmpt_dashboard_example_widgets() {
             
    //create a custom dashboard widget
    wp_add_dashboard_widget( 'dashboard_custom_message',
        'My Plugin Information', 'bmpt_dashboard_example_display',
        'bmpt_dashboard_example_setup' );             
}

function bmpt_dashboard_example_setup() {
             
    //check if option is set before saving
    if ( isset( $_POST['bmpt_msg'] ) ) {
        //retrieve the option value from the form
        $bmpt_msg = sanitize_text_field( $_POST['bmpt_msg'] );
             
        //save the value as an option
        update_option( 'bmpt_dashboard_widget_msg', $bmpt_msg );
    }           
    //load the saved message if it exists
    $bmpt _msg= get_option( 'bmpt_dashboard_widget_msg');
                
     echo 'Message:  < input type="text" name="bmpt_msg" id="bmpt_msg"
            value=" '.$bmpt_msg .' " size="50" / >'; 
   }
function bmpt_dashboard_example_display()
{
    //load our widget option
    $bmpt_option = get_option( 'bmpt_dashboard_widget_msg');
             
    //if option is empty set a default
    $bmpt_msg = ( $bmpt_option ) ? $bmpt_option : 'This is default message';
             
    echo ' < div class="msg-widget" > '.$bmpt_msg.' < /div > ';
}
? > 

در مثال فوق، در تابع bmpt_dashboard_example_setup  عمل دریافت و ذخیره سازی پیام و در تابع bmpt_dashboard_example_display دریافت تنظیمات ذخیره شده و نمایش پیام در خروجی صورت می پذیرد.

در وردپرس از دو تابع get_option و update_option به ترتیب برای دریافت پارامتر مربوط به تنظیمات و ذخیره سازی پارامتر مربوط به تنظیمات در جدول options پایگاه داده وردپرس استفاده می شود. در این مثال، برای ذخیره سازی پارامتر با تابع update_option، عنوان پارامتری که باید ذخیره شود به همراه مقدار آن به عنوان ورودی به تابع ارسال شده است و برای دریافت مقدار آن پارامتر تنها از عنوان پارامتر در تابع get_option استفاده شده است.