কাস্টম উইজেট তৈরি ও ব্যাখ্যা
আমরা এই টিউটোরিয়ালে কিভাবে একটি কাস্টম উইজেট তৈরি করতে হয় তা ধাপে ধাপে ব্যাখ্যা করবো। কাস্টম উইজেট তৈরি করার মাধ্যমে আপনি আপনার ওয়ার্ডপ্রেস থিম বা ওয়েবসাইটে নতুন ফিচার বা কন্টেন্ট যোগ করতে পারবেন।
এই টিউটোরিয়ালে আমরা একটি সহজ কাস্টম উইজেট তৈরি করবো এবং প্রত্যেকটি কোড লাইন বাংলা ভাষায় ব্যাখ্যা করবো।
উইজেট ক্লাস তৈরি: My_Custom_Widget
class My_Custom_Widget extends WP_Widget {
class My_Custom_Widget extends WP_Widget:
- এখানে আমরা একটি ক্লাস তৈরি করছি যা
WP_Widgetক্লাসটি এক্সটেন্ড (বিস্তৃত) করছে। WP_Widgetক্লাস ওয়ার্ডপ্রেসের বিল্ট-ইন ক্লাস যা দিয়ে আপনি উইজেট তৈরি করতে পারেন।- আমরা এই ক্লাসের ভিতরে নিজের কাস্টম ফাংশন যুক্ত করতে পারবো।
কনস্ট্রাক্টর মেথড: __construct()
function __construct() {
parent::__construct(
'my_custom_widget', // Base ID
__('My Custom Widget', 'text_domain'), // Name
array('description' => __('A Custom Widget for My Theme', 'text_domain'),) // Args
);
}
function __construct():
- এটি ক্লাসের কনস্ট্রাক্টর মেথড। যখনই এই ক্লাসটি ইনস্ট্যান্স করা হবে, এই মেথডটি স্বয়ংক্রিয়ভাবে চালু হবে।
- এই মেথডের ভিতরে আমরা উইজেটের প্রাথমিক সেটআপ বা কনফিগারেশন করছি।
parent::__construct():
- এটি প্যারেন্ট ক্লাস
WP_Widgetএর কনস্ট্রাক্টর মেথডকে কল করছে। - এর মাধ্যমে আমাদের উইজেট ওয়ার্ডপ্রেসে রেজিস্টার হচ্ছে।
'my_custom_widget':
- এটি উইজেটের বেস আইডি, যা উইজেটকে ইউনিক আইডি প্রদান করে।
- এই আইডিটি থিম বা প্লাগিনের মধ্যে উইজেটকে আলাদা করতে সাহায্য করে।
__('My Custom Widget', 'text_domain'):
- এটি উইজেটের নাম, যা ওয়ার্ডপ্রেস অ্যাডমিন প্যানেলে দেখা যাবে।
__('text', 'text_domain')হল একটি ফাংশন যা উইজেটের নামকে আন্তর্জাতিকীকরণ (translation-ready) করে।
array('description' => __('A Custom Widget for My Theme', 'text_domain')):
- এটি একটি অ্যারে যেখানে উইজেটের বিবরণ (description) দেওয়া হয়েছে।
- এই বিবরণ অ্যাডমিন প্যানেলে উইজেটের নিচে দেখানো হবে।
উইজেট আউটপুট: widget()
public function widget($args, $instance) {
echo $args['before_widget'];
echo __('Hello, World!', 'text_domain');
echo $args['after_widget'];
}
public function widget($args, $instance):
- এই মেথডটি উইজেটের সামগ্রী (content) প্রদর্শন করে। যখন উইজেট সাইটে প্রদর্শিত হবে, তখন এই মেথডটি চালু হবে।
$argsহল ওয়ার্ডপ্রেসের ডিফল্ট আর্গুমেন্ট (যেমন,before_widget,after_widget), যা উইজেটের HTML আউটপুট নিয়ন্ত্রণ করে।$instanceহল উইজেটের সেটিংস বা অপশন।
echo $args['before_widget']:
- এটি উইজেটের শুরুতে HTML কোড যোগ করে। ওয়ার্ডপ্রেস থিমের ডিজাইনের সাথে মিলিয়ে উইজেটের স্টাইলিং সঠিকভাবে প্রদর্শনের জন্য এই অংশটি গুরুত্বপূর্ণ।
echo __('Hello, World!', 'text_domain'):
- এটি উইজেটের ভিতরে “Hello, World!” টেক্সট প্রদর্শন করছে। এই টেক্সটটি সহজভাবে পরিবর্তন করে আপনার নিজস্ব কন্টেন্ট যোগ করতে পারেন।
echo $args['after_widget']:
- এটি উইজেটের শেষে HTML কোড যোগ করে, যাতে থিমের স্টাইলিং সঠিকভাবে অনুসরণ করা হয়।
উইজেটের ফর্ম তৈরি: form()
public function form($instance) {
$title = !empty($instance['title']) ? $instance['title'] : __('New title', 'text_domain');
?>
<p>
<label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title:'); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo esc_attr($title); ?>" />
</p>
<?php
}
public function form($instance):
- এটি উইজেটের অ্যাডমিন ফর্মের জন্য HTML আউটপুট তৈরি করে। যখন অ্যাডমিন কোনও উইজেট যোগ বা সম্পাদনা করতে যায়, তখন এই ফর্মটি প্রদর্শিত হবে।
$instanceহল উইজেটের বর্তমান সেটিংস।
$title = !empty($instance['title']) ? $instance['title'] : __('New title', 'text_domain');:
- এটি চেক করছে যে
$instance['title']ফিল্ডে কোনও ডেটা আছে কিনা। যদি থাকে, তাহলে সেটি$titleভ্যারিয়েবলে সেট করা হচ্ছে। না থাকলে ডিফল্টভাবে “New title” প্রদর্শন করা হচ্ছে।
<label> এবং <input> ট্যাগ:
<label>: উইজেট ফর্মের জন্য একটি লেবেল তৈরি করে।get_field_id('title')এর মাধ্যমে ফর্মের ইনপুট ফিল্ডের সাথে লেবেলটি সংযুক্ত করা হচ্ছে।<input>: এখানে একটি টেক্সট ইনপুট ফিল্ড তৈরি করা হচ্ছে, যেখানে অ্যাডমিন উইজেটের জন্য টাইটেল লিখতে পারবে।esc_attr($title)এর মাধ্যমে টাইটেলের ডেটা নিরাপদে ইনপুট ফিল্ডে প্রদর্শিত হচ্ছে।
উইজেটের আপডেট ফাংশন: update()
public function update($new_instance, $old_instance) {
$instance = array();
$instance['title'] = (!empty($new_instance['title'])) ? strip_tags($new_instance['title']) : '';
return $instance;
}
public function update($new_instance, $old_instance):- এই মেথডটি অ্যাডমিন যখন ফর্মে কোনো পরিবর্তন করে সেটি সেভ করার জন্য কাজ করে।
$new_instanceহল নতুন ডেটা যা ফর্মে সাবমিট হয়েছে, এবং$old_instanceহল পুরনো ডেটা যা আগে সংরক্ষিত ছিল।
$instance['title'] = (!empty($new_instance['title'])) ? strip_tags($new_instance['title']) : '';:- নতুন ইনপুট ডেটা থেকে শিরোনাম (title) নেওয়া হচ্ছে এবং
strip_tags()ফাংশনের মাধ্যমে এর মধ্যে থাকা কোনো HTML ট্যাগ সরিয়ে ফেলা হচ্ছে, যাতে নিরাপত্তা বজায় থাকে।
- নতুন ইনপুট ডেটা থেকে শিরোনাম (title) নেওয়া হচ্ছে এবং
return $instance;:- এখানে
$instanceফিল্ডটি রিটার্ন করা হচ্ছে, যা উইজেটের নতুন সেটিংস হিসেবে সংরক্ষণ হবে।
- এখানে
উইজেট রেজিস্টার করা
উইজেট তৈরি করার পরে এটি ওয়ার্ডপ্রেসে রেজিস্টার করতে হবে। আপনি এটি functions.php ফাইলে যুক্ত করতে পারেন:
function register_my_custom_widget() {
register_widget('My_Custom_Widget');
}
add_action('widgets_init', 'register_my_custom_widget');
register_widget('My_Custom_Widget'):
- এই ফাংশনের মাধ্যমে আমরা উইজেটকে ওয়ার্ডপ্রেসের ভিতরে রেজিস্টার করছি, যাতে অ্যাডমিন প্যানেলে এটি দেখা যায়।
add_action('widgets_init', 'register_my_custom_widget'):
widgets_initঅ্যাকশন হুকের মাধ্যমে আমরা আমাদের কাস্টম উইজেট রেজিস্টার করার ফাংশন কল করছি।
কাস্টম উইজেট তৈরি করে ফর্মের ভ্যালু দেখানোর ধাপ
১. উইজেট ক্লাস তৈরি
class My_Custom_Widget extends WP_Widget {
function __construct() {
parent::__construct(
'my_custom_widget', // Base ID
__('My Custom Widget', 'text_domain'), // Name
array('description' => __('A Custom Widget for My Theme', 'text_domain'),) // Args
);
}
// উইজেট আউটপুট
public function widget($args, $instance) {
// উইজেট HTML স্ট্রাকচার শুরু
echo $args['before_widget'];
// উইজেটের ইনপুট থেকে টাইটেলটি ফ্রন্টএন্ডে আউটপুট করা
if (!empty($instance['title'])) {
echo $args['before_title'] . apply_filters('widget_title', $instance['title']) . $args['after_title'];
}
// উইজেটের কন্টেন্ট প্রদর্শন
echo __('This is the widget content.', 'text_domain');
// উইজেট HTML স্ট্রাকচার শেষ
echo $args['after_widget'];
}
// উইজেট ফর্ম (অ্যাডমিন প্যানেলে ইনপুট ফিল্ড)
public function form($instance) {
$title = !empty($instance['title']) ? $instance['title'] : __('Default Title', 'text_domain');
?>
<!-- টাইটেল ইনপুট ফিল্ড -->
<p>
<label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title:', 'text_domain'); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo esc_attr($title); ?>" />
</p>
<?php
}
// ফর্ম থেকে ডেটা সেভ করার জন্য আপডেট মেথড
public function update($new_instance, $old_instance) {
$instance = array();
$instance['title'] = (!empty($new_instance['title'])) ? strip_tags($new_instance['title']) : '';
return $instance;
}
}
২. উইজেটের ফর্মে ইনপুট ফিল্ড দেখানো (অ্যাডমিন প্যানেলে)
public function form($instance):- এখানে আমরা
form()মেথডের মাধ্যমে উইজেটের জন্য একটি ইনপুট ফিল্ড তৈরি করছি, যেখানে ব্যবহারকারী (অ্যাডমিন) একটি টাইটেল লিখতে পারবে। $title = !empty($instance['title']) ? $instance['title'] : __('Default Title', 'text_domain');:- যদি আগের কোনো টাইটেল সেভ করা থাকে, তা
$titleভ্যারিয়েবলে সেট করা হবে। যদি না থাকে, তাহলে ডিফল্ট টাইটেল ব্যবহার করা হবে।
- যদি আগের কোনো টাইটেল সেভ করা থাকে, তা
<label>এবং<input>ট্যাগ:- লেবেল ও ইনপুট ফিল্ডের মাধ্যমে টাইটেল ইনপুট নেওয়া হচ্ছে।
- এখানে আমরা
৩. ফ্রন্টএন্ডে টাইটেল আউটপুট করা
public function widget($args, $instance):- এই মেথডে উইজেটের ফ্রন্টএন্ড আউটপুট দেওয়া হয়।
if (!empty($instance['title'])):- যদি উইজেটের জন্য কোনো টাইটেল ইনপুট করা থাকে, তাহলে সেটি দেখানো হবে।
echo $args['before_title'] . apply_filters('widget_title', $instance['title']) . $args['after_title'];:- এখানে উইজেটের টাইটেলটি প্রদর্শিত হচ্ছে এবং থিমের সাথে সঠিকভাবে স্টাইল করা হচ্ছে।
apply_filters()এর মাধ্যমে টাইটেলকে ফিল্টার করা হয়েছে, যাতে এটি অন্য কোন ফিল্টার ফাংশন দ্বারা পরিবর্তন করা যায় যদি প্রয়োজন হয়।
৪. উইজেট রেজিস্টার করা
functions.php ফাইলে আমাদের কাস্টম উইজেটকে রেজিস্টার করতে হবে:
function register_my_custom_widget() {
register_widget('My_Custom_Widget');
}
add_action('widgets_init', 'register_my_custom_widget');