Skip to main content

كيف تعرض الصورة البارزة بواسطة TimThumb

بواسطة معاذ أشملي- wait... مشاهدة/ 9 تعليق
كيف تعرض الصورة البارزة بواسطة TimThumb
2017-02-12

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

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

تحميل TimThumb

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

اولا نقوم بتحميل اخر اصدار من السكريبت من Timthumb ورفعه الى مجلد القالب الذي تستعمل

http://sitename.com/wp-content/themes/your-theme-name/resize.php
لا تقم بتغيير اي شيئ في هذا الملف فقط قم برفعه الى مجلد القالب الذي تستعمل

متطلبات عمل Timthumb

لكي يعمل لك السكريبت timthumb بشكل جيد تحتاج القيام ببعض الامور

  1. انشاء مجلد cache داخل مجلد القالب وقم باعطائه التصريح 777
  2. انشاء ملف index.html وقم باعطائه التصريح 777
  3. انشاء ملف timthumb_cacheLastCleanTime.touch قم باعطائه التصريح 777
  4. انشاء ملف htaccess لحماية مجلد الكاش بالنسبة لهذا الملف قم باضافة الاكواد التالية :
php_flag engine off
Options -ExecCGI
AddHandler cgi-script .php .php5 .php4 .php3 .pl .py .jsp .asp .htm .shtml .sh .cgi .gif .jpg .jpeg .png .phtml

دمج TimThumb مع القالب :

بالنسبة لاستعمال timthumb لعرض الصورة البارزة سنقوم بعمل دالة لتبسيط الامر كما هو مستعمل للصور البارزة الافتراضية كل ما عليك هو اضافة الكود ادناه الى ملف functions.php

  1. المتغيير width هو عرض الصورة
  2. المتغيير height هو ارتفاع الصورة
  3. المتغيير class اذا اردت اضافة كلاس خاص بالتنسيقات css
  4. المتغيير postid هو رقم المقالة اتركه كما هو موضح في الكود ادناه
  5. المتغيير quality هذا لتغيير جودة الصورة القيمة من 1 الى 100 يستحسن تركه في 100 لعرض الصور البارزة بجودة عالية

بعد اضافة الى ملف functions.php كل ما تحتاجه لعرض البارزة هو عرضها بالشكل التالي :

show_thumb(300, 150, 'img-responsive', $post->ID, 100);

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

تعيين الصورة البارزة لـ Timthumb

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

set thumbnail - مجلة ووردبريس

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

اعداد روابط صديقة لمحركات البحث لـ Timthumb

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

ولكي ابسط الامر عليك قم بتحميل الملف media وقم بفك ضغطه على جهازك ثم قم برفع المجلد media الى مجلد ووردبريس الرئيسي ليصبح على الشكل التالي :

/media
/wp-admin
/wp-content
/wp-includes
...

بعد رفعه قم بتغير صلاحيات الملفات والمجلدات الموجودة داخل مجلد resizer حسب الصلاحيات التي ذكرنا فوق في متطلبات العمل الان تحتاج الى تعديل ملف ال htacces التالي :

/media/.htaccess

وتغيير الرابط التالي http://sitename.com الى رابط موقعك ولا تنسى تغيير http الى https اذا كنت تستعمل ssl هذا مثال على كود htaccess

الى هنا نكن قد انتهينا من طريقة ادراج الصور البارزة بواسطة السكريبت Timthumb والى اللقاء في تدوينة جديدة انشاء الله

اذا كان هناك اي استفسار يرجى وضع تعليق

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

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

التعليقات9 تعليقات

المرجوا الانتظار لتحميل التعليقات...
عرض التعليقات
اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *


شروط التعليق :

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

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