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

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

طريقة الإضافة

اذهب إلى المدونة ç التخطيط ç إضافة أداة ç HTML/JavaScript

ثم قم بنسخ الكود التالي ولصقه

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script> <style type="text/css"> #post-gallery {width:100%; margin:0px auto;font:normal 11px Arial,Sans-Serif;color:##000000;padding:8px; text-align:right;} #post-gallery .rp-item {float:left;display:inline; position:relative; margin:2px; padding:0px 0px; background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDJRCKHbkSIL_uBAWgHGTmhJDth7BzDCgvb3fN14t9OIBW6C8wWCc5pHhuPEkqrSOyUnUgqwq-_e0qGNEDpJ_4f6RZlM7OO5RwQW8n8WMBTNa6ymjJUnIgo47ROGMrnxIHvz84TpLaMdce/s1600/LOAD+(66).gif') no-repeat 50% 50%; width:79px; height:79px;} #post-gallery .rp-item img { width:69px; height:69px; border:none !important; margin:0px 0px !important; padding:0px 0px !important; background:transparent !important; display:none;} #post-gallery .rp-item img:hover{-moz-transform: scale(1.2) rotate(-350deg);-webkit-transform: scale(1.2) rotate(-350deg);-o-transform: scale(1.2) rotate(-350deg);-ms-transform: scale(1.2) rotate(-350deg);transform: scale(1.2) rotate(-350deg);-webkit-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);-moz-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);} #post-gallery .rp-item .rp-child { position:relative; top:10%!important; left:10%!important; z-index:1000; width:200px; background-color:white; border-bottom:5px solid #1BA1E2; -webkit-box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7); -moz-box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7); box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7); padding:10px 15px; overflow:hidden; word-wrap:break-word; display:none; opacity: 0.9;} #post-gallery .rp-item .rp-child h4 { font-size:12px; text-align:right; margin:0px 0px 5px; color:#1BA1E2;} #post-gallery .rp-item:hover .hidden {display:block;}</style> <script type="text/javascript"> var rpTitle = "", // عنوان الإضافة numposts = 18, // عدد المشاركات المعروظة numchar = 100, // عدد أحرف مقتطف الموضوع rcFadeSpeed = 600, // السرعة pBlank = "http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif", blogURL = "http://www.tiqniatpro.com/"; // رابط موقعك أو مدونتك </script> <script src="http://files.allbloggertricks.com/Scripts/abt-recent-posts.js" type="text/javascript"></script>

واستبدل http://www.tiqniatpro.com برابط موقعك أو مدونتك

ثم حفظ الأداة واذهب للمعاينة