Youtube تراند
عرض آخر الفيديوهات الإخبارية بطريقة API
إذا كنت تمتلك مدونة على منصة بلوجر وتريد عرض فيديوهات متعلقة بأخبار معينة أو مواضيع محددة على المدونة بشكل تلقائي من يوتيوب، فأنت في المكان المناسب!.
و في هذا الموضوع البسيط ، سوف اقوم بالشرح لك أداة لعرض الفيديوهات من يوتيوب باستخدام YouTube API وطريقة تضمينها في مدونتك بخطوات بسيطة.
ما هي YouTube API؟
YouTube API هي واجهة برمجية تتيح للمطورين الوصول إلى ميزات يوتيوب مثل البحث عن الفيديوهات، عرض التفاصيل، والتحكم في تشغيل الفيديوهات، من خلال برمجيات خارجية مثل المواقع أو التطبيقات. باستخدام هذه الواجهة، يمكنك البحث عن الفيديوهات المتعلقة بموضوع معين وعرضها مباشرة في مدونتك.
كيفية إعداد واستخدام السكريبت في بلوجر
الخطوة 1: الحصول على مفتاح YouTube API
- توجه إلى Google Cloud Console.
- قم بإنشاء مشروع جديد (إذا لم يكن لديك مشروع سابق).
- ابحث عن خدمة YouTube Data API v3 وقم بتفعيلها.
- انتقل إلى قسم API & Services وقم بإنشاء مفتاح API (API Key) لحسابك. ستستخدم هذا المفتاح في سكريبت جلب الفيديوهات.
الخطوة 2: كتابة سكريبت جلب الفيديوهات
بمجرد الحصول على مفتاح YouTube API.
يمكنك استخدام السكريبت التالي لعرض الفيديوهات في مدونتك:
<!DOCTYPE html>
<html>
<head>
<title>فيديوهات الأخبار</title>
</head>
<body>
<h2>أحدث فيديوهات الأخبار:</h2>
<div id="videoList"></div>
<script>
const API_KEY = 'YOUR_YOUTUBE_API_KEY'; // استبدل هذا بالمفتاح الخاص بك
const searchQuery = 'latest news'; // يمكنك تغيير هذا النص إلى أي موضوع تريده، مثل 'رياضة' أو 'تكنولوجيا'
const url = `https://www.googleapis.com/youtube/v3/search?part=snippet&q=${searchQuery}&type=video&key=${API_KEY}&maxResults=5`;
fetch(url)
.then(response => response.json())
.then(data => {
const videoList = document.getElementById('videoList');
data.items.forEach(item => {
const videoId = item.id.videoId;
const videoTitle = item.snippet.title;
const videoIframe = `
<h3>${videoTitle}</h3>
<iframe width="560" height="315" src="https://www.youtube.com/embed/${videoId}"
frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
`;
videoList.innerHTML += videoIframe;
});
})
.catch(error => {
console.error('حدث خطأ أثناء جلب الفيديوهات:', error);
});
</script>
</body>
</html>
الخطوة 3: تضمين السكريبت في مدونة بلوجر
- قم بتسجيل الدخول إلى حساب بلوجر الخاص بك.
- افتح منشورًا جديدًا أو قم بتحرير منشور موجود.
- انتقل إلى وضع HTML في المحرر.
- انسخ وألصق الكود أعلاه داخل محرر HTML.
- تأكد من استبدال
'YOUR_YOUTUBE_API_KEY'بمفتاح YouTube API الذي حصلت عليه في الخطوة الأولى. - يمكنك تغيير searchQuery إلى أي موضوع تريده، على سبيل المثال "أخبار التكنولوجيا"، "أخبار الرياضة"، أو أي موضوع آخر.
- اضغط على نشر.
كيف يعمل السكريبت؟
يعتمد السكريبت على واجهة برمجية من يوتيوب لجلب فيديوهات تتعلق بالموضوع المحدد في متغير searchQuery.
و بعد الانتهاء من جلب البيانات، يتم إنشاء قائمة من الفيديوهات داخل الصفحة باستخدام تكنولوجيا iframe لتضمين الفيديوهات بشكل مباشر.
يمكنك تعديل عدد الفيديوهات المعروضة عبر تعديل maxResults إلى القيمة التي تناسبك (على سبيل المثال، يمكنك جلب 10 فيديوهات بدلاً من 5).
ما هي فوائد استخدام هذه الأداة API_KEY
- تحديث تلقائي: بدلاً من البحث يدويًا عن الفيديوهات، تقوم الأداة بجلب أحدث الفيديوهات المتعلقة بالموضوع المحدد تلقائيًا.
- تفاعل الزوار: عرض الفيديوهات على مدونتك يشجع على تفاعل الزوار وزيادة وقت بقائهم على الصفحة.
- سهولة التضمين: باستخدام بضعة أسطر من الكود، يمكنك عرض فيديوهات يوتيوب مباشرة في مدونتك دون الحاجة إلى إضافة الفيديوهات يدويًا.
نصيحة أخيرة
لا تنس مراقبة استهلاك YouTube API الخاص بك، حيث أن لكل مفتاح حدًا معينًا للاستخدام اليومي.
إذا واجهت أي مشكلة أو استفسار بخصوص هذه الأداة، لا تتردد في طلب المساعدة!
