ضمیمه کردن فایل به نوشته از طریق Meta Box ها در وردپرس ( قسمت سوم )

metabox3

در طول دوره ی دو پست آینده، به چگونگی اهرم کردنAPI وردپرس برای تعریف متا باکس های سفارشی متعلق به خودمان برای پیوست کردن یک سند (مانند یک PDF) به صفحات وردپرسمان، نگاهی خواهیم انداخت. همچنین این امر را که چگونه باید یک فایل را انتخاب کنیم تا بتوانیم به درستی آن را حذف کنیم، بررسی خواهیم کرد.
چند ماه پیش، ندا گرجی ازده نشان داد که چگونه متا باکس سفارشی وردپرس ایجاد کنیم.( برای دیدن آن به لینک زیر مراجعه کنید:
(http://wpurl.ir/creatmetabox) همانطور که در مقاله ی او اشاره شده است، متا باکس های سفارشی از ویژگی های فوق العاده قدرتمند است که به ما اجازه می دهد تکه های مختلف اطلاعات را به پست ها و صفحات وردپرس اضافه کنیم.

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

تعریف متا باکس سفارشی
در ابتدا بیایید که متا باکس پست ایجاد کنیم. به طور خاص، متا باکس باید:
• هم در پست و هم در صفحه در دسترس باشد
• در کنار ویرایشگر پست ظاهر شود
• یک فایل ورودی را قبول کند
در اینجا، functions.php را در ریشه فهرست تم دوهزار و یازده قرار دهید. ما همه ی تغییراتمان را در انتهای فایل ایجاد خواهیم کرد. با تعریف یک تابع به نامadd_custom_meta_boxes شروع می کنیم و این تابع با هوک add_meta_boxes ثبت خواهد شد.

<?php
function add_custom_meta_boxes() {

} // end add_custom_meta_boxes
add_action('add_meta_boxes', 'add_custom_meta_boxes');
?>

در مرحله ی بعد، متا باکس سفارشی را تعریف خواهیم کرد. اول، کد را می نویسیم و بعد من شرح خواهم داد که این کد چه کارهایی انجام می دهد:

<?php
function add_custom_meta_boxes() {

	// Define the custom attachment for posts
	add_meta_box(
		'wp_custom_attachment',
		'Custom Attachment',
		'wp_custom_attachment',
		'post',
		'side'
	);
	
	// Define the custom attachment for pages
	add_meta_box(
		'wp_custom_attachment',
		'Custom Attachment',
		'wp_custom_attachment',
		'page',
		'side'
	);

} // end add_custom_meta_boxes
add_action('add_meta_boxes', 'add_custom_meta_boxes');

?>

توجه کنید که این دو کد فرا خوانده شده در زیرadd_meta_box تقریبا یکسان هستند.
• اولین پارامترID متا باکس است. این در هنگام ذخیره کردن مقدار استفاده می شود.
• پارامتر دوم برچسب است. این مقدار در عنوان بالای متا باکس پست ظاهر می شود.
• مقدار سوم، تابع فراخوانده شده ای است که در واقع برای تعریف کردن نشانه گذاری هایی که در متا باکس ظاهر شد، مورد استفاده قرار گرفت.
• مقدار چهارم نوع پستی را که این متا باکس سفارشی باید در آن ظاهر شود، به وردپرس می گوید. از آنجایی که ما آن را هم در پست ها و هم در صفحات می خواهم، آن را دو بار تعریف کرده ایم.
• پارامتر نهایی تعریف می کند که متا باکس کجا ظاهر شود. این می تواند در یکی از هر دو طرف باشد، پیشرفته و یا معمولی. ما انتخاب کردیم که آن در کنار ویرایشگر پست ظاهر شود.

تنظیم فرا خوانی

figure1
تا این جا، متا باکس سفارشی هیچ کاری انجام نمی دهد. در واقع حتی چیزی را هم نمایش نمی دهد:
این به این دلیل است که ما هنوزتوابع فرا خوانی را که به منظور تولید نشانه گذاری ها استفاده می شود تعریف نکرده ایم. به منظور انجام این کار، نیاز به تعریف یک تابع با نامی که در بالا ذکر کرده ایم داریم. به طور خاص: wp_custom_attachment.
ورودی باید قالب PDF را قبول کند، بنابراین یک توصیف کوتاه و عنصر ورودی مناسب برای پذیرش فایل ها، ارائه می دهیم:

<?php
function wp_custom_attachment() {

	wp_nonce_field(plugin_basename(__FILE__), 'wp_custom_attachment_nonce');
	
	$html = '<p class="description">';
		$html .= 'Upload your PDF here.';
	$html .= '</p>';
	$html .= '<input type="file" id="wp_custom_attachment" name="wp_custom_attachment" value="" size="25">';
	
	echo $html;

} // end wp_custom_attachment
?>

اولین خط از کد، nonce value را به منظور اینکه به اطلاعات ما به درستی اعتبار و امنیت ببخشد، تعریف می کند.
بعد، به سادگی یک نشانه برای نمایش بخش ورودی تنظیم میکنیم.

figure2
در اینجا، یک متا باکس سفارشی به نصیبمان شده است که مناسب و معقول به نظر می رسد اما در واقع کار نمی کند.
ذخیره کردن فایل ها
آلان ما آماده ی ذخیره کردن فایل ها هستیم. اول، نیاز به ایجاد یک تابع داریم که به هوک save_post هوک شود. بیایید آن را همین حالا تعریف کنیم:

<?php
function save_custom_meta_data($id) {

	/* --- security verification --- */
	if(!wp_verify_nonce($_POST['wp_custom_attachment_nonce'], plugin_basename(__FILE__))) {
	  return $id;
	} // end if
	  
	if(defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
	  return $id;
	} // end if
	  
	if('page' == $_POST['post_type']) {
	  if(!current_user_can('edit_page', $id)) {
	    return $id;
	  } // end if
	} else {
   		if(!current_user_can('edit_page', $id)) {
	    	return $id;
	   	} // end if
	} // end if
	/* - end security verification - */
	
} // end save_custom_meta_data
add_action('save_post', 'save_custom_meta_data');

?>

اگر چه این تابع در واقع هنوز مقادیر را ذخیره نمی کند، حداقل شامل کمی کد است که تضمین کند که ما آماده ی ذخیره کردن فایل ها هستیم. به طور خاص، تابع اطمینان حاصل می کند که مقدار nonce مورد انتظار حاضر است، که ذخیره سازی خودکار اتفاق نمی افتد، و کاربر که تلاش می کند تا اطلاعات را ذخیره کند، دارای مجوز برای انجام این کار است.
در حال حاضر برای شروع اعتبار دهی و ذخیره کردن فایل ها آماده هستیم. هنگامی که کار به ذخیره سازی داده های متای سفارشی مبتنی بر فایل می رسد، کد اضافی باید به فایل های بارگذاری شده ای که به طور مناسب تنظیم شده اند،معرفی شود. اول کد را تعریف می کنیم سپس آن را شرح خواهیم داد. این تابع باید شبیه به این باشد:

<?php
function save_custom_meta_data($id) {

	/* --- security verification --- */
	if(!wp_verify_nonce($_POST['wp_custom_attachment_nonce'], plugin_basename(__FILE__))) {
	  return $id;
	} // end if
	  
	if(defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
	  return $id;
	} // end if
	  
	if('page' == $_POST['post_type']) {
	  if(!current_user_can('edit_page', $id)) {
	    return $id;
	  } // end if
	} else {
   		if(!current_user_can('edit_page', $id)) {
	    	return $id;
	   	} // end if
	} // end if
	/* - end security verification - */
	
	// Make sure the file array isn't empty
	if(!empty($_FILES['wp_custom_attachment']['name'])) {
		
		// Setup the array of supported file types. In this case, it's just PDF.
		$supported_types = array('application/pdf');
		
		// Get the file type of the upload
		$arr_file_type = wp_check_filetype(basename($_FILES['wp_custom_attachment']['name']));
		$uploaded_type = $arr_file_type['type'];
		
		// Check if the type is supported. If not, throw an error.
		if(in_array($uploaded_type, $supported_types)) {

			// Use the WordPress API to upload the file
			$upload = wp_upload_bits($_FILES['wp_custom_attachment']['name'], null, file_get_contents($_FILES['wp_custom_attachment']['tmp_name']));
	
			if(isset($upload['error']) && $upload['error'] != 0) {
				wp_die('There was an error uploading your file. The error is: ' . $upload['error']);
			} else {
				add_post_meta($id, 'wp_custom_attachment', $upload);
				update_post_meta($id, 'wp_custom_attachment', $upload);		
			} // end if/else

		} else {
			wp_die("The file type that you've uploaded is not a PDF.");
		} // end if/else
		
	} // end if
	
} // end save_custom_meta_data
add_action('save_post', 'save_custom_meta_data');

?>

بلوک های جدید کد می کند چندین کار انجام می دهد. نظرات به منظور وضوح بیشتر ارائه شده است، اما اتفاقی که می افتد این است:
• اول، ما مطمئن می شویم که آرایه ی فایل خالی نیست
• بعد، یک آرایه برای پشتیبانی از انواع فایل ها تنظیم می کنیم و تایید می کنیم که فایل بارگذاری شده از همین نوع می باشد
• بعد، برای کپی کردن فایل در سرور ازwp_upload_bits استفاده می کنیم
• در نهایت، اگر هر گونه خطا یی وجود دارد، ما اجرا را متوقف می کنیم و آنها را برای کاربر نمایش می دهیم.
یک تبصره بر روی wp_upload_bits
(http://codex.wordpress.org/Function_Reference/wp_upload_bits). این تابع، یک جایگزین برای wp_handle_upload (http://codex.wordpress.org/Function_Reference/wp_handle_upload) است. تجربه من نشان می دهد کهwp_handle_upload با بعضی تنظیمات خاص سرور، مشکلاتی داشته است به همین دلیل منفی کاذب می دهد. منظورمن از آنچه گفتم این است که ادعا می کند در هنگام بارگذاری فایل مشکلاتی وجود دارد، در حالی که در واقع، فایل بارگذاری شده است.
لینک کردن فایل
در اینجا باید برای ارائه دادن یک لینک به فایل بر روی نوشته هایمان و صفحاتمان آماده باشیم. باشد. در فهرست تم دوهزار و یازده ، دو فایل فایل single.php وpage.php را قرار دهید. هر فایل شامل یک خط کد است که شبیه به این به نظر می رسد:

<?php
get_template_part( 'content', 'single' );
?>

درست زیر آن خط، نیاز داریم که اطلاعات متای پست سفارشی را با انجام این کار درخواست دهیم:

<?php
echo get_post_meta(get_the_ID(), 'wp_custom_attachment', true);  
?>

به طور خاص، این تابع اطلاعات متای پستی را درخواست می دهد که توسطwp_custom_attachment و مرتبط با ID این پست مشخص شده است. واضح است، نه؟ آخرین پارامتر این است که به وردپرس بگوییم که ما نتایج را در فرمت یک رشته می خواهیم (جایگزین در قالب یک آرایه است که فراتر از محدوده ی این آموزش می باشد).
بلوک نهایی کد باید شبیه به این باشد:

<?php
get_template_part( 'content', 'single' );
?>
<?php
echo get_post_meta(get_the_ID(), 'wp_custom_attachment', true);  

?>

حالا تلاش می کنیم که یک فایل برای یک صفحه یا پست بارگذاری کنیم. پست و صفحه را در مرورگر خود بارگذاری کنید. مجوز همه چیز به درستی انجام شده است، متوجه خواهید شد که … اوه … در واقع مسیری در یک فایل ندارید.
به روز رسانی فرم پست
به طور پیش فرض، مشکل این است که عنصر فرم مورد استفاده برای ذخیره همه ی اطلاعات پست ها و داده های مرتبط با آن، نوع فایل را قبول نمی کند. این را می توان با اضافه کردن یک تابع دیگر که به چرخه ی حیات صفحه ی وردپرس هوک می شود حل کرد:

<?php
function update_edit_form() {
    echo ' enctype="multipart/form-data"';
} // end update_edit_form
add_action('post_edit_form_tag', 'update_edit_form');

?>

این کار صفت enctype را به عنصر فرم ویرایشگر پست الحاق می کند، بنابراین بارگذاری فایل ها پشتیبانی نخواهد شد.
حالا بیایید سعی کنیم که دوباره یک فایل را بارگذاری کنیم. پست یا صفحه ی خود را با متا باکس پست سفارشی قرار دهید و برای بارگذاری یک PDF تلاش کنید. اگر همه چیز به خوبی پیش رود، شما باید قادر باشید که به سمت پست و یا صفحه حرکت کنید و URL فایل را مشاهده کنید.
لینک کردن آن
آخرین مرحله آسان ترین مرحله است. در این مرحله، دوباره فایل های single.php وpage.php را ملاقات کنید و فرا خوانده شده را در درخواست اطلاعات متای سفارشی در لنگر، بپوشانید به این کار، آن به این شکل به نظر خواهد رسید:

<?php get_template_part( 'content', 'single' ); ?>
<?php $img = get_post_meta(get_the_ID(), 'wp_custom_attachment', true); ?>
<a href="<?php echo $img['url']; ?>">
	Download PDF Here
</a>

در این مرحله، باید قادر باشد که یک PDF سفارشی را به صفحه ی خود پیوست کنید قرار دهید کاری کنید که یک لینک در پایین محتوای صفحه ظاهر شود که یک لینک دانلود ارائه می دهد. در آموزش بعدی، به این موضوع که چگونه می توانیم ظاهر طراحی شده ی بهتری برای لنگر دانلود و همچنین حذف فایل از صفحه با استفاده ازAPI وردپرس، خواهیم پرداخت.
تا ان زمان، سعی کنید سفارشی کردن متا باکس ها را تجربه کنید و حتی سعی کنید که کارهای بیشتری انجام دهید. برای مثال، برای شامل کردن برچسب های سفارشی به منظور ارائه ی محتوا برای لینک، تلاش کنید.

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

اگر می‌خواهید از آخرین و محبوب‌ترین مقالات ما در ایمیل خود مطلع شوید، همین الان ایمیل خود را در کادر زیر وارد کنید:

تعداد علاقه‌مندانی که تاکنون عضو خبرنامه ما شده‌اند:

331,269 نفر

پاسخی بگذارید

دیدگاه‌های این نوشته جدید ترین ها شاخص

  1. سلام
    چرا آموزش کامل واسه پست تایپ هایی با تایپ مختلف نذاشتید

  2. با سلام
    یعنی نمیشه به جای فایل های pdf فایل هایی با پسوند png یا jpg رو ذخیره کنه
    لطفا راهنمایی فرمایید
    با تشکر

  3. سلام اگه فایل تصویر باشه چکارباید کرد مثلا قرار است ۶ تا اسکرین شات باشه ؟

  4. عالی بود

  5. سلام. خیلی ممنون. فقط یه خواهشی داشتم. اگه ممکنه آموزش ایجاد متاباکس همراه با ادیتور هم اضافه کنیم
    که برای مثال در زیر ادیتور اصلی، یک ادیتور دیگه هم اضافه بشه و مقدار آن در single ظاهر شه.
    چون دنبال این آموزش خیلی گشتم و خوشحال میشم این آموزش را هم اضافه کنید.
    ممنون!

  6. سلام ممنون
    من یه مشکل دارم برای دریافت عکس ضمیمه شده وقتی این رو می نویسم
    $im = get_post_meta($item->ID, ‘wproto_attached_images’);
    ای دی یک متای دیگر از جدول wp_postmeta را نشان میدهد که با مراجعه به جدول متوجه شدم این ای دی هم به یک متای دیگر reference دارد من هنگام ضمیمه کردن عکس به متا باکس از عکس های قبلی attache شده استفاده کردم این که ای دی عکس قبلی رو زخیره کنه شاید منطقی باشه اما چطور میشه از این سیکل در ورد پرس به url عکس رسید ؟
    با تشکر

  7. خیلی مفید بود
    تشکر

  8. سلام
    ممنون خیلی خوب بود
    به سایت ما سر بزنید
    شاد باشید

  9. به درد بخور بود. خیلی ممنون همیار همیشگی 🙂

دوره‌های آموزشی