طريقة تعيين الصورة المصغرة لفيديو يوتيوب تلقائيا على ووردبريس

طريقة تعيين الصورة المصغرة لفيديو يوتيوب تلقائيا في ووردبريس

عندما نقوم بنشر مقالة تتوفر على فيديو، عادة ما نقوم بتحرير صورة أو الاستعانة بأحد المواقع لجلب الصورة المصغرة للفيديو واستعمالها كصورة بارزة للمقالة، لكن هذا الموضوع قد يكون مرهق وفيه بعض المضيعة للوقت أليس كذلك؟

الحل هو جلب الصورة المصغّرة للفيديو وتعيينها كصورة بارزة تلقائيا.

في تدوينة سابقة قمت بشرح طريقة تعيين أول صورة في التدوينة كصورة بارزة تلقائيا، هذه المرة سنقوم باستعمال نفس الطريقة تقريبا لكن بدل استعمال أول صورة سنقوم بجلب الصورة المصغرة ﻷول فيديو يوتيوب موجود في المقالة.

اقرأ أيضا: كيفية إضافة عضو ووردبريس جديد برمجيا

جلب الصورة المصغرة لفيديو اليوتيوب

أولا سنقوم بإنشاء دالة باسم sb_get_youtube_thumbnail لجلب الصورة المصغرة لأول فيديو يوتيوب موجود في محتوى المقالة.

/**
* Get video YouTube thumbnail from WordPress post
*
* @param string $content
* @return string $youtube_thumb
* @author Said El Bakkali
*/
function sb_get_youtube_thumbnail( $content ) {

    preg_match('%(?:youtube(?:-nocookie)?\.com/(?:[^/]+/.+/|(?:v|e(?:mbed)?)/|.*[?&]v=)|youtu\.be/)([^"&?/ ]{11})%i', $content , $matches );

    $video_id = ! empty( $matches ) ? $matches[1] : '';

    if ( ! $video_id ) {
        return;
    }

    $remote_headers = wp_remote_head( 'https://img.youtube.com/vi/' . $video_id . '/maxresdefault.jpg' );
    $is_404 = ( 404 === wp_remote_retrieve_response_code( $remote_headers ) );
    $video_thumbnail_url = ( ! $is_404 ) ? 'https://img.youtube.com/vi/' . $video_id . '/maxresdefault.jpg' : 'https://img.youtube.com/vi/' . $video_id . '/hqdefault.jpg';

    return $video_thumbnail_url;
}

ما قمنا به هنا هو البحث داخل محتوى المقالة عن أي رابط يوتيوب باستعمالك تعبير قياسي (Regular Expression) عن طريق الدالة preg_match، بعدها نقوم باستخراج المعرف الوحيد للفيديو (ID) الخاص بالفيديو وبذلك استعماله لجلب الصورة المصغرة.

تعيين الصورة المصغرة لفيديو يوتيوب تلقائيا

المرحلة الثانية هي جعل الصورة المصغرة التي سنقوم بجلبها باستعمال الكودة السابق كصورة مصغرة للمقالة.

اقرأ أيضا: عرض مقالات ذات صلة دون إضافة في ووردبريس

/**
* Upload and set post thumbnail automatically from first video YouTube in the post
*
* @param int $post_id the post ID.
* @param post $post the post object.
* @author Said El Bakkali
*/
function sb_set_youtube_thumbnail( $post_id, $post ) {

    if ( has_post_thumbnail( $post_id ) ) {
        return $post_id;
    }

    if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
        return $post_id;
    }

    if ( wp_is_post_revision( $post_id ) ) {
        return $post_id;
    }

    $video_thumbnail_url = sb_get_youtube_thumbnail( $post->post_content );
    $desc = esc_html__( 'Thumbnail Youtube of: ', 'sb-youtube-thumbnail' ) . get_the_title( $post_id );

    if ( ! empty( $video_thumbnail_url ) ) {
        $attachment_id = media_sideload_image( $video_thumbnail_url, $post_id, $desc, 'id');
    }

    if ( $attachment_id ) {
        set_post_thumbnail( $post_id, $attachment_id );
    }
}

add_action('save_post', 'sb_set_youtube_thumbnail', 10, 2 );

أولا قمنا بالتأكد من عدم تنفيذ الكود في ثلاث حالات:

  • توفر المقالة على صورة بارزة
  • ثانيا في حالة الحفظ التلقائي
  • ثالتا في حالة المراجعات.

بعدها نقو باستخراج رابط الصورة المصغرة لفيديو اليوتيوب من محتوى المقالة، ثم نقوم برفعها على ووردبريس باستخدام الدالة media_sideload_image() وفي الأخير نقوم بتحديد الصورة المرفوعة كصورة بارزة بواسطة الدالة set_post_thumbnail()

بعد إضافة هذه الأوكاد إلى قالبك وحفظ التغييرات، سيتم تعيين الصورة البارزة تلقائيا لكل مقالة تتوفر على فيديو يوتيوب اعتمادا على الصورة المصغرة للفيديو.

اقرأ أيضا: كيفية تخصيص صفحة تسجيل الدخول في ووردبريس

أتمنا أن تكون قد استفدت من الموضوع، إن كان لديك أي استفسار أو تساءل المرجو تركه من خلال التعليقات.

هابي كودينغ 🙂

close

قم بالتسجيل على قائمتي البريدية لكي تكون من الأوائل في الحصول على تدوينات وشروحات حصرية

أنا لا أرسل أبدا البريد المزعج! اقرأ سياسة الخصوصية لمزيد من المعلومات.

4 تعليقات

  1. السلام عليكم
    اشكرك استاذ سعيد على هذه المقالة..
    لدي سؤال.. وهو أنه فرضاً المقالة تحتوي على الفيديو، ولكني اريد استخدام صورة مصغرة خاصة بالمقالة ولا تتعلق بالفيديو لأنه الفيديو يعتبر اضافة توضيحية بالمقال وليس اساس التدوينة
    فكيف يمكن تصغير حجم الفيديو تلقائيا؟

    سؤال اخر ولكنه خارج الموضوع:
    كيف يمكنني وضع التنسيق الشجري لمكان التدوينة حسب التصنيف وليس حسب التاريخ كما هو واضح بأعلى تدوينتك:
    “حاليا تتواجد في:الرئيسية / شروحات ووردبريس / طريقة تعيين الصورة المصغرة لفيديو يوتيوب تلقائيا في ووردبريس”

    1. و عليكم السلام أخت خلود

      فيما يخص السؤال اﻷول، إذا كنت تريدين وضع صورة بارزة مختلفة فقط عليك تعيينها قبل نشر المقالة، و حتى إذا كنت قد نشرتها و تم رفع و تعيين صورة فيديو اليوتوب كصورة بارزة يمكنك تغييرها وقتما أردت.

      فيما يخص السؤال الثاني، لقد عاينت موقعك و أظن أنه مبني على قالب مهاراتي أليس كذلك؟

      التحكم فيما ذكرته يتغير حسب القالب و طريقة تطويره ، فقط اتصلي بصاحب قالب مهاراتي و هو سيوافيك بالحل مباشرة.

      أنا لم أستعمل ذلك القالب من قبل لهذا لا أستطيع إفادتك.

      شكرا لك على الزيارة و التعليق.

اترك تعليقًا

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