شرح إستخدام الحقول الخاصة في ووردبريس – yourcolor
شرح إستخدام الحقول الخاصة في ووردبريس
إحدى الخواص الهامة التي توفرها ووردبريس و التي تهمنا نحن كمصممين .. فهي تمنحنا القدرة على زيادة خواص التدوينات و اضافة خواص كثيرة للقوالب التي نقوم بتصميمها … سأشرح في هذه التدوينة فكرة و طريقة عملها و كيفية إستغلالها في تصميم القوالب مع شرح مثال بسيط لإنشاء مصغرات للتدوينات بإستخدامها ..
مواقع إستخدمت فيها الحقول الخاصة …
متابعات عقبة إظهار فيديو في السايد بار الجانبي
مجموعة تايم كود إظهار صور مصغرة بجانب التدوينات
مدونة شبايك عن شبايك في فوتر المدونة للتحكم فيها من لوحة التحكم
حسناً لنبدأ …
من لوحة تحكم المدونة ومن صفحة اضافة تدوينة جديدة ستجد في الاسفل .. صندوق ” خصائص إضافية ” او ” Custom fields ” .. سنقوم بإنشاء حقل جديد … في مثالنا هنا سنقوم بإضافة حقل لإستخدامة لوضع رابط مرجع التدوينة .. سنضع في حقل الاسم (key) اسم هذا الحقل وليكن في مثالنا references و في حقل القيمة (value) سنضع رابط هذا المرجع وليكن http://ar.wikibooks.org .. لا تنسى الضغط على زر “ اضف حقل مخصص ” … شاهد الصورة :
الأن إلى القوالب …
لنتعرف على شكل الدالة التي سنستخدمها :
get_post_meta($post_id, $key, $single);
و تأخذ ثلاث بارامترات ..
$post_id : معرف التدوينة ID
$key : إسم الحقل الذي تريد إستخدامه
$single : وتأخذ إحدى القيمتين :
true لعرض أول حقل عند إستخدام اكثر من حقل بنفس الأسم
false لعرض الحقول كمصفوفة كما سنشرح لاحقا
حسنا داخل حلقة عرض التدوينة أضف التالي :
<h3>مراجع التدوينة</h3> <?php echo get_post_meta($post->ID, "references",true); ?>
$post->ID : لجلب المعرف الخاص بالتدوينة .. ID
references : إسم الحقل الخاص الذي أضفناه
true : لا أملك سوى حقل references و حيد و بالتالي اريد عرضه هو فقط …
احفظ القالب و اذهب و شاهد التدوينة .. ستجد http://ar.wikibooks.org/ ظهرت في نهاية التدوينة … كما في الصورة
ما رأيك أن نجعلها كرابط بدلاً من ظهورها كنص .. إستخدم التالي :
<h3>مراجع التدوينة</h3> <?php $references = get_post_meta($post->ID, "references",true); ?> <a href="<?php echo $references ?>"><?php echo $references ?></a>
الأن أصبح لدينا رابط لمرجع التدوينة … لنفرض الأن أن لدينا تدوينة لم أقم بإضافة مراجع لها … سيظهر في نهاية التدوينة ” مراجع التدوينة “ دون أن يظهر تحتها أي مراجع لاني لم اقم باضافتها .. لاخفاء ” مراجع التدوينة “ عند عدم وجود مراجع سنستخدم شرط if للتحقق من وجود مراجع أم لا … شاهد الكود
<?php if(get_post_meta($post->ID, "references", $single = true)!="") :?> <h3>مراجع التدوينة</h3> <?php $references = get_post_meta($post->ID, "references",true); ?> <a href="<?php echo $references ?>"><?php echo $references ?></a> <?php endif; ?>
تدوينة متعددة المراجع !
الأن نريد اضافة أكثر من مرجع للتدوينة .. من لوحة التحكم من جديد قم بإضافة المراجع الأخرى و بنفس key أو الإسم وهو references الأن إلى القوالب من جديد .. في هذه الحالة سنستخدم foreach لجلب كافة الحقول الاضافية التي تحمل الاسم references … شاهد الكود :
<?php if(get_post_meta($post->ID, "references", $single = true)!="") :?>
<h3>مراجع التدوينة</h3>
<?php $references_field = get_post_meta($post->ID, "references",false);
foreach ( $references_field as $references ) { ?>
<a href="<?php echo $references ?>"><?php echo $references ?></a> <br />
<?php } endif; ?>
احفظ القالب و قم بمعاينة التدوينة ستجد بقية المراجع قد ظهرت
لنقوم بعمل تطبيق صغير على الدرس .. تطبيقنا هنا هو اضافة صورة مصغرة للتدوينة تظهر بجوارها في الصفحة الرئيسية و في الأرشيف بينما لا تظهر مثلا في صفحة العرض الكامل للتدوينة …
من لوحة التحكم وكما شرحنا سابقاً قم باضافة حقل جديد وليكن بإسم post-image ثم نضع في القيمة عنوان الصورة .. في قالب index.php و archive.php و search.php و قبل سطر إستدعاء الدالة the_content سنقوم بإضافة الكود التالي :
<?php if(get_post_meta($post->ID, "post-image", $single = true)!="") :?>
<div>
<?php $post_image = get_post_meta($post->ID, "post-image",true); ?>
<img src="<?php echo $post_image ?>" alt="" />
</div>
<?php endif; ?>
و هذا هو كود CSS الذي أستخدمته في المثال الموجود في الصورة بالأعلى :
.post-image{
float:left;
margin:0 10px 0 10px;
padding:2px;
border:1px #CCC solid;
}
إذا اردت أن تظهر الصورة المصغرة في صفحة عرض التدوينة مفردة فاضف الكود أيضاً في القالب single.php و إذا اردت إستخدمها مع الصفحات فأضف الكود لقالب page.php
هناك دوال أخرى غير الدالة التي شرحتها ولكنها كلها تقوم بنفس الوظيفة مع اختلافات بسيطة في طريقة الاستخدام .. يمكنك مراجعة صفحة الحقول الخاصة على WordPress Codex
التغذية
تويتر
فيسبوك
يوتيوب
الاكاديمية العربية لفنون التصميم و تعليم الجرافيك 
يجب عليك تسجيل الدخول لكتابة تعليق.