تقديم مجموعة من الشروحات والمواضيع التي تهم بالحاسوب والانترنت من حيث الاستخدام والانشاء والتصميم والحماية، مع الاهتمام بمدونات بلوجر ومواقع التواصل الاجتماعي خصوصا فيسبوك وتويتر

النشرة البريدية @

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

دروس، شرح، طريقة، بلوجر

تحتوي هذه المقالة على ما يلي

السلام عليكم.
أقدم لكم أداة آخر المواضيع من تطويري.
لهذه الأداة المتميزة الرائعة عدة مزايا:
ـ تتيح لزوار المدونة التعرف على آخر المواضيع بسهولة وأينما كانوا من صفحات المدونة.
ـ يمكنك اختيار عدد المواضيع الذي يتم عرضها.
ـ تتيح عرض أكبر عدد ممكن من آخر المواضيع في مساحة صغيرة لكونها متحركة... ومزايا أخرى ...

الطريقة:

1 - من Blogger إذهب إلى التخطيط => إضافة أداة => HTML/JavaScript
2 - أضف هذا الكود:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:265px;
}
#spylist ul{
width:300px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:288px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:50px;
overflow: hidden;
background:#fff url() repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:12px;
font-family:Tahoma,Arial,verdana, sans-serif;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}

.spydate{
overflow:hidden;
font-size:0px;
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:0px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

    <script language='javascript'>
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 50;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://www-se.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
    <script src='http://scriptabufarhan.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script></div>
<div dir="rtl" style="text-align: right;" trbidi="on">
<div dir="ltr" style="text-align: left;">
<span style="font-size: xx-small;">by <a href="http://www-se.blogspot.com/" target="_blank">Servnet</a></span></div>
</div>

3 - تعديل اللون الأحمر برابط مدونتك.
4 - إمكانية تعديل  numposts = 10 بعدد التدوينات المراد عرضها.
5 - إمكانية تعديل width:300px و  width:288px بالعرض المناسب.
6 - اضغط حفظ ... هنيئا لك :) 

ليست هناك تعليقات :

أضف تعليق

free tracking