أخر المقالات
تحميل...

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


السلام عليكم ورحمة الله وبركاته


قدمنا لكم في مواضيع سابقة عن إضافة آخر المواضيع لمدونات بلوجر بشكل تلقائي لكن اليوم موضوعنا هو نفس المواضع السابقة عن أكواد أخر المشاركات أو آخر التدوينات, لكن بشكل جديد رائع يعرض الصور بحجم أكبر ومعتمة مع إضافة النص في وسط الصورة مما يعطيها شكل جميل وحديث كما أنها تتحرك حوالي كل 7 ثواني لتظهر المواضيع الأقدم منها

مثال حي عن الكود:
معاينة


كيفية الإضافة إلى مدونتك

إذهب إلى لوحة تحكم مدونتك -->> تخطيط -->> ثم أنقر على إضافة أداة ثم أختر من بين الأداوت أداة HTML/JavaScript

ثم ألصق الكود التالي داخل الأداة:

<center>
<div id="featuredpostside"></div>
<script type="text/javascript">function FeaturedPostSide(a){(function(e){var h={blogURL:"",MaxPost:4,idcontaint:"",ImageSize:100,interval:5000,autoplay:false,loadingClass:"loadingxx",pBlank:"http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif",MonthNames:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],tagName:false};h=e.extend({},h,a);var g=e(h.idcontaint);var d=h.MaxPost*200;g.html('<div class="sliderx"><ul class="abt-sidebar-slider"></ul></div><div class="buttons"><a href="#" class="prevx">prev</a><a href="#" class="nextx">next</a></div>');var f=function(w){var q,k,m,u,x,p,t,v,r,l="",s=w.feed.entry;for(var o=0;o<s.length;o++){for(var n=0;n<s[o].link.length;n++){if(s[o].link[n].rel=="alternate"){q=s[o].link[n].href;break}}if("media$thumbnail" in s[o]){u=s[o].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+h.ImageSize+"-c")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.ImageSize+"$1")}k=s[o].title.$t;r=s[o].published.$t.substring(0,10);m=s[o].author[0].name.$t;x=r.substring(0,4);p=r.substring(5,7);t=r.substring(8,10);v=h.MonthNames[parseInt(p,10)-1];l+='<li><a target="_blank" href="'+q+'"><div class="overlayx"></div><img class="random" src="'+u+'"/><h4>'+k+'</h4></a><div class="label_text"><span class="date"><span class="dd">'+t+'</span> <span class="dm">'+v+'</span> <span class="dy">'+x+'</span></span> <span class="autname">'+m+"</span></div></li>"}e("ul",g).append(l).addClass(h.loadingClass)};var c=function(){e(h.idcontaint+" .nextx").click()};var b=function(){e.get((h.blogURL===""?window.location.protocol+"//"+window.location.host:h.blogURL)+"/feeds/posts/summary"+(h.tagName===false?"":"/-/"+h.tagName)+"?max-results="+h.MaxPost+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.idcontaint+" .prevx").click(function(){e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));return false});e(h.idcontaint+" .nextx").click(function(){e(h.idcontaint+" .sliderx li:last").after(e(h.idcontaint+" .sliderx li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));e(h.idcontaint+" .sliderx").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingClass)},d)};e(document).ready(b)})(jQuery)};</script>
<script type='text/javascript'>
//<![CDATA[
FeaturedPostSide({
blogURL:"http://mdadalgled.blogspot.com/",
MaxPost:4,
idcontaint:"#featuredpostside",
ImageSize:300,
interval:5000,
autoplay:true,
tagName:false
});
//]]>
</script>
<style scoped="" type="text/css">
/*
by madad2.com
*/
#featuredpostside {
height: 500px;
overflow: hidden;
}
ul.abt-sidebar-slider * {
    -moz-box-sizing: border-box;
}
ul.abt-sidebar-slider {
    font: 11px 'Open Sans',sans-serif;;
}
ul.abt-sidebar-slider, ul.abt-sidebar-slider li {
    list-style: none outside none;
    margin: 0;
    padding: 0;
    position: relative;
}
ul.abt-sidebar-slider {
    height: 1000px;
    width: 100%;
}
ul.abt-sidebar-slider li {
    display: none;
    float: left;
    height: 25%;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 100%;
}
ul.abt-sidebar-slider li:nth-child(1), ul.abt-sidebar-slider li:nth-child(2), ul.abt-sidebar-slider li:nth-child(3), ul.abt-sidebar-slider li:nth-child(4) {
    display: block;
}
ul.abt-sidebar-slider li:nth-child(2) {
    left: 0;
    top: 50%;
}
ul.abt-sidebar-slider img {
    border: 0 none;
    height: 100%;
    width: 100%;
}
ul.abt-sidebar-slider .overlayx, ul.abt-sidebar-slider li {
    transition: all 0.4s ease-in-out 0s;
}
ul.abt-sidebar-slider li:nth-child(4) {
    left: 0;
    top: 75%;
    width: 100%;
}
ul.abt-sidebar-slider li:nth-child(3) {
    left: 0;
    top: 25%;
}
ul.abt-sidebar-slider .overlayx {
    background-color: rgba(0, 0, 0, 0.5);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
}
ul.abt-sidebar-slider .overlayx, ul.abt-sidebar-slider img {
    border-radius: 3px 3px 3px 3px;
    margin-top: -5px;
}
ul.abt-sidebar-slider .overlayx:hover {
    opacity: 0.1;
}
ul.abt-sidebar-slider h4 {
   color: white;
font-family: 'Open Sans',sans-serif;
font-size: 16px;
font-weight: bold;
line-height: 1.5em;
margin: 0;
padding: 0px;
position: absolute;
left: 5%;
top: 40%;
width: 90%;
z-index: 2;
background: rgba(0, 0, 0, 0.4)url(http://4.bp.blogspot.com/-5BAxq07aDQA/UgdY3Mk8spI/AAAAAAAAB84/ElxocGOzgYA/s1600/Opacity.png)
}
ul.abt-sidebar-slider .label_text {
    bottom: 10px;
    color: white;
    font-size: 90%;
    left: 10px;
    position: absolute;
    z-index: 2;
}

.buttons {
    margin: 5px 0 0;
}
.buttons a {
    display: inline-block;
    height: 25px;
    position: relative;
    text-indent: -9999px;
    width: 15px;
}
.buttons a:before {
    border-color: transparent #535353 transparent transparent;
    border-style: solid;
    border-width: 8px 7px;
    content: "";
    height: 0;
    left: 50%;
    margin-left: -10px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
    width: 0;
}
.buttons a.nextx:before {
    border-color: transparent transparent transparent #535353;
    margin-left: -3px;
}
.date {
  background: none repeat scroll 0 0 #004489;
bottom: 218px;
padding: 8px;
position: relative;
right: 10px;
border-top-left-radius: 5px;
}
.autname {
background: none repeat scroll 0 0 #004489;
top: -3px;
padding: 8px;
position: relative;
left: 138px;}
</style>
</center>
التخصيص:
غير http://mdadalgled.blogspot.com/ برابط مدونتك
عدد المشاركات MaxPost:4 يمكنك تغيير الرقم 


13 تعليق على " إضافة كود آخر المشاركات لمدونات بلوجر شكل جديد متحرك مع التخصيص "

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

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

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

وأنت بألف خير شكرا لك اخي الكريم

أخي كل ماتحب معرفته عن اداوت مشرفي المواقع موجود هنا
https://support.google.com/webmasters/?hl=ar
لا تحتاج شرحي

انا اسف لاطالتى معك لكن انا لا استطيع ان اثبت ملكيتى للموقع الذى اكتبه
ممكن شرح الطريقة الموصى بها فى ادوات مشرف المواقع

الموصى بها: تحميل ملف HTML تحميل ملف HTML إلى موقعك على الويب.

1. نزل ملف التحقق من خلال HTML هذا. [google38bd7f697e3a801a.html]

2. حمّل الملف إلى ‪http://aks-android.blogspot.com/‬

3. أكد التحميل الناجح عن طريق زيارة ‪http://aks-android.blogspot.com/google38bd7f697e3a801a.html‬ في المتصفح.

4. انقر على التحقق أدناه.

للحفاظ على التحقق، لا تزل ملف HTML، حتى بعد نجاح عملية التحقق.

انا عايز شرح ازاى اعمل البتاعة دى
وازاى حمّل الملف إلى ‪http://aks-android.blogspot.com/‬

من المفترض إذا كنت تستخدم بلوجر أن تضاف أي مدونة تلقائيا على حسابك
لكن إذا تعذر عليك اضف موقعك ثم أختر طرق بديلة ثم علامة HTML ثم انسخ الكود وقم بإضافته أسفل الرمز <head> بعد ذلك إضغط على حفظ القالب ثم إضغط على تأكيد في أداوت مشرفي المواقع

يظهر لى
تعذر التحقق من موقعك: ‪http://aks-android.blogspot.com/‬
وانا عملتها وسيبتها نص ساعة وبعدين يظهر لى تعذر التحقق من موقعك

مدونتك غير موجودة يا أخي

اها صح
انا اسف على الازعاج
انا كنت غيرت رابط المدونة

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

واياك اخي حسان
لا يمكن تخصيص فهو سكربت يعرض حسب التغذية

تذكر قوله تعالى:
(( مَا يَلْفِظُ مِنْ قَوْلٍ إِلَّا لَدَيْهِ رَقِيبٌ عَتِيدٌ)) ‏
-----------------------------------
الان يمكنك اضافة اي مقطع فيديو الى التعليقات وايضا اضافة الصور فقط ضع رابط الصور او مقطع الفيديو في التعليقات
----------------------------------
آرائكم تسعدنا, لمتابعة التعليق حتى نرد عليك فقط ضع إشارة على إعلامي

نحن نعرض الإعلانات على الموقع للإسهام في تحسين موقعنا.

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

شكرًا لك

×