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

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

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

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

اولا قم بالذهاب الي قالب ثم تحرير 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='https://metlaoui-tunisia.blogspot.com/'/>

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