-->

اضافة زر تحميل المزيد من المواضيع المطور

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

التصفح بها والبحث عن اى موضوع وايجادة
وقد طرح قبل ذلك عدة مواضيع مثل موضوع اليوم 
هو اضافة التمرير الأنهائى لمدونات بلوجر ولاكن وجد بعض المدونين لايجبون 
الأضافة والسسب هو عند وضع ادات خاصة بالمدونة فى الفوتر لايستطيع او يلحق الزائر 
بالنقر عليها اومشاهدتها بسبب التمرير لآنهائى
ثم وجدت تطور الموضوع وتم طرح زر بديل للأضافة لاكن يتعارض مع بعض القوالب 
وشكلة الجمالى ليس بنسبة كثيرة 
فبعد البحث الكثير توصلت الى اضافة متميزة ورائعة 
زر تحميل المزيد من المواضيع بشكل مطور وجميل وليس بة اى مشاكل
تستطيع [معاينة] من هنا ستجدة اسفل المواضيع
ملحوظة :اذا كان يوجد ترقيم بالمدونة يجب حذفة حتى لايتعارض مع الأضافة

شرح الكود وتركيبه

نبحث عن الوسم 
]]></b:skin>
ثم نقوم بأضافة هذا الكود قبلة او فوقة اعلى منة
.loadmore{text-align:center;display:block}
.loadmore a{background-color:#5562F8;color:#fff;padding:8px 30px;display:inline-block;border-radius:3px}
.loadmore .fa{margin-left:10px}
.loadmore a:hover{background-color:#111}

تنسيق الكود 

اللون المحدد بالأزرق>>لون خلفية الزر الثابتة
اللون المحدد بالأحمر>>لون الخط الخاصة بالأضافة
اللون المحدد بالأخضر>>لون خلفية الاضافة عند الوقوف عليها بالسهم

الخطوة الثانية

نقوم بالبحث عن الوسم 
</head>
ثم نقوم باضافة هذا الكود فوقة=اعلى منة


<script src='//code.jquery.com/jquery-1.10.2.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
$('.post-home img').attr('src', function(i, src) {return src.replace( 's72-c', 's640' );});
$('.post-home img').attr('src', function(i, src) {return src.replace( '/default.jpg', '/mqdefault.jpg' );});
});
/*
* Plugin Name: Resize Image to Parent Container
*
* Author: Christian Varga
* Author URI: http://christianvarga.com
* Plugin Source: https://github.com/levymetal/jquery-resize-image-to-parent/
*
*/
// Infinite Scrolling
(function(e){function f(t){e.getScript("http://"+t+".disqus.com/blogger_index.js")}function l(){if(s){return}s=true;if(!n){r.hide();return}r.find("a").hide();r.find("img").show();e.ajax(n,{dataType:"html"}).done(function(t){var o=e("<div></div>").append(t.replace(a,""));var u=o.find("a.blog-pager-older-link");if(u){n=u.attr("href")}else{n="";r.hide()}var l=o.find(i).children();e(i).append(l);e(document).ready(function(){e(".post-home img").attr("src",function(e,t){return t.replace("s72-c","s640")});e(".post-home img").attr("src",function(e,t){return t.replace("/default.jpg","/mqdefault.jpg")})});(function(e){e.fn.resizeToParent=function(t){function n(e){e.css({width:"",height:"","margin-left":"","margin-top":""});var n=e.parents(t.parent).width();var r=e.parents(t.parent).height();var i=e.width();var s=e.height();var o=i/n;if(s/o<r){e.css({width:"auto",height:r});i=i/(s/r);s=r}else{e.css({height:"auto",width:n});i=n;s=s/o}var u=(i-n)/-2;var a=(s-r)/-2;e.css({"margin-left":u,"margin-top":a})}var r={parent:"div",delay:100};var t=e.extend(r,t);var i;var s=this;e(window).on("resize",function(){clearTimeout(i);i=setTimeout(function(){s.each(function(){n(e(this))})},t.delay)});return this.each(function(){var t=e(this);t.attr("src",t.attr("src"));t.load(function(){n(t)});if(this.complete){n(t)}})}})(jQuery);e(document).ready(function(){e(".post-thumbnail img").resizeToParent()});e(document).ready(function(){e(".thumb-load").remove()});if(window._gaq){window._gaq.push(["_trackPageview",n])}if(window.gapi&&window.gapi.plusone&&window.gapi.plusone.go){window.gapi.plusone.go()}if(window.disqus_shortname){f(window.disqus_shortname)}if(window.FB&&window.FB.XFBML&&window.FB.XFBML.parse){window.FB.XFBML.parse()}if(window.twttr&&window.twttr.widgets&&window.twttr.widgets.load){window.twttr.widgets.load()}r.find("img").hide();r.find("a").show();s=false})}function c(){return Math.max(o.height(),u.height(),document.documentElement.clientHeight)}function h(){var e=c();var t=o.scrollTop()+o.height();if(e-t<0){l()}}function p(){if(_WidgetManager._GetAllData().blog.pageType=="item"){return}n=e("a.blog-pager-older-link").attr("href");if(!n){return}var i=e('<a href="javascript:;"><i class="fa fa-spin fa-circle-o-notch"></i> تحميل المزيد من الموضوعات</a>');i.click(l);var s=e('<img src="'+t+'" style="display: none;">');o.scroll(h);r=e('<div class="loadmore"></div>');r.append(i);r.append(s);r.insertBefore(e("#blog-pager"));e("#blog-pager").hide()}var t="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIHhlM5oWpZBi75iTQxaUbdbA6BkFWJw53lINDwGlRPaIbn6toJ_3VDaA80jGRmQNyhSEGc9Nog3WQN5HRLUg7T0hYNquoUHkh6nCrn3mtOz1s0WtcAbTAs3mYNocj5AmulkqjPKPrclH-/s1600/ajax-loader+(2).gif";var n="";var r=null;var i="div.blog-posts";var s=false;var o=e(window);var u=e(document);var a=/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi;e(document).ready(p)})(jQuery);
//]]>
</script>

تنسيق الكود 

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

هناك تعليق واحد :

=a= =b= =c= =d= =e= =f= =g= =h= =j= =k= =l= =m= =n= =o= =p= =q= =w= =x= =y= =z=