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

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

في هذ التدوينة سنتطرق الى شرح طريقة عرض الصورة البارزة باستعمال 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

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

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

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

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

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

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

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

/media/.htaccess

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

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

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

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