تغير شكل المشاركات الشائعه الي شكل مترو احترافي

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

اليوم اقدم لكم طريقه حصريه لتغير شكل المشاركات الشائعه الي شكل مترو احترافي

مقدم من مدونه Ayana tech حصريا لكم

معاينه الشكل الجديد 

الان نأتي الي تغيير شكلها القديم الي الشكل الجديد

اولا قم بالذهاب الي قالب ثم تحرير Html 

ابحث عن الاكواد القديمه للأداه اذا كان هناك اكواد قديمه لها داخل القالب

قم بحذف اي اكواد لها علاقه بالاداه 

ولمعرفه ذلك ابحث عن 

.PopularPosts

واحذف جميع الاكواد التي لها المعرف نفسه

الان قم بالحث عن 

</haed>

ثم قم بإضافه الكود التالي فوقه

<style>
/*-----------------------------CSS Popular Post--------------*/
.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{margin:0;padding:0;list-style:none;border:none;background:none;outline:none}.PopularPosts ul li img{display:none;margin:2px;margin-left:10px;padding:0;width:60px;height:60px;float:right}.PopularPosts ul li{background-color:#fff;margin:0;padding:0;position:relative;box-shadow:inset 4px 0 0 rgba(255,255,255,0.0);transition:all 0.1s ease-out}.PopularPosts ul li:hover{background:#cf8860;transition:0.5s}.PopularPosts ul li:last-child{border-bottom:none}.PopularPosts ul li .item-title a,.PopularPosts ul li a{font-weight:400;color:#fff;text-decoration:none;transition:all 0.1s ease-in-out}.PopularPosts ul li a:hover{color:#fff!important}.PopularPosts ul li:before{display:none;list-style:none}.PopularPosts .item-thumbnail{display:none;float:left;margin:0 0 0 0}.PopularPosts .item-snippet{display:none;font-size:10px;color:#fff;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.PopularPosts .item-title{padding-bottom:.2em;margin:3px 10px}.profile-img{display:inline;opacity:1;margin:0 0 3px 6px}.PopularPosts .widget-content ul li{padding:.5em 0 .5em 0}.PopularPosts ul li:nth-child(1){margin-top:2px;background:#3498db}.PopularPosts ul li:nth-child(2){margin-top:2px;background:#9b59b6}.PopularPosts ul li:nth-child(3){margin-top:2px;background:#e74c3c}.PopularPosts ul li:nth-child(4){margin-top:2px;background:#FF8032}.PopularPosts ul li:nth-child(5){margin-top:2px;background:#1abc9c}.PopularPosts ul li:nth-child(6){margin-top:2px;background:#3498db}.PopularPosts ul li:nth-child(7){margin-top:2px;background:#9b59b6}.PopularPosts ul li:nth-child(8){margin-top:2px;background:#e74c3c}.PopularPosts ul li:nth-child(9){margin-top:2px;background:#FF8032}.PopularPosts ul li:nth-child(10){margin-top:2px;background:#1abc9c}.PopularPosts ul li:hover:nth-child(even),.PopularPosts ul li:hover:nth-child(odd){background:#DA4A3B}</style><a href='http://ayanatech.blogspot.com'/> 

الان قم بالضغط علي حفظ واذهب الي المعاينه