مرحبا بكم زوار ومتابعي مدونة عفريت بلوجر في هذا الدرس الجديد و الجميل للتزين مدوناتكم بخلفيات متعدّدة من إختيارك (صورك ، أو صور مفضلة أو أخرى تعبر عن مدونتك..) كل هذا يجعل مدونتك رائعة و أنيقة لأن الصور تتغير كل مرة تقوم بالدخول لموضوع أخر في صفحة أخرى أو عند تحديث الصفحة.
تابعوا معي الشرح البسيط جدا نضيف فقط كود (سكريبت) لمدونتك ونضع روابط الصور التي نريدها و تكون قد أنجزت الإضافة لمدونتك
توجه للوحة إدارة مدونتك ثم إلى تحرير قالب HTML مدونتك و ابحث عن الوسم
</head>
قم بنسخ الكود التالي وضعه قبله مباشرة
<script type='text/javascript'>
var images= new Array()
images[0]="http://3.bp.blogspot.com/-OENBFU6XEj8/U0LoF2ucDtI/AAAAAAAAHt8/n-LvqjzgVxs/s1600/Books.jpg"
images[1]="http://2.bp.blogspot.com/-GHntsusS2Bc/U0LoFZRhU9I/AAAAAAAAHts/xzSWgCmKpM8/s1600/maroc.jpg"
images[2]="http://4.bp.blogspot.com/-GwQIan_43CA/U0LoFvy0FaI/AAAAAAAAHtw/spk5MQSN6js/s1600/Study.jpg"
var random=Math.floor(3*Math.random());
document.write("<style>");
document.write("body {");
document.write(' background:url("' + images[random] + '") repeat;');
document.write(" }");
document.write("</style>");
</script>
var images= new Array()
images[0]="http://3.bp.blogspot.com/-OENBFU6XEj8/U0LoF2ucDtI/AAAAAAAAHt8/n-LvqjzgVxs/s1600/Books.jpg"
images[1]="http://2.bp.blogspot.com/-GHntsusS2Bc/U0LoFZRhU9I/AAAAAAAAHts/xzSWgCmKpM8/s1600/maroc.jpg"
images[2]="http://4.bp.blogspot.com/-GwQIan_43CA/U0LoFvy0FaI/AAAAAAAAHtw/spk5MQSN6js/s1600/Study.jpg"
var random=Math.floor(3*Math.random());
document.write("<style>");
document.write("body {");
document.write(' background:url("' + images[random] + '") repeat;');
document.write(" }");
document.write("</style>");
</script>
قم بتغيير الروابط باللون الأحمر بروابط الصور التي تريد ظهورها في الخلفية
يمكنك زيادة عدد الصور الذي تظهر كل مرة في مدونتك بزيادة سطور إضافية للصور وهذا مثال أنا وضعت 3 صور في الكود يمكنك أن تقوم بزيادة السطور في الكود أسفل هذا السطر
images[2]="http://4.bp.blogspot.com/-GwQIan_43CA/U0LoFvy0FaI/AAAAAAAAHtw/spk5MQSN6js/s1600/Study.jpg"
images[3]="http://4.bp.blogspot.com/-GwQIan_43CA/U0LoFvy0FaI/AAAAAAAAHtw/spk5MQSN6js/s1600/Study.jpg"
images[4]="http://4.bp.blogspot.com/-GwQIan_43CA/U0LoFvy0FaI/AAAAAAAAHtw/spk5MQSN6js/s1600/Study.jpg"
images[5]="http://4.bp.blogspot.com/-GwQIan_43CA/U0LoFvy0FaI/AAAAAAAAHtw/spk5MQSN6js/s1600/Study.jpg"
و لا تنسى تغيير الأرقام باللون الأزرق بالترتيب في كل سطر
ليست هناك تعليقات
إرسال تعليق