اضافة مصغرات الصور لووردبريس تلقائيا بدون حقل الخصائص


مصنفة في قسم  : قوالب ووردبريس
كتبت بتاريخ  : 6 أغسطس 2011
عدد المشاهدات  : 
عدد التعليقات  : 30 تعليق 

اضافة مصغرات الصور لووردبريس تلقائيا بدون حقل الخصائص

السلام عليكم ورحمة الله وبركاته

اضافة الصور المصغرة الى التدوينات في الرئيسية قد تكون مرهقة باستعمال حقل الخصائص لجميع التدوينات فمثلا اذا كانت لديك العديد من التدوينات فستضطر الى اضافة حقل خاص لكل تدوينة وهذا سيحتاج من مجهود جبار ولكن دائما ما تكون هناك حلول بالنسبة لهذه المشاكل. مع القليل من البحث وجدت حل لهذه المشكلة

كل عام و انتم بخير بمناسبة حلول شهر رمضان المبارك أعاده الله عليكم بالخير واليمن والبركات ونتمنى لكم دوام الصحة والعافية

في هذا الشرح سنستعمل السكريبت timthumb وقد تحدثنا سابقا عنه في هذه التدوينة كيف تضع مصغرات الصور و سكريبت TimThumb في مدونة الووردبريس وايضا سنستعمل هاك ليساعدنا في هذا الشرح والهاك من موقع WpRecipe get the first post image

الحل وجدته في موقع  Problogdesign الان ننتقل الى شرح طريقة ادراج الصور

تحميل سكريبت TimThumb

قم بتحميل سكريبت timthumb من هنا وضعه في مجلد القالب الذي تود ادراج الصور المصغرة به (TimThumb) او قم بانشاء ملف فارغ باسم timthumb.php وانسخ وانسخ الكود داخله وقم بحفظ الملف

اضافة الهاك لملف خصائص القالب functions.php

الان قم بفتح ملف خصائص القالب functions.php لكي نضيف الهاك بداخله واذا لم يكن لديك ملف خصائص قم بانشاء واحد جديد بعدها قم بلصق الكود  الموجود بالاسفل. هذا الهاك يقوم باخد رابط اول صورة في تدوينتك واستعمالها كصورة مصغرة

<?php
// retreives image from the post
function getImage($num) {
global $more;
$more = 1;
$content = get_the_content();
$count = substr_count($content, '<img');
$start = 0;
for($i=1;$i<=$count;$i++) {
$imgBeg = strpos($content, '<img', $start);
$post = substr($content, $imgBeg);
$imgEnd = strpos($post, '>');
$postOutput = substr($post, 0, $imgEnd+1);
$image[$i] = $postOutput;
$start=$imgEnd+1;

$cleanF = strpos($image[$num],'src="')+5;
$cleanB = strpos($image[$num],'"',$cleanF)-$cleanF;
$imgThumb = substr($image[$num],$cleanF,$cleanB);

}
if(stristr($image[$num],'<img')) { echo $imgThumb; }
$more = 0;
}
//retreive image ends
?>

اضافة كود مصغرات الصور

هنا سنقوم بادراج الكود الذي سيعرض الصور المصغرة في الصفحة الرئيسية. افتح ملف Index.php او home.php على حسب ملفات القالب يجب ادراج الكود داخل the_loop لكي يتم عرضه بشكل جيد بدون مشاكل ويستحسن ان تضعه فوق the_content وهذا الكود

<div class="thumbnail">
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<img src="<?php bloginfo('template_directory'); ?>/timthumb.php?src=<?php getImage('1'); ?>&w=150&h=150&zc=1">
</a>
</div>

هذا الكود سيقوم بانشاء صورة بمقاس 150×150 بيكسل اذا اردت تغير المقاس فما عليك سوى تغيير ‘w’ و ‘h’ من الكود يرجى مراجعة التدوينة كيف تضع مصغرات الصور و سكريبت TimThumb لانه يجب انشاء مجلد cache داخل مجلد القالب واعطائه الصريح 777 او 755 احسن في حالة لم تظهر الصور

اضافة تنسيق لملف الاستايل

هنا يجب عليك اضافة تنسيق لملف الاستايل لعرض الصورة في المكان الذي تريد والتنسيق الذي تحب وهذا كود بسيط لطريقة العرض


.thumbnail a:link, .thumbnail a:visited {display:block; float:left; padding:5px; background:#e2e2e2; width:150px; height:150px; margin:5px 5px 0 0;}
.thumbnail a:hover, .thumbnail a:active {background:#C4C4C4;}

خاتمة

مميزات هذه الطريقة انك لن تحتاج لرفع المزيد من الصور ولن تستعمل الحقول الخاصة. اذا كان هناك اي استفسار يرجى وضع تعليق ؟ ولا تنسى الاشتراك في قائمتنا البريدية ولك جزيل الشكر

اضافة مصغرات الصور لووردبريس تلقائيا بدون حقل الخصائص بواسطة مجلة ووردبريس, يمكنك نقل ومشاركة التدوينة مع ذكر المصدر الأصلي للموضوع ، مع رابطه, والتدوينة مرخصة بموجب المشاع الابداعي Creative Commons A-NC-SA 3.0.

الوسوم : , , , , , , , ,


عدد التعليقات على هذه التدوينة : 30 تعليق

  1. ibrahim نوفمبر 7th, 2011

    بالضبط اخوي معاذ هذا هو اسم الاضافة اللي انت كتبته

    ولا يهمك , وشكرا مره اخرى على هالمدونات المفيدة 🙂

    • معاذ نوفمبر 7th, 2011

      العفو اخي العزيز
      على فكرة اخي ابراهيم الشرح الذي وضعت ينطبق على القوالب التي لا تدعم مصغرات الصور بشكل عام

  2. karim فبراير 15th, 2012

    لو سمحت بالنسبة لملف timthumb.php فهو بيستخدم دالة tempnam .. و الدالة دى خطيرة .. و بعضض السيرفيرات بتمنعها .. فهل يمكن وضع الملف .. و استبدال الدالة بدالة اخرى امنة ؟؟

    • معاذ فبراير 16th, 2012

      اخي ممكن تراسل مبرمج السكريبت ليس لدي خبرة كبيرة في php مع العلم ان السكريبت تم تحديثها اكتر من مرة يعني لو كان يشكل خطورة على السيرفر فلن يستعمله احد واغلب المواقع تفضل استعماله

  3. karim فبراير 16th, 2012

    شكرا اخ معاذ على ردك .. انا بالفعل بقالى اسبوع بحاول اقنع شركة الاستضافة .. انها مش خطيرة بدليل ان الاسكربت متعدل عليه اكثر من مرة !!

    • معاذ فبراير 16th, 2012

      العفو اخي العزيز
      والله يعينك مع تلك الاستضافات التعابنة والحمد لله اني لم اتعامل مع اي استضافة منهم Hostgator ولا اروع

  4. اسامة فبراير 25th, 2012

    يا اخي ما اقول لك الا بارك الله فيك

    فعلا استفدت كثيرا من هده الطريقة

    • معاذ فبراير 26th, 2012

      الله يبارك فيك اخي العزيز

  5. اسامة فبراير 29th, 2012

    اخي معاد الطريقة نجحت معي لكن المشكلة الصور لا تظهر الا ادا كانت مرفوعة على الموقع نفسوا

    يعني لا تظهر ان رفعتها على موقع اخر لرفع الصور

    • معاذ فبراير 29th, 2012

      خليها لبكرة انا تعبان الحين بكرة اضعك لك الطريقة

  6. اسامة فبراير 29th, 2012

    اوكي اخي الكريم

    في انتظارك

    • معاذ مارس 2nd, 2012

      عذرا على التاخير اخي العزيز
      في السطر 124 ستجد

      if(! isset($ALLOWED_SITES)){

      اضف المواقع التي تود استعمال الصور منها
      يستحسن تضيف النطاق بشكل التالي :
      mwordpress.net
      بدون www
      هذا في حالة كنت تود استعمال فقط بعض المواقع اما في حالة العكس اي تستعمل اي صورة خارجية فما عليك سوى تغيير قيمة ALLOW_ALL_EXTERNAL_SITES الى TRUE
      في السطر 33
      هذه التعديلات بخصوص ملف timthumb.php

  7. اسامة مارس 2nd, 2012

    تمام نجحت

    وظهرت مشكلة اخرى الا وهي الصور التي تظهر في الرئيسية لا تظهر في التصنيفات او Catégories

    • معاذ مارس 3rd, 2012

      اخي العزيز لا تنسى تعدل ملف archive.php ايضا
      باستعمال نفس الطريقة التي في الشرح

  8. أنس نوفمبر 24th, 2012

    للتنبيه فانه كان من قبل قد تم اكتشاف ثغرة في TimThumb التي ادت الى اختراق العديد من المواقع التي تعمل على نظام ووردبرس

    شخصيا لا ادري ان كان قد صدر تحديث لـ TimThumb مؤخرا وصحح الخلل الامني، ان كنت قد سمعت به وانت على علم بذلك فهذا الامر جيد وان كان العكس فان اردت سازودك بمعلومات اكثر

    • معاذ نوفمبر 26th, 2012

      ادري اخي بس النسخة التي تتحدث عنها قديمة جدا وقد اصدرت نسخة جديدة وبمميزات احسن من الاول
      انا وضعت رابط للسكريبت المحدث وهو موجود في مكتبة جوجل لسكريبتات

الصفحة 2 من 2»12

  • مجلة الوردبريس
    نوفمبر 26th, 2012




1. المرجوا الابتعاد عن كتابة تعليقات بنمط (يعطيك العافية)، (روعة)، (ممتاز)، (مشكوووور)، (ابداع).

2. زاوية التعليقات هي جزء مكمّل للموضوع الذي قرأته للتو. حاول أن تحصر تعليقك في صلب الموضوع حتى نستثمر هذا التعليق لكسب المزيد من الفائدة سواءً عن طريق مناقشة الموضوع أو عن طريق إضافة معلومات مكمّلة أو إبداء ملاحظات أخرى في نفس السياق.