0 !!اضافة قائمة اخر المواضيع بشكل متحرك بتقنية JQUERY

مرحبا بكم زوارنا على مدونة ربح المال

درسنا اليوم هو بخصوص كيفية إضافة آخر المواضيع على البلوجر مع مصغرات الصور بشكل متحرك – بتقنية jQuery. وتساعد هذه الإضافة على إبقاء الزائر لأطول مدة ممكنة في تصفح مدونتك.

لأنه يتيح لعرض عدد من آخر المواضيع التى تحددها بطريقة متحركة وجميلة

يمكن ملاحظة مثال لهذه الإضافة بمدونة ربح المال

لنشرع الان في تركيب هذه الإضافة على مدونة البلوجر

*1- قم بالدخول على تخطيط القالب ثم اضغط على إضافة أداة واختر HTML/JavaScript

*2- ثم قم بنسخ الكود التالي ولصقه بالمكان المخصص بكود HTML/JavaScript

<script type='text/javascript'> jQuery.noConflict(); </script> <style>img.recent_thumb {padding:1px;width:55px;height:55px;border:0;float:left;margin:0 0 5px 10px;}.recent_posts_with_thumbs {float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:65px;}.recent_posts_with_thumbs a {text-decoration:none;}.recent_posts_with_thumbs strong {font-size:10px;}</style> <script  type="text/javascript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script style='text/javascript' src="http://glitter-text.googlecode.com/files/recentpostticker.js" ></script> <script style='text/javascript' src='http://glitter-text.googlecode.com/files/recentpostswiththumbnailsv3.js'></script> <script style='text/javascript'> var numposts = 15; var showpostthumbnails = true; var displaymore = false; var displayseparator = false; var showcommentnum = false; var showpostdate = false; var showpostsummary = false; var numchars = 100; jQuery(document).ready(function($) {$('#sai').vTicker({ speed: 500, pause: 3000, showItems: 7, animation: 'fade', mousePause: false, height: 0, direction: 'down' });}); </script> <div id="sai"> <script src='http://afkarpro.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script> </div> <a href="http://mrqas.blogspot.com/2012/12/animated-last-posts-jQuery-on-Blogger.html"> Get it here </a>

ملاحظة:

*3- قبل حفظ الإضافة سنقوم ببعض التعديلات على الكود

+ قم بتغيير مايلي : http://mrqas.blogspot.com برابط موقعك أو مدونتك.
+ var numposts = 15 : من هنا يمكنكم التحكم بعدد المواضيع بالتغيير من قيمتها.

+ showItems: 7 : من هنا يمكنك تعديل عدد المواضيع المعروضة بالتغيير من قيمتها.
+ للتحكم فى سرعة حركة المواضيع بما يناسبك قم بالتغيير في القيم التالية : speed: 500,pause: 3000

ملاحظة:

- يستحسن وضع صورة على الأقل في كل موضوع للحصول على مظهرجيد للإضافة.

- تتميزهذه الإضافة بعدم تعارضها مع أي إضافات أخرى على مدونتك.

في الاخير اشكركم الى تدوينات قادمة ان شاء الله تعالى 

مدونة ربح المال