اضافة قائمة مسندلة لعرض فيديوهات على بلوجر videos blogger menu

بسم الله الرحمن الرحيم

مرحبا بكم في مدونة مسطرة التعليمية ... و اليوم درسنا عن اضافة لمدونات بلوجر و الاضافة عبارة عن قائمة منسدلة لعرض الفيديوهات بطريقة سهلة علي مدونة بلوجر و لا تاخذ مكان من الموضوع و تمكنك هذه الاضافة من عرض 50 فيديو أو أكثر في مساحة صغيرة جدا و انسب مكان لها ان توضع في جانب المدونة.

ناتي لصورة الاضافة

طريقة التركيب اتبع الخطوات التالية:

1- سجل دخولك الي بلوجر

2- اضغط علي تخطيط ثم اضافة اداة ثم اختيار اضافة كود HTML

3- اضافة الكود التالي:

<!--by-Ayoub Etmaiti- slide bar youtube -->

<script type="text/javascript">

function MostrarVideo(idYouTube)

{

var contenedor = document.getElementById('divInnerVideo');

if(idYouTube == "")

{

contenedor.innerHTML = "";

}

else

{

var dimensiones = "width='420' height='315' frameborder='0'";

var url = "http://www.youtube.com/embed/" + idYouTube;

contenedor.innerHTML = "<iframe " + dimensiones + " src='"+ url +"'></iframe>";

}

}

</script>

<div style="margin:20px 0px;">

<select id="sVideos" onchange="MostrarVideo(this.value);">

<option value="" selected="selected">[إختر الفيديو المراد عرضه...]</option>

<option value="lOYBSSP64S4">عنوان الفيديو</option>

<option value="lOYBSSP64S4">-عنوان الفيديو-</option>

</select>

</div>

<div id="divInnerVideo"></div>

<!--by-Ayoub Etmaiti- slide bar youtube -->

4- ثم اضغط حفظ ثم حفظ الترتيب.

و بعد ذلك نقوم بالاتي:

1- قم بتغيير "عنوان الفيديو" ذات الون الازرق الي عنوان الفيديو الذي تريد ان يظهر به في القائمة المنسدلة المضافة.

2-قم بتغيير الكلمة lOYBSSP64S4 ذات اللون الاحمر الي الكلمة الموجودة برابط الفيديو بمعني مثلا لو كان رابط الفيديو مثل ذلك:

http://www.youtube.com/watch?v=lOYBSSP64S4 ,سوف تقوم باضافة ما باخر الرابط ،اي ما لون باللون الاحمر.

3- قم بتغيير " إختر الفيديو المراد عرضه" و هي عنوان القائمة المنسدلة الي ما تريده.

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

شارك هذا المنشور