13 فبراير 2015

مدون محترف اضافات بلوجر jQuery اداة مواضيع مقترحة احترافية

اداة مواضيع مقترحة احترافية

آداة مواضيع مقترحة عشوائية تعرض على الزائر مع خاصية الإنزلاق و يمكنك التحكم بعدد المواضيع التي يتم عرضها و يمكنك عرض مواضيع قسم معين

 آداة مواضيع مقترحة عشوائية تعرض على الزائر مع خاصية الإنزلاق بحيث يمكنك التحكم بعدد المواضيع التي يتم عرضها ايضا يمكنك عرض مواضيع قسم معين و تستطيع تنسيق الاداة من حيث الحجم يمكنك الإطلاع على الآداة عبر زر المعاينة التالي

طريقة التركيب


  1. ادخل لوحة تحكم المدونة
  2. انقر فوق قالب
  3. انقر على تحرير HTML

ابحث عن الوسم التالي ]]></b:skin> و اضف الكود التالي فوقه
 .related-posts-widget{position:fixed;bottom:80px;right:0;display:none}
.related-posts-widget h2{color:#555;margin:0;padding:3px 6px 3px 0;font-weight:300;font-size:26px;font-family:inherit}
ul.rpw{list-style-type:none!important;margin:0;padding:0}
ul.rpw li{width:322px;overflow:hidden;margin:0;position:relative;list-style-type:none!important}
ul.rpw a{text-decoration:none;outline:0}
ul.rpw img{border:0;width:100%;height:auto;margin-bottom:-4px}
ul.rpw strong{background:#59a5d9;color:#fff;z-index:5;line-height:1.2em!important;position:absolute;bottom:0;left:0;right:0;height:auto;padding:4px 8px;font-weight:400;font-size:14px;font-family:inherit}
ul.rpw a strong{display:none}
ul.rpw a:hover strong{display:block}
.ani-dur{-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-ms-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:1s;-moz-animation-duration:1s;-ms-animation-duration:1s;animation-duration:1s;}
@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}
100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}
100%{opacity:1;-webkit-transform:none;transform:none}}
.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}

الان ابحث عن الوسم </body> و اضف الكود التالي فوقه
 <b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
(function(c){c.fn.relatedPostsWidget=function(s){if(!this.size())return this;s=c.extend({},c.fn.relatedPostsWidget.defaults,s);return this.each(function(){var k=c(this),z=0,g=null,p=null,t=0,q=0,l=-1,n=-1,u=-1,r=null,v=0,w=null,A="",b=s,F=function(){if(!((l+1)*b.show_n>=q&&!b.animate_loop))if(!v){c("li",g).eq(n).fadeOut(b.exit_time,B);b.show_n>1&&c("li",g).slice(n+1,u).fadeOut(b.exit_time)}},B=function(){if(g.parent().size()){l++;if(l*b.show_n>=q)l=0;n=l*b.show_n;u=(l+1)*b.show_n;c("li",g).eq(n).animate(r,
b.enter_time,"linear",C);b.show_n>1&&c("li",g).slice(n+1,u).animate(r,b.enter_time)}},C=function(){w&&clearTimeout(w);w=setTimeout(F,b.stay_time)},G=function(){r={};r[b.animate]="show";g.bind("mouseenter",function(){v=1}).bind("mouseleave",function(){v=0;C()});B()},x=function(){if(!(t||!g)){b.loading_class&&g.removeClass(b.loading_class);b.max_posts&&b.tags.length&&c("li:gt("+(b.max_posts-1)+")",g).remove();q=c("li",g).size();b.tags.length&&b.timeout&&b.max_posts&&c("img",g).each(function(){var d=
c(this);d.attr("rel")&&d.attr("src",d.attr("rel"))});if(b.show_n==0)c("li",g).show();else q&&G();t=1}},E=function(d){if(!t){z++;if(d.feed.entry){if(!g){k.html("");if(b.tags.length==0)b.recent_title&&c("<h2>"+b.recent_title+"</h2>").appendTo(k);else b.related_title&&c("<h2>"+b.related_title+"</h2>").appendTo(k);g=c('<ul class="rpw '+b.loading_class+'"></ul>').appendTo(k)}for(var i=0,o=d.feed.entry.length;i<o;i++){var e=d.feed.entry[i],h;a:{var f=0;for(h=e.link.length;f<h;f++)if(e.link[f].rel=="alternate"){h=
e.link[f].href;break a}h=""}f=e.title.$t;e=e.media$thumbnail?e.media$thumbnail.url:b.thumb_default;if(h!=A||b.tags.length==0)a:{var j=h,m=f,H=e;if(b.tags.length>0){e=c("li",g);f=0;for(var I=e.length;f<I;f++){var y=c("a",e.eq(f));h=D(y);if(y.attr("href")==j){j=y;m=++h;j.attr("score",m);b.post_score_class&&j.attr("class",b.post_score_class+m);for(j=f-1;j>=0;j--){m=c("a",e.eq(j));if(D(m)>h){f-j>1&&e.eq(j).after(e.eq(f));break a}}f>0&&e.eq(0).before(e.eq(f));break a}}}e=j;f=m;h=H;if(b.thumb_size!="s72-c")h=
h.replace("/s72-c/","/"+b.thumb_size+"/");j=b.tags.length&&b.timeout&&b.max_posts?"rel":"src";g.append('<li style="display:none"><a href="'+e+'" title="'+f+'">'+(b.thumbs&&h?"<span><img alt='thumbnail post' "+j+'="'+h+'" title="'+f+'"/></span>':"")+(b.titles?"<strong>"+f+"</strong>":"")+"</a></li>")}}}if(z>=b.tags.length){p&&clearTimeout(p);x()}}},D=function(d){d=parseInt(d.attr("score"));return d>0?d:1},J=function(){if(!b.tags){b.tags=[];c('a[rel="tag"]:lt('+b.max_tags+")").each(function(){var e=c.trim(c(this).text().replace(/\n/g,
""));if(c.inArray(e,b.tags)==-1)b.tags[b.tags.length]=e})}var d=b.blog_url+"/feeds/posts/summary/";if(b.tags.length==0){if(b.timeout)p=setTimeout(x,b.timeout);c.ajax({url:d,data:{"max-results":b.max_posts,alt:"json-in-script"},success:E,dataType:"jsonp",cache:true})}else{if(b.timeout)p=setTimeout(x,b.timeout*b.tags.length);for(var i=0,o=b.tags.length;i<o;i++)c.ajax({url:d,data:{category:b.tags[i],"max-results":b.posts_per_tag,alt:"json-in-script"},success:E,dataType:"jsonp",cache:true})}};(function(){var d=
k.attr("data-options");if(!d){var i=k.html().replace(/\n|\r\n/g,"");if(i)if((i=i.match(/<!--\s*(\{.+\});?\s*--\>/))&&i.length==2)d=i[1]}if(d){if(d.indexOf("{")<0)d="{"+d+"}";try{b=eval("("+d+")")}catch(o){a.html('<b style="color:red">'+o+"</b>");return null}b=c.extend({},c.fn.relatedPostsWidget.defaults,b)}if(b.post_page_only?location.pathname.match(/^\/\d{4}\/\d\d\/[\w\-\_]+\.html/):true){A=location.protocol+"//"+location.host+location.pathname+(b.url_querystring?location.search:"");J()}})()})};
c.fn.relatedPostsWidget.defaults={blog_url:"http://www.mudwnp.blogspot.com/",max_posts:5,max_tags:5,posts_per_tag:5,tags:false,loading_class:"rpw-loading",related_title:"Related Posts",recent_title:"نوصي بقرائة الموضوع التالي",post_score_class:"",post_page_only:0,thumb_default:"",thumb_size:"s72-c",thumbs:1,titles:1,url_querystring:0,timeout:1500,show_n:0,stay_time:5E3,enter_time:200,exit_time:200,animate:"opacity",animate_loop:1}})(jQuery);jQuery(document).ready(function(){jQuery("div.related-posts-widget").relatedPostsWidget()});
$(window).scroll(function(){if ($(this).scrollTop()>1000){$('.related-posts-widget').fadeIn();}else{$('.related-posts-widget').fadeOut();}});
//]]>
</script>
<div class="related-posts-widget ani-dur fadeInRight">
<!-- {
    thumb_size:'s320'
,max_posts:5
,show_n:1
} -->
</div>
</b:if>

التنسيق 


قم بتغيير رابط مدونتي
غير الكلمات التي باللون الاحمر بما يناسبك
سوف يتم عرض الصور المصغرة للمواضيع الاخيرة بعرض 320px و الطول سوف يكون مختلف من صورة لصورة على حسب حجم الصور في المواضيع إذا اردت جعل كل الصور بحجم واحد قم بتغيير height:auto إلى height:160px

اي سؤال او استفسار لا تترد بوضع تعليق

مواضيع ذات صلة
اداة مواضيع مقترحة احترافية
4 / 5
بواسطة

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

  1. شكرا لك اخي ولكن هل من الممكن اضافة موضوع لكيفية عمل تأثير على الصور مثل الموجود في هذا القالب الذي من تطويركم قالب http://minima3-red.blogspot.com/ قالب minima3 مع فائق الشكر :)

    ردحذف
    الردود
    1. إن شاء الله يا غالي يتم عمل موضوع مثل هذا في وقت قريب بسبب كثرة الطلبات الموجودة
      و الشكر لله =r

      حذف
  2. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
    الردود
    1. مرورك الرائع اخي الكريم
      ولكن لا ننشر روابط و طبعا نتشرف بزيارة مدونتك
      و تم التعليق بها بالتوفيق
      ولكن اعذرني سوف يتم مسح التعليق بسبب الرابط

      حذف
  3. اخي الاداة مش شغالة عندي

    ممكن حل !!

    ردحذف
    الردود
    1. قد يكون القالب الخاص بك
      او هناك اضافة متعارضة معها
      او إنك اضفت الاكواد بشكل خاطيء

      حذف
  4. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
    الردود
    1. اعتذر منك يا غالي
      لمسح التعليق
      لا ننشر روابط إشهار
      تم زيارة المدونة و التعليق بها
      فهي مدونة جميلة
      اتمنى لك التوفيق

      حذف
  5. شكرا ياغالى ع الاضافه جمييله جدا بالتوفيق

    ردحذف

يسعدنا تفاعلكم بالتعليق , لكن يرجى مراعاة الآداب العامة وعدم نشر روابط إشهار حتى ينشر التعليق , ويمكنك ان تستخدم الإبتسامات بالوقوف عليها لمعرفة الكود. اولا تضع الـ = بعدها الحرف الخاص بالإبتسامة
=q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r