اضافة اخر المواضيع في الشريط الجانبي (السايدبار) بطريقة احترافية
اليكم اضافة اخر المواضيع في السايدبار بطريقة جديدة وبشكل جديد
السلام عليكم متابعينا اليوم اليكم اضافة جديدة وحصرية لمدونات بلوجر وهي اضافة اخر المواضيع لمدونات بلوجر , اداة اليوم بسيطة وسهلة جدا ولا تحتاج لأي خبرات منك , بطريقة بسيطة ستصبح لديك اضافة جديدة لاخر المواضيع في بلوجر ,
مميزات الاضافة انها لا تبطئ القالب , بدون اكواد ضارة اضافة صورة للموضوع عندما يكون ليس به صور واشياء اخري ستعاينها بنفسك عندما تركب الاضافة في موقعك , قبل الشرح ساريك صور ةالاضافة اولا
هذه صورة معاينة لاضافة اليوم , سنذهب الي
الشرح
قم بفتح التخطيط ثم قم باضافة اداة جديدة في السايدبار وقم باضافة أداة HTML/JavaScript
وبعدها ضع هذا الكود داخل الاداة
<style>
/* CSS Recent Post Gallery Widget */
.recent-grid {padding:0;clear:both;}
.recent-grid:after {content:"";clear:both;display:table;}
.recent-grid .galleryview{position:relative;display:inline-block;margin:6px 0;overflow:hidden;}
.recent-grid .galleryview a{text-decoration:none;float:left;position:relative;margin:0 6px}
.recent-grid .galleryview .ptitle{display:block;background:rgba(0,0,0,.7);clear:left;position:absolute;font-size:9px;line-height:1.3em;text-align:left;bottom:3px;left:3px;right:3px;top:3px;color:#fff;overflow:hidden;padding:5px;word-wrap:break-word;visibility:hidden;opacity:0;backface-visibility:hidden;transition:all .2s}
.recent-grid .galleryview:hover .ptitle{visibility:visible;opacity:1}
.recent-grid a img{background:#fdfdfd;float:left;padding:2px;border:1px solid #e3e3e3;transition:all .3s}
.recent-grid a:hover img {border-color:#bbb;}
</style>
<script type='text/javascript'>
//<![CDATA[
// Recent Post Gallery
function gallerygrid(a){for(var t=a.feed.entry||[],e=['<div class="recent-grid">'],i=0;i<t.length;++i){for(var l=t[i],r=l.title.$t,n=l.media$thumbnail?l.media$thumbnail.url:"http://2.bp.blogspot.com/-4fCf53FqYKM/Vccsy7apoZI/AAAAAAAAK4o/XJkv3RkC0pw/s1600/default%2Bimage.png",s=n.replace("s72-c","s"+recentpost_thumbs+"-c"),h=l.link||[],c=0;c<h.length&&"alternate"!=h[c].rel;++c);var d=h[c].href,m='<img src="'+s+'" width="'+recentpost_thumbs+'" height="'+recentpost_thumbs+'"/>',p=recentpost_title?'<span class="ptitle">'+r+"</span>":"",g='<a href="'+d+'" target="_blank" title="'+r+'">'+m+p+"</a>";e.push('<div class="galleryview">',g,"</div>")}e.push("</div>"),document.write(e.join(""))}
//]]>
</script>
<script>
var recentpost_thumbs = 72;
var recentpost_title = true;
</script>
<script src="/feeds/posts/summary?max-results=9&alt=json-in-script&callback=gallerygrid"></script>
وقم بحفظ التغييرات وسيتم وضع اضافة اخر المواضيع في موقع بكل سهولة
تعليقات
إرسال تعليق