اضافة اخر مواضيع المدونة بشكل جديد واحترافي


إضافة اخر مواضيع لمدونات بلوجر إضافة بشكل جديد  تظهر اخر تدوينات  في شريط منقلب
 طريقة التركيب 


انتقل إلى لوح تحكم مدونتك،
إختر "تخطيط" ثم إضافة أداة ,ثم اختر HTML/Javascript
والآن الصق داخل المستطيل الكود التالي 





<style type="text/css" >

#spylist-widget {
    overflow: hidden;

    margin-top: 5px;

    padding: 0px 0px;
    height: 385px;


    font-family:calibri;

}
#spylist-widget ul {
    width: 295px;
    overflow: hidden;
    list-style-type: none;
    padding: 0px 0px;
    margin: 0px 0px;
}
#spylist-widget li {
    width: 282px;
    padding: 5px 5px;
    margin: 0px 0px 5px 0px;
    list-style-type: none;
    float: none;
    height: 80px;
    overflow: hidden;
    background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_6zQM49MA7jWpUMZ9faKEeiQmqJQ4-N2h3Li63JM643ls5LRir5UXkETHUxhzYQqUJHYcnQ98xADOrAP6CWqYvvLWD1CUv3Ln19yqGxUTfHHCZ35vsBbKCRQ_xws6-S8ijcEvp98FF5U/s320/latesthack.com-.jpg) repeat-x;
    border: 1px solid #ddd;
}
#spylist-widget li a {
    text-decoration: none;
    color: #4B545B;
    font-size: 15px;
    height: 18px;
    overflow: hidden;
    margin: 0px 0px;
    padding: 0px 0px 2px 0px;
}
#spylist-widget img {
    float: left;
    margin-top: 5px;
    margin-right: 15px;
    background: #EFEFEF;
    border: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    padding: 4px;
    background: #eee;
    background: -webkit-gradient(linear, left top, left bottom, from(#eee), color-stop(0.5, #ddd), color-stop(0.5, #c0c0c0), to(#aaa));
    background: -moz-linear-gradient(top, #eee, #ddd 50%, #c0c0c0 50%, #aaa);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 3px rgba(0,0,0,.7);
    -moz-box-shadow: 0 0 3px rgba(0,0,0,.7);
    box-shadow: 0 0 3px rgba(0,0,0,.7);
}
#spylist-widget img:hover {
    -moz-transform: scale(1.2) rotate(-350deg);
    -webkit-transform: scale(1.2) rotate(-350deg);
    -o-transform: scale(1.2) rotate(-350deg);
    -ms-transform: scale(1.2) rotate(-350deg);
    transform: scale(1.2) rotate(-350deg);
    -webkit-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);
    -moz-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);
    box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);
}
.spydate {
    overflow: hidden;
    font-size: 10px;
    color: #0284C2;
    padding: 2px 0px;
    margin: 1px 0px 0px 0px;
    height: 15px;
    font-family: Tahoma,Arial,verdana, sans-serif;
}
.spycomment {
    overflow: hidden;
    font-family: Tahoma,Arial,verdana, sans-serif;
    font-size: 10px;
    color: #262B2F;
    padding: 0px 0px;
    margin: 0px 0px;
}
</style>
<script language='JavaScript'> 
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyPVBPBB7HVcVSBWVH_9G_NEbP-K5oQmfqpNSdOlqnPfIzINFlkuMv3RJV9ltwpiWE8FsXoqEdztcR2RFj4bHglkeoqNNacWlTJJEKXYfIM6uo2V002xIGJNhoKqb4GiU7MWtkEQnBIyM/s1600/defaultimage.jpg";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyPVBPBB7HVcVSBWVH_9G_NEbP-K5oQmfqpNSdOlqnPfIzINFlkuMv3RJV9ltwpiWE8FsXoqEdztcR2RFj4bHglkeoqNNacWlTJJEKXYfIM6uo2V002xIGJNhoKqb4GiU7MWtkEQnBIyM/s1600/defaultimage.jpg";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyPVBPBB7HVcVSBWVH_9G_NEbP-K5oQmfqpNSdOlqnPfIzINFlkuMv3RJV9ltwpiWE8FsXoqEdztcR2RFj4bHglkeoqNNacWlTJJEKXYfIM6uo2V002xIGJNhoKqb4GiU7MWtkEQnBIyM/s1600/defaultimage.jpg";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyPVBPBB7HVcVSBWVH_9G_NEbP-K5oQmfqpNSdOlqnPfIzINFlkuMv3RJV9ltwpiWE8FsXoqEdztcR2RFj4bHglkeoqNNacWlTJJEKXYfIM6uo2V002xIGJNhoKqb4GiU7MWtkEQnBIyM/s1600/defaultimage.jpg";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyPVBPBB7HVcVSBWVH_9G_NEbP-K5oQmfqpNSdOlqnPfIzINFlkuMv3RJV9ltwpiWE8FsXoqEdztcR2RFj4bHglkeoqNNacWlTJJEKXYfIM6uo2V002xIGJNhoKqb4GiU7MWtkEQnBIyM/s1600/defaultimage.jpg";
imgr[5] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyPVBPBB7HVcVSBWVH_9G_NEbP-K5oQmfqpNSdOlqnPfIzINFlkuMv3RJV9ltwpiWE8FsXoqEdztcR2RFj4bHglkeoqNNacWlTJJEKXYfIM6uo2V002xIGJNhoKqb4GiU7MWtkEQnBIyM/s1600/defaultimage.jpg";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 60;
thumbheight = 60;fntsize = 9;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
"home_page = "http://libya-web.blogspot.com;
limitspy=5;
intervalspy=4000;
</script>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'></script>
<center><div id="spylist-widget">
<script src='http://latest-hacks.googlecode.com/svn/gadgets/scrollingrecentposts/scrollingrecentposts.js' type='text/javascript'></script></center>
</div>



  • والان الخطوة الأهم : يجب عليك تبديل عنوان المدونة باللون الاحمرhttp://libya-web.blogspot.com بعنوان مدونتك
  • لتغيير طول الاضافه height: 385px
  • لتغيير عرض القطعةwidth: 295px;؛ width: 282px؛
  •  لتغيير حجم الخطfntsize
  • لتغيير اللون - acolor 
  • لتغيير سمك الخط - aBold
  • numposts = 10; هذه القيمة تمثل عدد المواضيع التي يمكن تؤيتها .
  • لتغييرسرعة الانزلاق للقطعه،   intervalspy = 4000

وبالاخير أتمنى أن تنال إعجابكم وأنتظر تشجيعاتكم

2 comments

avatar

رائع جدا اخى
بالتوفيق