قسمت ۶ – افزودن فیلد سفارشی در تکسانومی / Taxonomy

تهران آی تی / برنامــه نویــسـی / قسمت ۶ – افزودن فیلد سفارشی در تکسانومی / Taxonomy
افزودن فیلد سفارشی در تکسانومی / Taxonomy

افزودن فیلد سفارشی در تکسانومی / Taxonomy

گام اول : افزودن فیلدها

به عنوان مثال فرض کنید میخواهیم به صفحه افزودن دسته های پیش فرض وردپرس و یا تکسانومی های سفارشی خود فیلدی ساده اضافه کنیم تا آدرس یک تصویر را در آن قرار دهیم مانند تصویر زیر. برای این کار ابتدا باید ui آن را ایجاد کنیم برای این کار میبایست توسط اکشن Taxonomy Name_add_form_fields هوک بزنیم.

توجه : نام این اکشن باید حتما ترکیبی از نام تکسانومی و مقدار رزرو شده _add_form_fields باشد، درصورتی که میخواهید فیلد خود را به دسته های پیش فرض وردپرس اضافه کنید به جای نام تکسانومی از category استفاده کنید.

افزودن فیلد سفارشی در تکسانومی / Taxonomy

افزودن فیلد سفارشی در تکسانومی / Taxonomy

در این اکش ۳ نکته مهم وجود دارد که باید به آن توجه داشت، که به شرح ذیل است:

  • نام اکشن : نام این اکشن باید حتما ترکیبی از نام تکسانومی و مقدار رزرو شده _add_form_fields باشد، درصورتی که میخواهید فیلد خود را به دسته های پیش فرض وردپرس اضافه کنید به جای نام تکسانومی از category استفاده کنید. در این مثال از tin_product_type_add_form_fields استفاده شده است.
  • نام تابع : در اصل نام تابعی است که اکشن باید اجرا کند، و حتما به صورت انحصاری باشد. در این مثال از tin_add_meta_box_product_type استفاده شده است
  • اتربیوت name : در تابع از کد های html استفاده شده و کلاس های css پیشفرض خود وردپرس است و نکته مهمی که وجود دارد این است که input ای که قرار است آدرس تصویر ما را دریافت کند اتربیوتی به اسم name دارد که ما در گام های بعدی توسط همین مقداری که به اتربیوت name دادیم مقدار input را ذخیره، ویرایش و … میکنیم. در این مثال از tin_term_image استفاده شده است.

کدهای اکشن و تابع آن

//Hook------->Taxonomy Name_add_form_fields
add_action('tin_product_type_add_form_fields', 'tin_add_meta_box_product_type', 10, 1);
function tin_add_meta_box_product_type($taxonomy)
{
?>
<div class="form-field term-group">
<label class="featuret-group">تصویر</label>
<input type="url" class="postform" id="tin_meta_box_image" name="tin_term_image">
</div>
<?php
}

گام دوم : ذخیره فیلدها در دیتابیس

در گام اول ui را ایجاد کردیم و به input اصلی خود اتربیوت name دایم و مقدار آن را tin_term_image گذاشتم. حال در این مرحله توسط همین اتربیوت مقدار input را گرفته و ذخیره میکنیم. برای ذخیره کردن فیلد خود ابتدا باید توسط اکشن created_Taxonomy Name هوک بزنیم.

توجه : نام این اکشن باید حتما ترکیبی از مقدار رزرو شده created_ و نام تکسانومی باشد، درصورتی که این کار را برای دسته های پیش فرض وردپرس انجام میدهید به جای نام تکسانومی از category استفاده کنید.

  • در این مثال نام اکشن ما created_tin_product_type میباشد.
  • در این مثال نام تابع اکشن ما tin_save_meta_box_product_type میباشد.
  • تابع ما، یک ورودی به نام term_id میگیرد این مقدار توسط خود وردپرس اختصاص داده میشود.
  • توسط شرطی برسی میکنیم آیا مقداری برای input ما ست شده است یا خیر، در صورتی که ست شده بود کار های بعدی را انجام میدهیم.
  • توسط دستور sanitize_text_field مقدار input را پاکسازی و ایمن سازی میکنیم و آن را داخل متغییری به نام tin_term_image میریزیم.
  • و در آخر توسط تابع update_term_meta آن را ذخیره میکنیم. این تابع ۳ ورودی میگیرد ورودی اول term_id است که توسط خود وردپرس آن را گرفتیم، ورودی دوم کلید و یا نام مقداری است که میخواهیم ذخیره کنیم و ورودی سوم مقدار آن است که این مقدار را ما در متغییر tin_term_image ریختیم و به تابع دادیم.

کدهای اکشن و تابع آن

//Hook------->created_Taxonomy Name
add_action('created_tin_product_type', 'tin_save_meta_box_product_type', 10, 1);
function tin_save_meta_box_product_type($term_id)
{
if( isset( $_POST['tin_term_image'])){
$tin_term_image=sanitize_text_field($_POST['tin_term_image']);
update_term_meta($term_id, 'tin_term_image', $tin_term_image);
}
}

گام سوم : افزودن فیلدهای صفحه ویرایش

بخش دسته ها و یا تکسانومی ها شامل ۲ صفحه است، صفحه ای که آن را ایجاد میکنید و صفحه ای که میتوانید دسته افزوده شده را ویرایش کنید. ما در گام اول UI فیلد مورد نظر خود را به صفحه ایجاد دسته یا تکسانومی اضافه کردیم حال نوبت آن است که به صفحه ویرایش دسته هم UI مد نظر خود را اضافه کنیم.

توجه : نام این اکشن باید حتما ترکیبی از نام تکسانومی و مقدار رزرو شده _edit_form_fields باشد، درصورتی که میخواهید فیلد خود را به دسته های پیش فرض وردپرس اضافه کنید به جای نام تکسانومی از category استفاده کنید.

  • در این مثال نام اکشن ما tin_product_type_edit_form_fields میباشد.
  • در این مثال نام تابع اکشن ما tin_edit_meta_box_product_type میباشد.
  • تابع ما، دو ورودی به نام های term, taxonomy میگیرد این مقادیر توسط خود وردپرس اختصاص داده میشود.
  • در صفحه ویرایش، ui شبیه به گام اول است با این تفاوت که باید به جای تگ div از تگ های جدول و کلاس های مربوط به همین صفحه استفاده کرد.

نکته مهم این بخش این است که ما باید مقداری که از input خود در صفحه ایجاد دسته گرفتیم و ذخیره کردیم را بگیریم و در input نمایش دهیم تا کاربر در صورت نیاز آن را تغییر دهد. برای این کار از تابع get_term_meta استفاده میکنیم این تابع سه ورودی میکیرد که به شرح ذیل است

  • ورودی اول term_id : ما term را از ورودی تابع اصلی گرفتیم و برای اینکه به id آن دسترسی داشته باشیم از دستور term->term_id استفاده میکنیم.
  • ورودی دوم key : نام مقداری است که میخواهیم فراخانی کنیم در گام دوم در تابع update_term_meta ما نام مقدار خود را tin_term_image گذاشتم و حال باید همان را فراخوانی کنیم.
  • ورودی سوم  single : میپرسد آیا میخواهید تک باشد یا به صورت آرایه. اگر true بدهیم به صورت تک پارامتر برای ما بر میگرداند.

و در آخر توسط اتربیوت value از تگ input مقدار را در input چاپ میکنیم.

کدهای اکشن و تابع آن

////Hook------->Taxonomy Name_edit_form_fields
add_action('tin_product_type_edit_form_fields', 'tin_edit_meta_box_product_type', 10, 2);
function tin_edit_meta_box_product_type($term, $taxonomy)
{
$term_image=get_term_meta( $term->term_id, 'tin_term_image', true );
?>
<tr class="form-field term-group-wrap">
<th scope="row">
<label class="featuret-group">تصویر</label>
</th>
<td>
<input type="url" value="<?php echo $term_image; ?>" class="postform" id="tin_meta_box_image" name="tin_term_image">
</td>
</tr>
<?php
}

گام چهارم: ذخیره فیلدهای صفحه ویرایش در دیتابیس

این گام شبیه به گام دوم است با این تفاوت که نام اکشن آن به جای created_ و نام تکسانومی مقدار edited_ و نام تکسانومی میباشد و حتی میتوان در اکشن خود نام تابع گام دوم را فراخوانی کرد و دیگر برای اکشن خود تابع جدیدی ایجاد نکرد.

توجه : نام این اکشن باید حتما ترکیبی از مقدار رزرو شده edited_ و نام تکسانومی باشد، درصورتی که این کار را برای دسته های پیش فرض وردپرس انجام میدهید به جای نام تکسانومی از category استفاده کنید.

کدهای اکشن و تابع آن

//Hook------->edited_Taxonomy Name
add_action('edited_tin_product_type', 'tin_edited_meta_box_product_type', 10, 1);
function tin_edited_meta_box_product_type($term_id)
{
if (isset($_POST['tin_term_image'])) {
$tin_term_image = sanitize_text_field($_POST['tin_term_image']);
update_term_meta($term_id, 'tin_term_image', $tin_term_image);
}
}

مشاهده کل کد ها به صورت یکجا

از باکس کد زیر میتوانید کدهایی که در این ۴ گام زدیم را به صورت یکجا مشاهده کنید و در صورت نیاز کپی کرده و به پروژه خود اضافه کنید.

/////////////////////////////////////////////////
//گام اول : افزودن فیلدهای صفحه ایجاد دسته
//Hook------->Taxonomy Name_add_form_fields
/////////////////////////////////////////////////
add_action('tin_product_type_add_form_fields', 'tin_add_meta_box_product_type', 10, 1);
function tin_add_meta_box_product_type($taxonomy)
{
?>
<div class="form-field term-group">
<label class="featuret-group">تصویر</label>
<input type="url" class="postform" id="tin_meta_box_image" name="tin_term_image">
</div>
<?php
}
/////////////////////////////////////////////////
//گام دوم : ذخیره فیلدهای صفحه ایجاد دسته در دیتابیس
//Hook------->created_Taxonomy Name
/////////////////////////////////////////////////
add_action('created_tin_product_type', 'tin_save_meta_box_product_type', 10, 1);
function tin_save_meta_box_product_type($term_id)
{
if (isset($_POST['tin_term_image'])) {
$tin_term_image = sanitize_text_field($_POST['tin_term_image']);
update_term_meta($term_id, 'tin_term_image', $tin_term_image);
}
}
/////////////////////////////////////////////////
//گام سوم : افزودن فیلدهای صفحه ویرایش
////Hook------->Taxonomy Name_edit_form_fields
/////////////////////////////////////////////////
add_action('tin_product_type_edit_form_fields', 'tin_edit_meta_box_product_type', 10, 2);
function tin_edit_meta_box_product_type($term, $taxonomy)
{
$term_image=get_term_meta( $term->term_id, 'tin_term_image', true );
?>
<tr class="form-field term-group-wrap">
<th scope="row">
<label class="featuret-group">تصویر</label>
</th>
<td>
<input type="url" value="<?php echo $term_image; ?>" class="postform" id="tin_meta_box_image" name="tin_term_image">
</td>
</tr>
<?php
}
/////////////////////////////////////////////////
//گام چهارم: ذخیره فیلدهای صفحه ویرایش در دیتابیس
//Hook------->edited_Taxonomy Name
/////////////////////////////////////////////////
add_action('edited_tin_product_type', 'tin_edited_meta_box_product_type', 10, 1);
function tin_edited_meta_box_product_type($term_id)
{
if (isset($_POST['tin_term_image'])) {
$tin_term_image = sanitize_text_field($_POST['tin_term_image']);
update_term_meta($term_id, 'tin_term_image', $tin_term_image);
}
}

نحوه فراخوانی و نمایش فیلدها در قالب وردپرسی

توسط روش هایی که در آموزش های قبلی بیان شد مثل کوئری، توابع، فانکشن ها و … میتوان دسته ها را در قالب فراخوانی کرد و نمایش داد. ولی برای نمایش فیلدهای سفارشی باید از تابع get_term_meta در حلقه ها و کد های خود استفاده کنید. این تابع ۳ ورودی میگیرد که به شرح ذیل است.

  • ورودی اول term_id است که id ترمی که میخواهیم فیلد سفارشی آن را نمایش دهیم، وارد میکنیم.
  • ورودی دوم key است که باید کلید فیلد سفارشی ای که میخواهیم نمایش دهیم را اینجا واردی کنیم در این مثال مقدار کلید ما tin_term_image است.
  • ورودی سوم مقدار true یا false میگیرد و میپرسد که آیا میخواهید مقدار خروجی تابع single باشد یا خیر که ما مقدار true میدهیم.

get_term_meta($term_id:integer,$key:string,$single:boolean );

نمایش توسط تابع Get_Terms()

در مثال زیر میخواهیم توسط تابع Get_Terms فیلد های سفارشی که اضافه کردیم را توسط دستور get_term_meta نمایش دهیم.

$args = array(
'taxonomy' => 'tin_product_type',
'hide_empty' => false,
);
$terms = get_terms($args);
foreach ($terms as $term) {
$id = $term->term_id;
$img = get_term_meta($id, 'tin_term_image', true);
if ($img) {
echo $img . '</br>';
} else {
echo 'No Image </br>';
}
}

نمونه کد زیر نمونه پیشرفته تر کدهای بالا است که علاوه بر فیلد سفارشی میتواند نام، لینک، توضیحات و … هم نمایش دهد.

<?php
$args = array(
'taxonomy' => 'tin_product_type',
'hide_empty' => false,
);
$terms = get_terms($args);
foreach ($terms as $term) {
$id = $term->term_id;
$name = $term->name;
$description = $term->description;
$link = esc_url(get_term_link($term));
$img = get_term_meta($id, 'tin_term_image', true);
?>
<a href="<?php echo $link; ?>">
<?php if (!empty($img)) : ?>
<img src="<?php echo $img; ?>">
<?php else : ?>
<p>No Image</p>
<?php endif; ?>
<h1><?php echo $name; ?></h1>
<p><?php echo $description; ?></p>
</a>
<?php
}

نمایش در صفحه Archive

مثال ساده که فقط فیلد سفارشی را نمایش میدهد.

$queried_object=get_queried_object();
$id = $queried_object->term_id;
$img = get_term_meta($id, 'tin_term_image', true);
if(!empty($img)){
echo $img;
}else{
echo 'NO Image';
}

نمونه کد زیر نمونه پیشرفته تر کدهای بالا است که علاوه بر فیلد سفارشی میتواند نام، لینک، توضیحات و … هم نمایش دهد.

<?php
$queried_object = get_queried_object();
$id = $queried_object->term_id;
$img = get_term_meta($id, 'tin_term_image', true);
$name = $queried_object->name;
$description = $queried_object->description;
$link = esc_url(get_term_link($queried_object));
?>
<a href="<?php echo $link; ?>">
<?php if (!empty($img)) : ?>
<img src="<?php echo $img; ?>">
<?php else : ?>
<p>No Image</p>
<?php endif; ?>
<h1><?php echo $name; ?></h1>
<p><?php echo $description; ?></p>
</a>
<?php

جستجو کنید

طراحی و پیاده سازی پروژه های طراحی سایت دانشجویی

انجام، اجرا و طراحی پروژه های طراحی سایت برای دانشجویان با HTML CSS PHP ASP.NET JAVA و ... با کمترین هزینه. برای مشاهده نمونه کارها و یا دریافت مشاوره رایگان از تیم طراحی سایت تهران آی تی با ما در تماس باشید. ما بهترین پروژه های طراحی سایت را با حداقل هزینه برای شما طراحی میکنیم - مشاوره رایگان 09121486770

مــشاوره و مشاهده نمونه کارها

مطالب مرتبط

لطفا از مطالب مرتبط با این پست دیدن فرمایید

دوره رایگان بنفش ASP.NET MVC

کامل ترین و بهترین دوره رایگان Asp.Net MVC 5 شامل 44 قسمت - ASP.NET یک فریمورک وب رایگان برای ساخت وب سایت ها و برنامه های کاربردی وب بر روی دات نت فریم ورک با استفاده از HTML ، CSS و جاوا اسکریپت است. از این رو تیم تحقیقاتی تهران آی تی به این نتیجه رسید که دوره رایگان و کاربردی در خصوص ASP.NET MVC 5 منتشر کند. این دوره آموزشی رایگان با عشق و علاقه برای شما پژوهندگان علم تولید شده است.

ورود به دوره رایگان بنفش ASP.NET MVC

جــذاب های هفته

از پربازدیدترین مطالب تهران آی تی در هفته ای که گذشت دیدن فرمایید

باورکردنی نیست فقط با 300 هزار تومان

طراحی سایت شما + طراحی اپلیکیشن هدیه و رایگان
این یک حراج است در مدت زمان محدود - شرکت های زیادی سایت های ارزان طراحی میکنند اما آیا کیفیت لازم را دارا هستند؟ طراحی سایت ارزان به همراه اپلیکیشن رایگان هدیه برای اولین بار توسط تهران آی تی مخصوص سازمان ها و کسب و کار های کوچک و بزرگ و حتی جدید تیم طراحی سایت تهران آی تی در کنار شماست تا شناخته شوید - مشاوره رایگان 09121486770

مــشاوره و مشاهده نمونه کارها

پشتیبانی 24 ساعته

تیم تهران آی تی در هفت روز هفته و 24 ساعت روز آماده پاسخ گویی به سوالات کاربران و ارائه مشاره رایگان میباشد