تغيير شكل المشاركات الشائعة V1

لسلام عليكم مرحبا بكم متتبعي المدونة اليوم اقدم لكم شكل للمشاركة الشائعة يكون احترافي

قبل التركيب لا تنسى حذف الاكواد الأولى

ضع هذه الاكواد فوق ال

<script type='text/javascript'>
//<![CDATA[
function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || "all" }) }
loadCSS("//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css");loadCSS("https://cdn.rawgit.com/abdelalilebbihi/techabdou/fe375e69/abdou-neo.css");
//]]>
</script>
<style>
/* Popular Post */
.popular-posts ul li:first-child .item-thumbnail{width:100%;background:#000;margin:0;height:200px;overflow:hidden}
.popular-posts ul li .item-snippet{display:none}
.popular-posts ul li:first-child .item-thumbnail img{height:200px}
.popular-posts ul li:first-child{margin-bottom:-10px}
.popular-posts ul li:first-child .item-thumbnail a{opacity:.5;padding:0;margin:0}
.popular-posts ul li:first-child .item-title a{position:absolute;width:inherit;bottom:13px;font-size:20px;z-index:999;padding:20px;line-height:25px;color:#fff}
.popular-posts ul li:first-child .item-title{position:relative;width:88%;display:inline-block}
.PopularPosts h2{padding-right:.4em;padding-left:0}
.popular-posts ul{padding:10px 0 0;margin:0}
.popular-posts ul li{list-style:none outside none!important;margin:0;margin-bottom:0;padding-top:0!important}
.PopularPosts .item-title a{font-size:13px;line-height:20px;display:block;letter-spacing:1px;margin-bottom:8px;color:#333;font-weight:700;font-family:neo;text-transform:uppercase}
.PopularPosts a{color:#666;font-size:.9rem;line-height:normal;text-decoration:none}
.PopularPosts a:hover{color:#222}
.PopularPosts img{padding-right:0;height:70px;object-fit:cover;width:100%}
.PopularPosts .item-thumbnail{width:120px;margin:0 10px 5px 0;float:left}
.popular-posts ul li:last-child{border:0;margin:0}
</style>