07-04-2019, 07:27 PM | #1 |
تاريخ التسجيل: Feb 2019
العمر: 38
المشاركات: 1,149
التقييم: 10
|
تاريخ التسجيل: Feb 2019
العمر: 38
المشاركات: 1,149
التقييم: 10
طريقة عرض الصورة البارزة بواسطة TimThumb
سنتطرق الى شرح طريقة عرض الصورة البارزة باستعمال TimThumb هذا السكريبت مع اانه تم التخلي عن دعمه مؤخرا الا انه لازال يعمل بشكل جيد لعرض الصور البارزة عكس الطريقة التي يستعملها ووردبريس التي تبدوو لي ليست بالجيدة من ناحية انشاء مصغرات الصور بجودة عالية
تحميل TimThumb المرجوا اعادة تحميل السكريبت لمن استعمله سابقا لانه قد تم انزال ترقيع ضروري منذ فترة ونسيت التنبيه لهذا الامر في التدوينة واسف على هذا التاخير اولا نقوم بتحميل اخر اصدار من السكريبت من TimThumb ورفعه الى مجلد القالب الذي تستعمل http://sitename.com/wp-content/themes/your-theme-name/resize.phpلا تقم بتغيير اي شيئ في هذا الملف فقط قم برفعه الى مجلد القالب الذي تستعمل متطلبات عمل Timthumb لكي يعمل لك السكريبت TimThumb بشكل جيد تحتاج القيام ببعض الامور
بالنسبة لاستعمال TimThumb لعرض الصورة البارزة سنقوم بعمل دالة لتبسيط الامر كما هو مستعمل للصور البارزة الافتراضية كل ما عليك هو اضافة الكود ادناه الى ملف functions.php Failed loading gist https://gist.github.com/d79a75f8ba0d...1d98b8ff.json: error
show_thumb(300, 150, 'img-responsive', $post->ID, 100);حتى ابسط الامر عليك هذا استعلام لعرض اخر المقالات في ووردبريس يبقى مثال فقط لطريقة استعمال دالة عرض الصورة البارزة بواسطة timthumb // The Loop while ( have_posts() ) : the_post(); ?> <div class="hentry"> <h2 class="entry-title"> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> </h2> <div class="thumbnail"> <?php show_thumb(300, 150, ‘img-responsive’, $post->ID, 100); ?> </div> <p><?php the_content(”); ?></p> </div> <?php endwhile; تعيين الصورة البارزة لـ Timthumb بالنسبة لتعين الصورة البارزة فهو كالطريقة العادية للوردبريس يتم تعين الصورة من صفحة تحرير المقالة على الجهة اليسرى من صفحة تحرير المقالة تجد مربع بالشكل التالي : قم بالضغط على تعيين صورة بارزة بعد ذالك ستظهر لك نافدة اختر منها الصورة التالي تريد من مكتبة الوسائط او قم برفع صورة جديدة اعداد روابط صديقة لمحركات البحث لـ Timthumb هذه الطريقة تحتاج تعديل على الكود الذي استعملنا فوق سيصبح بالشكل التالي : <?php function show_thumb($width, $height, $class, $postid, $quality) { if ( has_post_thumbnail() ) { $img = wp_get_attachment_image_src( get_post_thumbnail_id($postid), 'full' ); $url = $img['0']; echo '<img class="'.$class.'" src="'.home_url().'/media/resizer/'.$width.'x'.$height.'/r/'.remove_path($url).'" alt="'. get_the_title($postid).'" height="'.$height.'" width="'.$width.'" />'; } } function remove_path($url = ”) { if ($url == 'http://' OR $url == 'https://'){ return $url; } $url = parse_url($url); $url = explode('/', $url['path']); $url = array_slice($url, -3, 3, false); $url = $url['0'].'/'.$url['1'].'/'.$url['2']; return $url; } ?> ولكي ابسط الامر عليك قم بتحميل الملف media وقم بفك ضغطه على جهازك ثم قم برفع المجلد media الى مجلد ووردبريس الرئيسي ليصبح على الشكل التالي : /media /wp-admin /wp-content /wp-includes ... بعد رفعه قم بتغير صلاحيات الملفات والمجلدات الموجودة داخل مجلد resizer حسب الصلاحيات التي ذكرنا فوق في متطلبات العمل الان تحتاج الى تعديل ملف ال htacces التالي : /media/.htaccess وتغيير الرابط التالي http://sitename.com الى رابط موقعك ولا تنسى تغيير http الى https اذا كنت تستعمل ssl هذا مثال على كود htaccess <IfModule mod_rewrite.c> RewriteEngine On RewriteBase /media/ RewriteRule ^resizer/(.*)x(.*)/r/(.*) resizer/resize.php?src=http://sitename.com/wp-content/uploads/$3&h=$2&w=$1&zc=0&s=1 </IfModule> الى هنا نكن قد انتهينا من طريقة ادراج الصور البارزة بواسطة السكريبت TimThumb والى اللقاء في تدوينة جديدة انشاء الله المصدر: منتديات رحيل لكل العرب - من قسم: قسم تطوير المواقع ومحركات البحث والسيو Seo والووردبريس WordPress |
اقتباس |
أضف رد جديد |
الذين يشاهدون محتوى الموضوع الآن : 1 ( الأعضاء 0 والزوار 1) | |
|
|
المواضيع المتشابهه | ||||
الموضوع | كاتب الموضوع | المنتدى | مشاركات | آخر مشاركة |
معجزات سورة الفاتحة | admin | قسم القرآن الكريم | 1 | 28-07-2019 04:23 AM |
ضبط إعدادات الشحن (Shipping) لمتجرك الإلكتروني على منصة WooCommerce | مهرة النجدية | قسم تطوير المواقع ومحركات البحث والسيو Seo والووردبريس WordPress | 1 | 22-07-2019 06:58 PM |
طريقة تساعدك ان تجعل فيسبوك يختار الصورة الصحيحة عند مشاركة المقالات | raheel | قسم تطوير المواقع ومحركات البحث والسيو Seo والووردبريس WordPress | 0 | 07-04-2019 06:43 PM |
ما هي طريقة إنشاء إضافة جيكويري تجعل الصورة Fullscreen | raheel | قسم تطوير المواقع ومحركات البحث والسيو Seo والووردبريس WordPress | 0 | 07-04-2019 06:15 PM |
كيف يمكن تحسين صورة للوصول الى النتائج الاولى في محرك بحث الصور؟ | raheel | قسم تطوير المواقع ومحركات البحث والسيو Seo والووردبريس WordPress | 0 | 13-03-2019 04:52 PM |